fix(i18n): close shared ui gaps

job-tracker-ui/src/components/ProFeatureNotice.tsx

@@ -1,6 +1,7 @@
 import React, { useState } from "react";
 import CloseIcon from "@mui/icons-material/Close";
 import { Alert, Button, IconButton, Stack, Typography } from "@mui/material";
+import { useOptionalI18n } from "../i18n/I18nProvider";
 
 type Props = {
   featureKey: string;
@@ -13,6 +14,7 @@ function storageKey(featureKey: string) {
 }
 
 export default function ProFeatureNotice({ featureKey, title, children }: Props) {
+  const i18n = useOptionalI18n();
   const [dismissed, setDismissed] = useState(() => {
     if (typeof window === "undefined") return false;
     try {
@@ -38,8 +40,8 @@ export default function ProFeatureNotice({ featureKey, title, children }: Props)
       severity="info"
       action={(
         <Stack direction="row" spacing={0.5} alignItems="center">
-          <Button href="/settings" size="small">View Pro</Button>
-          <IconButton size="small" aria-label={`Dismiss ${title}`} onClick={dismiss}>
+          <Button href="/settings" size="small">{i18n?.t("proFeatureView") ?? "View Pro"}</Button>
+          <IconButton size="small" aria-label={i18n?.t("proFeatureDismiss", { title }) ?? `Dismiss ${title}`} onClick={dismiss}>
             <CloseIcon fontSize="small" />
           </IconButton>
         </Stack>