added typechecking for all ts files (#6466)

Fixes: #6436 

Changes made: 

- Added typecheck step before twenty-ui build to check stories TS errors
- Added a tsconfig.dev.json to add stories and tests to typecheking when
in dev mode
- Added tsconfig.dev.json to storybook dev command of twenty-ui to
typecheck stories while developing
- Fixed twenty-ui stories that were broken

- Added a serve command to serve front build
- Fixed unit test from another PR

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>

packages/twenty-ui/vite.config.ts

@@ -4,64 +4,78 @@ import wyw from '@wyw-in-js/vite';
 import * as path from 'path';
 import { defineConfig } from 'vite';
 import checker from 'vite-plugin-checker';
-import dts from 'vite-plugin-dts';
+import dts, { PluginOptions } from 'vite-plugin-dts';
 import svgr from 'vite-plugin-svgr';
 import tsconfigPaths from 'vite-tsconfig-paths';
 
+import { UserPluginConfig } from 'vite-plugin-checker/dist/esm/types';
+
 // eslint-disable-next-line @nx/enforce-module-boundaries, import/no-relative-packages
 import packageJson from '../../package.json';
 
-export default defineConfig({
-  root: __dirname,
-  cacheDir: '../../node_modules/.vite/packages/twenty-ui',
+export default defineConfig(({ command }) => {
+  const isBuildCommand = command === 'build';
 
-  plugins: [
-    react({ jsxImportSource: '@emotion/react' }),
-    tsconfigPaths(),
-    svgr(),
-    dts({
-      entryRoot: 'src',
-      tsconfigPath: path.join(__dirname, 'tsconfig.lib.json'),
-    }),
-    checker({
-      typescript: {
-        tsconfigPath: path.join(__dirname, 'tsconfig.lib.json'),
-      },
-    }),
-    wyw({
-      include: [
-        '**/OverflowingTextWithTooltip.tsx',
-        '**/Chip.tsx',
-        '**/Tag.tsx',
-        '**/Avatar.tsx',
-        '**/AvatarChip.tsx',
-      ],
-      babelOptions: {
-        presets: ['@babel/preset-typescript', '@babel/preset-react'],
-      },
-    }),
-  ],
+  const tsConfigPath = isBuildCommand
+    ? path.resolve(__dirname, './tsconfig.build.json')
+    : path.resolve(__dirname, './tsconfig.dev.json');
 
-  // Configuration for building your library.
-  // See: https://vitejs.dev/guide/build.html#library-mode
-  build: {
-    outDir: './dist',
-    reportCompressedSize: true,
-    commonjsOptions: {
-      transformMixedEsModules: true,
+  const checkersConfig: UserPluginConfig = {
+    typescript: {
+      tsconfigPath: tsConfigPath,
     },
-    lib: {
-      // Could also be a dictionary or array of multiple entry points.
-      entry: 'src/index.ts',
-      name: 'twenty-ui',
-      fileName: 'index',
-      // Change this to the formats you want to support.
-      // Don't forget to update your package.json as well.
-      formats: ['es', 'cjs'],
+  };
+
+  const dtsConfig: PluginOptions = {
+    entryRoot: 'src',
+    tsconfigPath: tsConfigPath,
+  };
+
+  return {
+    root: __dirname,
+    cacheDir: '../../node_modules/.vite/packages/twenty-ui',
+
+    plugins: [
+      react({ jsxImportSource: '@emotion/react' }),
+      tsconfigPaths(),
+      svgr(),
+      dts(dtsConfig),
+      checker(checkersConfig),
+      wyw({
+        include: [
+          '**/OverflowingTextWithTooltip.tsx',
+          '**/Chip.tsx',
+          '**/Tag.tsx',
+          '**/Avatar.tsx',
+          '**/AvatarChip.tsx',
+        ],
+        babelOptions: {
+          presets: ['@babel/preset-typescript', '@babel/preset-react'],
+        },
+      }),
+    ],
+
+    // Configuration for building your library.
+    // See: https://vitejs.dev/guide/build.html#library-mode
+    build: {
+      outDir: './dist',
+      reportCompressedSize: true,
+      commonjsOptions: {
+        transformMixedEsModules: true,
+      },
+      lib: {
+        // Could also be a dictionary or array of multiple entry points.
+        entry: 'src/index.ts',
+        name: 'twenty-ui',
+        fileName: 'index',
+        // Change this to the formats you want to support.
+        // Don't forget to update your package.json as well.
+        formats: ['es', 'cjs'],
+      },
+      rollupOptions: {
+        // External packages that should not be bundled into your library.
+        external: Object.keys(packageJson.dependencies || {}),
+      },
     },
-    rollupOptions: {
-      // External packages that should not be bundled into your library.
-      external: Object.keys(packageJson.dependencies || {}),
-    },
-  },
+  };
 });