diff --git a/apps/app/components/notifications/notification-popover.tsx b/apps/app/components/notifications/notification-popover.tsx
index 6080ee5e8..0ad6ae66f 100644
--- a/apps/app/components/notifications/notification-popover.tsx
+++ b/apps/app/components/notifications/notification-popover.tsx
@@ -118,7 +118,7 @@ export const NotificationPopover = () => {
               leaveFrom="opacity-100 translate-y-0"
               leaveTo="opacity-0 translate-y-1"
             >
-              <Popover.Panel className="absolute bg-custom-background-100 flex flex-col left-0 md:left-full ml-8 z-10 top-0 md:w-[36rem] w-[20rem] h-[27rem] border border-custom-border-300 shadow-lg rounded-xl">
+              <Popover.Panel className="absolute bg-custom-background-100 flex flex-col left-0 md:left-full ml-8 z-10 top-0 md:w-[36rem] w-[20rem] h-[50vh] border border-custom-border-300 shadow-lg rounded-xl">
                 <div className="flex items-center justify-between px-5 pt-5">
                   <h2 className="text-xl font-semibold mb-2">Notifications</h2>
                   <div className="flex gap-x-4 justify-center items-center text-custom-text-200">
diff --git a/apps/app/hooks/use-user-notifications.tsx b/apps/app/hooks/use-user-notifications.tsx
index b202a1deb..394628aee 100644
--- a/apps/app/hooks/use-user-notifications.tsx
+++ b/apps/app/hooks/use-user-notifications.tsx
@@ -54,44 +54,48 @@ const useUserNotification = () => {
       notifications?.find((notification) => notification.id === notificationId)?.read_at !== null;
 
     if (isRead) {
+      notificationsMutate(
+        (prev) =>
+          prev?.map((prevNotification) => {
+            if (prevNotification.id === notificationId) {
+              return {
+                ...prevNotification,
+                read_at: null,
+              };
+            }
+            return prevNotification;
+          }),
+        false
+      );
       await userNotificationServices
         .markUserNotificationAsUnread(workspaceSlug.toString(), notificationId)
-        .then(() => {
-          notificationsMutate((prev) =>
-            prev?.map((prevNotification) => {
-              if (prevNotification.id === notificationId) {
-                return {
-                  ...prevNotification,
-                  read_at: null,
-                };
-              }
-              return prevNotification;
-            })
-          );
-          mutateNotificationCount();
-        })
         .catch(() => {
           throw new Error("Something went wrong");
+        })
+        .finally(() => {
+          notificationsMutate();
         });
     } else {
+      notificationsMutate(
+        (prev) =>
+          prev?.map((prevNotification) => {
+            if (prevNotification.id === notificationId) {
+              return {
+                ...prevNotification,
+                read_at: new Date(),
+              };
+            }
+            return prevNotification;
+          }),
+        false
+      );
       await userNotificationServices
         .markUserNotificationAsRead(workspaceSlug.toString(), notificationId)
-        .then(() => {
-          notificationsMutate((prev) =>
-            prev?.map((prevNotification) => {
-              if (prevNotification.id === notificationId) {
-                return {
-                  ...prevNotification,
-                  read_at: new Date(),
-                };
-              }
-              return prevNotification;
-            })
-          );
-          mutateNotificationCount();
-        })
         .catch(() => {
           throw new Error("Something went wrong");
+        })
+        .finally(() => {
+          notificationsMutate();
         });
     }
   };
@@ -105,22 +109,24 @@ const useUserNotification = () => {
     if (isArchived) {
       await userNotificationServices
         .markUserNotificationAsUnarchived(workspaceSlug.toString(), notificationId)
-        .then(() => {
-          notificationsMutate();
-        })
         .catch(() => {
           throw new Error("Something went wrong");
+        })
+        .finally(() => {
+          notificationsMutate();
         });
     } else {
+      notificationsMutate(
+        (prev) => prev?.filter((prevNotification) => prevNotification.id !== notificationId),
+        false
+      );
       await userNotificationServices
         .markUserNotificationAsArchived(workspaceSlug.toString(), notificationId)
-        .then(() => {
-          notificationsMutate((prev) =>
-            prev?.filter((prevNotification) => prevNotification.id !== notificationId)
-          );
-        })
         .catch(() => {
           throw new Error("Something went wrong");
+        })
+        .finally(() => {
+          notificationsMutate();
         });
     }
   };
@@ -137,19 +143,25 @@ const useUserNotification = () => {
         .patchUserNotification(workspaceSlug.toString(), notificationId, {
           snoozed_till: null,
         })
-        .then(() => {
+        .finally(() => {
           notificationsMutate();
         });
-    } else
+    } else {
+      notificationsMutate(
+        (prevData) => prevData?.filter((prev) => prev.id !== notificationId) || [],
+        false
+      );
       await userNotificationServices
         .patchUserNotification(workspaceSlug.toString(), notificationId, {
           snoozed_till: dateTime,
         })
-        .then(() => {
-          notificationsMutate(
-            (prevData) => prevData?.filter((prev) => prev.id !== notificationId) || []
-          );
+        .catch(() => {
+          new Error("Something went wrong");
+        })
+        .finally(() => {
+          notificationsMutate();
         });
+    }
   };
 
   return {