Cra vite migration

.babelrc

@@ -3,4 +3,4 @@
     "plugins": [
         "@babel/plugin-proposal-class-properties"
     ]
-}
+}

.dockerignore

@@ -0,0 +1,19 @@
+.git
+.github
+node_modules
+dist
+coverage
+
+# Local environment and secrets
+.env
+*.env
+.npmrc
+.yarnrc.yml
+
+# Local tooling noise
+.vscode
+.idea
+.DS_Store
+
+# Not required for image build
+docs

.gitignore

@@ -89,4 +89,9 @@ package-lock\.json
 
 # Yarn files
 .yarnrc.yml
-.yarn/
+.yarn/
+
+dist/
+
+nginx.crt
+nginx.key

.nvmrc

@@ -1 +1 @@
-v12.13.1
+24

Dockerfile

@@ -0,0 +1,28 @@
+# syntax=docker/dockerfile:1.7
+
+FROM node:24-alpine AS build
+WORKDIR /app
+
+RUN apk add --no-cache git
+RUN corepack enable && corepack prepare yarn@1.22.22 --activate
+COPY package.json yarn.lock ./
+
+# Provide private registry auth at build time
+RUN --mount=type=secret,id=npmrc,target=/root/.npmrc yarn install --frozen-lockfile
+
+COPY . .
+
+RUN yarn build
+
+FROM nginxinc/nginx-unprivileged:1.29.5-alpine AS runtime
+USER root
+RUN apk add --no-cache gettext
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+COPY docker-entrypoint.sh /docker-entrypoint.sh
+COPY --from=build /app/dist /usr/share/nginx/html
+RUN chmod +x /docker-entrypoint.sh
+
+USER 150
+
+EXPOSE 80
+CMD ["/docker-entrypoint.sh"]

default.env

@@ -1,16 +1,21 @@
 HTTPS=true
 
-REACT_APP_ENVIRONMENT=dev
-REACT_APP_ACCESSIBILITY_STATEMENT_URL=https://uustatus.no/nb/erklaringer/publisert/698f231b-2177-4e76-bd93-628b24564dd8
-REACT_APP_GEOID_CLIENT_ID=
-REACT_APP_GEOID_AUTHORITY=
-REACT_APP_GEOID_ISSUER=
-REACT_APP_GEOID_REDIRECT_URI=
-REACT_APP_GEOID_POST_LOGOUT_REDIRECT_URI=
-REACT_APP_GEOID_METADATA_ADDRESS=
-REACT_APP_GEOID_AUTHORIZATION_ENDPOINT=
-REACT_APP_GEOID_USERINFO_ENDPOINT=
-REACT_APP_GEOID_END_SESSION_ENDPOINT=
-REACT_APP_GEOID_JWKS_URI=
-REACT_APP_GEOID_KID=
-REACT_APP_GEOID_N=
+VITE_BUILD_NUMBER=
+VITE_MAJOR_MINOR_VERSION_MASTER=
+VITE_MAJOR_MINOR_VERSION_DEVELOPMENT=
+VITE_ENVIRONMENT=
+VITE_ACCESSIBILITY_STATEMENT_URL=https://uustatus.no/nb/erklaringer/publisert/698f231b-2177-4e76-bd93-628b24564dd8
+VITE_GEOID_CLIENT_ID=
+VITE_GEOID_AUTHORITY=
+VITE_GEOID_ISSUER=
+VITE_GEOID_REDIRECT_URI=
+VITE_GEOID_POST_LOGOUT_REDIRECT_URI=
+VITE_GEOID_METADATA_ADDRESS=
+VITE_GEOID_AUTHORIZATION_ENDPOINT=
+VITE_GEOID_TOKEN_ENDPOINT=
+VITE_GEOID_USERINFO_ENDPOINT=
+VITE_GEOID_END_SESSION_ENDPOINT=
+VITE_GEOID_JWKS_URI=
+VITE_GEOID_KID=
+VITE_GEOID_N=
+VITE_GEOID_BAATAUTHZ_APIURL=

docker-compose.yml

