diff --git a/src/app/[name]/(Dialogs)/notifications/hooks/useNotificationData.ts b/src/app/[name]/(Dialogs)/notifications/hooks/useNotificationData.ts index 49dd7fb..48c7cea 100644 --- a/src/app/[name]/(Dialogs)/notifications/hooks/useNotificationData.ts +++ b/src/app/[name]/(Dialogs)/notifications/hooks/useNotificationData.ts @@ -1,5 +1,5 @@ import * as api from "../service/NotificationService"; -import { useQuery } from "@tanstack/react-query"; +import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; export const useGetNotifications = () => { return useQuery({ @@ -7,3 +7,13 @@ export const useGetNotifications = () => { queryFn: api.getNotifications, }); }; + +export const useDeleteNotification = () => { + const queryClient = useQueryClient(); + return useMutation({ + mutationFn: api.deleteNotification, + onSuccess: () => { + queryClient.invalidateQueries({ queryKey: ["notifications"] }); + }, + }); +}; diff --git a/src/app/[name]/(Dialogs)/notifications/page.tsx b/src/app/[name]/(Dialogs)/notifications/page.tsx index 73b2959..98598ce 100644 --- a/src/app/[name]/(Dialogs)/notifications/page.tsx +++ b/src/app/[name]/(Dialogs)/notifications/page.tsx @@ -5,16 +5,82 @@ import { ArrowLeft, Trash } from 'iconsax-react'; import { useRouter } from 'next/navigation'; import React from 'react' import { useTranslation } from 'react-i18next'; -import { useGetNotifications } from './hooks/useNotificationData'; +import { useGetNotifications, useDeleteNotification } from './hooks/useNotificationData'; +import type { Notification } from './types/Types'; type Props = object +const formatDate = (dateString: string): string => { + const date = new Date(dateString); + return date.toLocaleDateString('fa-IR', { + year: 'numeric', + month: 'long', + day: 'numeric' + }); +}; + +const formatTime = (dateString: string): string => { + const date = new Date(dateString); + return date.toLocaleTimeString('fa-IR', { + hour: '2-digit', + minute: '2-digit' + }); +}; + export default function NotificationsIndex({ }: Props) { - - const { t } = useTranslation('notifications') const router = useRouter(); - const { data } = useGetNotifications(); + const { data, isLoading, isError } = useGetNotifications(); + const { mutate: deleteNotification } = useDeleteNotification(); + + const notifications = React.useMemo(() => { + return data?.data ?? []; + }, [data?.data]); + + const handleDelete = (id: string) => { + deleteNotification(id); + }; + + if (isLoading) { + return ( +
+
+ +

{t("Heading")}

+ { router.back() }} + /> +
+
+ +

در حال دریافت اعلان‌ها...

+
+
+ ); + } + + if (isError || !notifications.length) { + return ( +
+
+ +

{t("Heading")}

+ { router.back() }} + /> +
+
+

اعلانی وجود ندارد

+
+
+ ); + } return (
@@ -30,27 +96,40 @@ export default function NotificationsIndex({ }: Props) {
) diff --git a/src/app/[name]/(Dialogs)/notifications/service/NotificationService.ts b/src/app/[name]/(Dialogs)/notifications/service/NotificationService.ts index b82cece..3d668c7 100644 --- a/src/app/[name]/(Dialogs)/notifications/service/NotificationService.ts +++ b/src/app/[name]/(Dialogs)/notifications/service/NotificationService.ts @@ -1,6 +1,19 @@ import { api } from "@/config/axios"; +import { NotificationsResponse } from "../types/Types"; +import { BaseResponse } from "@/app/[name]/(Main)/types/Types"; -export const getNotifications = async () => { - const { data } = await api.get("/public/notifications"); +export const getNotifications = async (): Promise => { + const { data } = await api.get( + "/public/notifications" + ); + return data; +}; + +export const deleteNotification = async ( + id: string +): Promise> => { + const { data } = await api.delete>( + `/public/notifications/${id}` + ); return data; }; diff --git a/src/app/[name]/(Dialogs)/notifications/types/Types.ts b/src/app/[name]/(Dialogs)/notifications/types/Types.ts new file mode 100644 index 0000000..e7d72bf --- /dev/null +++ b/src/app/[name]/(Dialogs)/notifications/types/Types.ts @@ -0,0 +1,16 @@ +import { BaseResponse } from "@/app/[name]/(Main)/types/Types"; + +export interface Notification { + id: string; + createdAt: string; + updatedAt: string; + deletedAt: string | null; + restaurant: string; + user: string; + admin: string | null; + title: string; + content: string; + sentAt: string | null; +} + +export type NotificationsResponse = BaseResponse; diff --git a/src/components/navigation/BottomNavBar.tsx b/src/components/navigation/BottomNavBar.tsx index 4086aa6..fcbef8a 100644 --- a/src/components/navigation/BottomNavBar.tsx +++ b/src/components/navigation/BottomNavBar.tsx @@ -52,20 +52,11 @@ function BottomNavBar({ onPagerClick }: BottomNavBarProps) { {/* 🔽 Your HTML content inside SVG */}