diff --git a/components/ui/sidebar/SidebarItems.tsx b/components/ui/sidebar/SidebarItems.tsx
index 9d81de6740..e6423fff62 100644
--- a/components/ui/sidebar/SidebarItems.tsx
+++ b/components/ui/sidebar/SidebarItems.tsx
@@ -95,7 +95,7 @@ export const sectionItems: SidebarItem[] = [
title: "Dashboards",
items: [
{
- key: "home",
+ key: "overview",
href: "/",
icon: "solar:home-2-linear",
title: "Overview",
diff --git a/components/ui/sidebar/SidebarWrap.tsx b/components/ui/sidebar/SidebarWrap.tsx
index 7f9b0e62e2..f2212850bb 100644
--- a/components/ui/sidebar/SidebarWrap.tsx
+++ b/components/ui/sidebar/SidebarWrap.tsx
@@ -3,6 +3,7 @@
import { Icon } from "@iconify/react";
import { Button, ScrollShadow, Spacer, Tooltip } from "@nextui-org/react";
import clsx from "clsx";
+import { usePathname } from "next/navigation";
import React, { useCallback, useEffect, useState } from "react";
import { useMediaQuery } from "usehooks-ts";
@@ -19,6 +20,9 @@ export const SidebarWrap = () => {
const [isCollapsed, setIsCollapsed] = useState(false);
const [isLoaded, setIsLoaded] = useState(false);
+ const pathname = usePathname();
+ const currentPath = pathname === "/" ? "overview" : pathname.split("/")?.[1];
+
const isMobile = useMediaQuery("(max-width: 768px)");
const isCompact = isCollapsed || isMobile;
@@ -74,16 +78,17 @@ export const SidebarWrap = () => {