implement home skeleton with tailwind

gessfred · Jan 14, 2024 · 38116d2 · 38116d2
1 parent c7cb591
commit 38116d2
Show file tree

Hide file tree

Showing 11 changed files with 880 additions and 24 deletions.
diff --git a/app/package-lock.json b/app/package-lock.json
diff --git a/app/package.json b/app/package.json
@@ -10,10 +10,13 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@codemirror/lang-sql": "^6.5.5",
     "@headlessui/react": "^1.7.18",
     "@heroicons/react": "^2.1.1",
+    "@uiw/react-codemirror": "^4.21.21",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-dom": "^18.2.0",
+    "uniqid": "^5.4.0"
   },
   "devDependencies": {
     "@tailwindcss/forms": "^0.5.7",

diff --git a/app/src/App.jsx b/app/src/App.jsx
@@ -3,6 +3,7 @@ import reactLogo from './assets/react.svg'
 import viteLogo from '/vite.svg'
 import './App.css'
 import Home from './pages/Home'
+import Worksheet from './pages/Worksheet'
 
 function API(url, user) {
   const call = (verb, route, callbacks, body) => {
@@ -209,15 +210,6 @@ function Signin({api, show, onLogin}) {
   )
 }
 
-/*function Home({show}) {
-  if(!show) return <span></span>
-  return (
-    <div>
-      <h1>Home</h1>
-    </div>
-  )
-}*/
-
 function App() {
   const [count, setCount] = useState(0)
   const [state, setState] = useState({pageid: 'login'})
@@ -239,8 +231,14 @@ function App() {
           setState({user: user, pageid: 'main'})
         }}
       />
-      <Home show={state.pageid === 'main'} 
-
+      <Home 
+        show={state.pageid === 'main'} 
+        api={api}
+        createWorksheet={() => setStateProperty({pageid: 'worksheet'})}
+      />
+      <Worksheet 
+        show={state.pageid === 'worksheet'}
+        api={api}
       />
     </>
   )

diff --git a/app/src/components/Chart.jsx b/app/src/components/Chart.jsx