feat(sidebar): Add support for multi-level nested navigation

This commit refactors the sidebar component to support arbitrarily deep nested navigation items.

The previous implementation was limited to one level of nesting and contained complex rendering logic directly within the main component, making it difficult to extend and maintain.

Changes include:
- Extracted the rendering logic into a new recursive `MenuItem` component.
- Rewrote the effect that keeps the active path expanded to correctly handle multiple levels of nesting.
- Updated the navigation data structure to reflect the new capabilities and corrected the URL for "Company Categories".
- Removed a large block of commented-out, unused navigation data.

src/app/(companies)/company-categories/create/page.tsx

@@ -7,8 +7,8 @@ interface IProps {}
 const CreateCompanyCategoryPage = ({}: IProps) => {
   const breadcrumbItems: BreadcrumbItem[] = [
     { href: "/", name: "Dashboard" },
-    { href: "/companies/categories", name: "Company Categories" },
-    { href: "/companies/categories/create", name: "Create Company Category" },
+    { href: "/company-categories", name: "Company Categories" },
+    { href: "/company-categories/create", name: "Create Company Category" },
   ];
   return (
     <>

src/app/(companies)/company-categories/edit/[id]/page.tsx

@@ -15,8 +15,8 @@ const EditCompanyCategory = ({
   const { isLoading, data } = useCompanyCategoriesDetails(id);
   const breadcrumbItems: BreadcrumbItem[] = [
     { name: "Dashboard", href: "/" },
-    { name: "Company Categories", href: "/companies/categories" },
-    { name: "Edit Company Category", href: `/companies/categories/edit/${id}` },
+    { name: "Company Categories", href: "/company-categories" },
+    { name: "Edit Company Category", href: `/company-categories/edit/${id}` },
   ];
   if (isLoading) return <Loading />;
   return (

src/app/(companies)/company-categories/page.tsx

@@ -4,7 +4,7 @@ import CompanyCategoriesTable from "@/components/Tables/companies/company-catego
 const CompanyCategoryList = () => {
   const breadcrumbItems = [
     { name: "Dashboard", href: "/" },
-    { name: "Company Categories", href: "/companies/categories" },
+    { name: "Company Categories", href: "/company-categories" },
   ];
   return (
     <>