Fix Bugsnag missing API key error, modernize husky, and upgrade to Yarn 4

- Skip Bugsnag initialization when no API key is set (fixes dev crash)
- Update husky config to modern v9+ format (fixes deprecation warning)
- Migrate from Yarn 1 to Yarn 4 with node-modules linker
- Update CI workflows to use --immutable instead of --frozen-lockfile

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: MatissJanis

.github/workflows/deploy.yaml

@@ -21,7 +21,7 @@ jobs:
           REACT_APP_STATIC_API_ENDPOINT: ${{ secrets.REACT_APP_STATIC_API_ENDPOINT }}
           REACT_APP_BROKALYS_API_KEY: ${{ secrets.REACT_APP_BROKALYS_API_KEY }}
         run: |
-          yarn install --frozen-lockfile
+          yarn install --immutable
           yarn build
       - name: Deploy 🚀
         uses: JamesIves/github-pages-deploy-action@releases/v4

.github/workflows/test.yaml

@@ -8,7 +8,7 @@ jobs:
     steps:
       - uses: actions/checkout@v4
       - name: Install
-        run: yarn install --frozen-lockfile
+        run: yarn install --immutable
       - name: Test
         run: yarn test
       - name: Build 🔧

.gitignore

@@ -3,7 +3,13 @@
 # dependencies
 /node_modules
 /.pnp
-.pnp.js
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
 
 # testing
 /coverage

.husky/pre-commit

@@ -1,4 +1 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
-
 yarn lint-staged

.yarn/releases/yarn-4.13.0.cjs

@@ -0,0 +1,2 @@
+nodeLinker: node-modules
+yarnPath: .yarn/releases/yarn-4.13.0.cjs

.yarnrc.yml

@@ -68,7 +68,7 @@
     "preview": "vite preview",
     "test": "vitest run",
     "test:watch": "vitest",
-    "prepare": "husky install"
+    "prepare": "husky"
   },
   "resolutions": {
     "@types/react": "^18.3.28",
@@ -86,5 +86,6 @@
     "cz-emoji": {
       "symbol": true
     }
-  }
+  },
+  "packageManager": "yarn@4.13.0"
 }

package.json

@@ -1,12 +1,17 @@
 import Bugsnag from '@bugsnag/js';
 import BugsnagPluginReact from '@bugsnag/plugin-react';
 
-Bugsnag.start({
-  releaseStage: import.meta.env.MODE,
-  enabledReleaseStages: ['production'],
-  apiKey: import.meta.env.VITE_BUGSNAG_KEY!,
-  plugins: [new BugsnagPluginReact()],
-  collectUserIp: false,
-});
+const apiKey = import.meta.env.VITE_BUGSNAG_KEY;
+
+if (apiKey) {
+  Bugsnag.start({
+    releaseStage: import.meta.env.MODE,
+    enabledReleaseStages: ['production'],
+    apiKey,
+    plugins: [new BugsnagPluginReact()],
+    collectUserIp: false,
+  });
+}
 
 export default Bugsnag;
+export const isBugsnagEnabled = !!apiKey;

src/bugsnag.ts

@@ -9,11 +9,13 @@ import { ReactRouter6Adapter } from 'use-query-params/adapters/react-router-6';
 
 import App from './App';
 import client from './apollo-client';
-import Bugsnag from './bugsnag';
+import Bugsnag, { isBugsnagEnabled } from './bugsnag';
 import { MapContext } from './hooks/use-map-context';
 import './index.css';
 
-const ErrorBoundary = Bugsnag.getPlugin('react')!.createErrorBoundary(React);
+const ErrorBoundary = isBugsnagEnabled
+  ? Bugsnag.getPlugin('react')!.createErrorBoundary(React)
+  : React.Fragment;
 
 const container = document.getElementById('root') as HTMLElement;
 const root = createRoot(container);

src/index.tsx

@@ -2,7 +2,7 @@ import { useMemo } from 'react';
 import { ErrorBoundary } from 'react-error-boundary';
 import { Header, Message, Statistic } from 'semantic-ui-react';
 
-import Bugsnag from 'src/bugsnag';
+import Bugsnag, { isBugsnagEnabled } from 'src/bugsnag';
 import getRegionData from 'src/common/get-region-data';
 import FilterToolbar from 'src/components/FilterToolbar';
 import PropertyPriceChart from 'src/components/PropertyPriceChart';
@@ -43,7 +43,9 @@ export default function Home() {
                 Failed loading the data. Please try again later.
               </Message>
             }
-            onError={(error) => Bugsnag.notify(error as Error)}
+            onError={(error) =>
+              isBugsnagEnabled && Bugsnag.notify(error as Error)
+            }
           >
             <Statistic.Group size="small" className={styles.statistics}>
               <MeanPrice />