@@ -0,0 +1,60 @@
+# for runnning locally with https, run the following command in the project root to generate self-signed certificates: 
+# openssl req -x509 -nodes -newkey rsa:2048 -keyout nginx.key -out nginx.crt -days 365 -subj "/CN=localhost" -addext "subjectAltName=DNS:localhost,IP:127.0.0.1" && chmod 644 nginx.key
+
+
+services:
+  kartkatalog:
+    build:
+      context: .
+      dockerfile: Dockerfile
+      secrets:
+        - npmrc
+    ports:
+      - "${PORT:-5173}:443"
+    env_file:
+      - .env
+    configs:
+      - source: nginx_local_conf
+        target: /etc/nginx/conf.d/default.conf
+    volumes:
+      - ./nginx.key:/etc/ssl/private/selfsigned.key
+      - ./nginx.crt:/etc/ssl/certs/selfsigned.crt
+
+configs:
+  nginx_local_conf:
+    content: |
+      server {
+          listen 443 ssl;
+          server_name _;
+
+          ssl_certificate /etc/ssl/certs/selfsigned.crt;
+          ssl_certificate_key /etc/ssl/private/selfsigned.key;
+
+        root /usr/share/nginx/html;
+        index index.html;
+
+        location = /config.js {
+          alias /tmp/config.js;
+          add_header Cache-Control "no-store";
+        }
+
+        location = /version.js {
+          alias /tmp/version.js;
+          add_header Cache-Control "no-store";
+        }
+
+        # React Router (browser history) fallback
+        location / {
+          try_files $$uri $$uri/ /index.html;
+        }
+
+        # Cache immutable static assets
+        location /assets/ {
+          expires 1y;
+          add_header Cache-Control "public, immutable";
+        }
+      }
+
+secrets:
+  npmrc:
+    file: .npmrc

docker-entrypoint.sh

@@ -0,0 +1,33 @@
+#!/bin/sh
+set -eu
+
+CONFIG_VARS='${VITE_ENVIRONMENT}
+${VITE_ACCESSIBILITY_STATEMENT_URL}
+${VITE_GEOID_CLIENT_ID}
+${VITE_GEOID_AUTHORITY}
+${VITE_GEOID_ISSUER}
+${VITE_GEOID_REDIRECT_URI}
+${VITE_GEOID_POST_LOGOUT_REDIRECT_URI}
+${VITE_GEOID_METADATA_ADDRESS}
+${VITE_GEOID_AUTHORIZATION_ENDPOINT}
+${VITE_GEOID_TOKEN_ENDPOINT}
+${VITE_GEOID_USERINFO_ENDPOINT}
+${VITE_GEOID_END_SESSION_ENDPOINT}
+${VITE_GEOID_JWKS_URI}
+${VITE_GEOID_KID}
+${VITE_GEOID_N}
+${VITE_GEOID_BAATAUTHZ_APIURL}'
+
+VERSION_VARS='${VITE_BUILD_NUMBER}
+${VITE_MAJOR_MINOR_VERSION_MASTER}
+${VITE_MAJOR_MINOR_VERSION_DEVELOPMENT}'
+
+if [ -f /etc/app-config/config.js ]; then
+    cp /etc/app-config/config.js /tmp/config.js
+else
+    envsubst "$CONFIG_VARS" < /usr/share/nginx/html/config.template.js > /tmp/config.js
+fi
+
+envsubst "$VERSION_VARS" < /usr/share/nginx/html/version.template.js > /tmp/version.js
+
+exec nginx -g 'daemon off;'

index.html

