chore(deps): bump @ircsignpost/signpost-base from 16.8.0 to 16.10.0 (#55

)

Bumps [@ircsignpost/signpost-base](https://github.com/unitedforukraine/signpost-base) from 16.8.0 to 16.10.0.
- [Commits](https://github.com/unitedforukraine/signpost-base/commits)

---
updated-dependencies:
- dependency-name: "@ircsignpost/signpost-base"
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

context/BreadcrumbsContext.tsx

@@ -0,0 +1,37 @@
+import { ReactNode, createContext, useContext, useState } from 'react';
+
+interface BreadcrumbsContextProps {
+  breadcrumbs: { url: string; title: string };
+  setBreadcrumbs: React.Dispatch<
+    React.SetStateAction<{ url: string; title: string }>
+  >;
+}
+
+const BreadcrumbsContext = createContext<BreadcrumbsContextProps | undefined>(
+  undefined
+);
+
+export const BreadcrumbsProvider: React.FC<{ children: ReactNode }> = ({
+  children,
+}) => {
+  const [breadcrumbs, setBreadcrumbs] = useState<{
+    url: string;
+    title: string;
+  }>({ url: '', title: '' });
+
+  return (
+    <BreadcrumbsContext.Provider value={{ breadcrumbs, setBreadcrumbs }}>
+      {children}
+    </BreadcrumbsContext.Provider>
+  );
+};
+
+export const useBreadcrumbs = () => {
+  const context = useContext(BreadcrumbsContext);
+
+  if (!context) {
+    throw new Error('useBreadcrumbs must be used within a BreadcrumbsProvider');
+  }
+
+  return context;
+};

lib/translations.tsx

@@ -277,6 +277,7 @@ export function populateArticleContentStrings(dynamicContent: {
   return {
     textReaderTitle: dynamicContent['default_article_reader_title'],
     shareButtonStrings: getShareButtonStrings(dynamicContent),
+    homeBreadcrumbString: 'Home',
   };
 }
 
@@ -329,6 +330,7 @@ export function populateCategoryStrings(dynamicContent: {
     searchBarStrings: populateSearchBarStrings(dynamicContent),
     selectSubTopicLabel: dynamicContent['default_select_subtopic'],
     footerStrings: populateFooterStrings(dynamicContent),
+    homeBreadcrumbString: 'Home',
   };
 }
 
@@ -340,6 +342,7 @@ export function populateSectionStrings(dynamicContent: {
     selectTopicLabel: getSelectTopicLabel(dynamicContent),
     searchBarStrings: populateSearchBarStrings(dynamicContent),
     footerStrings: populateFooterStrings(dynamicContent),
+    homeBreadcrumbString: 'Home',
   };
 }
 

package.json

@@ -20,7 +20,7 @@
     "@algolia/client-search": "^4.14.2",
     "@changey/react-leaflet-markercluster": "^4.0.0-rc1",
     "@directus/sdk": "^10.3.3",
-    "@ircsignpost/signpost-base": "16.8.0",
+    "@ircsignpost/signpost-base": "16.15.0",
     "@next/env": "^12.2.4",
     "@react-spring/web": "^9.5.4",
     "@vercel/og": "^0.5.10",

pages/_app.tsx

@@ -27,13 +27,14 @@ import Analytics from '@ircsignpost/signpost-base/dist/src/analytics';
 import { GOOGLE_ANALYTICS_IDS } from '../lib/constants';
 
 import type { AppProps } from 'next/app';
+import { BreadcrumbsProvider } from '../context/BreadcrumbsContext';
 
 function MyApp({ Component, pageProps }: AppProps) {
   return (
-    <>
+    <BreadcrumbsProvider>
       <Analytics googleAnalyticsIds={GOOGLE_ANALYTICS_IDS}/>
       <Component {...pageProps} />
-    </>
+    </BreadcrumbsProvider>
   );
 }
 

pages/articles/[article].tsx

@@ -26,6 +26,7 @@ import getConfig from 'next/config';
 import { useRouter } from 'next/router';
 import React from 'react';
 
+import { useBreadcrumbs } from '../../context/BreadcrumbsContext';
 import {
   CATEGORIES_TO_HIDE,
   CATEGORY_ICON_NAMES,
@@ -89,6 +90,7 @@ export default function Article({
 }: ArticleProps) {
   const router = useRouter();
   const { publicRuntimeConfig } = getConfig();
+  const { breadcrumbs } = useBreadcrumbs();
 
   return (
     <ArticlePage
@@ -142,6 +144,7 @@ export default function Article({
             locale: locale,
           },
           strings: strings.articleContentStrings,
+          previosURL: breadcrumbs,
         }}
       />
     </ArticlePage>

pages/categories/[category].tsx

@@ -13,8 +13,10 @@ import {
 } from '@ircsignpost/signpost-base/dist/src/zendesk';
 import { GetStaticProps } from 'next';
 import getConfig from 'next/config';
+import { useRouter } from 'next/router';
 import { useEffect, useState } from 'react';
 
+import { useBreadcrumbs } from '../../context/BreadcrumbsContext';
 import {
   CATEGORIES_TO_HIDE,
   CATEGORY_ICON_NAMES,
@@ -69,8 +71,9 @@ export default function Category({
   footerLinks,
 }: CategoryProps) {
   const [sectionDisplayed, setSectionDisplayed] = useState<Section[]>(sections);
-
   const { publicRuntimeConfig } = getConfig();
+  const router = useRouter();
+  const { setBreadcrumbs } = useBreadcrumbs();
 
   const handleSectionFilterChange = async (val: number) => {
     const SECTION = await getCategorySection(
@@ -87,6 +90,15 @@ export default function Category({
     setSectionDisplayed(sections);
   }, [sections]);
 
+  useEffect(() => {
+    const url = router.asPath;
+    const test = {
+      url,
+      title: categoryItems.filter((x) => x.value === categoryId)[0]?.name,
+    };
+    setBreadcrumbs(test);
+  }, [categoryId, categoryItems, router.asPath, setBreadcrumbs]);
+
   return (
     <CategoryPage
       currentLocale={currentLocale}

pages/index.tsx

@@ -203,11 +203,14 @@ export const getStaticProps: GetStaticProps = async ({ locale }) => {
   const uniqueProvidersIdsArray = Array.from(uniqueProvidersIdsSet);
 
   const serviceTypes = await getDirectusServiceCategories(directus);
-  const providers = await getDirectusProviders(
+  const providersArray = await getDirectusProviders(
     directus,
-    DIRECTUS_COUNTRY_ID,
-    uniqueProvidersIdsArray
+    DIRECTUS_COUNTRY_ID
   );
+
+  const providers = providersArray
+    .filter((x) => uniqueProvidersIdsArray.includes(x.id))
+    .sort((a, b) => a.name?.normalize().localeCompare(b.name?.normalize()));
   const populations = await getDirectusPopulationsServed(
     uniquePopulationsIdsArray,
     directus

pages/sections/[section].tsx

@@ -18,7 +18,10 @@ import {
 } from '@ircsignpost/signpost-base/dist/src/zendesk';
 import { GetStaticProps } from 'next';
 import getConfig from 'next/config';
+import { useRouter } from 'next/router';
+import { useEffect } from 'react';
 
+import { useBreadcrumbs } from '../../context/BreadcrumbsContext';
 import {
   CATEGORIES_TO_HIDE,
   GOOGLE_ANALYTICS_IDS,
@@ -69,6 +72,14 @@ export default function Category({
   footerLinks,
 }: CategoryProps) {
   const { publicRuntimeConfig } = getConfig();
+  const router = useRouter();
+  const { setBreadcrumbs } = useBreadcrumbs();
+
+  useEffect(() => {
+    const url = router.asPath;
+    const test = { url, title: section.name };
+    setBreadcrumbs(test);
+  }, [router.asPath, setBreadcrumbs, section.name]);
 
   return (
     <SectionPage

yarn.lock

@@ -1761,10 +1761,10 @@
   resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45"
   integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==
 
-"@ircsignpost/signpost-base@16.8.0":
-  version "16.8.0"
-  resolved "https://registry.yarnpkg.com/@ircsignpost/signpost-base/-/signpost-base-16.8.0.tgz#690fff93b8db272cf6609ee53520981afc517068"
-  integrity sha512-PPH7MDBbAuSpLrT3JEmcOkYIho6wbfoxgBkWO1yRa2J9IwawYmtv/OOndBJwc+ALTY55NNiYCmPsxwynaSGc2Q==
+"@ircsignpost/signpost-base@16.15.0":
+  version "16.15.0"
+  resolved "https://registry.yarnpkg.com/@ircsignpost/signpost-base/-/signpost-base-16.15.0.tgz#8efc32e2891c1c41c320a25dc0ce581b261caaff"
+  integrity sha512-DjVn72Qqf/HHPE4evXQUytGF50v9Bc40Gn+I4yhO1oh51Q1aoMVK0oXz+9SnzMGXRocHPwsozMrFYA3BPRFmww==
 
 "@jridgewell/gen-mapping@^0.1.0":
   version "0.1.1"