Merge pull request #806 from navikt/fix-js-bundle-size

Reduce JS bundle size

index.d.ts

@@ -0,0 +1 @@
+declare module "@navikt/arbeidsplassen-react";

next.config.js

@@ -1,7 +1,12 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {
+const withBundleAnalyzer = require("@next/bundle-analyzer")({
+    enabled: process.env.ANALYZE === "true",
+});
+
+const nextConfig = withBundleAnalyzer({
     basePath: "/stillinger",
     cacheHandler: process.env.NODE_ENV === "production" ? require.resolve("./cache-handler.mjs") : undefined,
+    transpilePackages: ["@navikt/arbeidsplassen-react"],
     experimental: {
         optimizePackageImports: ["@navikt/ds-react", "@navikt/aksel-icons"],
         instrumentationHook: true,
@@ -14,7 +19,7 @@ const nextConfig = {
     env: {
         STILLINGSREGISTRERING_PATH: "/stillingsregistrering",
     },
-};
+});
 
 const { PHASE_DEVELOPMENT_SERVER } = require("next/constants");
 const { withSentryConfig } = require("@sentry/nextjs");

package.json

@@ -2,7 +2,6 @@
     "name": "pam-stillingsok-frontend",
     "version": "0.211.0",
     "description": "",
-    "main": "index.js",
     "scripts": {
         "next": "npm run dev",
         "build": "next build",
@@ -24,7 +23,7 @@
         "@axe-core/react": "^4.9.1",
         "@navikt/aksel-icons": "^6.16.3",
         "@navikt/arbeidsplassen-css": "^8.2.17",
-        "@navikt/arbeidsplassen-react": "^8.2.17",
+        "@navikt/arbeidsplassen-react": "^8.3.1",
         "@navikt/arbeidsplassen-theme": "^6.0.7",
         "@navikt/ds-css": "^6.16.3",
         "@navikt/ds-react": "^6.16.3",
@@ -47,10 +46,13 @@
         "winston": "^3.13.0"
     },
     "devDependencies": {
+        "@next/bundle-analyzer": "^14.2.13",
         "@next/eslint-plugin-next": "^14.2.1",
         "@testing-library/jest-dom": "^6.4.2",
         "@testing-library/react": "^14.2.2",
         "@types/node": "20.12.12",
+        "@types/react": "^18.2.0",
+        "@types/react-dom": "^18.2.0",
         "@types/testing-library__jest-dom": "^6.0.0",
         "@types/testing-library__react": "^10.2.0",
         "@typescript-eslint/eslint-plugin": "^7.14.1",
@@ -75,6 +77,7 @@
         "prettier": "^3.2.5",
         "stylelint": "^16.5.0",
         "stylelint-config-recommended": "^14.0.0",
+        "typescript": "^4.9.5",
         "vitest": "^1.6.0"
     },
     "lint-staged": {

src/app/(sok)/_components/SearchQueryProvider.tsx

@@ -62,6 +62,7 @@ export function SearchQueryProvider({ children }: SearchQueryProviderProps): Rea
     }
 
     function has(key: string, value?: string): boolean {
+        // @ts-expect-error https://github.com/microsoft/TypeScript/issues/55569 /
         return urlSearchParams.has(key, value);
     }
 
@@ -90,6 +91,7 @@ export function SearchQueryProvider({ children }: SearchQueryProviderProps): Rea
     function remove(key: string, value?: string): void {
         setUrlSearchParams((previous) => {
             const newUrlSearchParams = new URLSearchParams(previous);
+            // @ts-expect-error https://github.com/microsoft/TypeScript/issues/55569
             newUrlSearchParams.delete(key, value);
             return setDefaultValues(newUrlSearchParams, key);
         });