Fix ecosystem filters.

- Search by location not working. - On Empty list, blank page shown
CodeForAfrica · Oct 3, 2023 · 8889f3d · 8889f3d
1 parent 40ec020
commit 8889f3d
Show file tree

Hide file tree

Showing 4 changed files with 90 additions and 69 deletions.
diff --git a/apps/charterafrica/src/components/EcosystemList/EcosystemList.js b/apps/charterafrica/src/components/EcosystemList/EcosystemList.js
@@ -84,9 +84,7 @@ const EcosystemList = React.forwardRef(function EcosystemList(props, ref) {
   if (loading && listRef.current) {
     listRef.current.scrollIntoView({ behavior: "smooth" });
   }
-  if (!results.length && !values.search) {
-    return null;
-  }
+
   return (
     <Box ref={ref} sx={{ backgroundColor: "common.white" }}>
       <Section
@@ -109,32 +107,41 @@ const EcosystemList = React.forwardRef(function EcosystemList(props, ref) {
             filterOptions={filterOptions}
             onQuerySearch={onQuerySearch}
           />
-          <RichTypography
-            textAlign={{ xs: "center", sm: "left" }}
-            color="neutral.dark"
-            variant="h2SemiBold"
-            sx={{ mt: 6.25 }}
-          >
-            {title}
-          </RichTypography>
-          {loading ? <LinearProgress color="secondary" /> : null}
-          <Grid sx={{ py: 6.25 }} container columnSpacing={2.5} rowSpacing={5}>
-            {results.map((item) => (
-              <Grid key={item.id} item xs={12} sm={6} md={4} lg={3}>
-                <Component key={item.id} {...item} />
+          {results.length ? (
+            <>
+              <RichTypography
+                textAlign={{ xs: "center", sm: "left" }}
+                color="neutral.dark"
+                variant="h2SemiBold"
+                sx={{ mt: 6.25 }}
+              >
+                {title}
+              </RichTypography>
+              {loading ? <LinearProgress color="secondary" /> : null}
+              <Grid
+                sx={{ py: 6.25 }}
+                container
+                columnSpacing={2.5}
+                rowSpacing={5}
+              >
+                {results.map((item) => (
+                  <Grid key={item.id} item xs={12} sm={6} md={4} lg={3}>
+                    <Component key={item.id} {...item} />
+                  </Grid>
+                ))}
               </Grid>
-            ))}
-          </Grid>
-          <NextPrevPagination
-            count={totalPages}
-            onChange={(_, p) => onPageChange(p)}
-            page={page}
-            sx={{
-              backgroundColor: "common.white",
-              mt: 5,
-              pb: 8,
-            }}
-          />
+              <NextPrevPagination
+                count={totalPages}
+                onChange={(_, p) => onPageChange(p)}
+                page={page}
+                sx={{
+                  backgroundColor: "common.white",
+                  mt: 5,
+                  pb: 8,
+                }}
+              />
+            </>
+          ) : null}
         </Box>
       </Section>
     </Box>

diff --git a/apps/charterafrica/src/lib/data/common/processPageContributors.js b/apps/charterafrica/src/lib/data/common/processPageContributors.js
@@ -7,32 +7,33 @@ import queryString from "@/charterafrica/utils/ecosystem/queryString";
 import formatDateTime from "@/charterafrica/utils/formatDate";
 import labelsPerLocale from "@/charterafrica/utils/translationConstants";
 
-const orQueryBuilder = (fields, search) => {
-  return fields.map((field) => ({ [field]: { like: search } }));
+const queryBuilder = (query) => {
+  const { search, location } = query;
+  const fields = ["description", "fullName", "location", "externalId"];
+  const where = {};
+  if (search) {
+    where.or = fields.map((field) => ({ [field]: { like: search } }));
+  }
+  if (location) {
+    where.location = { equals: location };
+  }
+  return where;
 };
 
 export async function getContributors(page, api, context) {
   const {
     locale,
-    query: { page: pageNumber = 1, limit = 12, search, sort = "fullName" } = {},
+    query: { page: pageNumber = 1, limit = 12, sort = "fullName" } = {},
   } = context;
-
-  const fields = ["description", "fullName", "location", "externalId"];
-  const toolQueries = orQueryBuilder(fields, search);
-  const query = {
-    or: toolQueries,
-  };
-
+  const where = queryBuilder(context.query);
   const { docs, ...pagination } = await api.getCollection(
     CONTRIBUTORS_COLLECTION,
     {
       locale,
       page: parseInt(pageNumber, 10) || 1,
       limit,
       sort,
-      where: {
-        ...query,
-      },
+      where,
     },
   );
   const results = docs.map((person) => {

diff --git a/apps/charterafrica/src/lib/data/common/processPageOrganisations.js b/apps/charterafrica/src/lib/data/common/processPageOrganisations.js
@@ -4,8 +4,17 @@ import queryString from "@/charterafrica/utils/ecosystem/queryString";
 import formatDateTime from "@/charterafrica/utils/formatDate";
 import labelsPerLocale from "@/charterafrica/utils/translationConstants";
 
-const orQueryBuilder = (fields, search) => {
-  return fields.map((field) => ({ [field]: { like: search } }));
+const queryBuilder = (query) => {
+  const { search, location } = query;
+  const fields = ["description", "location", "name", "externalId", "slug"];
+  const where = {};
+  if (search) {
+    where.or = fields.map((field) => ({ [field]: { like: search } }));
+  }
+  if (location) {
+    where.location = { equals: location };
+  }
+  return where;
 };
 
 async function processPageSingleOrganisation(page, api, context) {
@@ -65,13 +74,9 @@ async function processPageSingleOrganisation(page, api, context) {
 export async function getOrganisations(page, api, context) {
   const {
     locale,
-    query: { page: pageNumber = 1, limit = 12, search, sort = "name" } = {},
+    query: { page: pageNumber = 1, limit = 12, sort = "name" } = {},
   } = context;
-  const fields = ["description", "location", "name", "externalId", "slug"];
-  const toolQueries = orQueryBuilder(fields, search);
-  const query = {
-    or: toolQueries,
-  };
+  const where = queryBuilder(context.query);
   const filterLabels = labelsPerLocale[locale];
   const { docs, ...pagination } = await api.getCollection(
     ORGANIZATION_COLLECTION,
@@ -80,9 +85,7 @@ export async function getOrganisations(page, api, context) {
       page: pageNumber,
       limit,
       sort,
-      where: {
-        ...query,
-      },
+      where,
     },
   );
   const results = docs.map((tool) => {

diff --git a/apps/charterafrica/src/lib/data/common/processPageTools.js b/apps/charterafrica/src/lib/data/common/processPageTools.js
@@ -7,8 +7,30 @@ import queryString from "@/charterafrica/utils/ecosystem/queryString";
 import formatDateTime from "@/charterafrica/utils/formatDate";
 import labelsPerLocale from "@/charterafrica/utils/translationConstants";
 
-const orQueryBuilder = (fields, search) => {
-  return fields.map((field) => ({ [field]: { like: search } }));
+const queryBuilder = (query) => {
+  const { search, theme, homeCountry } = query;
+  const where = {};
+  if (search) {
+    const fields = [
+      "description",
+      "theme",
+      "operatingCountries",
+      "name",
+      "id",
+      "slug",
+      "homeCountry",
+    ];
+    where.or = fields.map((field) => ({ [field]: { like: search } }));
+  }
+  if (homeCountry) {
+    where.homeCountry = {
+      equals: homeCountry,
+    };
+  }
+  if (theme) {
+    where.theme = { equals: theme };
+  }
+  return where;
 };
 
 const getRepoLink = (tool) => {
@@ -99,27 +121,15 @@ async function processPageSingleTool(page, api, context) {
 export async function getTools(page, api, context) {
   const {
     locale,
-    query: { page: pageNumber = 1, limit = 12, search, sort = "name" } = {},
+    query: { page: pageNumber = 1, limit = 12, sort = "name" } = {},
   } = context;
-  const fields = [
-    "description",
-    "theme",
-    "operatingCountries",
-    "name",
-    "id",
-    "slug",
-  ];
-  const toolQueries = orQueryBuilder(fields, search);
-  const query = {
-    or: toolQueries,
-  };
-
+  const where = queryBuilder(context.query);
   const { docs, ...pagination } = await api.getCollection(TOOL_COLLECTION, {
     locale,
     page: pageNumber,
     limit,
     sort,
-    where: query,
+    where,
   });
 
   const results = docs.map((tool) => {