Dev to opportunities

src/apps/support/src/pages/ticket-details/TicketDetailPage.module.scss

@@ -12,9 +12,11 @@
     text-decoration: none;
 }
 
-.challengeLink {
-    color: var(--Actived);
+.challengeLink,
+.challengeLink:hover {
+    color: $link-blue-dark;
     font-weight: 700;
+    text-decoration: underline;
 }
 
 .header {

src/apps/support/src/pages/ticket-details/TicketDetailPage.spec.tsx

@@ -1,4 +1,5 @@
 /* eslint-disable import/no-extraneous-dependencies, ordered-imports/ordered-imports, react/jsx-no-bind */
+import { readFileSync } from 'fs'
 import {
     fireEvent,
     render,
@@ -17,6 +18,7 @@ import { TicketDetailPage } from './TicketDetailPage'
 const mockMutate = jest.fn()
 const mockUseSWR = jest.fn()
 let mockProfile: { roles: string[]; userId: number | string }
+const ticketDetailStyles = readFileSync(`${__dirname}/TicketDetailPage.module.scss`, 'utf8')
 
 interface Deferred<T> {
     promise: Promise<T>
@@ -196,6 +198,17 @@ describe('TicketDetailPage reply access', () => {
             .toBeTruthy()
     })
 
+    it('styles the challenge anchor as a visible link', () => {
+        const challengeLinkRule = ticketDetailStyles.match(
+            /\.challengeLink,\s*\.challengeLink:hover \{[^}]*\}/,
+        )?.[0]
+
+        expect(challengeLinkRule)
+            .toContain('color: $link-blue-dark;')
+        expect(challengeLinkRule)
+            .toContain('text-decoration: underline;')
+    })
+
     it('identifies the support staff member who closed the ticket', () => {
         mockUseSWR.mockReturnValue({
             data: {
@@ -239,7 +252,7 @@ describe('TicketDetailPage reply access', () => {
             .toBeTruthy()
     })
 
-    it('preserves freshly revalidated assignees when marking a ticket read completes', async () => {
+    it('revalidates fresh detail after marking the ticket read', async () => {
         const markReadRequest = createDeferred<void>()
         mockedMarkRead.mockReturnValue(markReadRequest.promise)
         mockUseSWR.mockReturnValue({
@@ -254,35 +267,10 @@ describe('TicketDetailPage reply access', () => {
 
         await waitFor(() => {
             expect(mockMutate)
-                .toHaveBeenCalledWith(expect.any(Function), false)
+                .toHaveBeenCalledTimes(1)
         })
-
-        const updateCachedTicket = mockMutate.mock.calls[0][0] as (
-            ticket?: SupportTicketDetail,
-        ) => SupportTicketDetail | undefined
-        const freshlyRevalidatedTicket: SupportTicketDetail = {
-            ...closedTicket,
-            assignees: [{
-                assignedAt: '2026-08-07T01:30:00.000Z',
-                handle: 'support-staff',
-                userId: '67890',
-            }],
-            hasUnread: true,
-            responseCount: 1,
-            responses: [{
-                createdAt: '2026-08-07T01:30:00.000Z',
-                id: 'response-1',
-                markdown: 'We are investigating.',
-                readBy: [],
-                userHandle: 'support-staff',
-                userId: '67890',
-            }],
-        }
-
-        expect(updateCachedTicket(freshlyRevalidatedTicket))
-            .toEqual({ ...freshlyRevalidatedTicket, hasUnread: false })
-        expect(updateCachedTicket(undefined))
-            .toBeUndefined()
+        expect(mockMutate.mock.calls[0])
+            .toEqual([])
     })
 
     it('identifies support team replies without labelling the ticket owner', () => {

src/apps/support/src/pages/ticket-details/TicketDetailPage.tsx

@@ -75,9 +75,7 @@ export const TicketDetailPage: FC = () => {
 
         markedReadTicket.current = data.id
         markSupportTicketRead(data.id)
-            .then(() => mutate(current => (current
-                ? { ...current, hasUnread: false }
-                : current), false))
+            .then(() => mutate())
             .catch(() => undefined)
     }, [data, mutate])