@@ -0,0 +1,117 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8" />
+  <link rel="shortcut icon" href="/favicon.ico" />
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
+  <meta name="theme-color" content="#000000" />
+  <!--
+      manifest.json provides metadata used when your web app is added to the
+      homescreen on Android. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+  <link rel="manifest" href="/manifest.json" />
+  <script src="/config.js"></script>
+  <script src="/version.js"></script>
+  <!--
+      Notice the use of  in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <script type="text/javascript">
+
+     function shouldRedirectDownload() {
+      var redirectDownload = getCookie('_redirectDownload');
+
+      if (redirectDownload === 'true') {
+            setCookie('_redirectDownload', 'false');
+        return true;
+      }
+      return false;
+    }
+
+     function getCookie(cname) {
+      let name = cname + "=";
+      let decodedCookie = decodeURIComponent(document.cookie);
+      let ca = decodedCookie.split(';');
+      for(let i = 0; i <ca.length; i++) {
+        let c = ca[i];
+        while (c.charAt(0) == ' ') {
+          c = c.substring(1);
+        }
+        if (c.indexOf(name) == 0) {
+          return c.substring(name.length, c.length);
+        }
+      }
+      return "";
+    }
+
+    function isLocalhost() {
+        return window.location.hostname === 'localhost' ||
+        // [::1] is the IPv6 localhost address.
+        window.location.hostname === '[::1]' ||
+        // 127.0.0.0/8 are considered localhost for IPv4.
+        window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/)
+    }
+
+    function setCookie(cname, cvalue) {
+      if(isLocalhost())
+        document.cookie = cname + "=" + cvalue;
+      else
+        document.cookie = cname + "=" + cvalue + "; Domain=geonorge.no";
+    }
+
+    if (shouldRedirectDownload()) {
+       window.location.href = '/nedlasting';
+    }
+
+
+    var loggedInOtherApp = getCookie('_loggedIn');
+    setCookie('_loggedInOtherApp', loggedInOtherApp);
+
+    //if (loggedInOtherApp === 'false') {
+    //  console.log("User is not logged in to other app, clearing sessionStorage");
+    //  sessionStorage.clear();
+    //}
+
+     var appConfig = window.__APP_CONFIG__ || {};
+     var runtimeEnvironment = appConfig.VITE_ENVIRONMENT || '';
+     var isProduction = runtimeEnvironment !== 'dev' && runtimeEnvironment !== 'test';
+     console.log("VITE_ENVIRONMENT: " + runtimeEnvironment)
+     if (isProduction) {
+      /* Google Tag Manager */
+      (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+      new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+      j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+      'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+      })(window,document,'script','dataLayer','GTM-MR2X5P');
+
+     }
+    </script>
+  <title>Kartkatalogen</title>
+</head>
+
+
+<body>
+  <!-- Google Tag Manager (noscript) -->
+  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-MR2X5P"
+  height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+  <!-- End Google Tag Manager (noscript) -->
+  <noscript>You need to enable JavaScript to run this app.</noscript>
+  <div id="ie"></div>
+  <script>
+    var isIE11 = !!window.MSInputMethodContext && !!document.documentMode;
+    if (isIE11) {
+      document.getElementById("ie").innerHTML = '<div><div class="banner"><img src="/static/media/geonorge-navbar-logo_dev.43841dc5.svg" /></div><p>Det ser ut som du bruker en eldre versjon av Internet Explorer.</p> <p>For å bruke denne tjenesten på best mulig måte bør du laste ned og installere Chrome, Firefox eller oppgradere til Microsoft Edge.</p><p> <a href="https://www.microsoft.com/nb-no/windows/microsoft-edge">Prøv Microsoft Edge</a></p><p><a href="https://www.google.com/chrome/">Last ned Chrome</a></p><p><a href="https://www.mozilla.org/nb-NO/firefox/">Last ned Firefox</a></p></div>';
+    }
+  </script>
+  <div id="root"></div>
+
+  <script type="module" src="/src/main.jsx"></script>
+</body>
+
+</html>

jest.config.js

@@ -6,9 +6,11 @@ module.exports = {
   setupFilesAfterEnv: ["<rootDir>/src/setupTests.js"],
   moduleDirectories: ['node_modules', 'src'],
   moduleNameMapper: {
-    "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
-    "\\.(css|scss|less)$": "identity-obj-proxy"
-  },
+  "^@/(.*)$": "<rootDir>/src/$1",
+
+  "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
+  "\\.(css|scss|less)$": "identity-obj-proxy"
+},
   testResultsProcessor: "jest-teamcity-reporter",
   coverageReporters: ["lcov", "text", "teamcity"]
 };

nginx.conf

@@ -0,0 +1,28 @@
+server {
+  listen 80;
+  server_name _;
+
+  root /usr/share/nginx/html;
+  index index.html;
+
+  location = /config.js {
+    alias /tmp/config.js;
+    add_header Cache-Control "no-store";
+  }
+
+  location = /version.js {
+    alias /tmp/version.js;
+    add_header Cache-Control "no-store";
+  }
+
+  # React Router (browser history) fallback
+  location / {
+    try_files $uri $uri/ /index.html;
+  }
+
+  # Cache immutable static assets
+  location /assets/ {
+    expires 1y;
+    add_header Cache-Control "public, immutable";
+  }
+}