diff --git a/app/jobs/@list/client-page.tsx b/app/jobs/@list/client-page.tsx index 5a056a09e..3832c1e84 100644 --- a/app/jobs/@list/client-page.tsx +++ b/app/jobs/@list/client-page.tsx @@ -19,7 +19,10 @@ export const JobListClientPage = ({ rawSearchParams }: Props) => { routeSection={ROUTE_SECTIONS.JOBS} atom={jobFiltersSearchParamsAtom} > - + ); diff --git a/app/organizations/@list/client-page.tsx b/app/organizations/@list/client-page.tsx new file mode 100644 index 000000000..a6ab91318 --- /dev/null +++ b/app/organizations/@list/client-page.tsx @@ -0,0 +1,27 @@ +'use client'; + +import { ROUTE_SECTIONS } from '~/shared/core/constants'; + +import { orgFiltersSearchParamsAtom } from '~/orgs/atoms/org-filters-search-params-atom'; +import { orgTotalCountAtom } from '~/orgs/atoms/org-total-count-atom'; +import { FiltersSection } from '~/filters/components/filters-section'; +import { FiltersProvider } from '~/filters/providers/filters-provider'; + +interface Props { + rawSearchParams: Record; +} + +export const OrgListClientPage = ({ rawSearchParams }: Props) => { + return ( + + + + ); +}; diff --git a/app/organizations/@list/default.tsx b/app/organizations/@list/default.tsx new file mode 100644 index 000000000..70c0a557d --- /dev/null +++ b/app/organizations/@list/default.tsx @@ -0,0 +1 @@ +export { default } from './page'; diff --git a/app/organizations/@list/page.tsx b/app/organizations/@list/page.tsx new file mode 100644 index 000000000..f5af6b0c7 --- /dev/null +++ b/app/organizations/@list/page.tsx @@ -0,0 +1,44 @@ +import { dehydrate, HydrationBoundary } from '@tanstack/react-query'; + +import { ROUTE_SECTIONS } from '~/shared/core/constants'; +import { getQueryClient } from '~/shared/utils/get-query-client'; + +import { filterQueryKeys } from '~/filters/core/query-keys'; +import { orgQueryKeys } from '~/orgs/core/query-keys'; +import { getFilterConfig } from '~/filters/api/get-filter-config'; +import { getOrgList } from '~/orgs/api/get-org-list'; + +import { OrgListClientPage } from './client-page'; + +interface Props { + searchParams: Record; +} + +const OrgListPage = async ({ searchParams: rawSearchParams }: Props) => { + const queryClient = getQueryClient(); + + await Promise.all([ + // Prefetch list + queryClient.prefetchInfiniteQuery({ + queryKey: orgQueryKeys.list(rawSearchParams), + queryFn: async ({ pageParam }) => getOrgList(pageParam, rawSearchParams), + initialPageParam: 1, + }), + // Prefetch filter config + queryClient.prefetchQuery({ + queryKey: filterQueryKeys.list(rawSearchParams, ROUTE_SECTIONS.ORGS), + queryFn: () => getFilterConfig(`/${ROUTE_SECTIONS.ORGS}`), + }), + ]); + + return ( + + + + ); +}; + +export default OrgListPage; + +// Force SSR on this page (needed to pick up searchParams) +export const dynamic = 'force-dynamic'; diff --git a/app/organizations/layout.tsx b/app/organizations/layout.tsx new file mode 100644 index 000000000..4a8338e4d --- /dev/null +++ b/app/organizations/layout.tsx @@ -0,0 +1,20 @@ +interface Props { + children: React.ReactNode; + list: React.ReactNode; +} + +const OrgsLayout = ({ children, list }: Props) => { + return ( +
+
+
+ {list} +
+
+ + {children} +
+ ); +}; + +export default OrgsLayout; diff --git a/src/filters/components/filters-section/index.tsx b/src/filters/components/filters-section/index.tsx index b3ca38e7e..f15cacbe7 100644 --- a/src/filters/components/filters-section/index.tsx +++ b/src/filters/components/filters-section/index.tsx @@ -8,12 +8,13 @@ import { TotalCount } from './total-count'; interface Props { countAtom: PrimitiveAtom; + searchPlaceholder: string; } -export const FiltersSection = ({ countAtom }: Props) => { +export const FiltersSection = ({ countAtom, searchPlaceholder }: Props) => { return (
- + }> diff --git a/src/orgs/atoms/org-filters-search-params-atom.ts b/src/orgs/atoms/org-filters-search-params-atom.ts new file mode 100644 index 000000000..72dc66c49 --- /dev/null +++ b/src/orgs/atoms/org-filters-search-params-atom.ts @@ -0,0 +1,5 @@ +import { atom } from 'jotai'; + +export const orgFiltersSearchParamsAtom = atom( + new URLSearchParams(), +);