pagination and placeholder 2117 (#2297)

* pagination and placeholder

* linting and language translation

* code rabbit suggestions

* test fix

public/locales/en/translation.json

@@ -963,7 +963,8 @@
     "organizations": "Organizations",
     "search": "search",
     "filter": "filter",
-    "searchByName": "searchByName"
+    "searchByName": "searchByName",
+    "searchOrganizations": "Search Organization"
   },
   "userSidebarOrg": {
     "yourOrganizations": "Your Organizations",

public/locales/fr/translation.json

@@ -963,7 +963,8 @@
     "organizations": "Organisations",
     "search": "Rechercher",
     "filter": "Filtrer",
-    "searchByName": "Rechercher par nom"
+    "searchByName": "Rechercher par nom",
+    "searchOrganizations": "Rechercher Organisations"
   },
   "userSidebarOrg": {
     "yourOrganizations": "Vos organisations",

public/locales/hi/translation.json

@@ -963,7 +963,8 @@
     "organizations": "संगठनों",
     "search": "खोजें",
     "filter": "फ़िल्टर",
-    "searchByName": "नाम से खोजें"
+    "searchByName": "नाम से खोजें",
+    "searchOrganizations": "संगठनों खोजें"
   },
   "userSidebarOrg": {
     "yourOrganizations": "आपके संगठन",

public/locales/sp/translation.json

@@ -964,7 +964,8 @@
     "filter": "Filtrar",
     "organizations": "Organizaciones",
     "searchByName": "Buscar por nombre",
-    "searchUsers": "Buscar usuarios"
+    "searchUsers": "Buscar usuarios",
+    "searchOrganizations": "Buscar Organizaciones"
   },
   "userSidebarOrg": {
     "yourOrganizations": "Tus Organizaciones",

public/locales/zh/translation.json

@@ -963,7 +963,8 @@
     "organizations": "组织机构",
     "search": "搜索",
     "filter": "筛选",
-    "searchByName": "按名称搜索"
+    "searchByName": "按名称搜索",
+    "searchOrganizations": "搜索组织"
   },
   "userSidebarOrg": {
     "yourOrganizations": "您的组织",

src/components/PaginationList/PaginationList.tsx

@@ -67,7 +67,6 @@ const PaginationList = ({
       <Hidden smDown initialWidth={'lg'}>
         <TablePagination
           rowsPerPageOptions={[
-            -1,
             5,
             10,
             30,

src/screens/UserPortal/Organizations/Organizations.test.tsx

@@ -519,4 +519,44 @@ describe('Testing Organizations Screen [User Portal]', () => {
       settingsBtn.click();
     });
   });
+  test('Rows per Page values', async () => {
+    render(
+      <MockedProvider addTypename={false} link={link}>
+        <BrowserRouter>
+          <Provider store={store}>
+            <I18nextProvider i18n={i18nForTest}>
+              <Organizations />
+            </I18nextProvider>
+          </Provider>
+        </BrowserRouter>
+      </MockedProvider>,
+    );
+    await wait();
+    const dropdown = screen.getByTestId('table-pagination');
+    userEvent.click(dropdown);
+    expect(screen.queryByText('-1')).not.toBeInTheDocument();
+    expect(screen.getByText('5')).toBeInTheDocument();
+    expect(screen.getByText('10')).toBeInTheDocument();
+    expect(screen.getByText('30')).toBeInTheDocument();
+    expect(screen.getByText('All')).toBeInTheDocument();
+  });
+
+  test('Search input has correct placeholder text', async () => {
+    render(
+      <MockedProvider addTypename={false} link={link}>
+        <BrowserRouter>
+          <Provider store={store}>
+            <I18nextProvider i18n={i18nForTest}>
+              <Organizations />
+            </I18nextProvider>
+          </Provider>
+        </BrowserRouter>
+      </MockedProvider>,
+    );
+
+    await wait();
+
+    const searchInput = screen.getByPlaceholderText('Search Organization');
+    expect(searchInput).toBeInTheDocument();
+  });
 });

src/screens/UserPortal/Organizations/Organizations.tsx

@@ -319,8 +319,8 @@ export default function organizations(): JSX.Element {
           <div className="mt-4">
             <InputGroup className={styles.maxWidth}>
               <Form.Control
-                placeholder={t('searchUsers')}
-                id="searchUserOrgs"
+                placeholder={t('searchOrganizations')}
+                id="searchOrganizations"
                 type="text"
                 className={`${styles.borderNone} ${styles.backgroundWhite}`}
                 onKeyUp={handleSearchByEnter}