Merge branch 'development' into Theme-test-branch

pwa/gatsby-config.js

@@ -3,10 +3,14 @@ require("dotenv").config({
 });
 
 module.exports = {
+  /**
+   * We do NOT want to set the pathPrefix when we're using a DNS; it's only needed on gh-pages
+   * We CAN NOT set the pathPrefix when we're using the JSON-config files (due to needing access to window)
+   */
   pathPrefix:
     process.env.USE_GITHUB_REPOSITORY_NAME_AS_PATH_PREFIX === "true"
       ? `/${process.env.GITHUB_REPOSITORY_NAME}`
-      : "", // we do NOT want to set the prefix if we're using an DNS
+      : "",
   plugins: [
     {
       resolve: `gatsby-plugin-layout`,

pwa/src/apiService/apiService.ts

@@ -7,7 +7,7 @@ import { DEFAULT_FOOTER_CONTENT_URL } from "../templates/templateParts/footer/Fo
 import OpenWoo from "./resources/openWoo";
 import FooterContent from "./resources/footerContent";
 import Markdown from "./resources/markdown";
-import FilterCount from "./resources/filterCount";
+import AvailableFilters from "./resources/availableFilters";
 
 interface PromiseMessage {
   loading?: string;
@@ -25,17 +25,17 @@ export type TSendFunction = (
 export default class APIService {
   public get BaseClient(): AxiosInstance {
     return axios.create({
-      baseURL: process.env.GATSBY_API_BASE_URL,
+      baseURL: window.sessionStorage.getItem("API_BASE_URL") ?? "",
       headers: {
         Accept: "application/json",
         "Content-Type": "application/json",
       },
     });
   }
 
-  public get FilterCountClient(): AxiosInstance {
+  public get AvailableFiltersClient(): AxiosInstance {
     return axios.create({
-      baseURL: process.env.GATSBY_API_BASE_URL,
+      baseURL: window.sessionStorage.getItem("API_BASE_URL") ?? "",
       headers: {
         Accept: "application/json+aggregations",
         "Content-Type": "application/json",
@@ -45,17 +45,13 @@ export default class APIService {
 
   public get FooterContentClient(): AxiosInstance {
     return axios.create({
-      baseURL: removeFileNameFromUrl(
-        process.env.GATSBY_FOOTER_CONTENT !== undefined && process.env.GATSBY_FOOTER_CONTENT.length !== 0
-          ? process.env.GATSBY_FOOTER_CONTENT
-          : DEFAULT_FOOTER_CONTENT_URL,
-      ),
+      baseURL: removeFileNameFromUrl(window.sessionStorage.getItem("FOOTER_CONTENT") ?? DEFAULT_FOOTER_CONTENT_URL),
     });
   }
 
   public get MarkdownClient(): AxiosInstance {
     return axios.create({
-      baseURL: process.env.GATSBY_BASE_URL ?? undefined,
+      baseURL: window.sessionStorage.getItem("BASE_URL") ?? undefined,
       headers: {
         Accept: "application/vnd.github.html",
       },
@@ -66,8 +62,8 @@ export default class APIService {
     return new OpenWoo(this.BaseClient, this.Send);
   }
 
-  public get FilterCount(): FilterCount {
-    return new FilterCount(this.FilterCountClient, this.Send);
+  public get AvailableFilters(): AvailableFilters {
+    return new AvailableFilters(this.AvailableFiltersClient, this.Send);
   }
 
   public get FooterContent(): FooterContent {

pwa/src/apiService/resources/filterCount.ts → pwa/src/apiService/resources/availableFilters.ts

@@ -1,7 +1,7 @@
 import { TSendFunction } from "../apiService";
 import { AxiosInstance } from "axios";
 
-export default class FilterCount {
+export default class AvailableFilters {
   private _instance: AxiosInstance;
   private _send: TSendFunction;
 
@@ -10,11 +10,11 @@ export default class FilterCount {
     this._send = send;
   }
 
-  public getCategoryCount = async (): Promise<any> => {
+  public getCategories = async (): Promise<any> => {
     let endpoint = "/openWOO?_queries[]=Categorie";
 
-    if (process.env.GATSBY_OIDN_NUMBER) {
-      endpoint += `&oidn=${process.env.GATSBY_OIDN_NUMBER}`;
+    if (window.sessionStorage.getItem("OIDN_NUMBER")) {
+      endpoint += `&oidn=${window.sessionStorage.getItem("OIDN_NUMBER")}`;
     }
 
     const { data } = await this._send(this._instance, "GET", endpoint);

pwa/src/apiService/resources/openWoo.ts

@@ -19,8 +19,8 @@ export default class OpenWoo {
       filters,
     )}&_order[Publicatiedatum]=desc&_limit=${limit}&_page=${currentPage}`;
 
-    if (process.env.GATSBY_OIDN_NUMBER) {
-      endpoint += `&oidn=${process.env.GATSBY_OIDN_NUMBER}`;
+    if (window.sessionStorage.getItem("OIDN_NUMBER")) {
+      endpoint += `&oidn=${window.sessionStorage.getItem("OIDN_NUMBER")}`;
     }
 
     const { data } = await this._send(this._instance, "GET", endpoint);

pwa/src/hooks/filterCount.ts → pwa/src/hooks/availableFilters.ts

@@ -3,15 +3,15 @@ import { useQuery } from "react-query";
 import APIService from "../apiService/apiService";
 import APIContext from "../apiService/apiContext";
 
-export const useFilterCount = () => {
+export const useAvailableFilters = () => {
   const API: APIService | null = React.useContext(APIContext);
 
-  const getCategoryCount = () =>
-    useQuery<any, Error>(["CategoryCount"], () => API?.FilterCount.getCategoryCount(), {
+  const getCategories = () =>
+    useQuery<any, Error>(["available_catagories"], () => API?.AvailableFilters.getCategories(), {
       onError: (error) => {
         console.warn(error.message);
       },
     });
 
-  return { getCategoryCount };
+  return { getCategories };
 };

pwa/src/hooks/footerContent.ts

@@ -8,11 +8,7 @@ import { DEFAULT_FOOTER_CONTENT_URL } from "../templates/templateParts/footer/Fo
 export const useFooterContent = () => {
   const API: APIService | null = React.useContext(APIContext);
 
-  const fileName = getFileNameFromUrl(
-    process.env.GATSBY_FOOTER_CONTENT !== undefined && process.env.GATSBY_FOOTER_CONTENT.length !== 0
-      ? process.env.GATSBY_FOOTER_CONTENT
-      : DEFAULT_FOOTER_CONTENT_URL,
-  );
+  const fileName = getFileNameFromUrl(window.sessionStorage.getItem("FOOTER_CONTENT") ?? DEFAULT_FOOTER_CONTENT_URL);
 
   const getContent = () =>
     useQuery<any, Error>(["contents", fileName], () => API?.FooterContent.getContent(fileName), {

pwa/src/hooks/htmlParser/anchor/getAnchor.tsx

@@ -89,7 +89,7 @@ const handleInternalLinks = (props: any, targetFile: string, location: string, d
     if (!directoryFound) {
       const hrefWithLeadingSlash = !props.href.startsWith("/") ? `/${props.href}` : props.href;
 
-      open(`${process.env.GATSBY_GITHUB_REPOSITORY_URL}/blob/master${hrefWithLeadingSlash}`);
+      open(`${window.sessionStorage.getItem("GITHUB_REPOSITORY_URL") ?? ""}/blob/master${hrefWithLeadingSlash}`);
     }
 
     return; // ensure no other flow is triggered

pwa/src/hooks/htmlParser/image/getImage.tsx

@@ -4,7 +4,7 @@ export const getImage = (props: any) => {
   let src = props.src;
 
   if (!props.src.includes("https://" || "http://")) {
-    const sessionUrl = process.env.GATSBY_GITHUB_REPOSITORY_URL;
+    const sessionUrl = window.sessionStorage.getItem("GITHUB_REPOSITORY_URL");
     const url = sessionUrl?.replace("https://github.com/", "");
 
     src = `https://raw.githubusercontent.com/${url}/master/docs/features/${props.src}`;

pwa/src/hooks/useMarkdownDirectories.ts

@@ -9,7 +9,7 @@ export const useMarkdownDirectories = () => {
   const [directories, setDirectories] = React.useState<TMarkdownDirectory[]>([]);
 
   React.useEffect(() => {
-    const markdownDirectoryPathsString: string | undefined = process.env.GATSBY_GITHUB_DOCS_DIRECTORY_PATHS;
+    const markdownDirectoryPathsString: string | null = window.sessionStorage.getItem("GITHUB_DOCS_DIRECTORY_PATHS");
 
     if (!markdownDirectoryPathsString) return;
 

pwa/src/layout/Head.tsx

@@ -26,13 +26,13 @@ export const Head: React.FC = () => {
         lang: currentLanguage,
       }}
       bodyAttributes={{
-        class: process.env.GATSBY_NL_DESIGN_THEME_CLASSNAME,
+        class: window.sessionStorage.getItem("NL_DESIGN_THEME_CLASSNAME"),
       }}
     >
-      <title>{`Woo | ${process.env.GATSBY_ORGANISATION_NAME} | ${
+      <title>{`Woo | ${window.sessionStorage.getItem("ORGANISATION_NAME")} | ${
         getPageTitle(translatedCrumbs, gatsbyContext.location) ?? "Error"
       }`}</title>
-      <link rel="icon" type="svg" href={process.env.GATSBY_FAVICON_URL} />
+      <link rel="icon" type="svg" href={window.sessionStorage.getItem("FAVICON_URL") ?? ""} />
     </Helmet>
   );
 };

pwa/src/layout/Layout.tsx

@@ -12,6 +12,7 @@ import { fas } from "@fortawesome/free-solid-svg-icons";
 import { fab } from "@fortawesome/free-brands-svg-icons";
 import { far } from "@fortawesome/free-regular-svg-icons";
 import { IconPack, library } from "@fortawesome/fontawesome-svg-core";
+import { initiateEnvironment } from "../services/initiateEnvironment";
 import { ToolTip } from "@conduction/components";
 
 export const TOOLTIP_ID = "cb8f47c3-7151-4a46-954d-784a531b01e6";
@@ -28,6 +29,10 @@ const Layout: React.FC<LayoutProps> = ({ children, pageContext, location }) => {
 
   library.add(fas, fab as IconPack, far as IconPack);
 
+  React.useEffect(() => {
+    initiateEnvironment();
+  }, []);
+
   React.useEffect(() => {
     setAPI(new APIService());
   }, [pageContext]);