From d888117e1203853f8617fb96ff597f8cd1cfa6c8 Mon Sep 17 00:00:00 2001
From: Andrea Gueugnaut <andrea.gueugnaut@gmail.com>
Date: Mon, 3 Feb 2025 13:04:06 +0100
Subject: [PATCH] feat(frontend): specify the precision category for housing
 evolutions

---
 .../components/HousingEdition/HousingEditionSideMenu.tsx    | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/HousingEdition/HousingEditionSideMenu.tsx b/frontend/src/components/HousingEdition/HousingEditionSideMenu.tsx
index 6b0d98789..02446b7b3 100644
--- a/frontend/src/components/HousingEdition/HousingEditionSideMenu.tsx
+++ b/frontend/src/components/HousingEdition/HousingEditionSideMenu.tsx
@@ -7,6 +7,7 @@ import Grid from '@mui/material/Unstable_Grid2';
 import Stack from '@mui/material/Stack';
 import Typography from '@mui/material/Typography';
 import { fromJS } from 'immutable';
+import fp from 'lodash/fp';
 import { FormProvider, useController, useForm } from 'react-hook-form';
 import { ElementOf } from 'ts-essentials';
 import * as yup from 'yup';
@@ -411,7 +412,7 @@ function HousingEditionSideMenu(props: HousingEditionSideMenuProps) {
           <Grid
             component="article"
             container
-            sx={{ alignItems: 'center', columnGap: 2 }}
+            sx={{ alignItems: 'center', columnGap: 2, rowGap: 1 }}
             xs={12}
           >
             <Grid
@@ -438,7 +439,8 @@ function HousingEditionSideMenu(props: HousingEditionSideMenuProps) {
             <Grid>
               {filteredEvolutions.map((precision) => (
                 <Tag key={precision.id} className={styles.tag}>
-                  {precision.label}
+                  {fp.startCase(precision.category.replace('-', ' '))} :&nbsp;
+                  {precision.label.toLowerCase()}
                 </Tag>
               ))}
             </Grid>