showing correct amount of table results (#6908)

* showing correct amount of table results

* updated component testing

Author: konzz

app/react/Routes.tsx

@@ -113,16 +113,18 @@ const getRoutesLayout = (
         <Route path="new" element={adminsOnlyRoute(<NewTemplate />)} />
         <Route path="edit/:templateId" element={adminsOnlyRoute(<EditTemplate />)} />
       </Route>
-      <Route
-        path="metadata_extraction"
-        element={adminsOnlyRoute(<IXDashboard />)}
-        loader={IXdashboardLoader(headers)}
-      />
-      <Route
-        path="metadata_extraction/suggestions/:extractorId"
-        loader={IXSuggestionsLoader(headers)}
-        element={adminsOnlyRoute(<IXSuggestions />)}
-      />
+      <Route path="metadata_extraction">
+        <Route
+          index
+          element={adminsOnlyRoute(<IXDashboard />)}
+          loader={IXdashboardLoader(headers)}
+        />
+        <Route
+          path="suggestions/:extractorId"
+          loader={IXSuggestionsLoader(headers)}
+          element={adminsOnlyRoute(<IXSuggestions />)}
+        />
+      </Route>
       <Route path="relationship-types">
         <Route
           index
@@ -202,7 +204,7 @@ const getRoutes = (
   return createRoutesFromElements(
     <Route path="/" element={<App customParams={parameters} />}>
       {layout}
-      <Route path=":lang">
+      <Route path="/:lang">
         {layout}
         <Route path="*" element={<GeneralError />} />
       </Route>

app/react/V2/Components/Layouts/SettingsContent.tsx

@@ -1,9 +1,8 @@
 /* eslint-disable react/no-multi-comp */
-import { Link } from 'react-router-dom';
 import React, { PropsWithChildren } from 'react';
 import { Breadcrumb } from 'flowbite-react';
 import { ChevronLeftIcon } from '@heroicons/react/20/solid';
-import { Translate } from 'app/I18N';
+import { I18NLink, Translate } from 'app/I18N';
 
 interface SettingsContentProps extends PropsWithChildren {
   className?: string;
@@ -31,12 +30,12 @@ const SettingsContent = ({ children, className }: SettingsContentProps) => (
 
 const SettingsHeader = ({ contextId, title, children, path, className }: SettingsHeaderProps) => (
   <div className={`${className || ''} flex pt-5 pb-4 px-4 `} data-testid="settings-content-header">
-    <Link to="/settings" className="block lg:hidden">
+    <I18NLink to="/settings" className="block lg:hidden">
       <ChevronLeftIcon className="w-8 stroke-1 lg:hidden" />
       <span className="sr-only">
         <Translate>Navigate back</Translate>
       </span>
-    </Link>
+    </I18NLink>
     <Breadcrumb className="!relative p-1 flex right-0 !bg-transparent m-0 !w-full flex-wrap align-middle">
       {Array.from(path?.entries() || []).map(([key, value]) => (
         <Breadcrumb.Item key={key} href={value} className="max-w-xs">

app/react/V2/Components/Layouts/specs/SettingsContent.cy.tsx

@@ -47,7 +47,7 @@ describe('ConfirmationModal', () => {
     cy.get('[data-testid="settings-content-header"]')
       .invoke('text')
       .should('contain', 'Root PathMiddle PathLeafCurrent page');
-    cy.get('a[href="/settings"]').should('not.be.visible');
+    cy.get('a[href="/en/settings"]').should('not.be.visible');
     cy.contains('a', 'Root Path').invoke('attr', 'href').should('include', '#top');
     cy.contains('a', 'Middle Path').invoke('attr', 'href').should('include', '#bottom');
     cy.contains('a', 'Leaf').invoke('attr', 'href').should('include', '#footer');
@@ -58,6 +58,6 @@ describe('ConfirmationModal', () => {
   it('should have an arrow to return to settings menu for mobile', () => {
     cy.viewport(450, 650);
     render();
-    cy.get('a[href="/settings"]').should('be.visible');
+    cy.get('a[href="/en/settings"]').should('be.visible');
   });
 });

app/react/V2/Routes/Settings/IX/IXSuggestions.tsx

@@ -268,7 +268,7 @@ const IXSuggestions = () => {
                 <PaginationState
                   page={Number(searchParams.get('page') || 1)}
                   size={SUGGESTIONS_PER_PAGE}
-                  total={status.data?.total || totalPages * SUGGESTIONS_PER_PAGE}
+                  total={aggregation.total || totalPages * SUGGESTIONS_PER_PAGE}
                   currentLength={currentSuggestions.length}
                 />
                 <div>