diff --git a/src/app/portfolio/[uid]/query.ts b/src/app/portfolio/[uid]/query.ts
index aac9153..3333de8 100644
--- a/src/app/portfolio/[uid]/query.ts
+++ b/src/app/portfolio/[uid]/query.ts
@@ -29,7 +29,7 @@ async function getLatestInvestment(
   deals: { project_id: number; deal_amount: number; created_time: Date;}[]
 ) {
   const llist = [];
-  const count = 8;
+  const count = 5;
   // select project name from the given id
   for (let i = deals.length - 1; i >= 0 && llist.length < count; --i) {
     let { data: project, error } = await supabase.from("project").select("project_name").eq("id", deals[i].project_id);
diff --git a/src/components/customToolTip.tsx b/src/components/customToolTip.tsx
new file mode 100644
index 0000000..a2cb991
--- /dev/null
+++ b/src/components/customToolTip.tsx
@@ -0,0 +1,22 @@
+import React from "react";
+import { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from "./ui/tooltip";
+
+interface CustomTooltipProps {
+  message: string;
+  children: React.ReactNode;
+}
+
+const CustomTooltip: React.FC<CustomTooltipProps> = ({ message, children }) => {
+  return (
+    <TooltipProvider delayDuration={0.5}>
+      <Tooltip>
+        <TooltipTrigger asChild>{children}</TooltipTrigger>
+        <TooltipContent>
+          <p>{message}</p>
+        </TooltipContent>
+      </Tooltip>
+    </TooltipProvider>
+  );
+};
+
+export default CustomTooltip;
diff --git a/src/components/navigationBar/AuthenticatedComponents.tsx b/src/components/navigationBar/AuthenticatedComponents.tsx
index b37f349..b2ab5d0 100644
--- a/src/components/navigationBar/AuthenticatedComponents.tsx
+++ b/src/components/navigationBar/AuthenticatedComponents.tsx
@@ -10,9 +10,10 @@ import {
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
-import { Bell, Heart, Wallet } from "lucide-react";
+import { Bell, Heart, Wallet, ChartPie } from "lucide-react";
 import { LogoutButton } from "@/components/auth/logoutButton";
 import { useUserRole } from "@/hooks/useUserRole";
+import CustomTooltip from "../customToolTip";
 
 interface AuthenticatedComponentsProps {
   uid: string;
@@ -28,22 +29,32 @@ export const AuthenticatedComponents = ({ uid, avatarUrl, notificationCount }: A
 
   return (
     <div className={`flex gap-3 pl-2 items-center ${businessClass}`}>
-      <Link href={"/notification"}>
-        <div className="relative inline-block">
-          <Bell className="h-6 w-6 " />
-          {notificationCount >= 1 && (
-            <span className="absolute -top-1 -right-1 inline-flex items-center justify-center w-4 h-4 text-xs font-bold text-white bg-red-600 rounded-full animate-ping">
-              {notificationCount}
-            </span>
-          )}
-        </div>
-      </Link>
+      <CustomTooltip message="Notification">
+        <Link href={"/notification"}>
+          <div className="relative inline-block">
+            <Bell className="h-6 w-6 " />
+            {notificationCount >= 1 && (
+              <span className="absolute -top-1 -right-1 inline-flex items-center justify-center w-4 h-4 text-xs font-bold text-white bg-red-600 rounded-full animate-ping">
+                {notificationCount}
+              </span>
+            )}
+          </div>
+        </Link>
+      </CustomTooltip>
       <Link href="/follow">
         <Heart />
       </Link>
       <Link href={"/portfolio/" + uid}>
         <Wallet className="cursor-pointer" />
       </Link>
+      {/*chart pie icon for bussiness's dashboard */}
+      {data?.role === "business" && (
+        <CustomTooltip message="Dashboard">
+          <Link href="/dashboard">
+            <ChartPie />
+          </Link>
+        </CustomTooltip>
+      )}
       <DropdownMenu>
         <DropdownMenuTrigger asChild>
           <Button variant="outline" size="icon" className="overflow-hidden rounded-full">