diff --git a/packages/shared-components/src/audio/AudioPlayerView/AudioPlayerView.tsx b/packages/shared-components/src/audio/AudioPlayerView/AudioPlayerView.tsx
index 7865831a91..b2385f7473 100644
--- a/packages/shared-components/src/audio/AudioPlayerView/AudioPlayerView.tsx
+++ b/packages/shared-components/src/audio/AudioPlayerView/AudioPlayerView.tsx
@@ -90,11 +90,11 @@ interface AudioPlayerViewProps {
  * ```
  */
 export function AudioPlayerView({ vm }: Readonly<AudioPlayerViewProps>): JSX.Element {
-    const i18n = useI18n();
+    const { translate: _t } = useI18n();
 
     const {
         playbackState,
-        mediaName = i18n.translate("timeline|m.audio|unnamed_audio"),
+        mediaName = _t("timeline|m.audio|unnamed_audio"),
         sizeBytes,
         durationSeconds,
         playedSeconds,
diff --git a/packages/shared-components/src/audio/PlayPauseButton/PlayPauseButton.tsx b/packages/shared-components/src/audio/PlayPauseButton/PlayPauseButton.tsx
index fabf291243..cc2ab5bb65 100644
--- a/packages/shared-components/src/audio/PlayPauseButton/PlayPauseButton.tsx
+++ b/packages/shared-components/src/audio/PlayPauseButton/PlayPauseButton.tsx
@@ -46,9 +46,9 @@ export function PlayPauseButton({
     togglePlay,
     ...rest
 }: Readonly<PlayPauseButtonProps>): JSX.Element {
-    const i18n = useI18n();
+    const { translate: _t } = useI18n();
 
-    const label = playing ? i18n.translate("action|pause") : i18n.translate("action|play");
+    const label = playing ? _t("action|pause") : _t("action|play");
 
     return (
         <IconButton
diff --git a/packages/shared-components/src/audio/SeekBar/SeekBar.tsx b/packages/shared-components/src/audio/SeekBar/SeekBar.tsx
index 44b667a76d..a30e527eee 100644
--- a/packages/shared-components/src/audio/SeekBar/SeekBar.tsx
+++ b/packages/shared-components/src/audio/SeekBar/SeekBar.tsx
@@ -33,7 +33,7 @@ interface ISeekCSS extends CSSProperties {
  * ```
  */
 export function SeekBar({ value = 0, className, ...rest }: Readonly<SeekBarProps>): JSX.Element {
-    const i18n = useI18n();
+    const { translate: _t } = useI18n();
 
     const [newValue, setNewValue] = useState(value);
     // Throttle the value setting to avoid excessive re-renders
@@ -53,7 +53,7 @@ export function SeekBar({ value = 0, className, ...rest }: Readonly<SeekBarProps
             value={newValue}
             step={1}
             style={{ "--fillTo": newValue / 100 } as ISeekCSS}
-            aria-label={i18n.translate("a11y|seek_bar_label")}
+            aria-label={_t("a11y|seek_bar_label")}
             {...rest}
         />
     );
diff --git a/packages/shared-components/src/pill-input/Pill/Pill.tsx b/packages/shared-components/src/pill-input/Pill/Pill.tsx
index 3eee068b3e..64fdac3d2d 100644
--- a/packages/shared-components/src/pill-input/Pill/Pill.tsx
+++ b/packages/shared-components/src/pill-input/Pill/Pill.tsx
@@ -39,7 +39,7 @@ export interface PillProps extends Omit<HTMLAttributes<HTMLDivElement>, "onClick
  */
 export function Pill({ className, children, label, onClick, ...props }: PropsWithChildren<PillProps>): JSX.Element {
     const id = useId();
-    const i18n = useI18n();
+    const { translate: _t } = useI18n();
 
     return (
         <Flex
@@ -58,7 +58,7 @@ export function Pill({ className, children, label, onClick, ...props }: PropsWit
                     aria-describedby={id}
                     size="16px"
                     onClick={onClick}
-                    aria-label={i18n.translate("action|delete")}
+                    aria-label={_t("action|delete")}
                     className="mx_Dialog_nonDialogButton"
                 >
                     <CloseIcon color="var(--cpd-color-icon-tertiary)" />