diff --git a/.github/workflows/ci-chrome-extension.yaml b/.github/workflows/ci-chrome-extension.yaml
deleted file mode 100644
index b9a07866abc0d..0000000000000
--- a/.github/workflows/ci-chrome-extension.yaml
+++ /dev/null
@@ -1,32 +0,0 @@
-name: CI Chrome Extension
-on:
-  push:
-    branches:
-      - main
-    paths:
-      - 'package.json'
-      - 'packages/twenty-chrome-extension/**'
-  pull_request:
-    paths:
-      - 'package.json'
-      - 'packages/twenty-chrome-extension/**'
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: true
-
-jobs:
-  chrome-extension-build:
-    runs-on: ubuntu-latest
-    env:
-      VITE_SERVER_BASE_URL: http://localhost:3000
-      VITE_FRONT_BASE_URL: http://localhost:3001
-    steps:
-      - name: Cancel Previous Runs
-        uses: styfle/cancel-workflow-action@0.11.0
-        with:
-            access_token: ${{ github.token }}
-      - uses: actions/checkout@v4
-      - name: Install dependencies
-        uses: ./.github/workflows/actions/yarn-install
-      - name: Chrome Extension / Run build
-        run: npx nx build twenty-chrome-extension
diff --git a/.github/workflows/ci-front.yaml b/.github/workflows/ci-front.yaml
index af27198d48d3d..ae1dd68779de8 100644
--- a/.github/workflows/ci-front.yaml
+++ b/.github/workflows/ci-front.yaml
@@ -5,11 +5,13 @@ on:
       - main
     paths:
       - 'package.json'
+      - 'packages/twenty-chrome-extension/**'
       - 'packages/twenty-front/**'
       - 'packages/twenty-ui/**'
   pull_request:
     paths:
       - 'package.json'
+      - 'packages/twenty-chrome-extension/**'
       - 'packages/twenty-front/**'
       - 'packages/twenty-ui/**'
 concurrency:
@@ -17,62 +19,33 @@ concurrency:
   cancel-in-progress: true
 
 jobs:
-  front-sb-test:
-    runs-on: ci-8-cores
-    strategy:
-      matrix:
-        storybook_scope: [pages, modules]
-    env:
-      REACT_APP_SERVER_BASE_URL: http://localhost:3000
-      STORYBOOK_SCOPE: ${{ matrix.storybook_scope }}
-    steps:
-      - name: Cancel Previous Runs
-        uses: styfle/cancel-workflow-action@0.11.0
-        with:
-          access_token: ${{ github.token }}
-      - name: Fetch local actions
-        uses: actions/checkout@v4
-      - name: Install dependencies
-        uses: ./.github/workflows/actions/yarn-install
-      - name: Install Playwright
-        run: cd packages/twenty-front && npx playwright install
-      - name: Front / Restore Storybook Task Cache
-        uses: ./.github/workflows/actions/task-cache
-        with:
-          tag: scope:frontend
-          tasks: storybook:build
-          suffix: _${{ matrix.storybook_scope }}
-      - name: Front / Write .env
-        run: npx nx reset:env twenty-front
-      - name: Run storybook tests
-        run: |
-          npx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \
-            "npx nx storybook:static twenty-front" \
-            "npx wait-on tcp:6006 && npx nx storybook:test twenty-front"
   front-task:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        task: [lint, typecheck, test]
-    env:
-      REACT_APP_SERVER_BASE_URL: http://localhost:3000
+        task: [build, lint, typecheck, test]
     steps:
       - name: Cancel Previous Runs
         uses: styfle/cancel-workflow-action@0.11.0
         with:
           access_token: ${{ github.token }}
-      - name: Fetch local actions and base branch history
+      - name: Fetch custom Github Actions and base branch history
         uses: actions/checkout@v4
         with:
           fetch-depth: 0
       - name: Install dependencies
         uses: ./.github/workflows/actions/yarn-install
-      - name: Front / Restore Task Cache
+      - name: Front / Restore ${{ matrix.task }} task cache
         uses: ./.github/workflows/actions/task-cache
         with:
           tag: scope:frontend
           tasks: ${{ matrix.task }}
-      - name: Front / Run task
+      - name: Reset .env
+        uses: ./.github/workflows/actions/nx-affected
+        with:
+          tag: scope:frontend
+          tasks: reset:env
+      - name: Run ${{ matrix.task }} task
         uses: ./.github/workflows/actions/nx-affected
         with:
           tag: scope:frontend
