From d363e64bcc6c78972c83e1c0285902d7f920eb35 Mon Sep 17 00:00:00 2001
From: hamid zarghami <hamid.zarghami1@gmail.com>
Date: Mon, 22 Dec 2025 14:14:20 +0330
Subject: [PATCH] notification count

---
 src/app/[name]/(Main)/hooks/useMenuData.ts   |  7 +++++++
 src/app/[name]/(Main)/service/MenuService.ts | 15 ++++++++++++++-
 src/app/[name]/(Main)/types/Types.ts         |  6 ++++++
 src/components/topbar/TopBar.tsx             |  4 +++-
 4 files changed, 30 insertions(+), 2 deletions(-)

diff --git a/src/app/[name]/(Main)/hooks/useMenuData.ts b/src/app/[name]/(Main)/hooks/useMenuData.ts
index 670dd34..2010c78 100644
--- a/src/app/[name]/(Main)/hooks/useMenuData.ts
+++ b/src/app/[name]/(Main)/hooks/useMenuData.ts
@@ -19,3 +19,10 @@ export const useGetCategories = () => {
     enabled: !!name,
   });
 };
+
+export const useGetNotificationsCount = () => {
+  return useQuery({
+    queryKey: ["notifications-count"],
+    queryFn: api.getNotificationsCount,
+  });
+};
diff --git a/src/app/[name]/(Main)/service/MenuService.ts b/src/app/[name]/(Main)/service/MenuService.ts
index 6f601fd..356d758 100644
--- a/src/app/[name]/(Main)/service/MenuService.ts
+++ b/src/app/[name]/(Main)/service/MenuService.ts
@@ -1,5 +1,9 @@
 import { api } from "@/config/axios";
-import { CategoriesResponse, FoodsResponse } from "../types/Types";
+import {
+  CategoriesResponse,
+  FoodsResponse,
+  NotificationsCountResponse,
+} from "../types/Types";
 
 export const getFoods = async (slug: string): Promise<FoodsResponse> => {
   const response = await api.get<FoodsResponse>(
@@ -16,3 +20,12 @@ export const getCategories = async (
   );
   return response.data;
 };
+
+export const getNotificationsCount = async (): Promise<
+  NotificationsCountResponse
+> => {
+  const response = await api.get<NotificationsCountResponse>(
+    `/public/notifications/unseen-count`
+  );
+  return response.data;
+};
diff --git a/src/app/[name]/(Main)/types/Types.ts b/src/app/[name]/(Main)/types/Types.ts
index 25d0027..f3bc02c 100644
--- a/src/app/[name]/(Main)/types/Types.ts
+++ b/src/app/[name]/(Main)/types/Types.ts
@@ -76,3 +76,9 @@ export interface Food {
 
 export type FoodsResponse = BaseResponse<Food[]>;
 export type FoodResponse = BaseResponse<Food>;
+
+export interface NotificationsCountData {
+  count: number;
+}
+
+export type NotificationsCountResponse = BaseResponse<NotificationsCountData>;
diff --git a/src/components/topbar/TopBar.tsx b/src/components/topbar/TopBar.tsx
index 696b41d..1d88440 100644
--- a/src/components/topbar/TopBar.tsx
+++ b/src/components/topbar/TopBar.tsx
@@ -11,6 +11,7 @@ import { useParams } from 'next/navigation'
 import useToggle from '@/hooks/helpers/useToggle'
 import LogoutPrompt from '@/features/general/LogoutPrompt'
 import { useGetProfile } from '@/app/[name]/(Profile)/profile/hooks/userProfileData'
+import { useGetNotificationsCount } from '@/app/[name]/(Main)/hooks/useMenuData'
 
 type Props = {
     profileDropState: boolean,
@@ -29,6 +30,7 @@ function TopBar({ profileDropState, toggleProfileDropState, toggleMenuState }: P
     const { name } = params;
     const { state: logoutModal, toggle: toggleLogoutModal } = useToggle();
     const { data: profile, isSuccess } = useGetProfile();
+    const { data: notificationsCount } = useGetNotificationsCount();
     const profileData = profile?.data;
     const isLoggedIn = isSuccess && profileData;
     const fullName = profileData ? `${profileData.firstName} ${profileData.lastName}`.trim() : 'کاربر داناک';
@@ -70,7 +72,7 @@ function TopBar({ profileDropState, toggleProfileDropState, toggleMenuState }: P
                         className='relative'>
                         <NotificationBellIcon className='size-4.5 text-icon-active dark:text-foreground' />
                         <span className='absolute -right-1 -top-1 flex items-center justify-center bg-primary size-3 rounded-full text-[8px] text-container'>
-                            <div className='mt-0.25 place-self-center'>2</div>
+                            <div className='mt-0.25 place-self-center'>{notificationsCount?.data?.count}</div>
                         </span>
                     </Link>
                     {isLoggedIn ? (