wip setup vite plus

Author: HugoPerard

.dockerignore

@@ -23,7 +23,6 @@
 /.vscode/*
 !/.vscode/extensions.json
 .idea/
-.eslintcache
 .db
 .git
 

.github/actions/setup-playwright/action.yml

@@ -22,11 +22,11 @@ runs:
       shell: bash
       env:
         BROWSERS: ${{ inputs.browsers }}
-      run: pnpm exec playwright install $BROWSERS --with-deps
+      run: vp exec playwright install $BROWSERS --with-deps
 
     - name: Install Playwright system deps
       if: steps.playwright-cache.outputs.cache-hit == 'true'
       shell: bash
       env:
         BROWSERS: ${{ inputs.browsers }}
-      run: pnpm exec playwright install-deps $BROWSERS
+      run: vp exec playwright install-deps $BROWSERS

.github/actions/setup-pnpm/action.yml

@@ -1,5 +1,5 @@
 name: Setup pnpm
-description: Install pnpm, setup Node.js with cache, and install dependencies
+description: Setup Vite+ (vp), Node.js, dependency cache, and install dependencies
 
 inputs:
   node-version:
@@ -10,18 +10,8 @@ inputs:
 runs:
   using: composite
   steps:
-    - name: Install pnpm
-      uses: pnpm/action-setup@v4
-      with:
-        version: 10
-        run_install: false
-
-    - name: Setup Node.js
-      uses: actions/setup-node@v4
+    - name: Setup Vite+
+      uses: voidzero-dev/setup-vp@v1
       with:
         node-version: ${{ inputs.node-version }}
-        cache: 'pnpm'
-
-    - name: Install deps
-      shell: bash
-      run: pnpm install --frozen-lockfile
+        cache: true

.github/workflows/code-quality.yml

@@ -17,9 +17,11 @@ jobs:
 
       - name: Setup pnpm
         uses: ./.github/actions/setup-pnpm
+        with:
+          node-version: '22'
 
       - name: Run oxlint
-        run: pnpm oxlint --deny-warnings .
+        run: vp lint --deny-warnings .
 
   typescriptChecker:
     name: 🟦 TypeScript Checker
@@ -35,7 +37,7 @@ jobs:
           node-version: 24
 
       - name: Run Typescript checker
-        run: pnpm run lint:ts
+        run: vp run lint:ts
 
   tests:
     name: 🔬 Tests
@@ -57,4 +59,4 @@ jobs:
         uses: ./.github/actions/setup-playwright
 
       - name: Run tests
-        run: SKIP_ENV_VALIDATION=true pnpm run test:ci
+        run: SKIP_ENV_VALIDATION=true vp run test:ci

.github/workflows/e2e-tests.yml

@@ -113,13 +113,13 @@ jobs:
           mc anonymous set download minio/$S3_BUCKET_NAME
 
       - name: Migrate database
-        run: pnpm db:push
+        run: vp run db:push
 
       - name: Add default data into database
-        run: pnpm db:seed
+        run: vp run db:seed
 
       - name: Run Playwright tests
-        run: pnpm exec playwright test --project=${{ matrix.browser }}
+        run: vp exec playwright test --project=${{ matrix.browser }}
 
       - uses: actions/upload-artifact@v4
         if: always()

.gitignore

@@ -21,7 +21,6 @@
 .DS_Store
 *.pem
 .idea/
-.eslintcache
 .db
 tsconfig.tsbuildinfo
 

.oxfmtrc.json

@@ -1,7 +1,13 @@
 import type { Preview } from '@storybook/react-vite';
+import {
+  createMemoryHistory,
+  createRootRoute,
+  createRouter,
+  RouterProvider,
+} from '@tanstack/react-router';
 import { useDarkMode } from '@vueless/storybook-dark-mode';
-import { StrictMode, useEffect } from 'react';
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
+import { createContext, StrictMode, useContext, useEffect, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { StoryContext } from 'storybook/internal/csf';
 
@@ -15,6 +21,33 @@ import {
 import i18nGlobal from '../src/lib/i18n/index';
 import { Providers } from '../src/providers';
 
+const StorybookStorySlotContext = createContext<ReactNode>(null);
+
+function StorybookStorySlotRoot() {
+  const slot = useContext(StorybookStorySlotContext);
+  return <>{slot}</>;
+}
+
+/** Minimal router so components using useRouter() work in Storybook. */
+function StorybookTanStackRouter({ children }: { children: ReactNode }) {
+  const router = useMemo(() => {
+    const rootRoute = createRootRoute({
+      component: StorybookStorySlotRoot,
+    });
+    const routeTree = rootRoute.addChildren([]);
+    return createRouter({
+      routeTree,
+      history: createMemoryHistory({ initialEntries: ['/'] }),
+    });
+  }, []);
+
+  return (
+    <StorybookStorySlotContext.Provider value={children}>
+      <RouterProvider router={router} />
+    </StorybookStorySlotContext.Provider>
+  );
+}
+
 const DocumentationWrapper = ({
   children,
   context,
@@ -77,12 +110,14 @@ const preview: Preview = {
       return (
         <Providers forcedTheme={isDarkMode ? 'dark' : 'light'}>
           <StrictMode>
-            <DocumentationWrapper context={context}>
-              {/* Calling as a function to avoid errors. Learn more at:
-               * https://github.com/storybookjs/storybook/issues/15223#issuecomment-1092837912
-               */}
-              {story(context)}
-            </DocumentationWrapper>
+            <StorybookTanStackRouter>
+              <DocumentationWrapper context={context}>
+                {/* Calling as a function to avoid errors. Learn more at:
+                 * https://github.com/storybookjs/storybook/issues/15223#issuecomment-1092837912
+                 */}
+                {story(context)}
+              </DocumentationWrapper>
+            </StorybookTanStackRouter>
           </StrictMode>
         </Providers>
       );

.oxlintrc.json

@@ -1,9 +1,9 @@
 {
   "recommendations": [
     "lokalise.i18n-ally",
-    "dbaeumer.vscode-eslint",
     "oxc.oxc-vscode",
     "ms-playwright.playwright",
-    "Prisma.prisma"
+    "Prisma.prisma",
+    "VoidZero.vite-plus-extension-pack"
   ]
 }