ui: fix partners tab

* ref: cern-sis/issues-scoap3#303
SCOAP3 · Feb 19, 2024 · 763d057 · 763d057
1 parent 59db9b5
commit 763d057
Show file tree

Hide file tree

Showing 4 changed files with 82 additions and 21 deletions.
diff --git a/ui/src/pages/index.tsx b/ui/src/pages/index.tsx
@@ -6,20 +6,20 @@ import { GetServerSideProps } from "next";
 import TabContent from "@/components/home/TabContent";
 import SearchBar from "@/components/shared/SearchBar";
 import { Journal, Country, Facets, Response, Params } from "@/types";
-import { authToken, getApiUrl, getSearchUrl } from "@/utils/utils";
+import { authToken, filterCountries, mapCountryNames, getApiUrl, getSearchUrl } from "@/utils/utils";
 
 interface HomePageProps {
   count: number;
   facets: Facets;
   query: Params;
 }
 
-const HomePage: React.FC<HomePageProps> = ({ count, facets, query }) => {
+const HomePage: React.FC<HomePageProps> = ({ count, facets }) => {
   const journals: Journal[] = facets
     ? facets?._filter_journal?.journal?.buckets
     : [];
   const partners: Country[] = facets
-    ? facets?._filter_country?.country?.buckets
+    ? mapCountryNames(filterCountries(facets?._filter_country?.country?.buckets))
     : [];
 
   const tabItems = [

diff --git a/ui/src/styles/globals.css b/ui/src/styles/globals.css
@@ -264,6 +264,7 @@ a {
     -moz-column-count: 2;
     column-count: 2;
     columns: 2;
+    max-height: 400px;
   }
 }
 
@@ -273,6 +274,7 @@ a {
     -moz-column-count: 1;
     column-count: 1;
     columns: 1;
+    max-height: 800px;
   }
 }
 

diff --git a/ui/src/utils/data.ts b/ui/src/utils/data.ts
@@ -0,0 +1,36 @@
+export const PARTNER_COUNTRIES = [
+  "Australia",
+  "Austria",
+  "Belgium",
+  "Canada",
+  "China",
+  "CERN",
+  "Czechia",
+  "Denmark",
+  "Finland",
+  "France",
+  "Germany",
+  "Greece",
+  "Hong Kong",
+  "Hungary",
+  "Iceland",
+  "Israel",
+  "Italy",
+  "Japan",
+  "JINR",
+  "Korea, Republic of",
+  "Mexico",
+  "Netherlands",
+  "Norway",
+  "Poland",
+  "Portugal",
+  "Slovakia",
+  "South Africa",
+  "Spain",
+  "Sweden",
+  "Switzerland",
+  "Taiwan, Province of China",
+  "Türkiye",
+  "United Kingdom",
+  "United States",
+]
diff --git a/ui/src/utils/utils.tsx b/ui/src/utils/utils.tsx
@@ -1,7 +1,9 @@
 import { ArticleIdentifier, Params, QueryType, queryTypes } from "@/types";
+import { PARTNER_COUNTRIES } from "./data";
 import { Token } from "../../token";
 
-export const BASE_URL =  process.env.NEXT_API_BASE_URL || 'https://backend.dev.scoap3.org';
+export const BASE_URL =
+  process.env.NEXT_API_BASE_URL || "https://backend.dev.scoap3.org";
 const SEARCH_URL = "/api/search/article";
 
 export const authToken = Token
@@ -20,24 +22,22 @@ const defaultQueryValues = {
 const isValue = (value: any): boolean =>
   value !== undefined && value !== null && value !== "";
 
-  const buildSearchParams = (q: Params): string => {
-    const query = { ...defaultQueryValues, ...q };
+const buildSearchParams = (q: Params): string => {
+  const query = { ...defaultQueryValues, ...q };
 
-    const values = Object.entries(query)
-      .flatMap(([key, value]) => {
-        if (queryTypes.includes(key as QueryType)) {
-          if (Array.isArray(value)) {
-            return value.filter(isValue).map((v) => `${key}=${v}`);
-          } else if (isValue(value)) {
-            return [`${key}=${value}`];
-          }
-        }
-        return [];
-      });
-
-    return values.join("&");
-  };
+  const values = Object.entries(query).flatMap(([key, value]) => {
+    if (queryTypes.includes(key as QueryType)) {
+      if (Array.isArray(value)) {
+        return value.filter(isValue).map((v) => `${key}=${v}`);
+      } else if (isValue(value)) {
+        return [`${key}=${value}`];
+      }
+    }
+    return [];
+  });
 
+  return values.join("&");
+};
 
 const getSearchUrl = (query: Params, local?: boolean) => {
   const searchParams = buildSearchParams(query);
@@ -65,4 +65,27 @@ const resolveIdentifierLink = (identifier: ArticleIdentifier) => {
   }
 };
 
-export { getSearchUrl, getApiUrl, resolveIdentifierLink };
+function filterCountries(
+  countryObjects: { key: string; doc_count: number }[]
+): { key: string; doc_count: number }[] {
+  return countryObjects.filter(obj => PARTNER_COUNTRIES.includes(obj.key));
+}
+
+function mapCountryNames(
+  countryObjects: { key: string; doc_count: number }[]
+): { key: string; doc_count: number }[] {
+  const correctCountries = countryObjects.map(country => {
+    if (country.key === 'Taiwan, Province of China') {
+      country.key = 'Taiwan';
+    }
+    if (country.key === 'Korea, Republic of') {
+      country.key = 'South Korea';
+    }
+    return country;
+  });
+
+  correctCountries.sort((a, b) => a.key.localeCompare(b.key))
+  return correctCountries;
+}
+
+export { getSearchUrl, getApiUrl, resolveIdentifierLink, filterCountries, mapCountryNames };