Redirect "Upcoming appointments" click to Appointments tab

modules/notifications/helpers.ts

@@ -6,6 +6,8 @@
 // SPDX-License-Identifier: MIT
 //
 import { type UserMessage } from '@/modules/firebase/models'
+import { routes } from '@/modules/routes'
+import { type PatientPageTab } from '@/routes/~_dashboard/~patients/~$id/~index'
 
 export const isMessageRead = (message: UserMessage) => !!message.completionDate
 
@@ -19,7 +21,9 @@
   if (actionParts.at(0) === 'users') {
     const userId = actionParts.at(1)
     const tab = actionParts.at(2)
-    return `/patients/${userId}${tab ? `?tab=${tab}` : ''}`
+    if (userId) {
+      return routes.patients.patient(userId, { tab: tab as PatientPageTab })
+    }
   }
   return null
 }

modules/routes.ts

@@ -6,6 +6,8 @@
 // SPDX-License-Identifier: MIT
 //
 
+import type { PatientPageTab } from '@/routes/~_dashboard/~patients/~$id/~index'
+
 export const routes = {
   home: '/',
   notifications: '/notifications',
@@ -16,7 +18,8 @@
   },
   patients: {
     index: '/patients',
-    patient: (patientId: string) => `/patients/${patientId}`,
+    patient: (patientId: string, params?: { tab?: PatientPageTab }) =>
+      `/patients/${patientId}${params?.tab ? `?tab=${params.tab}` : ''}`,
     invite: '/patients/invite',
   },
   signIn: '/sign-in',

routes/~_dashboard/UpcomingAppointmentsCard.tsx

@@ -9,7 +9,7 @@
 import { useNavigate } from '@tanstack/react-router'
 import { createColumnHelper } from '@tanstack/table-core'
 import { addWeeks, isBefore, isFuture } from 'date-fns'
-import { Loader2, Info } from 'lucide-react'
+import { Info, Loader2 } from 'lucide-react'
 import { useMemo } from 'react'
 import { appointmentsQueries } from '@/modules/firebase/appointment'
 import { routes } from '@/modules/routes'
@@ -25,6 +25,7 @@
 } from '@/packages/design-system/src/components/DataTable'
 import { Tooltip } from '@/packages/design-system/src/components/Tooltip'
 import { getUserName } from '@/packages/design-system/src/modules/auth/user'
+import { PatientPageTab } from '@/routes/~_dashboard/~patients/~$id/~index'
 
 export const UpcomingAppointmentsCard = () => {
   const navigate = useNavigate()
@@ -108,7 +109,9 @@
           tableView={{
             onRowClick: (appointment) =>
               void navigate({
-                to: routes.patients.patient(appointment.patient.id),
+                to: routes.patients.patient(appointment.patient.id, {
+                  tab: PatientPageTab.appointments,
+                }),
               }),
           }}
         />