Merge branch 'main' into dependabot/github_actions/actions/setup-node-4

satellytes · Nov 29, 2023 · 5a83a22 · 5a83a22
2 parents 5511101 + 36dfcf9
commit 5a83a22
Show file tree

Hide file tree

Showing 52 changed files with 3,666 additions and 3,216 deletions.
diff --git a/gatsby/config-options/constants.ts b/gatsby/config-options/constants.ts
@@ -1,10 +1,11 @@
-import { buildGatsbyCloudPreviewUrl } from '../util/build-gatsby-cloud-preview-url';
+import { buildNetlifyPreviewUrl } from '../util/build-netlify-preview-url';
 export const RSS_FEED_URL = '/blog/rss.xml';
 export const DEFAULT_META_IMAGE_URL_PATH = '/sy-share-image.jpg';
-export const GATSBY_SITE_PREFIX = process.env.GATSBY_SITE_PREFIX || '';
-export const BRANCH_PREVIEW_URL = buildGatsbyCloudPreviewUrl({
-  prefix: GATSBY_SITE_PREFIX,
+export const NETLIFY_DOMAIN_NAME = process.env.GATSBY_NETLIFY_DOMAIN_NAME || '';
+export const BRANCH_PREVIEW_URL = buildNetlifyPreviewUrl({
+  domainName: NETLIFY_DOMAIN_NAME,
   branch: process.env.BRANCH,
+  reviewId: process.env.REVIEW_ID,
 });
 
 // either use a branch preview url if any

diff --git a/gatsby/util/build-gatsby-cloud-preview-url.test.ts b/gatsby/util/build-gatsby-cloud-preview-url.test.ts
diff --git a/gatsby/util/build-gatsby-cloud-preview-url.ts b/gatsby/util/build-gatsby-cloud-preview-url.ts
diff --git a/gatsby/util/build-netlify-preview-url.test.ts b/gatsby/util/build-netlify-preview-url.test.ts
@@ -0,0 +1,30 @@
+import { buildNetlifyPreviewUrl } from './build-netlify-preview-url';
+
+describe('build-netlify-preview-url', () => {
+  test('should return a valid url', () => {
+    const url = buildNetlifyPreviewUrl({
+      domainName: 'satellytes',
+      branch: 'feature-branch-1',
+      reviewId: '123',
+    });
+    expect(url).toBe('https://deploy-preview-123--satellytes.netlify.app/');
+  });
+
+  test('should return null for the production branch', () => {
+    const url = buildNetlifyPreviewUrl({
+      domainName: 'satellytescommain',
+      branch: 'main',
+      reviewId: '123',
+    });
+    expect(url).toBe(null);
+  });
+
+  test('should return  null if no domainName is given', () => {
+    const url = buildNetlifyPreviewUrl({
+      domainName: null,
+      branch: 'something',
+      reviewId: '123',
+    });
+    expect(url).toBe(null);
+  });
+});
diff --git a/gatsby/util/build-netlify-preview-url.ts b/gatsby/util/build-netlify-preview-url.ts
@@ -0,0 +1,8 @@
+const PRODUCTION_BRANCH = 'main';
+export const buildNetlifyPreviewUrl = ({ domainName, reviewId, branch }) => {
+  if (!domainName || !reviewId || branch === PRODUCTION_BRANCH) {
+    return null;
+  }
+
+  return `https://deploy-preview-${reviewId}--${domainName}.netlify.app/`;
+};
diff --git a/package.json b/package.json
@@ -29,47 +29,47 @@
   },
   "dependencies": {
     "@contentful/rich-text-html-renderer": "^16.0.5",
-    "@contentful/rich-text-plain-text-renderer": "^16.0.5",
+    "@contentful/rich-text-plain-text-renderer": "^16.0.7",
     "@reach/accordion": "^0.18.0",
     "@reach/listbox": "^0.18.0",
     "@reach/tabs": "^0.18.0",
     "@slack/web-api": "^6.8.1",
     "@svgr/webpack": "^8.0.1",
-    "@types/leaflet": "^1.9.3",
+    "@types/leaflet": "^1.9.8",
     "axios": "^1.4.0",
     "babel-plugin-styled-components": "^2.1.3",
     "canvas": "^2.11.2",
     "date-fns": "^2.30.0",
     "fast-xml-parser": "^4.2.2",
-    "gatsby": "^5.10.0",
+    "gatsby": "^5.12.11",
     "gatsby-background-image": "^1.6.0",
     "gatsby-plugin-canonical-urls": "^5.10.0",
     "gatsby-plugin-catch-links": "^5.10.0",
-    "gatsby-plugin-feed": "^5.10.0",
-    "gatsby-plugin-gatsby-cloud": "^5.10.0",
-    "gatsby-plugin-image": "^3.10.0",
-    "gatsby-plugin-manifest": "^5.10.0",
+    "gatsby-plugin-feed": "^5.12.3",
+    "gatsby-plugin-gatsby-cloud": "^5.12.2",
+    "gatsby-plugin-image": "^3.12.3",
+    "gatsby-plugin-manifest": "^5.12.3",
     "gatsby-plugin-react-helmet": "^6.10.0",
     "gatsby-plugin-react-i18next": "^3.0.1",
     "gatsby-plugin-readingtime": "^3.0.1",
     "gatsby-plugin-robots-txt": "^1.8.0",
-    "gatsby-plugin-sass": "^6.10.0",
-    "gatsby-plugin-sharp": "^5.10.0",
-    "gatsby-plugin-sitemap": "^6.10.0",
+    "gatsby-plugin-sass": "^6.12.3",
+    "gatsby-plugin-sharp": "^5.12.3",
+    "gatsby-plugin-sitemap": "^6.12.3",
     "gatsby-plugin-smoothscroll": "^1.2.0",
     "gatsby-plugin-styled-components": "^6.10.0",
     "gatsby-plugin-svgr": "^3.0.0-beta.0",
     "gatsby-remark-copy-linked-files": "^6.10.0",
     "gatsby-remark-external-links": "^0.0.4",
-    "gatsby-remark-images": "^7.10.0",
+    "gatsby-remark-images": "^7.12.3",
     "gatsby-remark-prismjs": "^7.10.0",
-    "gatsby-source-contentful": "^8.10.0",
-    "gatsby-source-filesystem": "^5.10.0",
+    "gatsby-source-contentful": "^8.12.4",
+    "gatsby-source-filesystem": "^5.12.1",
     "gatsby-transformer-json": "^5.10.0",
-    "gatsby-transformer-remark": "^6.10.0",
-    "gatsby-transformer-sharp": "^5.10.0",
+    "gatsby-transformer-remark": "^6.12.3",
+    "gatsby-transformer-sharp": "^5.12.3",
     "html-entities": "^2.3.2",
-    "i18next": "^22.5.0",
+    "i18next": "^23.7.7",
     "leaflet": "^1.9.4",
     "leaflet-gesture-handling": "^1.2.2",
     "modern-normalize": "^2.0.0",
@@ -80,56 +80,57 @@
     "react-dropzone": "^14.2.3",
     "react-helmet": "^6.1.0",
     "react-hook-form": "^7.44.2",
-    "react-i18next": "^12.3.1",
+    "react-i18next": "^13.5.0",
     "react-leaflet": "^4.2.1",
     "react-medium-image-zoom": "^5.1.6",
-    "react-share": "^4.4.1",
-    "react-spring": "^9.7.1",
-    "react-use": "^17.4.0",
+    "react-share": "^5.0.2",
+    "react-spring": "^9.7.3",
+    "react-use": "^17.4.1",
     "rehype-react": "^7.2.0",
     "sass": "^1.62.1",
     "schema-dts": "^1.1.2",
     "sharp": "^0.32.1",
     "showdown": "^2.1.0",
     "slugify": "^1.6.6",
     "striptags": "^3.2.0",
-    "styled-components": "^5.3.11",
+    "styled-components": "^6.1.1",
+    "stylis": "^4.0.0",
     "unified": "^10.1.1",
     "util": "^0.12.5",
     "webpack": "^5.84.1",
     "what-input": "^5.2.12"
   },
   "devDependencies": {
     "@babel/core": "^7.22.1",
-    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/jest-dom": "^6.1.4",
     "@testing-library/react": "^14.0.0",
-    "@types/jest": "^29.5.1",
-    "@types/node": "^20.2.5",
-    "@types/react": "^18.2.7",
-    "@types/react-dom": "^18.2.4",
-    "@types/react-helmet": "^6.1.6",
-    "@types/react-syntax-highlighter": "^15.5.7",
-    "@types/showdown": "^2.0.1",
-    "@types/styled-components": "^5.1.26",
-    "@typescript-eslint/eslint-plugin": "^5.59.7",
-    "@typescript-eslint/parser": "^5.59.7",
+    "@types/jest": "^29.5.10",
+    "@types/node": "^20.10.0",
+    "@types/react": "^18.2.39",
+    "@types/react-dom": "^18.2.17",
+    "@types/react-helmet": "^6.1.9",
+    "@types/react-syntax-highlighter": "^15.5.10",
+    "@types/showdown": "^2.0.6",
+    "@types/styled-components": "^5.1.32",
+    "@typescript-eslint/eslint-plugin": "^6.13.1",
+    "@typescript-eslint/parser": "^6.13.1",
     "babel-loader": "^9.1.2",
     "eslint": "^8.41.0",
-    "eslint-config-prettier": "^8.8.0",
+    "eslint-config-prettier": "^9.0.0",
     "eslint-loader": "^4.0.2",
-    "eslint-plugin-jest-dom": "^4.0.3",
+    "eslint-plugin-jest-dom": "^5.1.0",
     "eslint-plugin-jsx-a11y": "^6.7.1",
     "eslint-plugin-react": "^7.32.2",
     "husky": "^8.0.3",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.5.0",
     "jest-environment-jsdom": "^29.5.0",
-    "jsdom": "^22.1.0",
-    "lint-staged": "^13.2.2",
-    "prettier": "^2.8.8",
+    "jsdom": "^23.0.0",
+    "lint-staged": "^15.1.0",
+    "prettier": "^3.1.0",
     "serve": "^14.2.0",
     "ts-jest": "^29.1.0",
-    "typescript": "^5.0.4"
+    "typescript": "^5.3.2"
   },
   "lint-staged": {
     "*.{js,jsx,ts,tsx,json,md}": [
@@ -138,6 +139,7 @@
     ]
   },
   "resolutions": {
-    "webpack": "^5"
+    "webpack": "^5",
+    "styled-components": "^6"
   }
 }
