From 0eca1517716e5c90cbf771fd64908de6f26b49ff Mon Sep 17 00:00:00 2001
From: Maciej Bodek <maciej.bodek@gmail.com>
Date: Thu, 26 Oct 2023 10:20:48 +0200
Subject: [PATCH] import: flow skeleton

---
 .../src/modules/Import/dropbox.tsx            |  5 +++
 .../src/modules/Import/import-file.tsx        | 32 +++++++++++++++++++
 .../web-console/src/modules/Import/result.tsx |  5 +++
 .../src/modules/Import/settings.tsx           |  5 +++
 .../web-console/src/scenes/Console/import.tsx |  8 +++--
 5 files changed, 52 insertions(+), 3 deletions(-)
 create mode 100644 packages/web-console/src/modules/Import/dropbox.tsx
 create mode 100644 packages/web-console/src/modules/Import/import-file.tsx
 create mode 100644 packages/web-console/src/modules/Import/result.tsx
 create mode 100644 packages/web-console/src/modules/Import/settings.tsx

diff --git a/packages/web-console/src/modules/Import/dropbox.tsx b/packages/web-console/src/modules/Import/dropbox.tsx
new file mode 100644
index 000000000..bdc8d2fc0
--- /dev/null
+++ b/packages/web-console/src/modules/Import/dropbox.tsx
@@ -0,0 +1,5 @@
+import React from "react"
+
+export const DropBox = () => {
+  return <div>dropbox</div>
+}
diff --git a/packages/web-console/src/modules/Import/import-file.tsx b/packages/web-console/src/modules/Import/import-file.tsx
new file mode 100644
index 000000000..df51bc69f
--- /dev/null
+++ b/packages/web-console/src/modules/Import/import-file.tsx
@@ -0,0 +1,32 @@
+import React, { createContext, useReducer } from "react"
+import { DropBox } from "./dropbox"
+import { Settings } from "./settings"
+import { Result } from "./result"
+
+export const Context = createContext({})
+
+type State = {
+  step: "dropbox" | "settings" | "result"
+  // TODO: file+schema
+}
+
+const initialState: State = {
+  step: "dropbox",
+}
+
+const reducer = (state: typeof initialState, action: Partial<State>) => ({
+  ...state,
+  ...action,
+})
+
+export const ImportFile = () => {
+  const [state, dispatch] = useReducer(reducer, initialState)
+
+  return (
+    <Context.Provider value={{ state, dispatch }}>
+      {state.step === "dropbox" && <DropBox />}
+      {state.step === "settings" && <Settings />}
+      {state.step === "result" && <Result />}
+    </Context.Provider>
+  )
+}
diff --git a/packages/web-console/src/modules/Import/result.tsx b/packages/web-console/src/modules/Import/result.tsx
new file mode 100644
index 000000000..88c26129a
--- /dev/null
+++ b/packages/web-console/src/modules/Import/result.tsx
@@ -0,0 +1,5 @@
+import React from "react"
+
+export const Result = () => {
+  return <div>upload result</div>
+}
diff --git a/packages/web-console/src/modules/Import/settings.tsx b/packages/web-console/src/modules/Import/settings.tsx
new file mode 100644
index 000000000..9e5c2a7b5
--- /dev/null
+++ b/packages/web-console/src/modules/Import/settings.tsx
@@ -0,0 +1,5 @@
+import React from "react"
+
+export const Settings = () => {
+  return <div>upload settings</div>
+}
diff --git a/packages/web-console/src/scenes/Console/import.tsx b/packages/web-console/src/scenes/Console/import.tsx
index 262591bdb..e3f1e511e 100644
--- a/packages/web-console/src/scenes/Console/import.tsx
+++ b/packages/web-console/src/scenes/Console/import.tsx
@@ -1,9 +1,11 @@
 import React from "react"
-import { PaneContent } from "../../components/PaneContent"
-import { PaneWrapper } from "../../components/PaneWrapper"
+import { PaneContent, PaneWrapper } from "../../components"
+import { ImportFile } from "../../modules/Import/import-file"
 
 export const Import = () => (
   <PaneWrapper>
-    <PaneContent>import</PaneContent>
+    <PaneContent>
+      <ImportFile />
+    </PaneContent>
   </PaneWrapper>
 )