Remove /me/clients page in favor of single /clients?me

src/app/(pages)/clients/page.tsx

@@ -13,21 +13,22 @@ type ClientsProps = {
     count?: string;
     page?: string;
     query?: string;
+    me?: string;
   };
-  me?: boolean;
 };
 
 export default async function ClientsPage(props: Readonly<ClientsProps>) {
-  const { searchParams, me } = props;
+  const { searchParams } = props;
+  const isMe = searchParams?.hasOwnProperty("me");
   const count = searchParams?.count ? parseInt(searchParams.count) : 10;
   const page = searchParams?.page ? parseInt(searchParams.page) : 1;
   const query = searchParams?.query;
   const startIndex = 1 + count * (page - 1);
-  const clientPage = await getClientsPage(count, startIndex, me, query);
+  const clientPage = await getClientsPage(count, startIndex, isMe, query);
   const numberOfPages = Math.ceil(clientPage.totalResults / count);
   const clients = clientPage.Resources;
   return (
-    <Page title="Clients">
+    <Page title={`${isMe ? "My Clients" : "Clients"}`}>
       <Panel>
         <Section>
           <div className="flex flex-row gap-2">

src/components/Sidebar/Link.tsx

@@ -1,6 +1,6 @@
 "use client";
 import { default as NextLink } from "next/link";
-import { usePathname } from "next/navigation";
+import { usePathname, useSearchParams } from "next/navigation";
 
 export type SidebarLinkProps = {
   sidebarId: string;
@@ -12,17 +12,27 @@ export type SidebarLinkProps = {
 export default function Link(props: Readonly<SidebarLinkProps>) {
   const { sidebarId, title, href, icon } = props;
   const pathname = usePathname();
+  const searchParams = useSearchParams();
   const hideSidebar = () => {
     const dismissButton = document.getElementById(`${sidebarId}-dismiss-btn`);
     dismissButton?.click();
   };
-
+  console.log(searchParams);
   let isActive = pathname.split("/")[1] === href.split("/")[1];
-  if (
-    (pathname === "/users/me" && href === "/users") ||
-    (pathname === "/users" && href === "/users/me")
-  ) {
-    isActive = false;
+
+  switch (pathname) {
+    case "/users":
+      isActive = href === "/users";
+      break;
+    case "/users/me":
+      isActive = href === "/users/me";
+      break;
+    case "/clients":
+      isActive =
+        (href === "/clients?me" && searchParams.has("me")) ||
+        (href === "/clients" && !searchParams.has("me"));
+      break;
+    default:
   }
 
   return (

src/components/Sidebar/index.tsx

@@ -35,7 +35,7 @@ const AccountManagement = () => {
       <SidebarLink title="Home" href="/users/me" icon={<HomeIcon />} />
       <SidebarLink
         title="My Clients"
-        href="/me/clients"
+        href="/clients?me"
         icon={<RocketLaunchIcon />}
       />
     </DrawerSection>