select from assessments; set donut colors

Signed-off-by: Gilles Dubreuil <[email protected]>

client/public/locales/en/translation.json

@@ -69,7 +69,8 @@
     "orange": "Orange",
     "purple": "Purple",
     "red": "Red",
-    "teal": "Teal"
+    "teal": "Teal",
+    "yellow": "Yellow"
   },
   "composed": {
     "add": "Add {{what}}",
@@ -238,7 +239,6 @@
     "businessServices": "Business services",
     "canceled": "Canceled",
     "category": "Category",
-    "cloudNativeReady": "Cloud-native ready",
     "color": "Color",
     "comments": "Comments",
     "completed": "Completed",
@@ -306,7 +306,6 @@
     "member(s)": "Member(s)",
     "memberCount": "Member count",
     "message": "Message",
-    "modernizable": "Modernizable",
     "migrationWave": "Migration wave",
     "migrationWaves": "Migration waves",
     "migrationWave(s)": "Migration wave(s)",
@@ -316,7 +315,6 @@
     "notConnected": "Not connected",
     "notReviewed": "Not reviewed",
     "notStarted": "Not started",
-    "notYetAssessed": "Not yet assessed",
     "notYetReviewed": "Not yet reviewed",
     "other": "Other",
     "owner": "Owner",
@@ -375,7 +373,6 @@
     "unassessed": "Unassessed",
     "unassigned": "Not yet assigned",
     "unknown": "Unknown",
-    "unsuitableForContainers": "Unsuitable for containers",
     "uploadApplicationFile": "Upload your application file",
     "uploadYamlFile": "Upload your YAML file",
     "url": "URL",

client/public/locales/es/translation.json

@@ -55,7 +55,8 @@
     "green": "Verde",
     "orange": "Naranja",
     "purple": "Morado",
-    "red": "Rojo"
+    "red": "Rojo",
+    "yellow": "Amarillo"
   },
   "composed": {
     "add": "Agregar {{what}}",
@@ -194,7 +195,6 @@
     "businessServices": "Servicios de negocio",
     "canceled": "Cancelado",
     "category": "Categoría",
-    "cloudNativeReady": "Listo para Cloud-native",
     "color": "Color",
     "comments": "Comentarios",
     "completed": "Completado",
@@ -247,13 +247,11 @@
     "member(s)": "Miembro(s)",
     "memberCount": "Número de miembros",
     "message": "Mensaje",
-    "modernizable": "Modernizable",
     "name": "Nombre",
     "northboundDependencies": "Dependencias del norte",
     "notAvailable": "No disponible",
     "notReviewed": "No revisado",
     "notStarted": "No empezado",
-    "notYetAssessed": "No evaluado todavía",
     "notYetReviewed": "No revisado todavía",
     "other": "Otro",
     "owner": "Propietario",
@@ -304,7 +302,6 @@
     "trivialButMigratable": "Trivial pero migrable",
     "unassessed": "No evaluado",
     "unknown": "Desconocido",
-    "unsuitableForContainers": "No apto para contenedores",
     "uploadApplicationFile": "Carga tu archivo con aplicaciones",
     "user": "Usuario",
     "version": "Versión",

client/src/app/api/rest.ts

@@ -205,6 +205,9 @@ export const getApplicationSummaryCSV = (id: string): AxiosPromise => {
   });
 };
 