diff --git a/.github/workflows/ci-server.yaml b/.github/workflows/ci-server.yaml
index 7f86a590aa215..cc1968b34772b 100644
--- a/.github/workflows/ci-server.yaml
+++ b/.github/workflows/ci-server.yaml
@@ -28,7 +28,7 @@ jobs:
         ports:
           - 5432:5432
     steps:
-      - name: Fetch local actions and base branch history
+      - name: Fetch custom Github Actions and base branch history
         uses: actions/checkout@v4
         with:
           fetch-depth: 0
diff --git a/.github/workflows/ci-storybook.yaml b/.github/workflows/ci-storybook.yaml
new file mode 100644
index 0000000000000..8bc70ba61e4e2
--- /dev/null
+++ b/.github/workflows/ci-storybook.yaml
@@ -0,0 +1,52 @@
+name: CI Storybook
+on:
+  push:
+    branches:
+      - main
+    paths:
+      - 'package.json'
+      - 'packages/twenty-front/**'
+      - 'packages/twenty-ui/**'
+  pull_request:
+    paths:
+      - 'package.json'
+      - 'packages/twenty-front/**'
+      - 'packages/twenty-ui/**'
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  front-sb-test:
+    runs-on: ci-8-cores
+    strategy:
+      matrix:
+        storybook_scope: [pages, modules]
+    env:
+      REACT_APP_SERVER_BASE_URL: http://localhost:3000
+      STORYBOOK_SCOPE: ${{ matrix.storybook_scope }}
+    steps:
+      - name: Cancel Previous Runs
+        uses: styfle/cancel-workflow-action@0.11.0
+        with:
+          access_token: ${{ github.token }}
+      - name: Fetch local actions
+        uses: actions/checkout@v4
+      - name: Install dependencies
+        uses: ./.github/workflows/actions/yarn-install
+      - name: Install Playwright
+        run: cd packages/twenty-front && npx playwright install
+      - name: Front / Restore Storybook Task Cache
+        uses: ./.github/workflows/actions/task-cache
+        with:
+          tag: scope:frontend
+          tasks: storybook:build
+          suffix: _${{ matrix.storybook_scope }}
+      - name: Front / Write .env
+        run: npx nx reset:env twenty-front
+      - name: Run storybook tests
+        run: |
+          npx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \
+            "npx nx storybook:static twenty-front" \
+            "npx wait-on tcp:6006 && npx nx storybook:test twenty-front"
+  
\ No newline at end of file
diff --git a/package.json b/package.json
index 5d4a7f0a60d2f..57e6613f62963 100644
--- a/package.json
+++ b/package.json
@@ -187,6 +187,7 @@
   "devDependencies": {
     "@babel/core": "^7.14.5",
     "@babel/preset-react": "^7.14.5",
+    "@crxjs/vite-plugin": "^1.0.14",
     "@docusaurus/module-type-aliases": "^3.1.0",
     "@docusaurus/tsconfig": "3.1.0",
     "@graphql-codegen/cli": "^3.3.1",
@@ -232,6 +233,7 @@
     "@types/bcrypt": "^5.0.0",
     "@types/better-sqlite3": "^7.6.8",
     "@types/bytes": "^3.1.1",
+    "@types/chrome": "^0.0.267",
     "@types/crypto-js": "^4.2.2",
     "@types/deep-equal": "^1.0.1",
     "@types/express": "^4.17.13",
diff --git a/packages/twenty-chrome-extension/.eslintrc.cjs b/packages/twenty-chrome-extension/.eslintrc.cjs
index 8dbe0179d2ba9..8de577d8881ce 100644
--- a/packages/twenty-chrome-extension/.eslintrc.cjs
+++ b/packages/twenty-chrome-extension/.eslintrc.cjs
@@ -1,6 +1,6 @@
 module.exports = {
   extends: ['../../.eslintrc.cjs', '../../.eslintrc.react.cjs'],
-  ignorePatterns: ['!**/*', 'node_modules', 'dist', 'src/generated/*.tsx'],
+  ignorePatterns: ['!**/*', '**/generated*/*'],
   overrides: [
     {
       files: ['*.ts', '*.tsx'],
diff --git a/packages/twenty-chrome-extension/.prettierignore b/packages/twenty-chrome-extension/.prettierignore
new file mode 100644
index 0000000000000..80697f2272d51
--- /dev/null
+++ b/packages/twenty-chrome-extension/.prettierignore
@@ -0,0 +1 @@
+src/generated
\ No newline at end of file
diff --git a/packages/twenty-chrome-extension/package.json b/packages/twenty-chrome-extension/package.json
index e01a896760b43..a9dffcb331cdb 100644
--- a/packages/twenty-chrome-extension/package.json
+++ b/packages/twenty-chrome-extension/package.json
@@ -5,15 +5,6 @@
   "version": "0.0.1",
   "type": "module",
   "scripts": {
-    "lint": "eslint . --report-unused-disable-directives --max-warnings 0 --config .eslintrc.cjs",
-    "graphql:generate": "graphql-codegen",
-    "fmt": "prettier --check \"src/**/*.ts\" \"src/**/*.tsx\"",
-    "fmt:fix": "prettier --cache --write \"src/**/*.ts\" \"src/**/*.tsx\""
-  },
-  "dependencies": {
-    "@types/chrome": "^0.0.256"
-  },
-  "devDependencies": {
-    "@crxjs/vite-plugin": "^1.0.14"
+    "build": "npx vite build"
   }
 }
diff --git a/packages/twenty-chrome-extension/project.json b/packages/twenty-chrome-extension/project.json
index cc3bbd317e9a5..ef607c1bfeedf 100644
--- a/packages/twenty-chrome-extension/project.json
+++ b/packages/twenty-chrome-extension/project.json
@@ -2,20 +2,67 @@
   "name": "twenty-chrome-extension",
   "$schema": "../../node_modules/nx/schemas/project-schema.json",
   "projectType": "application",
+  "tags": ["scope:frontend"],
   "targets": {
     "build": {
-      "executor": "nx:run-commands",
+      "outputs": ["{options.outputPath}"],
       "options": {
-        "cwd": "packages/twenty-chrome-extension",
-        "commands": ["rimraf ./dist", "tsc", "vite build"]
+        "outputPath": "{projectRoot}/dist"
       }
     },
     "start": {
+      "executor": "@nx/vite:dev-server",
+      "options": {
+        "buildTarget": "twenty-chrome-extension:build",
+        "hmr": true
+      }
+    },
+    "preview": {
+      "executor": "@nx/vite:preview-server",
+      "options": {
+        "buildTarget": "twenty-chrome-extension:build",
+        "port": 3001,
+        "open": true
+      }
+    },
+    "reset:env": {
+      "executor": "nx:run-commands",
+      "inputs": ["{projectRoot}/.env.example"],
+      "outputs": ["{projectRoot}/.env"],
+      "cache": true,
+      "options": {
+        "cwd": "{projectRoot}",
+        "command": "cp .env.example .env"
+      }
+    },
+    "typecheck": {},
+    "lint": {
+      "options": {
+        "lintFilePatterns": [
+          "{projectRoot}/src/**/*.{ts,tsx,json}",
+          "{projectRoot}/package.json"
+        ],
+        "maxWarnings": 0,
+        "reportUnusedDisableDirectives": "error"
+      },
+      "configurations": {
+        "ci": { "eslintConfig": "{projectRoot}/.eslintrc-ci.cjs" },
+        "fix": {}
+      }
+    },
+    "fmt": {
+      "options": {
+        "files": "src"
+      },
+      "configurations": {
+        "fix": {}
+      }
+    },
+    "graphql:generate": {
       "executor": "nx:run-commands",
-      "dependsOn": ["build"],
       "options": {
-        "cwd": "packages/twenty-chrome-extension",
-        "command": "VITE_MODE=development vite"
+        "cwd": "{projectRoot}",
+        "command": "graphql-codegen"
       }
     }
   }
diff --git a/packages/twenty-chrome-extension/tsconfig.app.json b/packages/twenty-chrome-extension/tsconfig.app.json
index f53b9c4f0325c..ce50a898d1df5 100644
--- a/packages/twenty-chrome-extension/tsconfig.app.json
+++ b/packages/twenty-chrome-extension/tsconfig.app.json
@@ -1,8 +1,5 @@
 {
   "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../.cache/tsc"
-  },
   "exclude": [
     "**/*.spec.ts",
     "**/*.test.ts",
@@ -10,5 +7,5 @@
     "**/*.test.tsx",
     "jest.config.ts"
   ],
-  "include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
+  "include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"]
 }
diff --git a/packages/twenty-chrome-extension/tsconfig.json b/packages/twenty-chrome-extension/tsconfig.json
index 43eb06cc54345..840e10a78c08e 100644
--- a/packages/twenty-chrome-extension/tsconfig.json
+++ b/packages/twenty-chrome-extension/tsconfig.json
@@ -1,15 +1,16 @@
 {
+  "extends": "../../tsconfig.base.json",
   "compilerOptions": {
+    "outDir": "../../.cache/tsc",
     "target": "ES2022",
     "useDefineForClassFields": true,
     "lib": ["ES2022", "DOM", "DOM.Iterable"],
     "module": "ESNext",
     "skipLibCheck": true,
     "esModuleInterop": true,
-    "baseUrl": ".",
     "paths": {
-      "@/*": ["src/options/modules/*"],
-      "~/*": ["src/*"]
+      "@/*": ["packages/twenty-chrome-extension/src/options/modules/*"],
+      "~/*": ["packages/twenty-chrome-extension/src/*"]
     },
 
     /* Bundler mode */
diff --git a/packages/twenty-chrome-extension/tsconfig.spec.json b/packages/twenty-chrome-extension/tsconfig.spec.json
index 00abfb39ae85b..0436d0542f824 100644
--- a/packages/twenty-chrome-extension/tsconfig.spec.json
+++ b/packages/twenty-chrome-extension/tsconfig.spec.json
@@ -1,10 +1,10 @@
 {
   "extends": "./tsconfig.json",
   "compilerOptions": {
-    "outDir": "../../.cache/tsc",
     "types": ["jest", "node"]
   },
   "include": [
+    "codegen.ts",
     "vite.config.ts",
     "jest.config.ts",
     "**/*.test.ts",
diff --git a/packages/twenty-chrome-extension/vite.config.ts b/packages/twenty-chrome-extension/vite.config.ts
index c360a7d24beb5..f30851658a91b 100644
--- a/packages/twenty-chrome-extension/vite.config.ts
+++ b/packages/twenty-chrome-extension/vite.config.ts
@@ -19,6 +19,9 @@ const viteManifestHack: Plugin & {
 
 export default defineConfig(() => {
   return {
+    root: __dirname,
+    cacheDir: '../../node_modules/.vite/packages/twenty-chrome-extension',
+
     build: {
       emptyOutDir: true,
       outDir: 'dist',
diff --git a/yarn.lock b/yarn.lock
index 8141f12a55455..5c58c2bf8d40d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -15896,13 +15896,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/chrome@npm:^0.0.256":
-  version: 0.0.256
-  resolution: "@types/chrome@npm:0.0.256"
+"@types/chrome@npm:^0.0.267":
+  version: 0.0.267
+  resolution: "@types/chrome@npm:0.0.267"
   dependencies:
     "@types/filesystem": "npm:*"
     "@types/har-format": "npm:*"
-  checksum: 35b3d2c92a3888cc14e5961421233003407a95078bf9b2f30c52a90470dae02588560bff1733ed3e7a8e9f12a1d0c5a6bae0ca30b6acdb3d723e1c2f29c8e861
+  checksum: baa2e526c86e0c092668eff8fdca35c3eea09f0cded9bab86d692ae3834955bfa49d3c064c51b003406099cce73060872c8c824ceef526c72a446c863a2b520c
   languageName: node
   linkType: hard
 
@@ -46242,9 +46242,6 @@ __metadata:
 "twenty-chrome-extension@workspace:packages/twenty-chrome-extension":
   version: 0.0.0-use.local
   resolution: "twenty-chrome-extension@workspace:packages/twenty-chrome-extension"
-  dependencies:
-    "@crxjs/vite-plugin": "npm:^1.0.14"
-    "@types/chrome": "npm:^0.0.256"
   languageName: unknown
   linkType: soft
 
@@ -46353,6 +46350,7 @@ __metadata:
     "@chakra-ui/accordion": "npm:^2.3.0"
     "@chakra-ui/system": "npm:^2.6.0"
     "@codesandbox/sandpack-react": "npm:^2.13.5"
+    "@crxjs/vite-plugin": "npm:^1.0.14"
     "@docusaurus/core": "npm:^3.1.0"
     "@docusaurus/module-type-aliases": "npm:^3.1.0"
     "@docusaurus/preset-classic": "npm:^3.1.0"
@@ -46439,6 +46437,7 @@ __metadata:
     "@types/bcrypt": "npm:^5.0.0"
     "@types/better-sqlite3": "npm:^7.6.8"
     "@types/bytes": "npm:^3.1.1"
+    "@types/chrome": "npm:^0.0.267"
     "@types/crypto-js": "npm:^4.2.2"
     "@types/deep-equal": "npm:^1.0.1"
     "@types/dompurify": "npm:^3.0.5"