Merge pull request #11 from Hoang-Nguyen-Huy/feat/fetch-api

Feat/fetch api

package.json

@@ -15,18 +15,23 @@
     "@fontsource/inter": "^5.1.0",
     "@mui/icons-material": "^6.1.1",
     "@mui/joy": "^5.0.0-beta.48",
-    "@mui/material": "^6.1.3",
+    "@mui/material": "^6.1.5",
+    "@mui/styled-engine-sc": "^6.1.5",
     "@mui/utils": "^6.1.3",
+    "@mui/x-data-grid": "^7.21.0",
     "@types/react-slick": "^0.23.13",
     "firebase": "^11.0.0",
+    "formik": "^2.4.6",
     "framer-motion": "^11.9.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-google-button": "^0.8.0",
     "react-icons": "^5.3.0",
     "react-router-dom": "^6.27.0",
     "react-slick": "^0.30.2",
-    "slick-carousel": "^1.8.1"
+    "slick-carousel": "^1.8.1",
+    "styled-components": "^6.1.13",
+    "yup": "^1.4.0"
   },
   "devDependencies": {
     "@eslint/js": "^9.9.0",

src/App.jsx

@@ -8,6 +8,8 @@ import SpecialOrchid from "./components/SpecialOrchid";
 import About from "./components/About";
 import Contact from "./components/Contact";
 import News from "./components/News";
+import Protected from "./components/Protected";
+import Dashboard from "./components/Dashboard";
 
 function App() {
   return (
@@ -20,6 +22,14 @@ function App() {
         <Route path='/fer-lab1/news' element={<News />}></Route>
         <Route path='/fer-lab1/about' element={<About />} />
         <Route path='/fer-lab1/contact' element={<Contact />} />
+        <Route
+          path='/fer-lab1/dashboard'
+          element={
+            <Protected>
+              <Dashboard />
+            </Protected>
+          }
+        />
       </Routes>
       <Footer />
     </div>

src/OrchidCategory.js

@@ -0,0 +1,8 @@
+export const categories = [
+  { id: "Dendrobium", name: "Dendrobium" },
+  { id: "Brassavola", name: "Brassavola" },
+  { id: "Cattleya", name: "Cattleya" },
+  { id: "Phalaenopsis", name: "Phalaenopsis" },
+  { id: "Vanda", name: "Vanda" },
+  { id: "Cymbidium", name: "Cymbidium" },
+];