fga-eps-mds · andremralves · Sep 13, 2024 · Sep 13, 2024 · Sep 13, 2024 · Sep 13, 2024
diff --git a/n18n.config.js b/n18n.config.js
@@ -3,7 +3,19 @@ const supportedLngs = ['en', 'pt'];
 export const ni18nConfig = {
   fallbackLng: supportedLngs,
   supportedLngs,
-  ns: ['translation', 'home', 'about', 'sidebar', 'settings', 'releases', 'repositories', 'overview'],
+  ns: [
+    'translation',
+    'home',
+    'about',
+    'sidebar',
+    'settings',
+    'releases',
+    'repositories',
+    'overview',
+    'header',
+    'lates_value_table',
+    'graphic_chart'
+  ],
   react: {
     useSuspense: false
   }

diff --git a/public/locales/en/graphic_chart.json b/public/locales/en/graphic_chart.json
@@ -0,0 +1,4 @@
+{
+  "error": "An error occurred while trying to load the information",
+  "noData": "No data available to display"
+}
diff --git a/public/locales/en/header.json b/public/locales/en/header.json
@@ -0,0 +1,10 @@
+{
+  "repository": "Repository",
+  "edit_intervals": "Edit Intervals",
+  "cancel": "Cancel",
+  "save": "Save",
+  "warning_message": "Attention: This configuration will be applied to all product repositories.",
+  "error_message": "An error occurred while trying to load the information.",
+  "update_success": "Intervals updated successfully!",
+  "update_error": "Error updating intervals!"
+}
diff --git a/public/locales/en/latest_value_table.json b/public/locales/en/latest_value_table.json
@@ -0,0 +1,6 @@
+{
+  "lastValue": "Latest value",
+  "lastMeasurement": "Latest measurement",
+  "error": "An error occurred while trying to load the information",
+  "noData": "No data available to display"
+}
diff --git a/public/locales/pt/graphic_chart.json b/public/locales/pt/graphic_chart.json
@@ -0,0 +1,4 @@
+{
+  "error": "Ocorreu um erro ao tentar carregar as informações",
+  "noData": "Não há dados para serem exibidos"
+}
diff --git a/public/locales/pt/header.json b/public/locales/pt/header.json
@@ -0,0 +1,10 @@
+{
+  "repository": "Repositório",
+  "edit_intervals": "Editar Intervalos",
+  "cancel": "Cancelar",
+  "save": "Salvar",
+  "warning_message": "Atenção: Essa configuração será aplicada a todos os repositórios do produto.",
+  "error_message": "Ocorreu um erro ao tentar carregar as informações.",
+  "update_success": "Intervalos atualizados com sucesso!",
+  "update_error": "Erro ao atualizar intervalos!"
+}
diff --git a/public/locales/pt/latest_value_table.json b/public/locales/pt/latest_value_table.json
@@ -0,0 +1,6 @@
+{
+  "lastValue": "Último valor",
+  "lastMeasurement": "Última medição",
+  "error": "Ocorreu um erro ao tentar carregar as informações",
+  "noData": "Não há dados para serem exibidos"
+}
diff --git a/src/pages/products/[product]/releases/tests/__snapshots__/Releases.spec.tsx.snap b/src/pages/products/[product]/releases/tests/__snapshots__/Releases.spec.tsx.snap
@@ -73,6 +73,7 @@ exports[`<Releases /> Deve corresponder ao snapshot 1`] = `
               aria-label="search-bar-label"
               class="MuiFormControl-root MuiTextField-root text css-1u3bzj6-MuiFormControl-root-MuiTextField-root"
               data-testid="input"
+              style="min-width: 250px;"
             >
               <div
                 class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl MuiInputBase-sizeSmall MuiInputBase-adornedEnd css-o9k5xi-MuiInputBase-root-MuiOutlinedInput-root"
@@ -86,13 +87,8 @@ exports[`<Releases /> Deve corresponder ao snapshot 1`] = `
                   value=""
                 />
                 <div
-                  class="MuiInputAdornment-root MuiInputAdornment-positionStart MuiInputAdornment-outlined MuiInputAdornment-sizeSmall css-ittuaa-MuiInputAdornment-root"
+                  class="MuiInputAdornment-root MuiInputAdornment-positionEnd MuiInputAdornment-outlined MuiInputAdornment-sizeSmall css-1laqsz7-MuiInputAdornment-root"
                 >
-                  <span
-                    class="notranslate"
-                  >
-                    
-                  </span>
                   <svg
                     aria-hidden="true"
                     class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"

diff --git a/src/pages/products/[product]/repositories/[repository]/components/Header/Header.tsx b/src/pages/products/[product]/repositories/[repository]/components/Header/Header.tsx
@@ -12,6 +12,7 @@ import ReactEcharts from 'echarts-for-react';
 import { ProductFormData } from '@services/product';
 import { toNumber } from 'lodash';
 import { useProductQuery } from '@pages/products/hooks/useProductQuery';
+import { useTranslation } from 'react-i18next';
 import GaugeSlider from '../GaugeSlider';
 import CopyBadgeModal from '../CopyBadgeModal';
 
@@ -29,6 +30,8 @@ function Header() {
 
   const { query } = useRouter();
 
+  const { t } = useTranslation('header');
+
   useEffect(() => {
     if (initialValues && !values) {
       setValues(initialValues);
@@ -89,12 +92,11 @@ function Header() {
 
       const result = await updateProduct(productId, productData);
       if (result.type === 'success') {
-        toast.success('Intervalos atualizados com sucesso!');
+        toast.success(t("update_success"));
         setCurrentProduct(result.value);
       } else {
-        toast.success('Erro ao atualizar intervalos!');
+        toast.success(t("update_error"));
       }
-
       setOpenModal(false);
     }
   };
@@ -104,7 +106,7 @@ function Header() {
       <Box display="flex" flexDirection="column">
         <Box display="flex">
           <Typography variant="h4" marginRight="10px">
-            Repositório
+            {t("repository")}
           </Typography>
           <Typography variant="h4" fontWeight="500" color="#33568E">
             {currentRepository?.name}
@@ -176,16 +178,16 @@ function Header() {
                   variant='contained'
                   onClick={onSubmit}
                 >
-                  Salvar
+                  {t("save")}
                 </Button>
               </Box>
               <Alert icon={<WarningIcon />} sx={{ display: "flex", justifyContent: "center", textAlign: 'center' }} severity="warning">
-                Atenção: Essa configuração será aplicada a todos os repositórios do produto.
+                {t("warning_message")}
               </Alert>
             </>
             :
             <Alert sx={{ display: "flex", justifyContent: "center", textAlign: 'center' }} severity="error">
-              Ocorreu um erro ao tentar carregar as informações.
+              {t("error_message")}
             </Alert>
           }
         </Box>

diff --git a/...uct]/repositories/[repository]/components/Header/tests/__snapshots__/Header.spec.tsx.snap b/...uct]/repositories/[repository]/components/Header/tests/__snapshots__/Header.spec.tsx.snap
@@ -14,7 +14,7 @@ exports[`Header should render correctly 1`] = `
         <h4
           class="MuiTypography-root MuiTypography-h4 css-obdthj-MuiTypography-root"
         >
-          Repositório
+          repository
         </h4>
         <h4
           class="MuiTypography-root MuiTypography-h4 css-r2wbd1-MuiTypography-root"

diff --git a/...s/[repository]/components/TreeViewFilter/tests/__snapshots__/TreeViewFilter.spec.tsx.snap b/...s/[repository]/components/TreeViewFilter/tests/__snapshots__/TreeViewFilter.spec.tsx.snap
@@ -47,6 +47,7 @@ exports[`<TreeViewFilter /> should render correctly 1`] = `
               aria-label="search"
               class="MuiFormControl-root MuiTextField-root text css-1u3bzj6-MuiFormControl-root-MuiTextField-root"
               data-testid="input"
+              style="min-width: 250px;"
             >
               <label
                 class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined css-1pysi21-MuiFormLabel-root-MuiInputLabel-root"
@@ -68,13 +69,8 @@ exports[`<TreeViewFilter /> should render correctly 1`] = `
                   value=""
                 />
                 <div
-                  class="MuiInputAdornment-root MuiInputAdornment-positionStart MuiInputAdornment-outlined MuiInputAdornment-sizeSmall css-ittuaa-MuiInputAdornment-root"
+                  class="MuiInputAdornment-root MuiInputAdornment-positionEnd MuiInputAdornment-outlined MuiInputAdornment-sizeSmall css-1laqsz7-MuiInputAdornment-root"
                 >
-                  <span
-                    class="notranslate"
-                  >
-                    
-                  </span>
                   <svg
                     aria-hidden="true"
                     class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"

diff --git a/...products/[product]/repositories/[repository]/tests/__snapshots__/Repository.spec.tsx.snap b/...products/[product]/repositories/[repository]/tests/__snapshots__/Repository.spec.tsx.snap
@@ -23,7 +23,7 @@ exports[`<Repository /> Should render correctly 1`] = `
               <h4
                 class="MuiTypography-root MuiTypography-h4 css-obdthj-MuiTypography-root"
               >
-                Repositório
+                repository
               </h4>
               <h4
                 class="MuiTypography-root MuiTypography-h4 css-r2wbd1-MuiTypography-root"

diff --git a/src/pages/products/[product]/repositories/tests/__snapshots__/Repositories.spec.tsx.snap b/src/pages/products/[product]/repositories/tests/__snapshots__/Repositories.spec.tsx.snap
@@ -76,6 +76,7 @@ Object {
                       aria-label="input-placeholder"
                       class="MuiFormControl-root MuiTextField-root text css-1u3bzj6-MuiFormControl-root-MuiTextField-root"
                       data-testid="input"
+                      style="min-width: 250px;"
                     >
                       <label
                         class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined css-1pysi21-MuiFormLabel-root-MuiInputLabel-root"
@@ -97,13 +98,8 @@ Object {
                           value=""
                         />
                         <div
-                          class="MuiInputAdornment-root MuiInputAdornment-positionStart MuiInputAdornment-outlined MuiInputAdornment-sizeSmall css-ittuaa-MuiInputAdornment-root"
+                          class="MuiInputAdornment-root MuiInputAdornment-positionEnd MuiInputAdornment-outlined MuiInputAdornment-sizeSmall css-1laqsz7-MuiInputAdornment-root"
                         >
-                          <span
-                            class="notranslate"
-                          >
-                            
-                          </span>
                           <svg
                             aria-hidden="true"
                             class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
@@ -220,6 +216,7 @@ Object {
                     aria-label="input-placeholder"
                     class="MuiFormControl-root MuiTextField-root text css-1u3bzj6-MuiFormControl-root-MuiTextField-root"
                     data-testid="input"
+                    style="min-width: 250px;"
                   >
                     <label
                       class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-sizeSmall MuiInputLabel-outlined css-1pysi21-MuiFormLabel-root-MuiInputLabel-root"
@@ -241,13 +238,8 @@ Object {
                         value=""
                       />
                       <div
-                        class="MuiInputAdornment-root MuiInputAdornment-positionStart MuiInputAdornment-outlined MuiInputAdornment-sizeSmall css-ittuaa-MuiInputAdornment-root"
+                        class="MuiInputAdornment-root MuiInputAdornment-positionEnd MuiInputAdornment-outlined MuiInputAdornment-sizeSmall css-1laqsz7-MuiInputAdornment-root"
                       >
-                        <span
-                          class="notranslate"
-                        >
-                          
-                        </span>
                         <svg
                           aria-hidden="true"
                           class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"

diff --git a/src/shared/components/GraphicChart/GraphicChart.tsx b/src/shared/components/GraphicChart/GraphicChart.tsx
@@ -14,6 +14,7 @@ import KeyboardDoubleArrowDownIcon from '@mui/icons-material/KeyboardDoubleArrow
 import KeyboardDoubleArrowUpIcon from '@mui/icons-material/KeyboardDoubleArrowUp';
 import { useProductContext } from '@contexts/ProductProvider';
 import { HistoryDateRange } from '@customTypes/product';
+import { useTranslation } from 'react-i18next';
 
 interface Prop {
   title: string;
@@ -57,6 +58,7 @@ const GraphicChart = ({
   const [showCharts, setShowCharts] = useState(false);
   const { currentProduct } = useProductContext();
 
+  const { t } = useTranslation('graphic_chart');
 
   const sliceHistorical = (rowIdx: number): Historical[] => {
     if (!autoGrid) return historical;
@@ -124,12 +126,10 @@ const GraphicChart = ({
         >
           {(type !== 'gauge') || (type === 'gauge' && showCharts) && (typeof window !== 'undefined') ?
             (typeof window !== 'undefined') && chartsOption.map((option) => (
-              <>
-                < ReactEcharts
-                  ref={echartsRef}
-                  onEvents={option?.onEvents}
-                  key={option.key} notMerge lazyUpdate style={chartStyle} option={option} />
-              </>
+              < ReactEcharts
+                ref={echartsRef}
+                onEvents={option?.onEvents}
+                key={option.key} notMerge lazyUpdate style={chartStyle} option={option} />
             ))
             :
             (typeof window !== 'undefined') && filteredChartsOptions.map((option) => (
@@ -154,13 +154,13 @@ const GraphicChart = ({
       </Fade>
       {error && (
         <Fade in timeout={1000}>
-          <Alert severity="error">Ocorreu um erro ao tentar carregar as informações</Alert>
+          <Alert severity="error">{t('error')}</Alert>
         </Fade>
       )}
       {isEmpty && (
         <Fade in timeout={1000}>
           <Alert variant="standard" severity="warning">
-            Não há dados para serem exibidos
+            {t('noData')}
           </Alert>
         </Fade>
       )}

diff --git a/src/shared/components/GraphicChart/tests/__snapshots__/GraphicChart.spec.tsx.snap b/src/shared/components/GraphicChart/tests/__snapshots__/GraphicChart.spec.tsx.snap
@@ -101,7 +101,7 @@ exports[`<GraphicChart /> should render correctly with empty data 1`] = `
     <div
       class="MuiAlert-message css-1pxa9xg-MuiAlert-message"
     >
-      Não há dados para serem exibidos
+      noData
     </div>
   </div>
 </div>
@@ -154,7 +154,7 @@ exports[`<GraphicChart /> should render correctly with error 1`] = `
     <div
       class="MuiAlert-message css-1pxa9xg-MuiAlert-message"
     >
-      Ocorreu um erro ao tentar carregar as informações
+      error
     </div>
   </div>
 </div>

diff --git a/src/shared/components/LatestValueTable/LatestValueTable.tsx b/src/shared/components/LatestValueTable/LatestValueTable.tsx
@@ -17,13 +17,16 @@ import {
 
 import _ from 'lodash';
 import { useRequestValues } from '@hooks/useRequestValues';
+import { useTranslation } from 'react-i18next';
 
 interface Prop {
   title: string;
   value: 'characteristics' | 'subcharacteristics' | 'measures' | 'metrics';
 }
 
 function LatestValueTable({ title, value }: Prop) {
+  const { t } = useTranslation('lates_value_table');
+
   const { data, error, isLoading, isEmpty } = useRequestValues({ type: 'latest-values', value });
   const tableRows: { name: string; latestValue: number; latestData: string }[] = [];
 
@@ -48,8 +51,8 @@ function LatestValueTable({ title, value }: Prop) {
             <TableHead>
               <TableRow>
                 <TableCell>{title}</TableCell>
-                <TableCell align="right">Último valor</TableCell>
-                <TableCell align="right">Última medição</TableCell>
+                <TableCell align="right">{t('lastValue')}</TableCell>
+                <TableCell align="right">{t('lastMeasurement')}</TableCell>
               </TableRow>
             </TableHead>
             <TableBody>
@@ -71,14 +74,14 @@ function LatestValueTable({ title, value }: Prop) {
       {error && (
         <Fade in>
           <Alert variant="standard" severity="error">
-            Ocorreu um erro ao tentar carregar as informações
+            {t('error')}
           </Alert>
         </Fade>
       )}
       {isEmpty && (
         <Fade in>
           <Alert variant="standard" severity="warning">
-            Não há dados para serem exibidos
+            {t('noData')}
           </Alert>
         </Fade>
       )}
-Original file line number
+Diff line change
@@ Expand Up @@
         <div
           class="MuiAlert-message css-1pxa9xg-MuiAlert-message"
         >
-          Não há dados para serem exibidos
+          noData
         </div>
       </div>
     </div>
@@ Expand Down Expand Up @@
         <div
           class="MuiAlert-message css-1pxa9xg-MuiAlert-message"
         >
-          Ocorreu um erro ao tentar carregar as informações
+          error
         </div>
       </div>
     </div>
@@ Expand Down @@