From ab6d3dd2aab1328beb05771268805ffc7116eba0 Mon Sep 17 00:00:00 2001
From: mario ma <mario.ma.node@gmail.com>
Date: Thu, 29 May 2025 18:20:33 +0800
Subject: [PATCH] feat: Add some translation to user-setting plugin

Signed-off-by: mario ma <mario.ma.node@gmail.com>
---
 .changeset/long-suits-obey.md                               | 5 +++++
 plugins/user-settings/report-alpha.api.md                   | 2 ++
 .../src/components/General/UserSettingsAppearanceCard.tsx   | 5 ++++-
 .../src/components/General/UserSettingsProfileCard.tsx      | 5 ++++-
 plugins/user-settings/src/translation.ts                    | 6 ++++++
 5 files changed, 21 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/long-suits-obey.md

diff --git a/.changeset/long-suits-obey.md b/.changeset/long-suits-obey.md
new file mode 100644
index 0000000000..996bba6026
--- /dev/null
+++ b/.changeset/long-suits-obey.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-user-settings': patch
+---
+
+Add some translation to user-setting plugin
diff --git a/plugins/user-settings/report-alpha.api.md b/plugins/user-settings/report-alpha.api.md
index 9b3b674a10..036ff2ff58 100644
--- a/plugins/user-settings/report-alpha.api.md
+++ b/plugins/user-settings/report-alpha.api.md
@@ -154,6 +154,8 @@ export const userSettingsTranslationRef: TranslationRef<
     readonly 'defaultSettingsPage.tabsTitle.general': 'General';
     readonly 'settingsLayout.title': 'Settings';
     readonly sidebarTitle: 'Settings';
+    readonly 'profileCard.title': 'Profile';
+    readonly 'appearanceCard.title': 'Appearance';
   }
 >;
 
diff --git a/plugins/user-settings/src/components/General/UserSettingsAppearanceCard.tsx b/plugins/user-settings/src/components/General/UserSettingsAppearanceCard.tsx
index ca7378235d..0fa07eb5fa 100644
--- a/plugins/user-settings/src/components/General/UserSettingsAppearanceCard.tsx
+++ b/plugins/user-settings/src/components/General/UserSettingsAppearanceCard.tsx
@@ -19,13 +19,16 @@ import List from '@material-ui/core/List';
 import { UserSettingsPinToggle } from './UserSettingsPinToggle';
 import { UserSettingsThemeToggle } from './UserSettingsThemeToggle';
 import { UserSettingsLanguageToggle } from './UserSettingsLanguageToggle';
+import { useTranslationRef } from '@backstage/frontend-plugin-api';
+import { userSettingsTranslationRef } from '../../translation';
 
 /** @public */
 export const UserSettingsAppearanceCard = () => {
   const { isMobile } = useSidebarPinState();
+  const { t } = useTranslationRef(userSettingsTranslationRef);
 
   return (
-    <InfoCard title="Appearance" variant="gridItem">
+    <InfoCard title={t('appearanceCard.title')} variant="gridItem">
       <List dense>
         <UserSettingsThemeToggle />
         <UserSettingsLanguageToggle />
diff --git a/plugins/user-settings/src/components/General/UserSettingsProfileCard.tsx b/plugins/user-settings/src/components/General/UserSettingsProfileCard.tsx
index aa9301e379..ac871941dd 100644
--- a/plugins/user-settings/src/components/General/UserSettingsProfileCard.tsx
+++ b/plugins/user-settings/src/components/General/UserSettingsProfileCard.tsx
@@ -20,13 +20,16 @@ import { UserSettingsSignInAvatar } from './UserSettingsSignInAvatar';
 import { UserSettingsMenu } from './UserSettingsMenu';
 import { useUserProfile } from '../useUserProfileInfo';
 import { InfoCard } from '@backstage/core-components';
+import { useTranslationRef } from '@backstage/frontend-plugin-api';
+import { userSettingsTranslationRef } from '../../translation';
 
 /** @public */
 export const UserSettingsProfileCard = () => {
   const { profile, displayName } = useUserProfile();
+  const { t } = useTranslationRef(userSettingsTranslationRef);
 
   return (
-    <InfoCard title="Profile" variant="gridItem">
+    <InfoCard title={t('profileCard.title')} variant="gridItem">
       <Grid container spacing={6}>
         <Grid item>
           <UserSettingsSignInAvatar size={96} />
diff --git a/plugins/user-settings/src/translation.ts b/plugins/user-settings/src/translation.ts
index 9785c4afaa..0161508d14 100644
--- a/plugins/user-settings/src/translation.ts
+++ b/plugins/user-settings/src/translation.ts
@@ -119,5 +119,11 @@ export const userSettingsTranslationRef = createTranslationRef({
       title: 'Settings',
     },
     sidebarTitle: 'Settings',
+    profileCard: {
+      title: 'Profile',
+    },
+    appearanceCard: {
+      title: 'Appearance',
+    },
   },
 });