diff --git a/src/assets/locales/de/translations.json b/src/assets/locales/de/translations.json
@@ -4,6 +4,7 @@
   "main.blog.button": "Alle Artikel",
   "main.services.button": "Erfahren Sie mehr",
   "career.mandatory-field": "* Pflichtfeld",
+  "career.headline": "Bewirb dich jetzt!",
   "career.first-name": "Vorname",
   "career.last-name": "Nachname",
   "career.email": "E-Mail Adresse",

diff --git a/src/assets/locales/en/translations.json b/src/assets/locales/en/translations.json
@@ -3,6 +3,7 @@
   "main.career.button": "All vacancies",
   "main.blog.button": "All articles",
   "main.services.button": "Learn more",
+  "career.headline": "Apply now!",
   "career.mandatory-field": "* Mandatory field",
   "career.first-name": "First name",
   "career.last-name": "Last name",

diff --git a/src/components/content/header-block/header-block.tsx b/src/components/content/header-block/header-block.tsx
@@ -19,7 +19,7 @@ interface HeaderBlockProps {
 }
 
 interface LargeProps {
-  large?: boolean;
+  $large?: boolean;
 }
 
 const BlockWrapper = styled.div`
@@ -66,14 +66,14 @@ const Metaline = styled.p<LargeProps>`
   ${TextStyles.textS}
   letter-spacing: -0.01em;
   color: rgba(0, 0, 0, 0.5);
