From 452c68db35af8d3bfd3c1a2c95c0f012746e36e8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Germ=C3=A1n=20Saracca?= <gersaracca@gmail.com>
Date: Wed, 11 Dec 2024 17:33:46 -0300
Subject: [PATCH] feat: add locales

---
 public/locales/en/collection.json                    |  4 +++-
 public/locales/en/shared.json                        |  2 ++
 .../collection-items-panel/CollectionItemsPanel.tsx  |  3 ---
 .../filter-panel/facets-filters/FacetFilterGroup.tsx | 12 +++++++++---
 .../selected-facets/SelectedFacets.tsx               |  5 ++++-
 5 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/public/locales/en/collection.json b/public/locales/en/collection.json
index e022a2ca9..f6c1c42fa 100644
--- a/public/locales/en/collection.json
+++ b/public/locales/en/collection.json
@@ -31,5 +31,7 @@
     "question": "Are you sure you want to publish your collection? Once you do so it must remain published.",
     "error": "There was an error publishing your collection."
   },
-  "publishedAlert": "Your collection is now public."
+  "publishedAlert": "Your collection is now public.",
+  "addFacetFilter": "Add {{labelName}} facet filter",
+  "removeSelectedFacet": "Remove {{labelName}} facet filter"
 }
diff --git a/public/locales/en/shared.json b/public/locales/en/shared.json
index 403cf5307..993dffade 100644
--- a/public/locales/en/shared.json
+++ b/public/locales/en/shared.json
@@ -4,6 +4,8 @@
   "add": "Add",
   "cancel": "Cancel",
   "continue": "Continue",
+  "more": "More...",
+  "less": "Less...",
   "pageNumberNotFound": {
     "heading": "Page Number Not Found",
     "message": "The page number you requested does not exist. Please try a different page number."
diff --git a/src/sections/collection/collection-items-panel/CollectionItemsPanel.tsx b/src/sections/collection/collection-items-panel/CollectionItemsPanel.tsx
index 2c7a82d19..981fa6b4c 100644
--- a/src/sections/collection/collection-items-panel/CollectionItemsPanel.tsx
+++ b/src/sections/collection/collection-items-panel/CollectionItemsPanel.tsx
@@ -44,9 +44,6 @@ interface CollectionItemsPanelProps {
  * Every time a load of items is triggered, the pagination info is updated and the URL is updated with the new query params so it can be shared and the user can navigate back and forward in the browser.
  */
 
-// TODO:ME - margin top scroll
-// TODO:ME - Add locales
-
 export const CollectionItemsPanel = ({
   collectionId,
   collectionRepository,
diff --git a/src/sections/collection/collection-items-panel/filter-panel/facets-filters/FacetFilterGroup.tsx b/src/sections/collection/collection-items-panel/filter-panel/facets-filters/FacetFilterGroup.tsx
index 3aced5f8a..1772de07f 100644
--- a/src/sections/collection/collection-items-panel/filter-panel/facets-filters/FacetFilterGroup.tsx
+++ b/src/sections/collection/collection-items-panel/filter-panel/facets-filters/FacetFilterGroup.tsx
@@ -1,4 +1,5 @@
 import { useState } from 'react'
+import { useTranslation } from 'react-i18next'
 import { Button, Col, Row } from '@iqss/dataverse-design-system'
 import { X as CloseIcon } from 'react-bootstrap-icons'
 import { CollectionItemsFacet } from '@/collection/domain/models/CollectionItemSubset'
@@ -25,6 +26,9 @@ export const FacetFilterGroup = ({
   onFacetChange,
   isLoadingCollectionItems
 }: FacetFilterGroupProps) => {
+  const { t } = useTranslation('collection')
+  const { t: tShared } = useTranslation('shared')
+
   const [visibleCount, setVisibleCount] = useState(FACETS_PER_VIEW)
 
   const handleShowMore = () => {
@@ -63,7 +67,9 @@ export const FacetFilterGroup = ({
                 role="option"
                 aria-selected={isFacetLabelSelected}
                 aria-label={
-                  isFacetLabelSelected ? `Remove ${label.name} filter` : `Add ${label.name} filter`
+                  isFacetLabelSelected
+                    ? t('removeSelectedFacet', { labelName: label.name })
+                    : t('addFacetFilter', { labelName: label.name })
                 }
                 disabled={isLoadingCollectionItems}
                 variant="link"
@@ -85,7 +91,7 @@ export const FacetFilterGroup = ({
                 size="sm"
                 onClick={handleShowLess}
                 disabled={isLoadingCollectionItems}>
-                Less...
+                {tShared('less')}
               </Button>
             )}
           </Col>
@@ -96,7 +102,7 @@ export const FacetFilterGroup = ({
                 size="sm"
                 onClick={handleShowMore}
                 disabled={isLoadingCollectionItems}>
-                More...
+                {tShared('more')}
               </Button>
             )}
           </Col>
diff --git a/src/sections/collection/collection-items-panel/selected-facets/SelectedFacets.tsx b/src/sections/collection/collection-items-panel/selected-facets/SelectedFacets.tsx
index 6e8ce3e3a..137e0aea8 100644
--- a/src/sections/collection/collection-items-panel/selected-facets/SelectedFacets.tsx
+++ b/src/sections/collection/collection-items-panel/selected-facets/SelectedFacets.tsx
@@ -1,3 +1,4 @@
+import { useTranslation } from 'react-i18next'
 import { Button } from '@iqss/dataverse-design-system'
 import { X as CloseIcon } from 'react-bootstrap-icons'
 import { FilterQuery } from '@/collection/domain/models/GetCollectionItemsQueryParams'
@@ -14,6 +15,8 @@ export const SelectedFacets = ({
   onRemoveFacet,
   isLoadingCollectionItems
 }: SelectedFacetsProps) => {
+  const { t } = useTranslation('collection')
+
   return (
     <div className={styles['selected-facets-container']}>
       {selectedFilterQueries.map((filterQuery) => {
@@ -25,7 +28,7 @@ export const SelectedFacets = ({
             className={styles['selected-facet-btn']}
             onClick={() => onRemoveFacet(filterQuery)}
             disabled={isLoadingCollectionItems}
-            aria-label={`Remove ${labelName} query filter`}
+            aria-label={t('removeSelectedFacet', { labelName })}
             key={filterQuery}>
             {labelName} <CloseIcon size={22} />
           </Button>