From ef0fb2630de301fc6343df4fd4217f588945ce42 Mon Sep 17 00:00:00 2001 From: ShivaniYadav07 Date: Thu, 17 Oct 2024 22:39:44 +0530 Subject: [PATCH 1/5] created dashboard routes --- package-lock.json | 52 +++++ package.json | 3 + src/App.tsx | 50 ++++- src/apiClient/apiClient.ts | 1 + src/components/icons/AttachIcon.tsx | 23 +++ src/components/icons/CallIcon.tsx | 20 ++ src/components/icons/ChatIcon.tsx | 25 +++ src/components/icons/ChatIcon3.tsx | 20 ++ src/components/icons/ClockIcon.tsx | 20 ++ .../icons/ConferenceMeetingIcon.tsx | 20 ++ src/components/icons/DashboardIcon.tsx | 19 ++ src/components/icons/DateIcon.tsx | 24 +++ src/components/icons/DownArrowIcon.tsx | 16 ++ src/components/icons/EfficiencyIcon.tsx | 33 +++ src/components/icons/ErrorBookIcon.tsx | 20 ++ src/components/icons/GrowthMeterIcon.tsx | 16 ++ src/components/icons/LeftArrowIcon.tsx | 16 ++ src/components/icons/LibertyIcon.tsx | 20 ++ src/components/icons/MenuIcon.tsx | 30 +++ src/components/icons/MicIcon.tsx | 34 ++++ src/components/icons/NotificationIcon.tsx | 20 ++ src/components/icons/OneOnOneMeetingIcon.tsx | 20 ++ src/components/icons/PlannerIcon.tsx | 25 +++ src/components/icons/Questionicon.tsx | 24 +++ src/components/icons/QuizIcon.tsx | 20 ++ src/components/icons/RequestMeetingIcon.tsx | 20 ++ src/components/icons/RightArrowIcon.tsx | 28 +++ src/components/icons/SendIcon.tsx | 24 +++ src/components/icons/StudyRoomIcon.tsx | 17 ++ src/components/icons/TimeIcon.tsx | 21 ++ src/components/icons/TrackerIcon.tsx | 20 ++ src/components/icons/TrophyIcon.tsx | 28 +++ src/components/icons/UpArrowIcon.tsx | 16 ++ src/components/icons/VideoChatIcon.tsx | 16 ++ src/components/icons/WorkshopIcon.tsx | 20 ++ src/components/index.ts | 71 +++++++ src/components/shared/ComingSoon.tsx | 18 ++ src/components/shared/Container.tsx | 10 + src/components/shared/Header.tsx | 22 ++ src/components/shared/Input.tsx | 51 +++++ src/components/shared/Loader.tsx | 11 + src/components/shared/Logo.tsx | 34 ++++ src/components/shared/LogoutButton.tsx | 50 +++++ src/components/shared/MobileMenu.tsx | 125 ++++++++++++ src/components/shared/MobileNavBar.tsx | 49 +++++ src/components/shared/Modal.tsx | 27 +++ src/components/shared/MotionDiv.tsx | 5 + src/components/shared/OtpInput.tsx | 31 +++ src/components/shared/Sidebar.tsx | 15 ++ src/components/shared/SidebarDesktop.tsx | 96 +++++++++ src/components/shared/TabContent.tsx | 46 +++++ src/components/shared/TabNavItem.tsx | 46 +++++ src/components/ui/button.tsx | 2 +- src/helpers/constants/efficiency.ts | 73 +++++++ src/helpers/constants/index.ts | 188 ++++++++++++++++++ src/helpers/types/index.ts | 12 +- src/helpers/utils/index.ts | 181 +++++++++++++++++ src/pages/auth/Login.tsx | 18 +- src/pages/root/dashboard/Sidebar.tsx | 97 +++++++++ src/pages/root/dashboard/index.tsx | 17 ++ src/pages/root/layout.tsx | 36 ++++ 61 files changed, 2096 insertions(+), 16 deletions(-) create mode 100644 src/components/icons/AttachIcon.tsx create mode 100644 src/components/icons/CallIcon.tsx create mode 100644 src/components/icons/ChatIcon.tsx create mode 100644 src/components/icons/ChatIcon3.tsx create mode 100644 src/components/icons/ClockIcon.tsx create mode 100644 src/components/icons/ConferenceMeetingIcon.tsx create mode 100644 src/components/icons/DashboardIcon.tsx create mode 100644 src/components/icons/DateIcon.tsx create mode 100644 src/components/icons/DownArrowIcon.tsx create mode 100644 src/components/icons/EfficiencyIcon.tsx create mode 100644 src/components/icons/ErrorBookIcon.tsx create mode 100644 src/components/icons/GrowthMeterIcon.tsx create mode 100644 src/components/icons/LeftArrowIcon.tsx create mode 100644 src/components/icons/LibertyIcon.tsx create mode 100644 src/components/icons/MenuIcon.tsx create mode 100644 src/components/icons/MicIcon.tsx create mode 100644 src/components/icons/NotificationIcon.tsx create mode 100644 src/components/icons/OneOnOneMeetingIcon.tsx create mode 100644 src/components/icons/PlannerIcon.tsx create mode 100644 src/components/icons/Questionicon.tsx create mode 100644 src/components/icons/QuizIcon.tsx create mode 100644 src/components/icons/RequestMeetingIcon.tsx create mode 100644 src/components/icons/RightArrowIcon.tsx create mode 100644 src/components/icons/SendIcon.tsx create mode 100644 src/components/icons/StudyRoomIcon.tsx create mode 100644 src/components/icons/TimeIcon.tsx create mode 100644 src/components/icons/TrackerIcon.tsx create mode 100644 src/components/icons/TrophyIcon.tsx create mode 100644 src/components/icons/UpArrowIcon.tsx create mode 100644 src/components/icons/VideoChatIcon.tsx create mode 100644 src/components/icons/WorkshopIcon.tsx create mode 100644 src/components/index.ts create mode 100644 src/components/shared/ComingSoon.tsx create mode 100644 src/components/shared/Container.tsx create mode 100644 src/components/shared/Header.tsx create mode 100644 src/components/shared/Input.tsx create mode 100644 src/components/shared/Loader.tsx create mode 100644 src/components/shared/Logo.tsx create mode 100644 src/components/shared/LogoutButton.tsx create mode 100644 src/components/shared/MobileMenu.tsx create mode 100644 src/components/shared/MobileNavBar.tsx create mode 100644 src/components/shared/Modal.tsx create mode 100644 src/components/shared/MotionDiv.tsx create mode 100644 src/components/shared/OtpInput.tsx create mode 100644 src/components/shared/Sidebar.tsx create mode 100644 src/components/shared/SidebarDesktop.tsx create mode 100644 src/components/shared/TabContent.tsx create mode 100644 src/components/shared/TabNavItem.tsx create mode 100644 src/helpers/constants/efficiency.ts create mode 100644 src/helpers/constants/index.ts create mode 100644 src/helpers/utils/index.ts create mode 100644 src/pages/root/dashboard/Sidebar.tsx create mode 100644 src/pages/root/dashboard/index.tsx create mode 100644 src/pages/root/layout.tsx diff --git a/package-lock.json b/package-lock.json index 8dd4151..57eef3b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "axios": "^1.7.2", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", + "framer-motion": "^11.11.9", "lucide-react": "^0.400.0", "next": "^14.2.5", "radix-ui": "^1.0.1", @@ -29,6 +30,8 @@ "zod": "^3.23.8" }, "devDependencies": { + "@types/dompurify": "^3.0.5", + "@types/js-cookie": "^3.0.6", "@types/node": "^20.14.9", "@types/react": "^18.3.3", "@types/react-dom": "^18.3.0", @@ -2810,12 +2813,29 @@ "@babel/types": "^7.20.7" } }, + "node_modules/@types/dompurify": { + "version": "3.0.5", + "resolved": "https://registry.npmjs.org/@types/dompurify/-/dompurify-3.0.5.tgz", + "integrity": "sha512-1Wg0g3BtQF7sSb27fJQAKck1HECM6zV1EB66j8JH9i3LCjYabJa0FSdiSgsD5K/RbrsR0SiraKacLB+T8ZVYAg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/trusted-types": "*" + } + }, "node_modules/@types/estree": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz", "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==", "dev": true }, + "node_modules/@types/js-cookie": { + "version": "3.0.6", + "resolved": "https://registry.npmjs.org/@types/js-cookie/-/js-cookie-3.0.6.tgz", + "integrity": "sha512-wkw9yd1kEXOPnvEeEV1Go1MmxtBJL0RR79aOTAApecWFVu7w0NNXNqhcWgvw2YgZDYadliXkl14pa3WXw5jlCQ==", + "dev": true, + "license": "MIT" + }, "node_modules/@types/lodash": { "version": "4.17.7", "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.7.tgz", @@ -2863,6 +2883,13 @@ "@types/react": "*" } }, + "node_modules/@types/trusted-types": { + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz", + "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==", + "dev": true, + "license": "MIT" + }, "node_modules/@typescript-eslint/eslint-plugin": { "version": "7.15.0", "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-7.15.0.tgz", @@ -4095,6 +4122,31 @@ "url": "https://github.com/sponsors/rawify" } }, + "node_modules/framer-motion": { + "version": "11.11.9", + "resolved": "https://registry.npmjs.org/framer-motion/-/framer-motion-11.11.9.tgz", + "integrity": "sha512-XpdZseuCrZehdHGuW22zZt3SF5g6AHJHJi7JwQIigOznW4Jg1n0oGPMJQheMaKLC+0rp5gxUKMRYI6ytd3q4RQ==", + "license": "MIT", + "dependencies": { + "tslib": "^2.4.0" + }, + "peerDependencies": { + "@emotion/is-prop-valid": "*", + "react": "^18.0.0", + "react-dom": "^18.0.0" + }, + "peerDependenciesMeta": { + "@emotion/is-prop-valid": { + "optional": true + }, + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, "node_modules/fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", diff --git a/package.json b/package.json index 66da343..f879acd 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "axios": "^1.7.2", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", + "framer-motion": "^11.11.9", "lucide-react": "^0.400.0", "next": "^14.2.5", "radix-ui": "^1.0.1", @@ -31,6 +32,8 @@ "zod": "^3.23.8" }, "devDependencies": { + "@types/dompurify": "^3.0.5", + "@types/js-cookie": "^3.0.6", "@types/node": "^20.14.9", "@types/react": "^18.3.3", "@types/react-dom": "^18.3.0", diff --git a/src/App.tsx b/src/App.tsx index 0921ece..12a5ac2 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,21 +1,57 @@ import './App.css'; import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom'; +import { useState, useEffect } from 'react'; import Mentors from './pages/root/mentor'; import Login from './pages/auth/Login'; -import Singup from './pages/auth/Singup'; +import Signup from './pages/auth/Singup'; import ForgotPassword from './pages/auth/ForgotPassword'; import Student from './pages/student'; +import Dashboard from './pages/root/dashboard'; +import Loader from './pages/root/Loader'; function App() { + const [isAuthenticated, setIsAuthenticated] = useState(false); + const [isLoading, setIsLoading] = useState(true); + const [meetingsLength, setMeetingsLength] = useState(0); + + useEffect(() => { + // Check if the user is authenticated by checking for a token + const token = localStorage.getItem('token'); + setIsAuthenticated(!!token); // Set authenticated state based on token presence + + const fetchMeetingsLength = async () => { + // Here you can make an API call to fetch the actual meetings length + const length = 5; // Example length value + setMeetingsLength(length); + setIsLoading(false); // Set loading to false after fetching length + }; + + fetchMeetingsLength(); + }, []); + + // Show loader while fetching + if (isLoading) { + return ; + } + return ( - } /> - } /> - } /> - } /> - } /> - } /> + : } + /> + : } + /> + } /> + } /> + } /> + : } + /> ); diff --git a/src/apiClient/apiClient.ts b/src/apiClient/apiClient.ts index 3abc716..690c9a8 100644 --- a/src/apiClient/apiClient.ts +++ b/src/apiClient/apiClient.ts @@ -6,6 +6,7 @@ const apiClient = axios.create({ headers: { 'Content-Type': 'application/json', }, + }); apiClient.interceptors.request.use( diff --git a/src/components/icons/AttachIcon.tsx b/src/components/icons/AttachIcon.tsx new file mode 100644 index 0000000..8dddad2 --- /dev/null +++ b/src/components/icons/AttachIcon.tsx @@ -0,0 +1,23 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const AttachIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default AttachIcon; diff --git a/src/components/icons/CallIcon.tsx b/src/components/icons/CallIcon.tsx new file mode 100644 index 0000000..6c6db30 --- /dev/null +++ b/src/components/icons/CallIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const CallIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default CallIcon; diff --git a/src/components/icons/ChatIcon.tsx b/src/components/icons/ChatIcon.tsx new file mode 100644 index 0000000..8e4ae8e --- /dev/null +++ b/src/components/icons/ChatIcon.tsx @@ -0,0 +1,25 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const ChatIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + + ); +}; + +export default ChatIcon; diff --git a/src/components/icons/ChatIcon3.tsx b/src/components/icons/ChatIcon3.tsx new file mode 100644 index 0000000..9ff3006 --- /dev/null +++ b/src/components/icons/ChatIcon3.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const ChatIcon3 = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default ChatIcon3; diff --git a/src/components/icons/ClockIcon.tsx b/src/components/icons/ClockIcon.tsx new file mode 100644 index 0000000..7809cd0 --- /dev/null +++ b/src/components/icons/ClockIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const ClockIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default ClockIcon; diff --git a/src/components/icons/ConferenceMeetingIcon.tsx b/src/components/icons/ConferenceMeetingIcon.tsx new file mode 100644 index 0000000..670be82 --- /dev/null +++ b/src/components/icons/ConferenceMeetingIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const ConferenceMeetingIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default ConferenceMeetingIcon; diff --git a/src/components/icons/DashboardIcon.tsx b/src/components/icons/DashboardIcon.tsx new file mode 100644 index 0000000..e8570ec --- /dev/null +++ b/src/components/icons/DashboardIcon.tsx @@ -0,0 +1,19 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const DashboardIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + + + + ); +}; + +export default DashboardIcon; diff --git a/src/components/icons/DateIcon.tsx b/src/components/icons/DateIcon.tsx new file mode 100644 index 0000000..2ac1507 --- /dev/null +++ b/src/components/icons/DateIcon.tsx @@ -0,0 +1,24 @@ +import { cn } from '../../lib/utils'; + +const DateIcon = ({ className }: { className?: string }) => { + return ( + + + + ); +}; + +export default DateIcon; diff --git a/src/components/icons/DownArrowIcon.tsx b/src/components/icons/DownArrowIcon.tsx new file mode 100644 index 0000000..d000c48 --- /dev/null +++ b/src/components/icons/DownArrowIcon.tsx @@ -0,0 +1,16 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const DownArrowIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default DownArrowIcon; diff --git a/src/components/icons/EfficiencyIcon.tsx b/src/components/icons/EfficiencyIcon.tsx new file mode 100644 index 0000000..b09f43f --- /dev/null +++ b/src/components/icons/EfficiencyIcon.tsx @@ -0,0 +1,33 @@ +import { cn } from "../../lib/utils"; + + +const EfficiencyIcon = ({ className }: { className?: string }) => { + return ( + + + + + + ); +}; +export default EfficiencyIcon \ No newline at end of file diff --git a/src/components/icons/ErrorBookIcon.tsx b/src/components/icons/ErrorBookIcon.tsx new file mode 100644 index 0000000..9a654a5 --- /dev/null +++ b/src/components/icons/ErrorBookIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const ErrorBookIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default ErrorBookIcon; diff --git a/src/components/icons/GrowthMeterIcon.tsx b/src/components/icons/GrowthMeterIcon.tsx new file mode 100644 index 0000000..8e3c24a --- /dev/null +++ b/src/components/icons/GrowthMeterIcon.tsx @@ -0,0 +1,16 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const GrowthMeterIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default GrowthMeterIcon; diff --git a/src/components/icons/LeftArrowIcon.tsx b/src/components/icons/LeftArrowIcon.tsx new file mode 100644 index 0000000..4fd594d --- /dev/null +++ b/src/components/icons/LeftArrowIcon.tsx @@ -0,0 +1,16 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const LeftArrowIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default LeftArrowIcon; diff --git a/src/components/icons/LibertyIcon.tsx b/src/components/icons/LibertyIcon.tsx new file mode 100644 index 0000000..75d26a2 --- /dev/null +++ b/src/components/icons/LibertyIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const LibertyIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default LibertyIcon; diff --git a/src/components/icons/MenuIcon.tsx b/src/components/icons/MenuIcon.tsx new file mode 100644 index 0000000..6a49868 --- /dev/null +++ b/src/components/icons/MenuIcon.tsx @@ -0,0 +1,30 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const MenuIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + + + ); +}; + +export default MenuIcon; diff --git a/src/components/icons/MicIcon.tsx b/src/components/icons/MicIcon.tsx new file mode 100644 index 0000000..69d9017 --- /dev/null +++ b/src/components/icons/MicIcon.tsx @@ -0,0 +1,34 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const MicIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + + + ); +}; + +export default MicIcon; diff --git a/src/components/icons/NotificationIcon.tsx b/src/components/icons/NotificationIcon.tsx new file mode 100644 index 0000000..d64b56e --- /dev/null +++ b/src/components/icons/NotificationIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const NotificationIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default NotificationIcon; diff --git a/src/components/icons/OneOnOneMeetingIcon.tsx b/src/components/icons/OneOnOneMeetingIcon.tsx new file mode 100644 index 0000000..a112310 --- /dev/null +++ b/src/components/icons/OneOnOneMeetingIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const OneOnOneMeetingIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default OneOnOneMeetingIcon; diff --git a/src/components/icons/PlannerIcon.tsx b/src/components/icons/PlannerIcon.tsx new file mode 100644 index 0000000..d6f2b2b --- /dev/null +++ b/src/components/icons/PlannerIcon.tsx @@ -0,0 +1,25 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const PlannerIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + + + ); +}; + +export default PlannerIcon; diff --git a/src/components/icons/Questionicon.tsx b/src/components/icons/Questionicon.tsx new file mode 100644 index 0000000..6e22c7c --- /dev/null +++ b/src/components/icons/Questionicon.tsx @@ -0,0 +1,24 @@ +import { cn } from '../../lib/utils'; + +const QuestionIcon = ({ className }: { className?: string }) => { + return ( + + + + ); +}; + +export default QuestionIcon; diff --git a/src/components/icons/QuizIcon.tsx b/src/components/icons/QuizIcon.tsx new file mode 100644 index 0000000..71263a6 --- /dev/null +++ b/src/components/icons/QuizIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const QuizIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default QuizIcon; diff --git a/src/components/icons/RequestMeetingIcon.tsx b/src/components/icons/RequestMeetingIcon.tsx new file mode 100644 index 0000000..bec1311 --- /dev/null +++ b/src/components/icons/RequestMeetingIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const RequestMeetingIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default RequestMeetingIcon; diff --git a/src/components/icons/RightArrowIcon.tsx b/src/components/icons/RightArrowIcon.tsx new file mode 100644 index 0000000..46a7b93 --- /dev/null +++ b/src/components/icons/RightArrowIcon.tsx @@ -0,0 +1,28 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const RightArrowIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + + ); +}; + +export default RightArrowIcon; diff --git a/src/components/icons/SendIcon.tsx b/src/components/icons/SendIcon.tsx new file mode 100644 index 0000000..e785446 --- /dev/null +++ b/src/components/icons/SendIcon.tsx @@ -0,0 +1,24 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const SendIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + + ); +}; + +export default SendIcon; diff --git a/src/components/icons/StudyRoomIcon.tsx b/src/components/icons/StudyRoomIcon.tsx new file mode 100644 index 0000000..178d280 --- /dev/null +++ b/src/components/icons/StudyRoomIcon.tsx @@ -0,0 +1,17 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const StudyRoomIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + + ); +}; + +export default StudyRoomIcon; diff --git a/src/components/icons/TimeIcon.tsx b/src/components/icons/TimeIcon.tsx new file mode 100644 index 0000000..a1786ce --- /dev/null +++ b/src/components/icons/TimeIcon.tsx @@ -0,0 +1,21 @@ +import { cn } from "../../lib/utils"; + +const TimeIcon = ({ className }: { className?: string }) => { + return ( + + + + ); +}; + +export default TimeIcon; diff --git a/src/components/icons/TrackerIcon.tsx b/src/components/icons/TrackerIcon.tsx new file mode 100644 index 0000000..c40106d --- /dev/null +++ b/src/components/icons/TrackerIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const TrackerIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default TrackerIcon; diff --git a/src/components/icons/TrophyIcon.tsx b/src/components/icons/TrophyIcon.tsx new file mode 100644 index 0000000..df709ea --- /dev/null +++ b/src/components/icons/TrophyIcon.tsx @@ -0,0 +1,28 @@ +import { cn } from '../../lib/utils'; + +const TrophyIcon = ({ className }: { className?: string }) => { + return ( + + + + + ); +}; +export default TrophyIcon; diff --git a/src/components/icons/UpArrowIcon.tsx b/src/components/icons/UpArrowIcon.tsx new file mode 100644 index 0000000..e0a5fab --- /dev/null +++ b/src/components/icons/UpArrowIcon.tsx @@ -0,0 +1,16 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const UpArrowIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default UpArrowIcon; diff --git a/src/components/icons/VideoChatIcon.tsx b/src/components/icons/VideoChatIcon.tsx new file mode 100644 index 0000000..ffaa2ea --- /dev/null +++ b/src/components/icons/VideoChatIcon.tsx @@ -0,0 +1,16 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const VideoChatIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default VideoChatIcon; diff --git a/src/components/icons/WorkshopIcon.tsx b/src/components/icons/WorkshopIcon.tsx new file mode 100644 index 0000000..42ab8d7 --- /dev/null +++ b/src/components/icons/WorkshopIcon.tsx @@ -0,0 +1,20 @@ +import { IIconProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const WorkshopIcon = ({ className, ...props }: IIconProps) => { + return ( + + + + ); +}; + +export default WorkshopIcon; diff --git a/src/components/index.ts b/src/components/index.ts new file mode 100644 index 0000000..06dba63 --- /dev/null +++ b/src/components/index.ts @@ -0,0 +1,71 @@ +import Container from "./shared/Container"; +import Logo from "./shared/Logo"; +import Header from "./shared/Header"; +import SidebarDesktop from "./shared/SidebarDesktop"; +import Sidebar from "./shared/Sidebar"; +import TabNavItem from "./shared/TabNavItem"; +import TabContent from "./shared/TabContent"; +import MobileNavBar from "./shared/MobileNavBar"; +import MobileMenu from "./shared/MobileMenu"; +import Input from "./shared/Input"; + +// import SemiRadialChart from "./charts/SemiRadialChart"; +// import RadialBarChart from "./charts/RadialBarChart"; +// import BarChart from "./charts/BarChart"; +// import MonthlyReportChart from "./charts/MonthlyReportChart"; +// import OverallReportChart from "./charts/OverallReportChart"; +// import DonutChart from "./charts/DonutChart"; + +import RightArrowIcon from "./icons/RightArrowIcon"; +import LeftArrowIcon from "./icons/LeftArrowIcon"; +import NotificationIcon from "./icons/NotificationIcon"; +import ChatIcon from "./icons/ChatIcon"; +import VideoChatIcon from "./icons/VideoChatIcon"; +import RequestMeetingIcon from "./icons/RequestMeetingIcon"; +import UpArrowIcon from "./icons/UpArrowIcon"; +import DownArrowIcon from "./icons/DownArrowIcon"; +import AttachIcon from "./icons/AttachIcon"; +import CallIcon from "./icons/CallIcon"; +import ChatIcon3 from "./icons/ChatIcon3"; +import MenuIcon from "./icons/MenuIcon"; +import MicIcon from "./icons/MicIcon"; +import SendIcon from "./icons/SendIcon"; +import OneOnOneMeetingIcon from "./icons/OneOnOneMeetingIcon"; +import ConferenceMeetingIcon from "./icons/ConferenceMeetingIcon"; +import ClockIcon from "./icons/ClockIcon"; + +export { + Container, + Logo, + Header, + SidebarDesktop, + Sidebar, + TabNavItem, + TabContent, + MobileNavBar, + MobileMenu, + Input, + // SemiRadialChart, + // RadialBarChart, + // BarChart, + // MonthlyReportChart, + // OverallReportChart, + // DonutChart, + RightArrowIcon, + LeftArrowIcon, + NotificationIcon, + ChatIcon, + VideoChatIcon, + RequestMeetingIcon, + UpArrowIcon, + DownArrowIcon, + AttachIcon, + CallIcon, + ChatIcon3, + MenuIcon, + MicIcon, + SendIcon, + OneOnOneMeetingIcon, + ConferenceMeetingIcon, + ClockIcon, +}; diff --git a/src/components/shared/ComingSoon.tsx b/src/components/shared/ComingSoon.tsx new file mode 100644 index 0000000..f1f6893 --- /dev/null +++ b/src/components/shared/ComingSoon.tsx @@ -0,0 +1,18 @@ +import Header from "./Header"; + +const ComingSoon = ({ pageTitle }: { pageTitle: string }) => { + return ( +
+

