improvement: notify counter badge added to treatment and tasks tabs for upadted and edited cases.

frontend/src/components/ui/lab/CasesPage.tsx

@@ -14,6 +14,8 @@ import {
   formatPatientName,
 } from '@/components/lab/caseDetailUtils';
 import { LabCaseDueDateBadge } from '@/components/lab/LabCaseDueDateBadge';
+import { notificationsApi } from '@/lib/api/notifications';
+import { notifyTabBadgesChanged } from '@/lib/tabBadgeUtils';
 import { casesApi } from '@/lib/api/cases';
 import { tasksApi } from '@/lib/api/tasks';
 import { treatmentCatalogApi } from '@/lib/api/treatment-catalog';
@@ -184,6 +186,14 @@ export function CasesPage() {
   useEffect(() => {
     if (selectedCaseId) {
       void loadDetail(selectedCaseId);
+      void notificationsApi.markCaseRead(selectedCaseId).then(() => {
+        notifyTabBadgesChanged();
+        setCases((prev) =>
+          prev.map((item) =>
+            item.id === selectedCaseId ? { ...item, hasUnread: false } : item,
+          ),
+        );
+      });
       void tasksApi
         .listComments(selectedCaseId)
         .then((r) => setCommentCount(r.data.length))
@@ -244,6 +254,7 @@ export function CasesPage() {
           item.id === selectedCaseId ? { ...item, isImportant: response.data.isImportant } : item,
         ),
       );
+      notifyTabBadgesChanged();
     } catch (error: unknown) {
       setSelectedCase(previousCase);
       toast.showError(getUserFacingError(error, tErrors, t('errorUpdateTask')));
@@ -373,19 +384,27 @@ export function CasesPage() {
                             : 'border-border hover:border-primary/40'
                         }`}
                       >
-                        <div className="flex flex-wrap items-center gap-1.5">
-                          <div className="font-medium text-text-primary">
-                            {formatPatientName(item.patient)}
+                        <div className="flex items-center gap-2">
+                          <div className="flex min-w-0 flex-1 flex-wrap items-center gap-1.5">
+                            <div className="font-medium text-text-primary">
+                              {formatPatientName(item.patient)}
+                            </div>
+                            <LabCaseDueDateBadge
+                              dueDate={item.dueDate}
+                              locale={locale}
+                              className="text-[10px]"
+                            />
+                            {item.isImportant ? (
+                              <Badge variant="warning" fixedWidth={false}>
+                                {t('importantLabel')}
+                              </Badge>
+                            ) : null}
                           </div>
-                          <LabCaseDueDateBadge
-                            dueDate={item.dueDate}
-                            locale={locale}
-                            className="text-[10px]"
-                          />
-                          {item.isImportant ? (
-                            <Badge variant="warning" fixedWidth={false}>
-                              {t('importantLabel')}
-                            </Badge>
+                          {item.hasUnread ? (
+                            <span
+                              className="h-2 w-2 shrink-0 rounded-full bg-badge-warning-fg"
+                              aria-label={t('unreadCase')}
+                            />
                           ) : null}
                         </div>
                         <div className="text-xs text-text-muted mt-0.5">
@@ -495,6 +514,7 @@ export function CasesPage() {
                           visibleToClinic,
                         });
                         setCommentCount((n) => n + 1);
+                        notifyTabBadgesChanged();
                         return r.data;
                       }}
                       onToggleVisibility={async (commentId, visible) => {

frontend/src/components/ui/lab/TaskRow.tsx

@@ -12,6 +12,7 @@ import {
   labTaskStatusVariant,
 } from '@/components/lab/labTaskStatusDisplay';
 import { LabCaseDueDateBadge } from '@/components/lab/LabCaseDueDateBadge';
+import { notifyTabBadgesChanged } from '@/lib/tabBadgeUtils';
 import {
   formatToothList,
   prosthesisTypeBadgeStyleFromCatalog,
@@ -228,6 +229,7 @@ export function TaskRow({
                 body,
                 visibleToClinic,
               });
+              notifyTabBadgesChanged();
               return r.data;
             }}
             onToggleVisibility={async (commentId, visible) => {

frontend/src/components/ui/lab/TasksPage.tsx

@@ -16,6 +16,8 @@ import {
   isDefaultTasksView,
   TASK_COMPLETE_EXIT_MS,
 } from '@/components/lab/tasksViewDefaults';
+import { useMarkTabReadOnVisit } from '@/lib/hooks/useTabBadgeCounts';
+import { notifyTabBadgesChanged } from '@/lib/tabBadgeUtils';
 import { scrollWithinMainScrollContainer } from '@/components/shared/scrollWithinMain';
 import { getUserFacingError } from '@/components/shared/formatApiError';
 import { canEditTasks, canViewTasks } from '@/components/shared/permissions';
@@ -78,6 +80,7 @@ export function TasksPage() {
   const canView = canViewTasks(currentOrganization);
   const canEdit = canEditTasks(currentOrganization);
   const locale = user?.language ?? 'en';
+  useMarkTabReadOnVisit();
 
   const tRef = useRef(t);
   tRef.current = t;
@@ -273,6 +276,7 @@ export function TasksPage() {
         } else {
           await loadTasks();
         }
+        notifyTabBadgesChanged();
       } catch (error: unknown) {
         showError(getUserFacingError(error, tErrors, t('errorUpdateTask')));
       } finally {