i18n & hardcoded strings cleanup for Dashboard components

[Abhishek-Punhani]

Summary

The Dashboard and StatCard implementations contain multiple hardcoded strings and title-based logic that prevent reuse and break internationalisation. This parent issue tracks the extraction of components, removal of hardcoded string checks, and migration of UI text to the app's i18n system.

Impact

• StatCard uses title string comparisons to choose decorative indicators (e.g., "Total Clusters", "Active Clusters"), which is brittle and not i18n-safe.
• User-facing strings like increase / decrease / change are hardcoded in English.
• Reuse of StatCard in PluginManager and elsewhere fails to display indicators or translations.

Files of interest

• frontend/src/components/dashboard/StatCard.tsx
• frontend/src/pages/Dashboard.tsx
• frontend/src/pages/PluginManager.tsx

Goals

1. Extract reusable subcomponents in Dashboard.tsx into dedicated modules where appropriate (e.g., indicators, sparkline/trend visuals, context badge).
2. Remove hardcoded title-based behaviour; provide explicit props (indicator, indicatorKey, titleKey) instead.
3. Internationalise all user-facing strings used by StatCard and related Dashboard components.
4. Add unit and integration tests to prevent regressions.

---

cc @btwshivam

[Abhishek-Punhani]

@btwshivam, if we can create a child issue for each component?

[gulshank0]

Hey @btwshivam,
I’d like to work on this issue.

My plan to solve it:

-> Refactor StatCard to support internationalization by removing hardcoded English text and title-based string checks.

-> Add a variant prop to replace checks like title === "Total Clusters" with a safer and cleaner approach.

-> Add i18n support for change labels by moving increase/decrease/change text into translation files.

-> Update the Dashboard to pass the new variant prop to all StatCard components.

-> Add translations for 10 languages: en, ja, de, es, fr, hi, it, pt, zh-Hans, and zh-Hant.

[Abhishek-Punhani]

Hey @btwshivam, I’d like to work on this issue.

My plan to solve it:

-> Refactor StatCard to support internationalization by removing hardcoded English text and title-based string checks.

-> Add a variant prop to replace checks like title === "Total Clusters" with a safer and cleaner approach.

-> Add i18n support for change labels by moving increase/decrease/change text into translation files.

-> Update the Dashboard to pass the new variant prop to all StatCard components.

-> Add translations for 10 languages: en, ja, de, es, fr, hi, it, pt, zh-Hans, and zh-Hant.

Hey @gulshank0 👋 — welcome and thanks for your interest!

Just a quick note: There are multiple subcomponents in Dashboard.tsx (not just StatCard) that need extraction, i18n, and removal of hardcoded logic. StatCard is only one part of that scope.

@Arpit529Srivastava, I thought of opening child issues for each component; should we handle all of them in this issue only?

[Arpit529Srivastava]

opening child issue for each component would be a better way to tackle.
/cc @kunal-511 if you can suggest more on this issue.
thanks

[Arpit529Srivastava]

/need-triage