Merge branch 'main' into feedback-widget

DTS-STN · Nov 21, 2023 · 19f7063 · 19f7063
2 parents ca5e44c + 214ae69
commit 19f7063
Show file tree

Hide file tree

Showing 21 changed files with 20,374 additions and 160,623 deletions.
diff --git a/.github/workflows/build-and-deploy-storybooks.yml b/.github/workflows/build-and-deploy-storybooks.yml
@@ -8,10 +8,19 @@ on:
 jobs:
   build-and-deploy:
     runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        os: [ubuntu-latest]
+        node-version: [18.x]
     steps:
       - name: Checkout 🛎️
         uses: actions/[email protected] # If you're using actions/checkout@v2 you must set persist-credentials to false in most cases for the deployment to work correctly.
 
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v2
+        with:
+          node-version: ${{ matrix.node-version }}
+
       - name: Install 🔧 # This example project is built using yarn and outputs the result to the 'build' folder. Replace with the commands required to build your project, or remove this step entirely if your site is pre-built.
         run: yarn install
 

diff --git a/.github/workflows/test-and-lint.yml b/.github/workflows/test-and-lint.yml
@@ -8,10 +8,19 @@ on:
 jobs:
   test:
     runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        os: [ubuntu-latest]
+        node-version: [18.x]
     steps:
       - name: Checkout 🔔
         uses: actions/[email protected]
 
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v2
+        with:
+          node-version: ${{ matrix.node-version }}
+
       - name: Install 🔧
         run: yarn install
 

diff --git a/.gitignore b/.gitignore
@@ -85,3 +85,12 @@ terraform.rc
 .idea
 
 graphql/.cache/
+
+# Ignore yarn related files
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
diff --git a/.storybook/main.js b/.storybook/main.js
@@ -10,15 +10,7 @@ module.exports = {
     "@storybook/addon-links",
     "@storybook/addon-essentials",
     "@storybook/addon-a11y",
-    {
-      name: "@storybook/addon-postcss",
-      options: {
-        postcssLoaderOptions: {
-          implementation: require("postcss"),
-        },
-      },
-    },
-    "@storybook/addon-mdx-gfm",
+    "@storybook/addon-styling",
   ],
   webpackFinal: (config) => {
     // useTranslation() hook in next-i18next is looking for a server environment and storybooks

diff --git a/.storybook/preview.js b/.storybook/preview.js
@@ -1,12 +1,11 @@
-import * as nextImage from "next/image";
 import "../styles/globals.css";
 import "../styles/forms.css";
 import "../styles/menu.css";
 import "./fonts.css";
 
 import i18n from "./i18n.js";
 import { I18nProviderWrapper } from "./i18nextProviderWrapper";
-import { RouterContext } from "next/dist/shared/lib/router-context";
+import { RouterContext } from "next/dist/shared/lib/router-context.shared-runtime";
 
 export const globalTypes = {
   locale: {
@@ -23,127 +22,6 @@ export const globalTypes = {
   },
 };
 
-// override next js image component to make it work with storybook
-// https://github.com/vercel/next.js/issues/18393#issuecomment-750910068
-Object.defineProperty(nextImage, "default", {
-  configurable: true,
-  value: (props) => {
-    const height = props.height;
-    const width = props.width;
-    const quotient = height / width;
-    const paddingTop = isNaN(quotient) ? "100%" : `${quotient * 100}%`;
-    let wrapperStyle;
-    let sizerStyle;
-    let sizerSvg;
-    let toBase64;
-    let imgStyle = {
-      position: "absolute",
-      top: 0,
-      left: 0,
-      bottom: 0,
-      right: 0,
-      boxSizing: "border-box",
-      padding: 0,
-      border: "none",
-      margin: "auto",
-      display: "block",
-      width: 0,
-      height: 0,
-      minWidth: "100%",
-      maxWidth: "100%",
-      minHeight: "100%",
-      maxHeight: "100%",
-      objectFit: props.objectFit ? props.objectFit : undefined,
-      objectPosition: props.objectPosition ? props.objectPosition : undefined,
-    };
-
-    if (
-      width !== undefined &&
-      height !== undefined &&
-      props.layout !== "fill"
-    ) {
-      if (props.layout === "responsive") {
-        wrapperStyle = {
-          display: "block",
-          overflow: "hidden",
-          position: "relative",
-          boxSizing: "border-box",
-          margin: 0,
-        };
-        sizerStyle = {
-          display: "block",
-          boxSizing: "border-box",
-          paddingTop,
-        };
-      } else if (props.layout === "intrinsic" || props.layout === undefined) {
-        wrapperStyle = {
-          display: "inline-block",
-          maxWidth: "100%",
-          overflow: "hidden",
-          position: "relative",
-          boxSizing: "border-box",
-          margin: 0,
-        };
-        sizerStyle = {
-          boxSizing: "border-box",
-          display: "block",
-          maxWidth: "100%",
-        };
-        sizerSvg = `<svg width="${width}" height="${height}" xmlns="http://www.w3.org/2000/svg" version="1.1"/>`;
-        toBase64 = Buffer.from(sizerSvg).toString("base64");
-      } else if (props.layout === "fixed") {
-        wrapperStyle = {
-          overflow: "hidden",
-          boxSizing: "border-box",
-          display: "inline-block",
-          position: "relative",
-          width,
-          height,
-        };
-      }
-    } else if (
-      width === undefined &&
-      height === undefined &&
-      props.layout === "fill"
-    ) {
-      wrapperStyle = {
-        display: "block",
-        overflow: "hidden",
-        position: "absolute",
-        top: 0,
-        left: 0,
-        bottom: 0,
-        right: 0,
-        boxSizing: "border-box",
-        margin: 0,
-      };
-    } else {
-      throw new Error(
-        `Image with src "${props.src}" must use "width" and "height" properties or "layout='fill'" property.`
-      );
-    }
-
-    return (
-      <div style={wrapperStyle}>
-        {sizerStyle ? (
-          <div style={sizerStyle}>
-            {sizerSvg ? (
-              <img
-                style={{ maxWidth: "100%", display: "block" }}
-                alt={props.alt}
-                aria-hidden={true}
-                role="presentation"
-                src={`data:image/svg+xml;base64,${toBase64}`}
-              />
-            ) : null}
-          </div>
-        ) : null}
-        <img {...props} decoding="async" style={imgStyle} />
-      </div>
-    );
-  },
-});
-
 export const parameters = {
   actions: { argTypesRegex: "^on[A-Z].*" },
   nextRouter: {