+export const getAssessments = (): Promise<Assessment[]> =>
+  axios.get(ASSESSMENTS).then((response) => response.data);
+
 export const getAssessmentsByItemId = (
   isArchetype: boolean,
   itemId?: number | string

client/src/app/pages/reports/components/landscape/donut.tsx

@@ -11,15 +11,13 @@ export interface IDonutProps {
   total: number;
   color: string;
   riskLabel: string;
-  riskDescription: string;
 }
 
 export const Donut: React.FC<IDonutProps> = ({
   value,
   total,
   color,
   riskLabel,
-  riskDescription,
 }) => {
   const { t } = useTranslation();
 
@@ -44,7 +42,6 @@ export const Donut: React.FC<IDonutProps> = ({
       <StackItem>
         <TextContent className="pf-v5-u-text-align-center">
           <Text component="h3">{riskLabel}</Text>
-          <Text component="small">{riskDescription}</Text>
         </TextContent>
       </StackItem>
     </Stack>

client/src/app/pages/reports/components/landscape/landscape.tsx

@@ -91,36 +91,32 @@ export const Landscape: React.FC = () => {
             <Donut
               value={landscapeData.low}
               total={applications.length}
-              color={RISK_LIST["green"].hexColor}
-              riskLabel={t("terms.lowRisk")}
-              riskDescription={t("terms.cloudNativeReady")}
+              color={RISK_LIST["red"].hexColor}
+              riskLabel={t("colors.red")}
             />
           </SplitItem>
           <SplitItem>
             <Donut
               value={landscapeData.medium}
               total={applications.length}
               color={RISK_LIST["yellow"].hexColor}
-              riskLabel={t("terms.mediumRisk")}
-              riskDescription={t("terms.modernizable")}
+              riskLabel={t("colors.yellow")}
             />
           </SplitItem>
           <SplitItem>
             <Donut
               value={landscapeData.high}
               total={applications.length}
-              color={RISK_LIST["red"].hexColor}
-              riskLabel={t("terms.highRisk")}
-              riskDescription={t("terms.unsuitableForContainers")}
+              color={RISK_LIST["green"].hexColor}
+              riskLabel={t("colors.green")}
             />
           </SplitItem>
           <SplitItem>
             <Donut
               value={landscapeData.unassessed}
               total={applications.length}
               color={RISK_LIST["unknown"].hexColor}
-              riskLabel={t("terms.unassessed")}
-              riskDescription={t("terms.notYetAssessed")}
+              riskLabel={`${t("terms.unassessed")}/${t("terms.unknown")}`}
             />
           </SplitItem>
         </Split>

client/src/app/pages/reports/reports.tsx

@@ -37,7 +37,7 @@ import { Landscape } from "./components/landscape";
 import { AdoptionPlan } from "./components/adoption-plan";
 import { IdentifiedRisksTable } from "./components/identified-risks-table";
 import { useFetchApplications } from "@app/queries/applications";
-import { useFetchQuestionnaires } from "@app/queries/questionnaires";
+import { useFetchAssessments } from "@app/queries/assessments";
 
 export const Reports: React.FC = () => {
   // i18
@@ -49,7 +49,7 @@ export const Reports: React.FC = () => {
   const [selectedQuestionnaire, setSelectedQuestionnaire] =
     React.useState<string>("All questionnaires");
 
-  const { questionnaires } = useFetchQuestionnaires();
+  const { assessments } = useFetchAssessments();
 
   // Cards
   const [isAdoptionCandidateTable, setIsAdoptionCandidateTable] =
@@ -137,12 +137,12 @@ export const Reports: React.FC = () => {
                           <SelectOption key={0} value="All questionnaires">
                             All questionnaires
                           </SelectOption>
-                          {questionnaires.map((questionnaire, index) => (
+                          {assessments.map((assessment, index) => (
                             <SelectOption
                               key={index}
-                              value={questionnaire.name}
+                              value={assessment.questionnaire.name}
                             >
-                              {questionnaire.name}
+                              {assessment.questionnaire.name}
                             </SelectOption>
                           ))}
                         </Select>

client/src/app/queries/assessments.ts

@@ -4,6 +4,7 @@ import {
   createAssessment,
   deleteAssessment,
   getAssessmentById,
+  getAssessments,
   getAssessmentsByItemId,
   updateAssessment,
 } from "@app/api/rest";
@@ -15,6 +16,18 @@ export const assessmentsQueryKey = "assessments";
 export const assessmentQueryKey = "assessment";
 export const assessmentsByItemIdQueryKey = "assessmentsByItemId";
 
+export const useFetchAssessments = () => {
+  const { isLoading, data, error } = useQuery({
+    queryKey: [QuestionnairesQueryKey],
+    queryFn: getAssessments,
+    onError: (error: AxiosError) => console.log("error, ", error),
+  });
+  return {
+    assessments: data || [],
+    isFetching: isLoading,
+    fetchError: error,
+  };
+};
 export const useCreateAssessmentMutation = (
   isArchetype: boolean,
   onSuccess: (name: string) => void,