structure set up

Author: abel-tefera

package-lock.json

@@ -10,18 +10,29 @@
  "preview": "vite preview"
  },
  "dependencies": {
+ "@reduxjs/toolkit": "^2.0.1",
+ "file-saver": "^2.0.5",
+ "jszip": "^3.10.1",
+ "localforage": "^1.10.0",
  "react": "^18.2.0",
- "react-dom": "^18.2.0"
+ "react-dom": "^18.2.0",
+ "react-redux": "^9.0.2",
+ "react-tooltip": "^5.25.0",
+ "redux-persist": "^6.0.0",
+ "uuid": "^9.0.1"
  },
  "devDependencies": {
  "@types/react": "^18.2.37",
  "@types/react-dom": "^18.2.15",
  "@typescript-eslint/eslint-plugin": "^6.10.0",
  "@typescript-eslint/parser": "^6.10.0",
  "@vitejs/plugin-react-swc": "^3.5.0",
+ "autoprefixer": "^10.4.16",
  "eslint": "^8.53.0",
  "eslint-plugin-react-hooks": "^4.6.0",
  "eslint-plugin-react-refresh": "^0.4.4",
+ "postcss": "^8.4.32",
+ "tailwindcss": "^3.3.6",
  "typescript": "^5.2.2",
  "vite": "^5.0.0"
  }

package.json

@@ -0,0 +1,6 @@
+export default {
+ plugins: {
+ tailwindcss: {},
+ autoprefixer: {},
+ },
+}

postcss.config.js

@@ -1,35 +1,17 @@
-import { useState } from 'react'
-import reactLogo from './assets/react.svg'
-import viteLogo from '/vite.svg'
-import './App.css'
+import "./App.css";
+import Structure from "./components/file-structure/Structure";
+import React, {useEffect} from "react";
+import { Provider } from "react-redux";
+import { persistor, store } from "./state/store";
+import { PersistGate } from "redux-persist/integration/react";
 
 function App() {
- const [count, setCount] = useState(0)
-
  return (
- <>
- <div>
- <a href="https://vitejs.dev" target="_blank">
- <img src={viteLogo} className="logo" alt="Vite logo" />
- </a>
- <a href="https://react.dev" target="_blank">
- <img src={reactLogo} className="logo react" alt="React logo" />
- </a>
- </div>
- <h1>Vite + React</h1>
- <div className="card">
- <button onClick={() => setCount((count) => count + 1)}>
- count is {count}
- </button>
- <p>
- Edit <code>src/App.tsx</code> and save to test HMR
- </p>
- </div>
- <p className="read-the-docs">
- Click on the Vite and React logos to learn more
- </p>
- </>
- )
+ <Provider store={store}>
+ <PersistGate loading={null} persistor={persistor}></PersistGate>
+ <Structure />
+ </Provider>
+ );
 }
 
-export default App
+export default App;