made more changes

compass/app/admin/page.tsx

@@ -1,7 +1,7 @@
 "use client";
 
-import { PageLayout } from "@/components/admin/PageLayout";
-import { Table } from "@/components/admin/Table/Index";
+import { PageLayout } from "@/components/PageLayout";
+import { Table } from "@/components/Table/Index";
 
 import { UsersIcon } from "@heroicons/react/24/solid";
 

compass/components/resource/Sidebar.tsx

@@ -31,7 +31,7 @@ const Sidebar: React.FC<SidebarProps> = ({ setIsSidebarOpen }) => {
         <div className="flex flex-col space-y-2">
           <h4 className="text-xs font-semibold text-gray-500">Pages</h4>
           <nav className="flex flex-col">
-          <SidebarItem icon={<HomeIcon  />} text="Home" />
+          <SidebarItem active={true} icon={<HomeIcon  />} text="Home" />
             <SidebarItem icon={<BookmarkIcon  />} text="Resources" />
             <SidebarItem icon={<ClipboardIcon />} text="Services" />
             <SidebarItem icon={<BookOpenIcon  />} text="Training Manuals" />

compass/components/resource/SidebarItem.tsx

@@ -2,11 +2,12 @@
 interface SidebarItemProps {
   icon: React.ReactElement;
   text: string;
+  active: boolean;
 }
 
-export const SidebarItem: React.FC<SidebarItemProps> = ({ icon, text }) => {
+export const SidebarItem: React.FC<SidebarItemProps> = ({ icon, text, active }) => {
   return (
-    <a href="#" className="flex items-center p-2 space-x-2 hover:bg-gray-200 rounded-md">
+    <a href="#" className={active ? "flex items-center p-2 space-x-2 bg-gray-200 rounded-md"  : "flex items-center p-2 space-x-2 hover:bg-gray-200 rounded-md"}>
       <span className="h-5 text-gray-500 w-5">
       {icon}
       </span>