Merge pull request #2255 from dxc-technology/rarrojolopez/paginator-localization

Fix Paginator buttons to support localization

Author: Mil4n0r

apps/website/screens/principles/localization/LocalizationPage.tsx

@@ -455,6 +455,30 @@ const sections = [
                   with those parameters.
                 </td>
               </tr>
+              <tr>
+                <td>
+                  <Code>firstResultsTitle</Code>
+                </td>
+                <td>First results</td>
+              </tr>
+              <tr>
+                <td>
+                  <Code>previousResultsTitle</Code>
+                </td>
+                <td>Previous results</td>
+              </tr>
+              <tr>
+                <td>
+                  <Code>nextResultsTitle</Code>
+                </td>
+                <td>Next results</td>
+              </tr>
+              <tr>
+                <td>
+                  <Code>lastResultsTitle</Code>
+                </td>
+                <td>Last results</td>
+              </tr>
             </tbody>
           </DxcTable>
         ),

packages/lib/src/common/variables.ts

@@ -1504,6 +1504,10 @@ export const defaultTranslatedComponentLabels = {
       `${minNumberOfItems} to ${maxNumberOfItems} of ${totalItems}`,
     goToPageText: "Go to page:",
     pageOfText: (pageNumber: number, totalPagesNumber: number) => `Page: ${pageNumber} of ${totalPagesNumber}`,
+    firstResultsTitle: "First results",
+    previousResultsTitle: "Previous results",
+    nextResultsTitle: "Next results",
+    lastResultsTitle: "Last results",
   },
   passwordInput: {
     inputShowPasswordTitle: "Show password",
@@ -1519,7 +1523,7 @@ export const defaultTranslatedComponentLabels = {
     actionClearSelectionTitle: "Clear selection",
     actionClearSearchTitle: "Clear search",
     noMatchesErrorMessage: "No matches found",
-    selectAllLabel: "Select all"
+    selectAllLabel: "Select all",
   },
   tabs: {
     scrollLeft: "Scroll left",

packages/lib/src/paginator/Paginator.tsx

@@ -109,7 +109,7 @@ const DxcPaginator = ({
               onClick={() => {
                 onPageChange(1);
               }}
-              title="First results"
+              title={translatedLabels.paginator.firstResultsTitle}
               size={{ height: "medium" }}
             />
 
@@ -121,7 +121,7 @@ const DxcPaginator = ({
               onClick={() => {
                 onPageChange(currentPage - 1);
               }}
-              title="Previous results"
+              title={translatedLabels.paginator.previousResultsTitle}
               size={{ height: "medium" }}
             />
           </ButtonsContainer>
@@ -157,7 +157,7 @@ const DxcPaginator = ({
               onClick={() => {
                 onPageChange(currentPage + 1);
               }}
-              title="Next results"
+              title={translatedLabels.paginator.nextResultsTitle}
               size={{ height: "medium" }}
             />
             <DxcButton
@@ -168,7 +168,7 @@ const DxcPaginator = ({
               onClick={() => {
                 onPageChange(totalPages);
               }}
-              title="Last results"
+              title={translatedLabels.paginator.lastResultsTitle}
               size={{ height: "medium" }}
             />
           </ButtonsContainer>