From e101c5652a1feb07bcddeb47564f33c450169b12 Mon Sep 17 00:00:00 2001
From: Jan Maarten <83665577+janmaarten-a11y@users.noreply.github.com>
Date: Wed, 8 Jul 2026 13:08:06 -0700
Subject: [PATCH] Timeline: CommentCard uses shared MutedTime permalink helper

Swap CommentCard's inline permalink timestamp for the shared MutedTime
helper (with href) from timelineStoryHelpers. Pure Storybook-only
refactor, zero visual change. Follow-up to #8072 adopting the shared
permalink-time helper introduced in #8140.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 .../react/src/Timeline/internal/CommentCard.module.css     | 6 ------
 packages/react/src/Timeline/internal/CommentCard.tsx       | 7 ++-----
 2 files changed, 2 insertions(+), 11 deletions(-)

diff --git a/packages/react/src/Timeline/internal/CommentCard.module.css b/packages/react/src/Timeline/internal/CommentCard.module.css
index 9f99868deb8..dcaa736933a 100644
--- a/packages/react/src/Timeline/internal/CommentCard.module.css
+++ b/packages/react/src/Timeline/internal/CommentCard.module.css
@@ -148,12 +148,6 @@
   color: var(--fgColor-muted);
 }
 
-/* Muted, underlined relative-time permalink. The underline keeps this muted
-   in-text link high-contrast accessible (matches the badge-row `.Timestamp`). */
-.Timestamp {
-  text-decoration: underline;
-}
-
 .CardActions {
   display: flex;
   align-items: center;
diff --git a/packages/react/src/Timeline/internal/CommentCard.tsx b/packages/react/src/Timeline/internal/CommentCard.tsx
index 5f1f7e08837..fff12ca6f47 100644
--- a/packages/react/src/Timeline/internal/CommentCard.tsx
+++ b/packages/react/src/Timeline/internal/CommentCard.tsx
@@ -5,9 +5,8 @@ import Avatar from '../../Avatar'
 import {IconButton} from '../../Button'
 import Label from '../../Label'
 import Link from '../../Link'
-import RelativeTime from '../../RelativeTime'
 import Timeline from '../Timeline'
-import {InlineAvatar} from './timelineStoryHelpers'
+import {InlineAvatar, MutedTime} from './timelineStoryHelpers'
 import classes from './CommentCard.module.css'
 
 /**
@@ -207,9 +206,7 @@ export const CommentCard = ({
             {hasInlineHeader ? <span className={classes.CommentedVerb}>commented</span> : null}
             <span className={classes.TimestampLine}>
               {/* Muted + underlined keeps this muted permalink high-contrast accessible. */}
-              <Link href="#" className={classes.Timestamp} muted>
-                <RelativeTime date={new Date(timestamp)} format="relative" />
-              </Link>
+              <MutedTime date={new Date(timestamp)} href="#" />
               {viaApp ? (
                 <>
                   {' – with '}