💚 build: attempt to fix the CI build

.github/workflows/ci.yml

@@ -37,7 +37,7 @@ jobs:
           npm run lint
           CI=false npm run build
         env: 
-          API_URL: "http://localhost:8000"
+          MYKN_API_URL: "http://localhost:8000"
 
       - uses: actions/upload-artifact@v4
         with:
@@ -104,7 +104,7 @@ jobs:
           CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}
 
   frontend-tests:
-    name: Run storybook tests
+    name: Run the Vitest test suite
     needs: frontend-build
     runs-on: ubuntu-latest
 
@@ -124,28 +124,10 @@ jobs:
       - name: Install Playwright
         run: npx playwright install --with-deps
 
-      - name: Build Storybook
-        run: npm run build-storybook
-
-      - name: Run vitest tests
+      - name: Run tests
         run: npm run test:coverage
 
-      - name: Serve Storybook and run tests
-        run: |
-          npx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \
-            "npx http-server storybook-static --port 6006" \
-            "npx wait-on tcp:127.0.0.1:6006 && npm run test-storybook"
-
-      - name: Publish coverage report (storybook)
-        uses: codecov/codecov-action@v3.1.4
-        with:
-          working-directory: frontend/coverage
-          files: ./storybook/coverage-storybook.json
-          flags: storybook
-        env:
-          CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}
-
-      - name: Publish coverage report (jest)
+      - name: Publish coverage report
         uses: codecov/codecov-action@v3.1.4
         with:
           working-directory: frontend/coverage
@@ -180,7 +162,7 @@ jobs:
   docker_build:
     name: Build docker image
 
-    uses: ./.github/workflows/build-image.yaml
+    uses: ./.github/workflows/build-image.yml
     with:
       image_name: maykinmedia/open-beheer
       image_tag_suffix: ""

frontend/bin/create_page.sh

@@ -104,7 +104,7 @@ import {
 } from "storybook-addon-remix-react-router";
 
 import { ${component_name} as ${component_name}Component } from "./$capitalized_page_name";
-import { ${capitalized_page_name}LoaderData } from "./${page_name}.loader.tsx";
+import { ${page_name}Loader } from "./${page_name}.loader";
 
 const meta: Meta<typeof ${component_name}Component> = {
   title: "Pages/${capitalized_page_name}",
@@ -119,7 +119,7 @@ export const ${component_name}: Story = {
   parameters: {
     reactRouter: reactRouterParameters({
       routing: {
-        loader: () => ({}) as ${capitalized_page_name}LoaderData,
+        loader: ${page_name}Loader,
       },
     }),
   },

frontend/package.json

@@ -13,16 +13,15 @@
     "prepare": "cd .. && husky frontend/.husky",
     "test": "vitest",
     "test:coverage": "vitest --coverage --watch=false",
-    "test-storybook": "test-storybook",
-    "test-storybook:coverage": "test-storybook --coverage",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build"
   },
   "dependencies": {
+    "@maykin-ui/admin-ui": "^0.0.53",
+    "@maykin-ui/client-common": "^0.0.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "react-router": "^7.5.0",
-    "@maykin-ui/admin-ui": "^0.0.53"
+    "react-router": "^7.5.0"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^3.2.6",

frontend/src/pages/home/Home.stories.tsx

@@ -5,7 +5,7 @@ import {
 } from "storybook-addon-remix-react-router";
 
 import { HomePage as HomePageComponent } from "./Home";
-import { HomeLoaderData } from "./home.loader.tsx";
+import { homeLoader } from "./home.loader.tsx";
 
 const meta: Meta<typeof HomePageComponent> = {
   title: "Pages/Home",
@@ -20,7 +20,7 @@ export const HomePage: Story = {
   parameters: {
     reactRouter: reactRouterParameters({
       routing: {
-        loader: () => ({}) as HomeLoaderData,
+        loader: homeLoader,
       },
     }),
   },

frontend/src/pages/login/Login.stories.tsx

@@ -5,7 +5,7 @@ import {
 } from "storybook-addon-remix-react-router";
 
 import { LoginPage as LoginPageComponent } from "./Login";
-import { LoginLoaderData } from "./login.loader.tsx";
+import { loginLoader } from "./login.loader.tsx";
 
 const meta: Meta<typeof LoginPageComponent> = {
   title: "Pages/Login",
@@ -20,7 +20,7 @@ export const LoginPage: Story = {
   parameters: {
     reactRouter: reactRouterParameters({
       routing: {
-        loader: () => ({}) as LoginLoaderData,
+        loader: loginLoader,
       },
     }),
   },

frontend/vitest.config.ts

@@ -1,6 +1,9 @@
 import { defineConfig } from "vitest/config";
 
+import config from "./vite.config";
+
 export default defineConfig({
+  ...config,
   test: {
     globals: true,
     environment: "jsdom",

frontend/vitest.workspace.ts

@@ -10,7 +10,7 @@ const dirname =
 
 // More info at: https://storybook.js.org/docs/writing-tests/test-addon
 export default defineWorkspace([
-  "*.stories.tsx",
+  "vitest.config.ts",
   {
     extends: "vite.config.ts",
     plugins: [