Fix paths variables (#8)

* Refactor paths names * Fix paths variables
vocdoni · Jun 6, 2024 · aa66e47 · aa66e47 · github-actions · Jun 6, 2024
1 parent baeea38
commit aa66e47
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 18 deletions.
diff --git a/src/components/Organizations/OrganizationsList.tsx b/src/components/Organizations/OrganizationsList.tsx
@@ -8,21 +8,26 @@ import { RoutedPagination } from '~components/Pagination/Pagination'
 import LoadingError from '~src/layout/LoadingError'
 import { useTranslation } from 'react-i18next'
 import { LoadingCards } from '~src/layout/Loading'
-import { ORGANIZATIONS_LIST_PATH } from '~src/router'
+import { organizationsListPath } from '~src/router'
+import { ChangeEvent } from 'react'
 
 export const OrganizationsFilter = () => {
   const { t } = useTranslation()
   const navigate = useNavigate()
 
   const debouncedSearch = debounce((value) => {
-    navigate(generatePath(ORGANIZATIONS_LIST_PATH, { page: '0', query: value as string }))
+    navigate(generatePath(organizationsListPath, { page: '0', query: value as string }))
   }, 1000)
 
-  const searchOnChange = (event: any) => {
-    debouncedSearch(event.target.value)
-  }
-
-  return <InputSearch maxW={'300px'} placeholder={t('organizations.search_by_org_id')} onChange={searchOnChange} />
+  return (
+    <InputSearch
+      maxW={'300px'}
+      placeholder={t('organizations.search_by_org_id')}
+      onChange={(event: ChangeEvent<HTMLInputElement>) => {
+        debouncedSearch(event.target.value)
+      }}
+    />
+  )
 }
 
 export const PaginatedOrganizationsList = () => {
@@ -51,7 +56,7 @@ export const PaginatedOrganizationsList = () => {
   }
 
   return (
-    <RoutedPaginationProvider totalPages={Math.ceil(count / 10)} path={ORGANIZATIONS_LIST_PATH}>
+    <RoutedPaginationProvider totalPages={Math.ceil(count / 10)} path={organizationsListPath}>
       {orgs?.organizations.map((org) => (
         <OrganizationCard key={org.organizationID} id={org.organizationID} electionCount={org.electionCount} />
       ))}

diff --git a/src/components/TopBar.tsx b/src/components/TopBar.tsx
@@ -15,7 +15,7 @@ import { useTranslation } from 'react-i18next'
 import { RxHamburgerMenu } from 'react-icons/rx'
 import { generatePath } from 'react-router-dom'
 import { VocdoniEnvironment } from '~constants'
-import { ORGANIZATIONS_LIST_PATH } from '~src/router'
+import { organizationsListPath } from '~src/router'
 
 import logoUrl from '/images/logo-header.png'
 import logoStgUrl from '/images/logo-header-stg.png'
@@ -48,7 +48,7 @@ export const TopBar = () => {
   const links: HeaderLink[] = [
     {
       name: t('links.organizations'),
-      url: generatePath(ORGANIZATIONS_LIST_PATH, { page: null, query: null }),
+      url: generatePath(organizationsListPath, { page: null, query: null }),
     },
     {
       name: t('links.processes'),

diff --git a/src/router/index.tsx b/src/router/index.tsx
@@ -6,10 +6,10 @@ import { createBrowserRouter, RouteObject, RouterProvider } from 'react-router-d
 import RouteError from '~pages/RouteError'
 import Layout from '~src/layout/Default'
 
-export const BASE_PATH = '/'
-export const ORGANIZATIONS_LIST_PATH = '/organizations/:page?/:query?'
-export const PROCESS_PATH = '/process/:pid'
-export const ORGANIZATION_PATH = '/organization/:pid'
+export const basePath = '/'
+export const organizationsListPath = '/organizations/:page?/:query?'
+export const processPath = '/process/:pid'
+export const organizationPath = '/organization/:pid'
 
 const Home = lazy(() => import('~pages/Home'))
 const Organization = lazy(() => import('~pages/Organization/Organization'))
@@ -20,7 +20,7 @@ export const RoutesProvider = () => {
   const { client } = useClient()
   const routes: RouteObject[] = [
     {
-      path: BASE_PATH,
+      path: basePath,
       element: <Layout />,
       errorElement: <RouteError />,
       children: [
@@ -33,15 +33,15 @@ export const RoutesProvider = () => {
           ),
         },
         {
-          path: ORGANIZATIONS_LIST_PATH,
+          path: organizationsListPath,
           element: (
             <SuspenseLoader>
               <OrganizationList />
             </SuspenseLoader>
           ),
         },
         {
-          path: PROCESS_PATH,
+          path: processPath,
           element: (
             <SuspenseLoader>
               <Vote />
@@ -50,7 +50,7 @@ export const RoutesProvider = () => {
           loader: async ({ params }) => await client.fetchElection(params.pid),
         },
         {
-          path: ORGANIZATION_PATH,
+          path: organizationPath,
           element: (
             <SuspenseLoader>
               <Organization />