-  margin-top: ${({ large }) => (large ? '32px' : '16px')};
+  margin-top: ${({ $large }) => ($large ? '32px' : '16px')};
 `;
 
 const HeaderBlockText = styled.p<LargeProps>`
-  ${({ large }) => (large ? TextStyles.textSR : TextStyles.textS)};
+  ${({ $large }) => ($large ? TextStyles.textSR : TextStyles.textS)};
 
   ${up('md')} {
-    ${({ large }) => (large ? TextStyles.textR : TextStyles.textSR)};
+    ${({ $large }) => ($large ? TextStyles.textR : TextStyles.textSR)};
   }
   margin: 16px 0 0;
   letter-spacing: -0.01em;
@@ -91,9 +91,9 @@ export const HeaderBlock = (props: HeaderBlockProps) => {
         <Topline>{props.topline}</Topline>
         <Headline>{props.headline}</Headline>
         {props.metaline && (
-          <Metaline large={props.large}>{props.metaline}</Metaline>
+          <Metaline $large={props.large}>{props.metaline}</Metaline>
         )}
-        <HeaderBlockText large={props.large}>{props.children}</HeaderBlockText>
+        <HeaderBlockText $large={props.large}>{props.children}</HeaderBlockText>
       </TextWrapper>
       {props.illustration && (
         <IconWrapper>

diff --git a/src/components/content/heroes/aurora/aurora-components.ts b/src/components/content/heroes/aurora/aurora-components.ts
@@ -4,7 +4,7 @@ const BACKGROUND_LAYER_Z = -2;
 const FOREGROUND_LAYER_Z = -1;
 
 interface AuroraBackgroundProps {
-  source: string;
+  $source: string;
   overwriteBackground?: string;
 }
 
@@ -22,7 +22,7 @@ export const AuroraBackground = styled.div<AuroraBackgroundProps>`
   ${(props) =>
     props.overwriteBackground === undefined
       ? css`
-          background-image: url(${props.source});
+          background-image: url(${props.$source});
           background-repeat: no-repeat;
           background-size: cover;
           background-position: center -20vw;

diff --git a/src/components/content/heroes/aurora/aurora.tsx b/src/components/content/heroes/aurora/aurora.tsx
@@ -34,7 +34,7 @@ export const Aurora = ({ type, className }: AuroraProps) => {
   return (
     <AuroraContainer className={className}>
       <AuroraBackground
-        source={getSource(type)}
+        $source={getSource(type)}
         overwriteBackground={weatherBackground}
       />
       <AuroraForeground>