Feat/sidebar molecule

src/App.tsx

@@ -5,12 +5,14 @@ import { Toaster } from "react-hot-toast";
 import Components from "./components";
 import OtpPage from "./molecules/otp-page";
 import HistoryPage from "./pages/history-page";
+
 import ComingSoonPage from "./pages/coming-soon-page";
 import DowntimePage from "./pages/downtime-page";
 import FAQPage from "./pages/faq-page";
 import FeedbackPage from './molecules/feedback-page'
 import LaunchPage from "./pages/launch-page";
 import HomePage from "./pages/home-page";
+
 
 
 function App() {
@@ -24,17 +26,26 @@ function App() {
           <Route path="/login-mobile-aadhar-page" element={<LoginPage />} />
           <Route path="/otp-page" element={<OtpPage />} />
           <Route path="/history-page" element={<HistoryPage />} />
+
+
+
+
+          <Route path="/coming-soon-page" element={<ComingSoonPage />} />
+          <Route path="/downtime-page" element={<DowntimePage />} />
+          <Route path="/faq-page" element={<FAQPage />} />
+
+
           <Route path="/home-page" element={<HomePage />} />
           <Route path="/coming-soon-page" element={<ComingSoonPage />} />
           <Route path="/downtime-page" element={<DowntimePage />} />
           <Route path="/faq-page" element={<FAQPage />} />
           <Route path="/feedback-page" element={<FeedbackPage />}/>
           <Route path="/launch-page" element={<LaunchPage />} />
+
           <Route path="/molecules" element={<Components />}/>
         </Routes>
       </>
     </>
   );
 }
-
 export default App;

src/components/index.tsx

@@ -6,9 +6,15 @@ import { useMemo } from "react";
 import ForumIcon from "@mui/icons-material/Forum";
 import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline";
 import { useColorPalates } from "../molecules/theme-provider/hooks";
+
+
+
 import VoiceRecorder from '../molecules/VoiceRecorder'
+
 import Navbar from "../molecules/Navbar/index";
-
+
+
+
 const Components = () => {
   const theme = useColorPalates();
   const sampleList = useMemo(
@@ -95,12 +101,14 @@ const Components = () => {
           <List items={sampleList} />}
         </div>
       </Container>
-
+
+
+
       <Container>
            <h4>Navbar</h4>
           <Navbar />
         </Container>
-
+ 
     </Box>
 
 

src/components/theme-picker/colors.json

@@ -1,7 +1,7 @@
 [
     {"primary":"","secondary":""}
-
-]
+
 
 ]
 
+

src/molecules/index.json

@@ -1,4 +1,19 @@
 {
+
+
+    "pages":["login-mobile-aadhar-page", "otp-page","history-page"],
+    "molecules": [    
+      "otp-input",
+      "theme-provider"
+  ,
+      "LoginMobileAadharPage",
+      "OTPPage",
+      "OTPInput",
+      "Navbar"
+
+    ]
+}
+
 
   "pages": [
     "login-mobile-aadhar-page",
@@ -15,3 +30,4 @@
   ]
 }
 
+

src/molecules/sidebar/config.json

@@ -0,0 +1,38 @@
+{
+  "component": {
+    "sidebar": {
+      "showLangSwitcher": true,
+      "languages": [
+        {
+          "code": "en",
+          "label": "ENG"
+        },
+        {
+          "code": "or",
+          "label": "ଓଡ଼ିଆ"
+        }
+      ],
+      "showProfileIcon": true,
+      "profileText": "Welcome, User",
+      "links": [
+        {
+          "label": "FAQ Page",
+          "icon": "HelpIcon",
+          "route": ""
+        },
+        {
+          "label": "Chat Page",
+          "icon": "HistoryIcon",
+          "route": ""
+        },
+        {
+          "label": "Feedback",
+          "icon": "FeedbackIcon",
+          "route": ""
+        }
+      ],
+      "showLogoutButton": true,
+      "logoutButtonLabel": "Logout"
+    }
+  }
+}