diff --git a/components/layout/sidebar.tsx b/components/layout/sidebar.tsx
deleted file mode 100644
index f1c949b..0000000
--- a/components/layout/sidebar.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-"use client";
-
-import { Session } from "next-auth";
-import { BsFillArrowLeftCircleFill } from "react-icons/bs";
-import { useSignInModal } from "./sign-in-modal";
-import {
- AiFillHome,
- AiOutlineVideoCameraAdd,
- AiFillCheckCircle,
- AiFillSetting
-} from "react-icons/ai";
-import { HiMiniArrowLeftCircle, HiMiniArrowRightCircle } from "react-icons/hi2";
-// import { GiCootieCatcher } from "react-icons/gi";
-import { useState } from "react";
-
-export default function Sidebar({ session }: { session?: Session | null }) {
- // const { SignInModal, setShowSignInModal } = useSignInModal();
- const [modalCollapse, setModalCollapse] = useState(true);
- return (
-
-
-
- {modalCollapse && "Catchup"}
-
-
-
-
- );
-}
diff --git a/components/modals/add-contact-modal.tsx b/components/modals/add-contact-modal.tsx
index 5d0125d..1c01ecd 100644
--- a/components/modals/add-contact-modal.tsx
+++ b/components/modals/add-contact-modal.tsx
@@ -1,5 +1,5 @@
import Modal from "@/components/shared/modal";
-import { Button } from "@/app/ui/button";
+import { Button } from "@/components/ui/Button";
import { ContactCreationRequest } from "@/lib/validators/contact";
import axios from "axios";
import Link from "next/link";
diff --git a/components/shared/modal.tsx b/components/shared/modal.tsx
index 45bfad5..cac217a 100644
--- a/components/shared/modal.tsx
+++ b/components/shared/modal.tsx
@@ -66,7 +66,7 @@ export default function Modal({
,
+ activeIcon: (
+
+ ),
+ inactiveIcon: (
+
+ ),
+ subItem: [
+ {
+ title: "Expenses",
+ to: "/expensetracker",
+ icon:
+ },
+ {
+ title: "Habits",
+ to: "/habits",
+ icon:
+ },
+ {
+ title: "CatchUp",
+ to: "/catchup",
+ icon:
+ },
+ {
+ title: "Timers",
+ to: "/dashboard",
+ icon:
+ }
+ ]
+ },
+ {
+ title: "Profile",
+ to: "/profile",
+ activeIcon: (
+
+ ),
+ inactiveIcon: (
+
+ )
+ },
+ {
+ title: "Settings",
+ to: "/settings",
+ activeIcon: (
+
+ ),
+ inactiveIcon: (
+
+ )
+ },
+ {
+ title: "Logout",
+ to: "/logout",
+ activeIcon: (
+
+ )
+ }
+];
+
+export default sideBarData;
diff --git a/components/sidebar/sidebar.tsx b/components/sidebar/sidebar.tsx
new file mode 100644
index 0000000..1264b8a
--- /dev/null
+++ b/components/sidebar/sidebar.tsx
@@ -0,0 +1,51 @@
+"use client";
+
+import { Session } from "next-auth";
+import { HiMiniArrowLeftCircle, HiMiniArrowRightCircle } from "react-icons/hi2";
+import { useState } from "react";
+import Link from "next/link";
+import sideBarData from "@/components/sidebar/sideBarData";
+import SubMenu from "@/components/sidebar/subMenu";
+
+export default function Sidebar({ session }: { session?: Session | null }) {
+ // const { SignInModal, setShowSignInModal } = useSignInModal();
+ const [modalCollapse, setModalCollapse] = useState(true);
+ return (
+
+
+
+
+ Cu
+
+ {modalCollapse && catchup}
+ {/* */}
+
+
+
+
+ );
+}
diff --git a/components/sidebar/subMenu.tsx b/components/sidebar/subMenu.tsx
new file mode 100644
index 0000000..22f1fc2
--- /dev/null
+++ b/components/sidebar/subMenu.tsx
@@ -0,0 +1,29 @@
+import Link from "next/link";
+import React, { ReactElement } from "react";
+// import { IconBase, IconType } from "react-icons";
+
+type SubItem = {
+ title: string;
+ to: string;
+ icon: ReactElement;
+};
+
+type Props = {
+ title: string;
+ to: string;
+ icon: ReactElement;
+ subItem?: SubItem[];
+};
+
+function SubMenu({ title, to, icon, subItem }: Props) {
+ return (
+
+
+ {icon}
+ {title}
+
+
+ );
+}
+
+export default SubMenu;