+ {pageTitle} +

+
+
+ ); +}; + +export default ComingSoon; diff --git a/src/components/shared/Container.tsx b/src/components/shared/Container.tsx new file mode 100644 index 0000000..a9b5b4f --- /dev/null +++ b/src/components/shared/Container.tsx @@ -0,0 +1,10 @@ +import { TContainerProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const Container = ({ children, className }: TContainerProps) => { + return ( +
{children}
+ ); +}; + +export default Container; diff --git a/src/components/shared/Header.tsx b/src/components/shared/Header.tsx new file mode 100644 index 0000000..05619dc --- /dev/null +++ b/src/components/shared/Header.tsx @@ -0,0 +1,22 @@ +import { THeaderProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const Header = ({ + title, + className, + icon: Icon, + titleClassName, +}: THeaderProps) => { + return ( +
+

{title}

+ {Icon &&
{Icon}
} +
+ ); +}; + +export default Header; diff --git a/src/components/shared/Input.tsx b/src/components/shared/Input.tsx new file mode 100644 index 0000000..23d7b84 --- /dev/null +++ b/src/components/shared/Input.tsx @@ -0,0 +1,51 @@ +import { cn } from "../../lib/utils"; + +import React, { + ForwardRefRenderFunction, + InputHTMLAttributes, + forwardRef, + useId, +} from "react"; + +interface InputProps extends InputHTMLAttributes { + label?: string; + icon1?: React.ReactNode; + icon2?: React.ReactNode; +} + +const Input: ForwardRefRenderFunction = ( + { + label, + className = "", + type = "text", + placeholder = "", + icon1, + icon2, + ...props + }, + ref +) => { + const id = useId(); + + return ( +
+ {label && } +
+ {icon1 && icon1} + + + + {icon2 && icon2} +
+
+ ); +}; + +export default forwardRef(Input); diff --git a/src/components/shared/Loader.tsx b/src/components/shared/Loader.tsx new file mode 100644 index 0000000..9b42651 --- /dev/null +++ b/src/components/shared/Loader.tsx @@ -0,0 +1,11 @@ +import { Loader2 } from "lucide-react"; + +const Loader = () => { + return ( +
+ +
+ ); +}; + +export default Loader; diff --git a/src/components/shared/Logo.tsx b/src/components/shared/Logo.tsx new file mode 100644 index 0000000..cab5282 --- /dev/null +++ b/src/components/shared/Logo.tsx @@ -0,0 +1,34 @@ +import Image from "next/image"; + +import { TLogoProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const Logo = ({ + fullLogoWidth, + fullLogoHeight, + fullLogoClassName, + smallLogoWidth, + smallLogoHeight, + smallLogoClassName, +}: TLogoProps) => { + return ( + <> + Leadlly_logo + Leadlly_logo + + ); +}; + +export default Logo; diff --git a/src/components/shared/LogoutButton.tsx b/src/components/shared/LogoutButton.tsx new file mode 100644 index 0000000..1ae6777 --- /dev/null +++ b/src/components/shared/LogoutButton.tsx @@ -0,0 +1,50 @@ +"use client"; + +import { useRouter } from "next/navigation"; + +import { LogOut } from "lucide-react"; + +import { toast } from "sonner"; + +import { Button } from "../ui/button"; + +// import { useAppDispatch } from "@/redux/hooks"; +// import { userData } from "@/redux/slices/userSlice"; + +const LogoutButton = () => { + const router = useRouter(); + + // const dispatch = useAppDispatch(); + + const logoutHandler = async () => { + try { + const response = await fetch("/api/auth/logout", { + method: "Get", + headers: { + "Content-Type": "application/json", + }, + }); + + const responseData = await response.json(); + toast.success(responseData.message); + router.push("/login"); + // dispatch(userData(null)); + } catch (error: any) { + toast.error("Logout Failed!", { + description: error?.message, + }); + } + }; + return ( + + ); +}; + +export default LogoutButton; diff --git a/src/components/shared/MobileMenu.tsx b/src/components/shared/MobileMenu.tsx new file mode 100644 index 0000000..6fa834e --- /dev/null +++ b/src/components/shared/MobileMenu.tsx @@ -0,0 +1,125 @@ +"use client"; + +import React, { useEffect, useRef, useState } from "react"; +import Link from "next/link"; +import { usePathname } from "next/navigation"; + +import { motion } from "framer-motion"; + +import { userSidebarLinks } from "../../helpers/constants"; +import { cn } from "../../lib/utils"; + +const MobileMenu = ({ meetingsLength }: { meetingsLength: number }) => { + const [navScrollPosition, setNavScrollPosition] = useState(0); + const navbarRef = useRef(null); + + const pathname = usePathname(); + + useEffect(() => { + const handleScroll = () => { + if (navbarRef.current) { + setNavScrollPosition(navbarRef.current.scrollLeft); + } + }; + + if (navbarRef.current) { + navbarRef.current.addEventListener("scroll", handleScroll); + } + + return () => { + if (navbarRef.current) { + navbarRef.current.removeEventListener("scroll", handleScroll); + } + }; + }, []); + + const handleMenuItemClick = (e: React.MouseEvent) => { + const clickedItem = e.currentTarget; + const navbarWidth = navbarRef.current?.offsetWidth || 0; + const clickedItemRect = clickedItem.getBoundingClientRect(); + const isLastVisibleItem = + clickedItemRect.right >= navbarWidth + navScrollPosition; + const isFirstVisibleItem = clickedItemRect.left <= navScrollPosition; + + if (navbarRef.current) { + if (isLastVisibleItem) { + const newScrollPosition = clickedItemRect.left - navbarWidth / 5; + navbarRef.current.scrollTo({ + left: newScrollPosition, + behavior: "smooth", + }); + } else if (isFirstVisibleItem) { + const newScrollPosition = clickedItemRect.right - navbarWidth / 5; + navbarRef.current.scrollTo({ + left: newScrollPosition, + behavior: "smooth", + }); + } + } + }; + + return ( + + ); +}; + +export default MobileMenu; diff --git a/src/components/shared/MobileNavBar.tsx b/src/components/shared/MobileNavBar.tsx new file mode 100644 index 0000000..815455b --- /dev/null +++ b/src/components/shared/MobileNavBar.tsx @@ -0,0 +1,49 @@ +import Image from "next/image"; +import Link from "next/link"; + +// import { Logo, NotificationIcon } from "@/components"; + +const MobileNavBar = () => { + return ( + + ); +}; + +export default MobileNavBar; diff --git a/src/components/shared/Modal.tsx b/src/components/shared/Modal.tsx new file mode 100644 index 0000000..250bf8f --- /dev/null +++ b/src/components/shared/Modal.tsx @@ -0,0 +1,27 @@ +"use client"; + +import React from "react"; +import { Dialog, DialogContent, DialogOverlay } from "../ui/dialog"; + +const Modal = ({ + children, + setOpenDialogBox, +}: { + children: React.ReactNode; + setOpenDialogBox: (openDialogBox: boolean) => void; +}) => { + const handleOpenChange = () => { + setOpenDialogBox(false); + }; + return ( + + + + {children} + + + + ); +}; + +export default Modal; diff --git a/src/components/shared/MotionDiv.tsx b/src/components/shared/MotionDiv.tsx new file mode 100644 index 0000000..1c32996 --- /dev/null +++ b/src/components/shared/MotionDiv.tsx @@ -0,0 +1,5 @@ +"use client"; + +import { motion } from "framer-motion"; + +export const MotionDiv = motion.div; diff --git a/src/components/shared/OtpInput.tsx b/src/components/shared/OtpInput.tsx new file mode 100644 index 0000000..b19d701 --- /dev/null +++ b/src/components/shared/OtpInput.tsx @@ -0,0 +1,31 @@ +// OtpInput.tsx + +import React from 'react'; + +const OtpInput = () => { + // Handle key press events to move focus + const handleKeyUp = (e: React.KeyboardEvent, index: number) => { + if (e.currentTarget.value.length === 1) { + const nextInput = document.querySelectorAll('input')[index + 1]; + if (nextInput) nextInput.focus(); + } + }; + + return ( +
+ {Array.from({ length: 4 }).map((_, index) => ( + handleKeyUp(e, index)} + /> + ))} +
+ ); +}; + +export default OtpInput; diff --git a/src/components/shared/Sidebar.tsx b/src/components/shared/Sidebar.tsx new file mode 100644 index 0000000..5215b17 --- /dev/null +++ b/src/components/shared/Sidebar.tsx @@ -0,0 +1,15 @@ +"use client"; + +import SidebarDesktop from "./SidebarDesktop"; +import { userSidebarLinks } from "../../helpers/constants"; + +const Sidebar = ({ meetingsLength }: { meetingsLength: number }) => { + return ( + + ); +}; + +export default Sidebar; diff --git a/src/components/shared/SidebarDesktop.tsx b/src/components/shared/SidebarDesktop.tsx new file mode 100644 index 0000000..675f197 --- /dev/null +++ b/src/components/shared/SidebarDesktop.tsx @@ -0,0 +1,96 @@ +"use client"; +import Link from "next/link"; +import { usePathname } from "next/navigation"; +import { motion } from "framer-motion"; + +// import { Logo } from "@/components"; +import { TSidebarLink } from "../../helpers/types"; +import { cn } from "../../lib/utils"; +// import { Button } from "../ui/button"; +// import { LogOut } from "lucide-react"; +// import LogoutButton from "./LogoutButton"; + +const SidebarDesktop = ({ + sidebar, + meetingsLength, +}: { + sidebar: TSidebarLink[]; + meetingsLength: number; +}) => { + const pathname = usePathname(); + + return ( + + ); +}; + +export default SidebarDesktop; diff --git a/src/components/shared/TabContent.tsx b/src/components/shared/TabContent.tsx new file mode 100644 index 0000000..635cdb0 --- /dev/null +++ b/src/components/shared/TabContent.tsx @@ -0,0 +1,46 @@ +"use client"; + +import { AnimatePresence, motion, Variants } from "framer-motion"; + +import { TTabContentProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const tabContentVariants: Variants = { + initial: { + x: 0, + opacity: 1, + }, + enter: { + x: 0, + opacity: 1, + }, + exit: { + x: -100, + opacity: 0, + }, +}; + +const TabContent = ({ + id, + activeTab, + children, + className, +}: TTabContentProps) => { + return activeTab === id ? ( + + + {children} + + + ) : null; +}; + +export default TabContent; diff --git a/src/components/shared/TabNavItem.tsx b/src/components/shared/TabNavItem.tsx new file mode 100644 index 0000000..3215c72 --- /dev/null +++ b/src/components/shared/TabNavItem.tsx @@ -0,0 +1,46 @@ +"use client"; + +import { motion } from "framer-motion"; +import { TTabNavItemProps } from "../../helpers/types"; +import { cn } from "../../lib/utils"; + +const TabNavItem = ({ + id, + title, + activeTab, + setActiveTab, + className, + activeTabClassName, + titleClassName, + layoutIdPrefix, +}: TTabNavItemProps) => { + const handleClick = () => { + setActiveTab(id); + }; + + const layoutId = `${layoutIdPrefix}_active__tab`; + + return ( +
  • + {activeTab === id && ( + + )} + {title} +
    • + ); +}; + +export default TabNavItem; diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx index 0ba4277..4106711 100644 --- a/src/components/ui/button.tsx +++ b/src/components/ui/button.tsx @@ -2,7 +2,7 @@ import * as React from "react" import { Slot } from "@radix-ui/react-slot" import { cva, type VariantProps } from "class-variance-authority" -import { cn } from "@/lib/utils" +import { cn } from "../../lib/utils" const buttonVariants = cva( "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", diff --git a/src/helpers/constants/efficiency.ts b/src/helpers/constants/efficiency.ts new file mode 100644 index 0000000..3b81ee0 --- /dev/null +++ b/src/helpers/constants/efficiency.ts @@ -0,0 +1,73 @@ +import { EfficiencyOption } from "."; +export const efficiencyOptions: EfficiencyOption[] = [ + { + max: 30, + label: '0-30%', + progressBarColor: 'bg-red-500', + textColor: 'text-red-500', + }, + { + min: 30, + max: 50, + label: '30-50%', + progressBarColor: 'bg-orange-500', + textColor: 'text-orange-500', + }, + { + min: 50, + max: 70, + label: '50-70%', + progressBarColor: 'bg-yellow-500', + textColor: 'text-yellow-500', + }, + { + min: 70, + max: 90, + label: '70-90%', + progressBarColor: 'bg-orange-300', + textColor: 'text-orange-300', + }, + { + min: 90, + label: '90-100%', + progressBarColor: 'bg-green-400', + textColor: 'text-green-400', + }, +]; + + +function findEfficiencyOption( + efficiency: number +): EfficiencyOption | undefined { + if (isNaN(efficiency)) { + throw new Error("Efficiency must be a number."); + } + + return efficiencyOptions.find((opt) => { + if (opt.min !== undefined && opt.max !== undefined) { + return efficiency >= opt.min && efficiency < opt.max; + } else if (opt.min !== undefined) { + return efficiency >= opt.min; + } else if (opt.max !== undefined) { + return efficiency < opt.max; + } + return false; + }); +} + +export function getProgressBarColor(efficiency: number): string { + const option = findEfficiencyOption(efficiency); + if (!option) { + return 'bg-[#ffffff]'; + } + + return option.progressBarColor; +} +export function getTextColor(efficiency: number): string { + const option = findEfficiencyOption(efficiency); + if (!option) { + return 'text-red-500' + } + + return option.textColor; +} diff --git a/src/helpers/constants/index.ts b/src/helpers/constants/index.ts new file mode 100644 index 0000000..1684bbb --- /dev/null +++ b/src/helpers/constants/index.ts @@ -0,0 +1,188 @@ +import { TSidebarLink } from "../types"; + +import DashboardIcon from "../../components/icons/DashboardIcon"; +import PlannerIcon from "../../components/icons/PlannerIcon"; +import TrackerIcon from "../../components/icons/TrackerIcon"; +import ErrorBookIcon from "../../components/icons/ErrorBookIcon"; +import GrowthMeterIcon from "../../components/icons/GrowthMeterIcon"; +import WorkshopIcon from "../../components/icons/WorkshopIcon"; +import LibertyIcon from "../../components/icons/LibertyIcon"; +import QuizIcon from "../../components/icons/QuizIcon"; +import StudyRoomIcon from "../../components/icons/StudyRoomIcon"; +import ChatIcon3 from "../../components/icons/ChatIcon3"; + +export const userSidebarLinks: TSidebarLink[] = [ + { + label: "dashboard", + icon: DashboardIcon, + href: "/", + }, + { + label: "planner", + icon: PlannerIcon, + href: "/planner", + }, + { + label: "tracker", + icon: TrackerIcon, + href: "/tracker", + }, + { + label: "chat", + icon: ChatIcon3, + href: "/chat", + }, + { + label: "quizzes", + icon: QuizIcon, + href: "/quizzes", + }, + { + label: "errorbook", + icon: ErrorBookIcon, + href: "/error-book", + }, + { + label: "growth meter", + icon: GrowthMeterIcon, + href: "/growth-meter", + }, + { + label: "workshops", + icon: WorkshopIcon, + href: "/workshops", + }, + { + label: "library", + icon: LibertyIcon, + href: "/library", + }, + { + label: "study room", + icon: StudyRoomIcon, + href: "/study-room", + }, +]; + +export const moodEmojis = [ + { + moodImg: "/assets/icons/sad_emoji.png", + mood_id: "sad-emoji", + mood: "sad", + }, + { + moodImg: "/assets/icons/unhappy_emoji.png", + mood_id: "unhappy-emoji", + mood: "unhappy", + }, + { + moodImg: "/assets/icons/neutral_emoji.png", + mood_id: "neutral-emoji", + mood: "neutral", + }, + { + moodImg: "/assets/icons/smiling_emoji.png", + mood: "smiling", + mood_id: "smiling-emoji", + }, + { + moodImg: "/assets/icons/laughing_emoji.png", + mood_id: "laughing-emoji", + mood: "laughing", + }, +]; + +export const manageAccountTabs = [ + { + id: "personal-info", + label: "Personal Info", + }, + { + id: "study-progress", + label: "Study Progress", + }, + // { + // id: "subject-overview", + // label: "Subject Overview", + // }, + // { + // id: "your-mentor", + // label: "Your Mentor", + // }, +]; + +export const subscriptionPlanningBenefits = [ + { + label: "goal setting & tracking", + }, + { + label: "schedule builder", + }, + { + label: "to-do list & reminders", + }, + { + label: "subject, chapter & topic tracking", + }, +]; + +export const subscriptionExpertBenefits = [ + { + label: "connect with a mentor", + }, + { + label: "live & on-demand workshops", + }, +]; +export const subscriptionLearningBenefits = [ + { + label: "growth meter", + }, + { + label: "points & levels", + }, + { + label: "know your mistakes", + }, +]; +export interface EfficiencyOption { + min?: number; + max?: number; + label: string; + progressBarColor: string; + textColor: string; +} +export const SUBJECT_COLORS = { + Maths: "bg-[#107FFC30]", + Chemistry: "bg-[#72EFDD4A]", + Physics: "bg-[#A36AF53D]", +}; + +export const chatPageTabs = [ + // { + // title: "chat", + // id: "chat", + // desktopView: true, + // }, + { + title: "meetings", + id: "meetings", + desktopView: true, + }, + { + title: "request meeting", + id: "requestMeeting", + desktopView: false, + }, +]; + +export const meetingTabs = [ + { + id: "upcoming", + label: "upcoming", + }, + { + id: "done", + label: "done", + }, +]; diff --git a/src/helpers/types/index.ts b/src/helpers/types/index.ts index 620caf5..fd7965c 100644 --- a/src/helpers/types/index.ts +++ b/src/helpers/types/index.ts @@ -1,5 +1,5 @@ import React, { SVGProps } from "react"; - +import { SUBJECT_COLORS } from "../constants"; export type TContainerProps = { children: React.ReactNode; className?: string; @@ -349,3 +349,13 @@ export type PlannerDataProps = { export type DataProps = { data: PlannerDataProps; }; + +export type Subject = keyof typeof SUBJECT_COLORS; + +export type TMeetingsProps = { + rescheduled: { + isRescheduled: boolean; + date: Date; + time: string; + }; +} \ No newline at end of file diff --git a/src/helpers/utils/index.ts b/src/helpers/utils/index.ts new file mode 100644 index 0000000..6c91001 --- /dev/null +++ b/src/helpers/utils/index.ts @@ -0,0 +1,181 @@ +import DOMPurify from "dompurify"; +import { SUBJECT_COLORS } from "../constants"; +import { Subject } from "../types"; + +const daysOfWeek = [ + "Sunday", + "Monday", + "Tuesday", + "Wednesday", + "Thursday", + "Friday", + "Saturday", +]; +const monthsOfYear = [ + "Jan", + "Feb", + "Mar", + "Apr", + "May", + "Jun", + "Jul", + "Aug", + "Sep", + "Oct", + "Nov", + "Dec", +]; + +export function getTodaysDay() { + const today = new Date(); + const dayOfWeek = daysOfWeek[today.getDay()]; + + return `${dayOfWeek}`; +} + +export function getMonthDate(date: Date): string { + const dayOfMonth: string = String(date.getDate()).padStart(2, "0"); + const month: string = monthsOfYear[date.getMonth()]; + + return `${month} ${dayOfMonth}`; +} + +export function getMonthDateForProd(date: Date): string { + // Get the time in milliseconds since the epoch (UTC) + const utcTime = date.getTime(); + + // Define the IST offset in milliseconds (5 hours and 30 minutes) + const istOffset = 5.5 * 60 * 60 * 1000; + + // Calculate the IST time in milliseconds + const istTime = utcTime + istOffset; + + // Create a new Date object for IST time + const istDate = new Date(istTime); + + // Extract the day of the month and the month name in IST + const dayOfMonth: string = String(istDate.getUTCDate()).padStart(2, "0"); + const month: string = monthsOfYear[istDate.getUTCMonth()]; + + return `${month} ${dayOfMonth}`; +} + +export function getTodaysFormattedDate() { + const today = new Date(); + const dayOfMonth = String(today.getDate()).padStart(2, "0"); + const month = monthsOfYear[today.getMonth()]; + const year = today.getFullYear(); + + return `${dayOfMonth} ${month} ${year}`; +} + +export function getFormattedDate(date: Date): string { + const dayOfMonth: string = String(date.getDate()).padStart(2, "0"); + const month: string = monthsOfYear[date.getMonth()]; + const year: number = date.getFullYear(); + + return `${dayOfMonth} ${month} ${year}`; +} + +export function getFormattedDateForProd(date: Date): string { + const istOffset = 5 * 60 * 60 * 1000 + 30 * 60 * 1000; // IST is UTC +5:30 + const istDate = new Date(date.getTime() + istOffset); + + const dayOfMonth: string = String(istDate.getDate()).padStart(2, "0"); + const month: string = monthsOfYear[istDate.getMonth()]; + const year: number = istDate.getFullYear(); + + return `${dayOfMonth} ${month} ${year}`; +} + +export function convertDateString(inputDate: Date): string { + const utcDate = new Date(inputDate); + + // Convert to IST by adding 5 hours and 30 minutes + const istDate = new Date(utcDate.getTime() + 5.5 * 60 * 60 * 1000); + + // Format the date + const day = istDate.getDate().toString().padStart(2, "0"); + const month = (istDate.getMonth() + 1).toString().padStart(2, "0"); // Months are 0-indexed + const year = istDate.getFullYear(); + + // Format the date as DD-MM-YYYY + return `${day}-${month}-${year}`; +} + +export function formatDate(dateString: Date): string { + const date = new Date(dateString); + const day = date.getDate(); + const month = date.toLocaleString("default", { month: "short" }); + return `${day} ${month}`; +} + +export function calculateDaysLeft(meetingDate: Date): number { + // Get the current date + const currentDate = new Date(); + + // Calculate the difference in milliseconds + const differenceInMs = meetingDate.getTime() - currentDate.getTime(); + + // Convert milliseconds to days + const daysLeft = Math.ceil(differenceInMs / (1000 * 60 * 60 * 24)); + + return daysLeft; +} + +export function capitalizeFirstLetter( + sentence: string | undefined +): string | undefined { + if (!sentence) { + return sentence; + } + + return sentence.charAt(0).toUpperCase() + sentence.slice(1); +} + +export const formatTime = (seconds: number) => { + const days = Math.floor(seconds / (24 * 60 * 60)) + .toString() + .padStart(2, "0"); + const hours = Math.floor((seconds % (24 * 60 * 60)) / (60 * 60)) + .toString() + .padStart(2, "0"); + const minutes = Math.floor((seconds % (60 * 60)) / 60) + .toString() + .padStart(2, "0"); + const secs = (seconds % 60).toString().padStart(2, "0"); + + return `${days}d : ${hours}h : ${minutes}m : ${secs}s`; +}; + +export const sanitizedHtml = (htmlString: string) => { + DOMPurify.sanitize(htmlString); + return htmlString; +}; + +export const getColorBySubject = (subject: Subject): string => { + return SUBJECT_COLORS[subject] || "bg-[#B0BEC5]"; +}; + +export function isMoodButtonDisabled(lastMoodDate: String) { + if (!lastMoodDate) return false; + + const today = new Date(); + const formattedToday = today.toISOString().split("T")[0]; + + return lastMoodDate === formattedToday; +} + +export const loadRazorpayScript = () => { + return new Promise((resolve) => { + const script = document.createElement("script"); + script.src = "https://checkout.razorpay.com/v1/checkout.js"; + script.onload = () => { + resolve(true); + }; + script.onerror = () => { + resolve(false); + }; + document.body.appendChild(script); + }); +}; diff --git a/src/pages/auth/Login.tsx b/src/pages/auth/Login.tsx index 22b1f5e..b6bdefe 100644 --- a/src/pages/auth/Login.tsx +++ b/src/pages/auth/Login.tsx @@ -23,8 +23,6 @@ const Login = () => { const handleSubmit = async (e: any) => { e.preventDefault(); setIsLoggingIn(true); - setIsLoading(true) - setLoginSuccess(true) try { const response = await apiClient.post(`/api/auth/admin/login`, { @@ -33,17 +31,23 @@ const Login = () => { }); if (response.status === 200) { - navigate('/mentors'); - + const { token } = response.data; + if (token) { + localStorage.setItem("token", token); + console.log('Token saved:', token); + navigate('/'); + } else { + throw new Error('Token not provided in the response'); + } } - } catch (error: any) { - setError(error); - + } catch (error: any) { + setError(error.response?.data?.message || error.message); } finally { setIsLoggingIn(false); setIsLoading(false) } }; + return ( <> {isLoading ? ( diff --git a/src/pages/root/dashboard/Sidebar.tsx b/src/pages/root/dashboard/Sidebar.tsx new file mode 100644 index 0000000..5ed8e62 --- /dev/null +++ b/src/pages/root/dashboard/Sidebar.tsx @@ -0,0 +1,97 @@ +"use client"; + +import Link from "next/link"; +import { usePathname } from "next/navigation"; +import { motion } from "framer-motion"; + +import { Logo } from "../../../components"; +import { TSidebarLink } from "../../../helpers/types"; +import { cn } from "../../../lib/utils"; +// import { Button } from "../../../components/ui/button"; +// import { LogOut } from "lucide-react"; +// import LogoutButton from "./LogoutButton"; + +const Sidebar = ({ + sidebar, + meetingsLength, +}: { + sidebar: TSidebarLink[]; + meetingsLength: number; +}) => { + const pathname = usePathname(); + + return ( + + ); +}; + +export default Sidebar; diff --git a/src/pages/root/dashboard/index.tsx b/src/pages/root/dashboard/index.tsx new file mode 100644 index 0000000..c821c3c --- /dev/null +++ b/src/pages/root/dashboard/index.tsx @@ -0,0 +1,17 @@ +import { userSidebarLinks } from "../../../helpers/constants"; +import Sidebar from "./Sidebar"; + + +const Dashboard = ({ meetingsLength }: { meetingsLength: number }) => { + + return ( + + ); +}; + +export default Dashboard; + + diff --git a/src/pages/root/layout.tsx b/src/pages/root/layout.tsx new file mode 100644 index 0000000..45cfd6f --- /dev/null +++ b/src/pages/root/layout.tsx @@ -0,0 +1,36 @@ +import type { Metadata } from "next"; +import Sidebar from "../../components/shared/Sidebar"; +import MobileMenu from "../../components/shared/MobileMenu"; +import { getMeetings } from "../../actions/meeting_actions"; +import { TMeetingsProps } from "../../helpers/types"; + +export const metadata: Metadata = { + title: "Leadlly", + description: + "Say goodbye to one-size-fits-all! We tailor study plans and resources to your individual learning style and goals.", +}; + +export default async function MainLayout({ + children, +}: Readonly<{ + children: React.ReactNode; +}>) { + const { meetings }: { meetings: TMeetingsProps[] } = await getMeetings(""); + const inCompleteMeetingsLength = meetings.length; + + return ( + <> +
    +
    + +
    +
    + {children} +
    +
    +
    + +
    + + ); +} From 119c78883fa4f94ccbe3a238b16d4ff7e936f202 Mon Sep 17 00:00:00 2001 From: ShivaniYadav07 Date: Fri, 18 Oct 2024 23:08:29 +0530 Subject: [PATCH 2/5] fix the dashboard's ui --- package-lock.json | 27 ++ package.json | 2 + public/assets/todo_pending_animation.json | 1 + src/App.tsx | 26 +- src/actions/planner_actions.ts | 122 ++++++++ src/assets/todo_pending_animation.json | 1 + src/components/shared/Sidebar.tsx | 11 +- src/components/shared/SidebarDesktop.tsx | 17 +- src/pages/root/dashboard/Sidebar.tsx | 97 ------ .../_components/ContinuousRevision.tsx | 65 ++++ .../_components/ContinuousRevisionForm.tsx | 271 ++++++++++++++++ .../dashboard/_components/DailyReport.tsx | 49 +++ .../_components/DailyStreakDialogBox.tsx | 173 +++++++++++ .../_components/DailyStreakQuestions.tsx | 83 +++++ .../root/dashboard/_components/DesktopUI.tsx | 86 +++++ .../dashboard/_components/InitailTodoBox.tsx | 34 ++ .../dashboard/_components/LevelPoints.tsx | 85 +++++ .../root/dashboard/_components/MobileUI.tsx | 55 ++++ .../_components/MoodEmojiSelector.tsx | 102 ++++++ .../root/dashboard/_components/PointsBox.tsx | 78 +++++ .../root/dashboard/_components/ProfileBox.tsx | 67 ++++ .../_components/ProgressAnalytics.tsx | 79 +++++ .../_components/QuestionDialogBox.tsx | 294 ++++++++++++++++++ .../dashboard/_components/SubjectProgress.tsx | 101 ++++++ .../root/dashboard/_components/TabletUI.tsx | 73 +++++ .../dashboard/_components/ToDoListButton.tsx | 86 +++++ .../root/dashboard/_components/TodaysPlan.tsx | 133 ++++++++ .../root/dashboard/_components/TodaysVibe.tsx | 17 + .../_components/TrialPeriodTimer.tsx | 62 ++++ .../_components/UpcomingWorkshops.tsx | 64 ++++ .../_components/UserProfileSheet.tsx | 55 ++++ .../_components/_skeletons/ToDoSkeleton.tsx | 23 ++ src/pages/root/dashboard/index.tsx | 17 - src/pages/root/dashboard/page.tsx | 29 ++ src/pages/root/layout.tsx | 16 +- vite.config.ts | 3 + 36 files changed, 2350 insertions(+), 154 deletions(-) create mode 100644 public/assets/todo_pending_animation.json create mode 100644 src/actions/planner_actions.ts create mode 100644 src/assets/todo_pending_animation.json delete mode 100644 src/pages/root/dashboard/Sidebar.tsx create mode 100644 src/pages/root/dashboard/_components/ContinuousRevision.tsx create mode 100644 src/pages/root/dashboard/_components/ContinuousRevisionForm.tsx create mode 100644 src/pages/root/dashboard/_components/DailyReport.tsx create mode 100644 src/pages/root/dashboard/_components/DailyStreakDialogBox.tsx create mode 100644 src/pages/root/dashboard/_components/DailyStreakQuestions.tsx create mode 100644 src/pages/root/dashboard/_components/DesktopUI.tsx create mode 100644 src/pages/root/dashboard/_components/InitailTodoBox.tsx create mode 100644 src/pages/root/dashboard/_components/LevelPoints.tsx create mode 100644 src/pages/root/dashboard/_components/MobileUI.tsx create mode 100644 src/pages/root/dashboard/_components/MoodEmojiSelector.tsx create mode 100644 src/pages/root/dashboard/_components/PointsBox.tsx create mode 100644 src/pages/root/dashboard/_components/ProfileBox.tsx create mode 100644 src/pages/root/dashboard/_components/ProgressAnalytics.tsx create mode 100644 src/pages/root/dashboard/_components/QuestionDialogBox.tsx create mode 100644 src/pages/root/dashboard/_components/SubjectProgress.tsx create mode 100644 src/pages/root/dashboard/_components/TabletUI.tsx create mode 100644 src/pages/root/dashboard/_components/ToDoListButton.tsx create mode 100644 src/pages/root/dashboard/_components/TodaysPlan.tsx create mode 100644 src/pages/root/dashboard/_components/TodaysVibe.tsx create mode 100644 src/pages/root/dashboard/_components/TrialPeriodTimer.tsx create mode 100644 src/pages/root/dashboard/_components/UpcomingWorkshops.tsx create mode 100644 src/pages/root/dashboard/_components/UserProfileSheet.tsx create mode 100644 src/pages/root/dashboard/_components/_skeletons/ToDoSkeleton.tsx delete mode 100644 src/pages/root/dashboard/index.tsx create mode 100644 src/pages/root/dashboard/page.tsx diff --git a/package-lock.json b/package-lock.json index 57eef3b..12efe8e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,7 +14,9 @@ "axios": "^1.7.2", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", + "dompurify": "^3.1.7", "framer-motion": "^11.11.9", + "lottie-react": "^2.4.0", "lucide-react": "^0.400.0", "next": "^14.2.5", "radix-ui": "^1.0.1", @@ -3597,6 +3599,12 @@ "node": ">=6.0.0" } }, + "node_modules/dompurify": { + "version": "3.1.7", + "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.1.7.tgz", + "integrity": "sha512-VaTstWtsneJY8xzy7DekmYWEOZcmzIe3Qb3zPd4STve1OBTa+e+WmS1ITQec1fZYXI3HCsOZZiSMpG6oxoWMWQ==", + "license": "(MPL-2.0 OR Apache-2.0)" + }, "node_modules/eastasianwidth": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz", @@ -4595,6 +4603,25 @@ "loose-envify": "cli.js" } }, + "node_modules/lottie-react": { + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/lottie-react/-/lottie-react-2.4.0.tgz", + "integrity": "sha512-pDJGj+AQlnlyHvOHFK7vLdsDcvbuqvwPZdMlJ360wrzGFurXeKPr8SiRCjLf3LrNYKANQtSsh5dz9UYQHuqx4w==", + "license": "MIT", + "dependencies": { + "lottie-web": "^5.10.2" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, + "node_modules/lottie-web": { + "version": "5.12.2", + "resolved": "https://registry.npmjs.org/lottie-web/-/lottie-web-5.12.2.tgz", + "integrity": "sha512-uvhvYPC8kGPjXT3MyKMrL3JitEAmDMp30lVkuq/590Mw9ok6pWcFCwXJveo0t5uqYw1UREQHofD+jVpdjBv8wg==", + "license": "MIT" + }, "node_modules/lru-cache": { "version": "5.1.1", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz", diff --git a/package.json b/package.json index f879acd..4eeea91 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,9 @@ "axios": "^1.7.2", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", + "dompurify": "^3.1.7", "framer-motion": "^11.11.9", + "lottie-react": "^2.4.0", "lucide-react": "^0.400.0", "next": "^14.2.5", "radix-ui": "^1.0.1", diff --git a/public/assets/todo_pending_animation.json b/public/assets/todo_pending_animation.json new file mode 100644 index 0000000..2bca429 --- /dev/null +++ b/public/assets/todo_pending_animation.json @@ -0,0 +1 @@ +{"v":"5.5.7","meta":{"g":"LottieFiles AE 0.1.20","a":"","k":"","d":"","tc":"#eaedf1"},"fr":60,"ip":0,"op":240,"w":600,"h":600,"nm":"Scanning","ddd":0,"assets":[{"id":"comp_0","layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Rectangle Copy 10","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[274,400.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[128,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 3","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Rectangle Copy 9","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[368.5,302.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[41,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 5","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Rectangle Copy 8","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[348.5,351.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[81,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 4","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"Rectangle Copy 7","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[249,351.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[78,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 2","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"Rectangle Copy 6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[270.5,302.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[121,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":4,"nm":"Rectangle 3","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[255,234.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[90,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":4,"nm":"Rectangle 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[299.89,304.75,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[245.78,319.5],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":19,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.48627450980392156,0.3686274509803922,0.9803921568627451,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0}]},{"id":"comp_1","layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Rectangle Copy 3","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[274,400.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[128,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 3","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Rectangle Copy 5","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[368.5,302.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[41,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 5","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Rectangle Copy 4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[348.5,351.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[81,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 4","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"Rectangle Copy 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[249,351.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[78,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 2","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"Rectangle Copy","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[270.5,302.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[121,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":4,"nm":"Rectangle","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[255,234.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[90,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":4,"nm":"Rectangle","sr":1,"ks":{"o":{"a":0,"k":60,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[299.89,304.75,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[245.78,319.5],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":19,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.48627450980392156,0.3686274509803922,0.9803921568627451,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0}]}],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Rectangle","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":1,"k":[{"i":{"x":0.376,"y":1},"o":{"x":0.275,"y":0},"t":0,"s":[300,485.50000000000006,0],"to":[0,-60,0],"ti":[0,0,0]},{"i":{"x":0.725,"y":1},"o":{"x":0.632,"y":0},"t":110,"s":[300,125.49999999999999,0],"to":[0,0,0],"ti":[0,-60,0]},{"t":220,"s":[300,485.50000000000006,0]}],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[300,9],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":4.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"bottom-grad","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":120,"s":[0]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":152,"s":[40]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":199,"s":[40]},{"t":218,"s":[0]}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":1,"k":[{"i":{"x":0.374,"y":1},"o":{"x":0.274,"y":0},"t":1,"s":[300,463.5,0],"to":[0,-52.833,0],"ti":[0,-7.167,0]},{"i":{"x":0.726,"y":1},"o":{"x":0.621,"y":0},"t":111,"s":[300,146.5,0],"to":[0,7.167,0],"ti":[0,-60,0]},{"t":221,"s":[300,506.50000000000006,0]}],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,-100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[300,45],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"gf","o":{"a":0,"k":100,"ix":10},"r":1,"bm":0,"g":{"p":3,"k":{"a":0,"k":[0,0.094,0.439,0.843,0.5,0.094,0.439,0.843,1,0.094,0.439,0.843,0,0,0.252,0.2,0.505,0.4,0.752,0.7,1,1],"ix":9}},"s":{"a":0,"k":[0,-22.5],"ix":5},"e":{"a":0,"k":[0,22.5],"ix":6},"t":1,"nm":"Gradient Fill 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"top-grad","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[1]},"o":{"x":[0.167],"y":[0]},"t":0,"s":[0]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":14,"s":[40]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":89,"s":[40]},{"i":{"x":[0.833],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":108,"s":[0]},{"t":221,"s":[0]}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":1,"k":[{"i":{"x":0.376,"y":1},"o":{"x":0.271,"y":0},"t":1,"s":[300,463.5,0],"to":[0,-60,0],"ti":[0,0,0]},{"i":{"x":0.725,"y":1},"o":{"x":0.632,"y":0},"t":111,"s":[300,103.49999999999999,0],"to":[0,0,0],"ti":[0,-60,0]},{"t":221,"s":[300,463.5,0]}],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[300,45],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"gf","o":{"a":0,"k":100,"ix":10},"r":1,"bm":0,"g":{"p":3,"k":{"a":0,"k":[0,0.094,0.439,0.843,0.5,0.094,0.439,0.843,1,0.094,0.439,0.843,0,0,0.252,0.2,0.505,0.4,0.752,0.7,1,1],"ix":9}},"s":{"a":0,"k":[0,-22.5],"ix":5},"e":{"a":0,"k":[0,22.5],"ix":6},"t":1,"nm":"Gradient Fill 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":0,"nm":"full","refId":"comp_0","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[300,300,0],"ix":2},"a":{"a":0,"k":[300,300,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"hasMask":true,"masksProperties":[{"inv":false,"mode":"i","pt":{"a":1,"k":[{"i":{"x":0.364,"y":1},"o":{"x":0.272,"y":0},"t":0,"s":[{"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[448.801,109],[153,109],[153,479.957],[448.801,479.957]],"c":true}]},{"i":{"x":0.73,"y":1},"o":{"x":0.631,"y":0},"t":110,"s":[{"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[448.801,109],[153,109],[153,129.957],[448.801,129.957]],"c":true}]},{"t":220,"s":[{"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[448.801,109],[153,109],[153,479.957],[448.801,479.957]],"c":true}]}],"ix":1},"o":{"a":0,"k":100,"ix":3},"x":{"a":0,"k":0,"ix":4},"nm":"Mask 1"}],"w":600,"h":600,"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":0,"nm":"trans","refId":"comp_1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[300,300,0],"ix":2},"a":{"a":0,"k":[300,300,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":600,"h":600,"ip":0,"op":3600,"st":0,"bm":0}],"markers":[]} \ No newline at end of file diff --git a/src/App.tsx b/src/App.tsx index 12a5ac2..fe4c165 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,35 +1,26 @@ import './App.css'; -import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom'; +import { BrowserRouter, Routes, Route } from 'react-router-dom'; import { useState, useEffect } from 'react'; import Mentors from './pages/root/mentor'; import Login from './pages/auth/Login'; import Signup from './pages/auth/Singup'; import ForgotPassword from './pages/auth/ForgotPassword'; import Student from './pages/student'; -import Dashboard from './pages/root/dashboard'; +import Dashboard from './pages/root/dashboard/page'; import Loader from './pages/root/Loader'; function App() { const [isAuthenticated, setIsAuthenticated] = useState(false); const [isLoading, setIsLoading] = useState(true); - const [meetingsLength, setMeetingsLength] = useState(0); useEffect(() => { - // Check if the user is authenticated by checking for a token const token = localStorage.getItem('token'); - setIsAuthenticated(!!token); // Set authenticated state based on token presence + setIsAuthenticated(!!token); - const fetchMeetingsLength = async () => { - // Here you can make an API call to fetch the actual meetings length - const length = 5; // Example length value - setMeetingsLength(length); - setIsLoading(false); // Set loading to false after fetching length - }; - - fetchMeetingsLength(); + + setIsLoading(false); }, []); - // Show loader while fetching if (isLoading) { return ; } @@ -37,20 +28,21 @@ function App() { return ( + : } + element={isAuthenticated ? : } /> : } + element={isAuthenticated ? : } /> } /> } /> } /> : } + element={isAuthenticated ? : } /> diff --git a/src/actions/planner_actions.ts b/src/actions/planner_actions.ts new file mode 100644 index 0000000..a66ee00 --- /dev/null +++ b/src/actions/planner_actions.ts @@ -0,0 +1,122 @@ +"use server"; + +import { getCookie } from "./cookie_actions"; +import { revalidateTag } from "next/cache"; + +export const getPlanner = async () => { + const token = await getCookie("token"); + + try { + const res = await fetch( + `${process.env.NEXT_PUBLIC_STUDENT_API_BASE_URL}/api/planner/get`, + { + method: "GET", + headers: { + "Content-Type": "application/json", + Cookie: `token=${token}`, + }, + credentials: "include", + // cache: "force-cache", + next: { + tags: ["plannerData"], + }, + } + ); + + const responseData = await res.json(); + + return responseData; + } catch (error: unknown) { + if (error instanceof Error) { + throw new Error(`Error fetching planner data: ${error.message}`); + } else { + throw new Error("An unknown error occurred while fetching planner data!"); + } + } +}; + +export const createPlanner = async () => { + const token = await getCookie("token"); + + try { + const res = await fetch( + `${process.env.NEXT_PUBLIC_STUDENT_API_BASE_URL}/api/planner/create`, + { + method: "GET", + headers: { + "Content-Type": "application/json", + Cookie: `token=${token}`, + }, + credentials: "include", + } + ); + + const responseData = await res.json(); + + return responseData; + } catch (error: unknown) { + if (error instanceof Error) { + throw new Error(`Error creating planner: ${error.message}`); + } else { + throw new Error("An unknown error occurred while creating planner!"); + } + } +}; + +export const updatePlanner = async () => { + const token = await getCookie("token"); + + try { + const res = await fetch( + `${process.env.NEXT_PUBLIC_STUDENT_API_BASE_URL}/api/planner/update`, + { + method: "GET", + headers: { + "Content-Type": "application/json", + Cookie: `token=${token}`, + }, + credentials: "include", + } + ); + + const responseData = await res.json(); + revalidateTag("plannerData"); + + return responseData; + } catch (error: unknown) { + if (error instanceof Error) { + throw new Error(`Error creating planner: ${error.message}`); + } else { + throw new Error("An unknown error occurred while creating planner!"); + } + } +}; + +export const allocateBackTopics = async () => { + const token = await getCookie("token"); + + try { + const res = await fetch( + `${process.env.NEXT_PUBLIC_STUDENT_API_BASE_URL}/api/planner/allocateTopics`, + { + method: "GET", + headers: { + "Content-Type": "application/json", + Cookie: `token=${token}`, + }, + credentials: "include", + } + ); + + const responseData = await res.json(); + revalidateTag("plannerData"); + + return responseData; + } catch (error: unknown) { + if (error instanceof Error) { + throw new Error(`Error creating planner: ${error.message}`); + } else { + throw new Error("An unknown error occurred while creating planner!"); + } + } +}; diff --git a/src/assets/todo_pending_animation.json b/src/assets/todo_pending_animation.json new file mode 100644 index 0000000..2bca429 --- /dev/null +++ b/src/assets/todo_pending_animation.json @@ -0,0 +1 @@ +{"v":"5.5.7","meta":{"g":"LottieFiles AE 0.1.20","a":"","k":"","d":"","tc":"#eaedf1"},"fr":60,"ip":0,"op":240,"w":600,"h":600,"nm":"Scanning","ddd":0,"assets":[{"id":"comp_0","layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Rectangle Copy 10","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[274,400.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[128,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 3","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Rectangle Copy 9","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[368.5,302.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[41,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 5","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Rectangle Copy 8","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[348.5,351.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[81,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 4","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"Rectangle Copy 7","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[249,351.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[78,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 2","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"Rectangle Copy 6","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[270.5,302.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[121,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":4,"nm":"Rectangle 3","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[255,234.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[90,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":4,"nm":"Rectangle 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[299.89,304.75,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[245.78,319.5],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":19,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.48627450980392156,0.3686274509803922,0.9803921568627451,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0}]},{"id":"comp_1","layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Rectangle Copy 3","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[274,400.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[128,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 3","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Rectangle Copy 5","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[368.5,302.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[41,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 5","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"Rectangle Copy 4","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[348.5,351.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[81,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 4","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":4,"nm":"Rectangle Copy 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[249,351.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[78,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy 2","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":4,"nm":"Rectangle Copy","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[270.5,302.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[121,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle Copy","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":6,"ty":4,"nm":"Rectangle","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[255,234.5,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[90,25],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":12.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[1,1,1,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":3,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":7,"ty":4,"nm":"Rectangle","sr":1,"ks":{"o":{"a":0,"k":60,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[299.89,304.75,0],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[245.78,319.5],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":19,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.48627450980392156,0.3686274509803922,0.9803921568627451,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0}]}],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Rectangle","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":1,"k":[{"i":{"x":0.376,"y":1},"o":{"x":0.275,"y":0},"t":0,"s":[300,485.50000000000006,0],"to":[0,-60,0],"ti":[0,0,0]},{"i":{"x":0.725,"y":1},"o":{"x":0.632,"y":0},"t":110,"s":[300,125.49999999999999,0],"to":[0,0,0],"ti":[0,-60,0]},{"t":220,"s":[300,485.50000000000006,0]}],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[300,9],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":4.5,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"fl","c":{"a":0,"k":[0.2,0.2,0.2,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"bottom-grad","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":120,"s":[0]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":152,"s":[40]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":199,"s":[40]},{"t":218,"s":[0]}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":1,"k":[{"i":{"x":0.374,"y":1},"o":{"x":0.274,"y":0},"t":1,"s":[300,463.5,0],"to":[0,-52.833,0],"ti":[0,-7.167,0]},{"i":{"x":0.726,"y":1},"o":{"x":0.621,"y":0},"t":111,"s":[300,146.5,0],"to":[0,7.167,0],"ti":[0,-60,0]},{"t":221,"s":[300,506.50000000000006,0]}],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,-100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[300,45],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"gf","o":{"a":0,"k":100,"ix":10},"r":1,"bm":0,"g":{"p":3,"k":{"a":0,"k":[0,0.094,0.439,0.843,0.5,0.094,0.439,0.843,1,0.094,0.439,0.843,0,0,0.252,0.2,0.505,0.4,0.752,0.7,1,1],"ix":9}},"s":{"a":0,"k":[0,-22.5],"ix":5},"e":{"a":0,"k":[0,22.5],"ix":6},"t":1,"nm":"Gradient Fill 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":3,"ty":4,"nm":"top-grad","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.833],"y":[1]},"o":{"x":[0.167],"y":[0]},"t":0,"s":[0]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":14,"s":[40]},{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":89,"s":[40]},{"i":{"x":[0.833],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":108,"s":[0]},{"t":221,"s":[0]}],"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":1,"k":[{"i":{"x":0.376,"y":1},"o":{"x":0.271,"y":0},"t":1,"s":[300,463.5,0],"to":[0,-60,0],"ti":[0,0,0]},{"i":{"x":0.725,"y":1},"o":{"x":0.632,"y":0},"t":111,"s":[300,103.49999999999999,0],"to":[0,0,0],"ti":[0,-60,0]},{"t":221,"s":[300,463.5,0]}],"ix":2},"a":{"a":0,"k":[0,0,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ty":"rc","d":1,"s":{"a":0,"k":[300,45],"ix":2},"p":{"a":0,"k":[0,0],"ix":3},"r":{"a":0,"k":0,"ix":4},"nm":"Rectangle Path 1","mn":"ADBE Vector Shape - Rect","hd":false},{"ty":"gf","o":{"a":0,"k":100,"ix":10},"r":1,"bm":0,"g":{"p":3,"k":{"a":0,"k":[0,0.094,0.439,0.843,0.5,0.094,0.439,0.843,1,0.094,0.439,0.843,0,0,0.252,0.2,0.505,0.4,0.752,0.7,1,1],"ix":9}},"s":{"a":0,"k":[0,-22.5],"ix":5},"e":{"a":0,"k":[0,22.5],"ix":6},"t":1,"nm":"Gradient Fill 1","mn":"ADBE Vector Graphic - G-Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[0,0],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Rectangle","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":4,"ty":0,"nm":"full","refId":"comp_0","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[300,300,0],"ix":2},"a":{"a":0,"k":[300,300,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"hasMask":true,"masksProperties":[{"inv":false,"mode":"i","pt":{"a":1,"k":[{"i":{"x":0.364,"y":1},"o":{"x":0.272,"y":0},"t":0,"s":[{"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[448.801,109],[153,109],[153,479.957],[448.801,479.957]],"c":true}]},{"i":{"x":0.73,"y":1},"o":{"x":0.631,"y":0},"t":110,"s":[{"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[448.801,109],[153,109],[153,129.957],[448.801,129.957]],"c":true}]},{"t":220,"s":[{"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[448.801,109],[153,109],[153,479.957],[448.801,479.957]],"c":true}]}],"ix":1},"o":{"a":0,"k":100,"ix":3},"x":{"a":0,"k":0,"ix":4},"nm":"Mask 1"}],"w":600,"h":600,"ip":0,"op":3600,"st":0,"bm":0},{"ddd":0,"ind":5,"ty":0,"nm":"trans","refId":"comp_1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[300,300,0],"ix":2},"a":{"a":0,"k":[300,300,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"w":600,"h":600,"ip":0,"op":3600,"st":0,"bm":0}],"markers":[]} \ No newline at end of file diff --git a/src/components/shared/Sidebar.tsx b/src/components/shared/Sidebar.tsx index 5215b17..630cac8 100644 --- a/src/components/shared/Sidebar.tsx +++ b/src/components/shared/Sidebar.tsx @@ -1,9 +1,12 @@ -"use client"; +import React from "react"; +import SidebarDesktop from "./SidebarDesktop"; // Ensure this path is correct +import { userSidebarLinks } from "../../helpers/constants"; // Adjust path if necessary -import SidebarDesktop from "./SidebarDesktop"; -import { userSidebarLinks } from "../../helpers/constants"; +type SidebarProps = { + meetingsLength: number; // TypeScript prop definition +}; -const Sidebar = ({ meetingsLength }: { meetingsLength: number }) => { +const Sidebar: React.FC = ({ meetingsLength }) => { return ( { +}; +const SidebarDesktop: React.FC = ({ sidebar, meetingsLength }) => { const pathname = usePathname(); - return ( -