refactor: priority messages duplication

frontend/src/app/[locale]/projects/[projectId]/home/ProjectHome.tsx

@@ -13,6 +13,7 @@ import TestPriorityChart from './TestPriorityDonutChart';
 import TestProgressBarChart from './TestProgressColumnChart';
 import Config from '@/config/config';
 import { useTheme } from 'next-themes';
+import { PriorityMessages } from '@/types/priority';
 const apiServer = Config.apiServer;
 
 async function fetchProject(jwt: string, projectId: number) {
@@ -41,9 +42,10 @@ async function fetchProject(jwt: string, projectId: number) {
 type Props = {
   projectId: string;
   messages: HomeMessages;
+  priorityMessages: PriorityMessages;
 };
 
-export function ProjectHome({ projectId, messages }: Props) {
+export function ProjectHome({ projectId, messages, priorityMessages }: Props) {
   const context = useContext(TokenContext);
   const { theme, setTheme } = useTheme();
   const [project, setProject] = useState({
@@ -134,7 +136,7 @@ export function ProjectHome({ projectId, messages }: Props) {
         </div>
         <div style={{ width: '30rem', height: '18rem' }}>
           <h3>{messages.byPriority}</h3>
-          <TestPriorityChart priorityCounts={priorityCounts} messages={messages} theme={theme} />
+          <TestPriorityChart priorityCounts={priorityCounts} priorityMessages={priorityMessages} theme={theme} />
         </div>
       </div>
     </div>

frontend/src/app/[locale]/projects/[projectId]/home/TestPriorityDonutChart.tsx

@@ -3,16 +3,16 @@ import { useState, useEffect } from 'react';
 import dynamic from 'next/dynamic';
 import { priorities } from '@/config/selection';
 import { CasePriorityCountType } from '@/types/case';
-import { HomeMessages } from './page';
+import { PriorityMessages } from '@/types/priority';
 const Chart = dynamic(() => import('react-apexcharts'), { ssr: false });
 
 type Props = {
   priorityCounts: CasePriorityCountType[];
-  messages: HomeMessages;
+  priorityMessages: PriorityMessages;
   theme: string;
 };
 
-export default function TestPriorityDonutChart({ priorityCounts, messages, theme }: Props) {
+export default function TestPriorityDonutChart({ priorityCounts, priorityMessages, theme }: Props) {
   const [chartData, setChartData] = useState({
     series: [],
     options: {
@@ -29,7 +29,7 @@ export default function TestPriorityDonutChart({ priorityCounts, messages, theme
           return found ? found.count : 0;
         });
 
-        const labels = priorities.map((entry) => messages[entry.uid]);
+        const labels = priorities.map((entry) => priorityMessages[entry.uid]);
         const colors = priorities.map((entry) => entry.chartColor);
         const legend = {
           labels: {

frontend/src/app/[locale]/projects/[projectId]/home/page.tsx

@@ -1,5 +1,6 @@
 import { ProjectHome } from './ProjectHome';
 import { useTranslations } from 'next-intl';
+import { PriorityMessages } from '@/types/priority';
 
 export type HomeMessages = {
   folders: string;
@@ -28,10 +29,6 @@ export type HomeMessages = {
   regression: string;
   automated: string;
   manual: string;
-  critical: string;
-  high: string;
-  medium: string;
-  low: string;
 };
 
 export default function Page({ params }: { params: { projectId: string } }) {
@@ -62,14 +59,19 @@ export default function Page({ params }: { params: { projectId: string } }) {
     regression: t('regression'),
     automated: t('automated'),
     manual: t('manual'),
-    critical: t('critical'),
-    high: t('high'),
-    medium: t('medium'),
-    low: t('low'),
   };
+
+  const pt = useTranslations('Priority');
+  const priorityMessages: PriorityMessages = {
+    critical: pt('critical'),
+    high: pt('high'),
+    medium: pt('medium'),
+    low: pt('low'),
+  };
+
   return (
     <>
-      <ProjectHome projectId={params.projectId} messages={messages} />
+      <ProjectHome projectId={params.projectId} messages={messages} priorityMessages={priorityMessages} />
     </>
   );
 }