Upgrade 0.33.0

update upgrade-guide

.github/ISSUE_TEMPLATE/oss-gg-hack-submission.yml

@@ -0,0 +1,33 @@
+name: oss.gg hack submission 🕹️
+description: "Submit your contribution for the for the oss.gg hackathon"
+title: "[🕹️]"
+labels: 🕹️ oss.gg, player submission, hacktoberfest
+assignees: []
+body:
+  - type: textarea
+    id: contribution-name
+    attributes:
+      label: What side quest or challenge are you solving?
+      description: Add the name of the side quest or challenge.
+    validations:
+      required: true
+  - type: textarea
+    id: points
+    attributes:
+      label: Points
+      description: How many points are assigned to this contribution?
+    validations:
+      required: true
+  - type: textarea
+    id: description
+    attributes:
+      label: Description
+      description: What's the task your performed?
+    validations:
+  - type: textarea
+    id: proof
+    attributes:
+      label: Provide proof that you've completed the task
+      description: Screenshots, loom recordings, links to the content you shared or interacted with.
+    validations:
+      required: true

.github/workflows/cd-deploy-main.yaml

@@ -5,6 +5,7 @@ on:
       - main
 jobs:
   deploy-main:
+    timeout-minutes: 3
     runs-on: ubuntu-latest
     steps:
       - name: Repository Dispatch

.github/workflows/cd-deploy-tag.yaml

@@ -5,6 +5,7 @@ on:
       - 'v*'
 jobs:
   deploy-tag:
+    timeout-minutes: 3
     runs-on: ubuntu-latest
     steps:
       - name: Repository Dispatch

.github/workflows/ci-chrome-extension.yaml

@@ -3,19 +3,16 @@ 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:
+    timeout-minutes: 15
     runs-on: ubuntu-latest
     env:
       VITE_SERVER_BASE_URL: http://localhost:3000
@@ -26,7 +23,25 @@ jobs:
         with:
           access_token: ${{ github.token }}
       - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Check for changed files
+        id: changed-files
+        uses: tj-actions/changed-files@v11
+        with:
+          files: |
+            package.json
+            packages/twenty-chrome-extension/**
+             
       - name: Install dependencies
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/yarn-install
       - name: Chrome Extension / Run build
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: npx nx build twenty-chrome-extension
+
+      - name: Mark as Valid if No Changes
+        if: steps.changed-files.outputs.changed != 'true'
+        run: |
+          echo "No relevant changes detected. Marking as valid."  

.github/workflows/ci-e2e.yml.bak

@@ -0,0 +1,52 @@
+name: CI E2E Tests
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+    branches:
+      - '**'
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  test:
+    timeout-minutes: 30
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v4
+      with:
+        fetch-depth: 0
+    - uses: actions/setup-node@v4
+      with:
+        node-version: lts/*
+
+    - name: Check for changed files
+      id: changed-files
+      uses: tj-actions/changed-files@v11
+      with:
+        files: |
+          packages/**
+          playwright.config.ts
+
+    - name: Skip if no relevant changes
+      if: steps.changed-files.outputs.any_changed == 'false'
+      run: echo "No relevant changes detected. Marking as valid."
+
+    - name: Install dependencies
+      if: steps.changed-files.outputs.any_changed == 'true'
+      uses: ./.github/workflows/actions/yarn-install
+    - name: Install Playwright Browsers
+      if: steps.changed-files.outputs.any_changed == 'true'
+      run: yarn playwright install --with-deps
+    - name: Run Playwright tests
+      if: steps.changed-files.outputs.any_changed == 'true'
+      run: yarn test:e2e companies
+    - uses: actions/upload-artifact@v4
+      if: always()
+      with:
+        name: playwright-report
+        path: playwright-report/
+        retention-days: 30

.github/workflows/ci-front.yaml

@@ -3,21 +3,16 @@ 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-build:
+    timeout-minutes: 30
     runs-on: ubuntu-latest
     env:
       REACT_APP_SERVER_BASE_URL: http://localhost:3000
@@ -29,21 +24,43 @@ jobs:
           access_token: ${{ github.token }}
       - name: Fetch local actions
         uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Check for changed files
+        id: changed-files
+        uses: tj-actions/changed-files@v11
+        with:
+          files: |
+            package.json
+            packages/twenty-front/**
+            packages/twenty-ui/**
+
+      - name: Skip if no relevant changes
+        if: steps.changed-files.outputs.any_changed == 'false'
+        run: echo "No relevant changes. Skipping CI."
+
       - name: Install dependencies
+        if: steps.changed-files.outputs.any_changed == 'true' 
         uses: ./.github/workflows/actions/yarn-install
       - name: Diagnostic disk space issue
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: df -h
       - name: Front / Restore Storybook Task Cache
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/task-cache
         with:
           tag: scope:frontend
           tasks: storybook:build
       - name: Front / Write .env
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: npx nx reset:env twenty-front
       - name: Front / Build storybook
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: npx nx storybook:build twenty-front
   front-sb-test:
-    runs-on: ci-8-cores
+    timeout-minutes: 30
+    runs-on: shipfox-8vcpu-ubuntu-2204
     needs: front-sb-build
     strategy:
       matrix:
@@ -54,36 +71,72 @@ jobs:
     steps:
       - name: Fetch local actions
         uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - name: Check for changed files
+        id: changed-files
+        uses: tj-actions/changed-files@v11
+        with:
+          files: |
+            packages/twenty-front/**  
+      - name: Skip if no relevant changes
+        if: steps.changed-files.outputs.any_changed == 'false'
+        run: echo "No relevant changes. Skipping CI." 
+
       - name: Install dependencies
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/yarn-install
       - name: Install Playwright
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: cd packages/twenty-front && npx playwright install
       - name: Front / Restore Storybook Task Cache
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/task-cache
         with:
           tag: scope:frontend
           tasks: storybook:build
       - name: Front / Write .env
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: npx nx reset:env twenty-front
       - name: Run storybook tests
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: npx nx storybook:serve-and-test:static twenty-front --configuration=${{ matrix.storybook_scope }}
   front-sb-test-performance:
-    runs-on: ci-8-cores
+    timeout-minutes: 30
+    runs-on: shipfox-8vcpu-ubuntu-2204
     env:
       REACT_APP_SERVER_BASE_URL: http://localhost:3000
       NX_REJECT_UNKNOWN_LOCAL_CACHE: 0
     steps:
       - name: Fetch local actions
         uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - name: Check for changed files
+        id: changed-files
+        uses: tj-actions/changed-files@v11
+        with:
+          files: |
+            packages/twenty-front/**
+
+      - name: Skip if no relevant changes
+        if: steps.changed-files.outputs.any_changed == 'false'
+        run: echo "No relevant changes. Skipping CI."
+
       - name: Install dependencies
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/yarn-install
       - name: Install Playwright
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: cd packages/twenty-front && npx playwright install
       - name: Front / Write .env
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: npx nx reset:env twenty-front
       - name: Run storybook tests
-        run: npx nx storybook:serve-and-test:static:performance twenty-front
+        if: steps.changed-files.outputs.any_changed == 'true'
+        run: npx nx run twenty-front:storybook:serve-and-test:static:performance
   front-chromatic-deployment:
+    timeout-minutes: 30
     if: contains(github.event.pull_request.labels.*.name, 'run-chromatic') || github.event_name == 'push'
     needs: front-sb-build
     runs-on: ubuntu-latest
@@ -95,21 +148,38 @@ jobs:
       - uses: actions/checkout@v4
         with:
           fetch-depth: 0
+
+      - name: Check for changed files
+        id: changed-files
+        uses: tj-actions/changed-files@v11
+        with:
+          files: |
+            packages/twenty-front/**
+
+      - name: Skip if no relevant changes
+        if: steps.changed-files.outputs.any_changed == 'false'
+        run: echo "No relevant changes. Skipping CI."
+
       - name: Install dependencies
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/yarn-install
       - name: Front / Restore Storybook Task Cache
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/task-cache
         with:
           tag: scope:frontend
           tasks: storybook:build
       - name: Front / Write .env
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: |
           cd packages/twenty-front
           touch .env
           echo "REACT_APP_SERVER_BASE_URL: $REACT_APP_SERVER_BASE_URL" >> .env
       - name: Publish to Chromatic
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: npx nx run twenty-front:chromatic:ci
   front-task:
+    timeout-minutes: 30
     runs-on: ubuntu-latest
     env:
       NX_REJECT_UNKNOWN_LOCAL_CACHE: 0
@@ -125,20 +195,35 @@ jobs:
         uses: actions/checkout@v4
         with:
           fetch-depth: 0
+      - name: Check for changed files
+        id: changed-files
+        uses: tj-actions/changed-files@v11
+        with:
+          files: |
+            packages/twenty-front/**
+
+      - name: Skip if no relevant changes
+        if: steps.changed-files.outputs.any_changed == 'false'
+        run: echo "No relevant changes. Skipping CI."
+
       - name: Install dependencies
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/yarn-install
       - name: Front / Restore ${{ matrix.task }} task cache
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/task-cache
         with:
           tag: scope:frontend
           tasks: ${{ matrix.task }}
       - name: Reset .env
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/nx-affected
         with:
           tag: scope:frontend
           tasks: reset:env
       - name: Run ${{ matrix.task }} task
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/nx-affected
         with:
           tag: scope:frontend
-          tasks: ${{ matrix.task }}
+          tasks: ${{ matrix.task }}

.github/workflows/ci-release-create.yaml

@@ -15,6 +15,7 @@ on:
 
 jobs:
   create_pr:
+    timeout-minutes: 10
     runs-on: ubuntu-latest
     steps:
       - name: Checkout

.github/workflows/ci-release-merge.yaml

@@ -6,6 +6,7 @@ on:
 
 jobs:
   tag_and_release:
+    timeout-minutes: 10
     runs-on: ubuntu-latest
     if: github.event.pull_request.merged == true && contains(github.event.pull_request.labels.*.name, 'release')
     steps:

.github/workflows/ci-server.yaml

@@ -3,32 +3,34 @@ on:
   push:
     branches:
       - main
-    paths:
-      - 'package.json'
-      - 'packages/twenty-server/**'
-      - 'packages/twenty-emails/**'
+
   pull_request:
-    paths:
-      - 'package.json'
-      - 'packages/twenty-server/**'
-      - 'packages/twenty-emails/**'
+   
 concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
   cancel-in-progress: true
 
 jobs:
   server-setup:
+    timeout-minutes: 30
     runs-on: ubuntu-latest
     env:
       NX_REJECT_UNKNOWN_LOCAL_CACHE: 0
     services:
       postgres:
-        image: twentycrm/twenty-postgres
+        image: twentycrm/twenty-postgres-spilo
         env:
-          POSTGRES_PASSWORD: postgres
-          POSTGRES_USER: postgres
+          PGUSER_SUPERUSER: postgres
+          PGPASSWORD_SUPERUSER: twenty
+          ALLOW_NOSSL: "true"
+          SPILO_PROVIDER: "local"
         ports:
           - 5432:5432
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
       redis:
         image: redis
         ports:
@@ -38,25 +40,47 @@ jobs:
         uses: actions/checkout@v4
         with:
           fetch-depth: 0
+
+      - name: Check for changed files
+        id: changed-files
+        uses: tj-actions/changed-files@v11
+        with:
+          files: |
+            package.json
+            packages/twenty-server/**
+            packages/twenty-emails/**
+
       - name: Install dependencies
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/yarn-install
       - name: Server / Restore Task Cache
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/task-cache
         with:
           tag: scope:backend
       - name: Server / Run lint & typecheck
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/nx-affected
         with:
           tag: scope:backend
           tasks: lint,typecheck
       - name: Server / Build
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: npx nx build twenty-server
       - name: Server / Write .env
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: npx nx reset:env twenty-server
+      - name: Server / Create DB
+        if: steps.changed-files.outputs.any_changed == 'true'
+        run: |
+          PGPASSWORD=twenty psql -h localhost -p 5432 -U postgres -d postgres -c 'CREATE DATABASE "default";'
+          PGPASSWORD=twenty psql -h localhost -p 5432 -U postgres -d postgres -c 'CREATE DATABASE "test";'
       - name: Worker / Run
+        if: steps.changed-files.outputs.any_changed == 'true'
         run: npx nx run twenty-server:worker:ci
 
   server-test:
+    timeout-minutes: 30
     runs-on: ubuntu-latest
     needs: server-setup
     env:
@@ -66,29 +90,50 @@ jobs:
         uses: actions/checkout@v4
         with:
           fetch-depth: 0
+
+      - name: Check for changed files
+        id: changed-files
+        uses: tj-actions/changed-files@v11
+        with:
+          files: |
+            package.json
+            packages/twenty-server/**
+            packages/twenty-emails/**
+
       - name: Install dependencies
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/yarn-install
       - name: Server / Restore Task Cache
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/task-cache
         with:
           tag: scope:backend
       - name:  Server / Run Tests
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/nx-affected
         with:
           tag: scope:backend
           tasks: test
 
   server-integration-test:
+    timeout-minutes: 30
     runs-on: ubuntu-latest
     needs: server-setup
     services:
       postgres:
-        image: twentycrm/twenty-postgres
+        image: twentycrm/twenty-postgres-spilo
         env:
-          POSTGRES_PASSWORD: postgres
-          POSTGRES_USER: postgres
+          PGUSER_SUPERUSER: postgres
+          PGPASSWORD_SUPERUSER: twenty
+          ALLOW_NOSSL: "true"
+          SPILO_PROVIDER: "local"
         ports:
           - 5432:5432
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
       redis:
         image: redis
         ports:
@@ -100,17 +145,30 @@ jobs:
         uses: actions/checkout@v4
         with:
           fetch-depth: 0
+
+      - name: Check for changed files
+        id: changed-files
+        uses: tj-actions/changed-files@v11
+        with:
+          files: |
+            package.json
+            packages/twenty-server/**
+            packages/twenty-emails/**
+
       - name: Install dependencies
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/yarn-install
       - name: Server / Restore Task Cache
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/task-cache
         with:
           tag: scope:backend
       - name: Server / Run Integration Tests
+        if: steps.changed-files.outputs.any_changed == 'true'
         uses: ./.github/workflows/actions/nx-affected
         with:
           tag: scope:backend
-          tasks: "test:integration"
+          tasks: "test:integration:with-db-reset"
       - name: Server / Upload reset-logs file
         if: always()
         uses: actions/upload-artifact@v4

.github/workflows/ci-test-docker-compose.yaml

@@ -1,20 +1,31 @@
 name: 'Test Docker Compose'
 on:
   pull_request:
-    paths:
-      - 'packages/twenty-docker/**'
+   
 concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
   cancel-in-progress: true
 
 jobs:
   test:
+    timeout-minutes: 30
     runs-on: ubuntu-latest
     steps:
     - name: Checkout
       uses: actions/checkout@v2
+    - name: Check for changed files
+      id: changed-files
+      uses: tj-actions/changed-files@v11
+      with:
+          files: |
+            packages/twenty-docker/**
+            docker-compose.yml
+    - name: Skip if no relevant changes
+      if: steps.changed-files.outputs.any_changed != 'true'
+      run: echo "No relevant changes detected. Marking as valid."
 
     - name: Run compose
+      if: steps.changed-files.outputs.any_changed == 'true'
       run: |
         echo "Patching docker-compose.yml..."
         # change image to localbuild using yq
@@ -25,23 +36,42 @@ jobs:
 
         yq eval 'del(.services.db.image)' -i docker-compose.yml
         yq eval '.services.db.build.context = "../../"' -i docker-compose.yml
-        yq eval '.services.db.build.dockerfile = "./packages/twenty-docker/twenty-postgres/Dockerfile"' -i docker-compose.yml
+        yq eval '.services.db.build.dockerfile = "./packages/twenty-docker/twenty-postgres-spilo/Dockerfile"' -i docker-compose.yml
 
         echo "Setting up .env file..."
         cp .env.example .env
         echo "Generating secrets..."
         echo "# === Randomly generated secrets ===" >>.env
-        echo "ACCESS_TOKEN_SECRET=$(openssl rand -base64 32)" >>.env
-        echo "LOGIN_TOKEN_SECRET=$(openssl rand -base64 32)" >>.env
-        echo "REFRESH_TOKEN_SECRET=$(openssl rand -base64 32)" >>.env
-        echo "FILE_TOKEN_SECRET=$(openssl rand -base64 32)" >>.env
-        echo "POSTGRES_ADMIN_PASSWORD=$(openssl rand -base64 32)" >>.env
+        echo "APP_SECRET=$(openssl rand -base64 32)" >>.env
+        echo "PGPASSWORD_SUPERUSER=$(openssl rand -base64 32)" >>.env
 
-        echo "Starting server..."
-        docker compose up -d
+        echo "Docker compose up..."
+        docker compose up -d || {
+            echo "Docker compose failed to start"
+            docker compose logs
+            exit 1
+        }
         docker compose logs db server -f &
         pid=$!
 
+        echo "Waiting for database to start..."
+        count=0
+        while [ ! $(docker inspect --format='{{.State.Health.Status}}' twenty-db-1) = "healthy" ]; do
+            sleep 1;
+            count=$((count+1));
+            if [ $(docker inspect --format='{{.State.Status}}' twenty-db-1) = "exited" ]; then
+                echo "Database exited"
+                docker compose logs db
+                exit 1
+            fi
+            if [ $count -gt 300 ]; then
+                echo "Failed to start database after 5 minutes"
+                docker compose logs db
+                exit 1
+            fi
+            echo "Still waiting for database... (${count}/60)"
+        done
+
         echo "Waiting for server to start..."
         count=0
         while [ ! $(docker inspect --format='{{.State.Health.Status}}' twenty-server-1) = "healthy" ]; do
@@ -49,11 +79,14 @@ jobs:
             count=$((count+1));
             if [ $(docker inspect --format='{{.State.Status}}' twenty-server-1) = "exited" ]; then
                 echo "Server exited"
+                docker compose logs server
                 exit 1
             fi
             if [ $count -gt 300 ]; then
-                echo "Failed to start server"
+                echo "Failed to start server after 5 minutes"
+                docker compose logs server
                 exit 1
             fi
+            echo "Still waiting for server... (${count}/300s)"
         done
       working-directory: ./packages/twenty-docker/

.github/workflows/ci-tinybird.yaml

@@ -0,0 +1,26 @@
+name: CI Tinybird
+on:
+  push:
+    branches:
+      - main
+    paths:
+      - 'package.json'
+      - 'packages/twenty-tinybird/**'
+
+  pull_request:
+    paths:
+      - 'package.json'
+      - 'packages/twenty-tinybird/**'
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  ci:
+    uses: tinybirdco/ci/.github/workflows/ci.yml@main
+    with:
+      data_project_dir: packages/twenty-tinybird
+    secrets:
+      tb_admin_token: ${{ secrets.TB_ADMIN_TOKEN }}
+      tb_host: https://api.eu-central-1.aws.tinybird.co

.github/workflows/ci-utils.yaml

@@ -15,10 +15,13 @@ permissions:
   statuses: write
 concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: true
+  # We don't cancel in-progress because this workflow is triggered on
+  # pull_request_target, which means the ref can be the same accross two PRs.
+  # cancel-in-progress: true
 
 jobs:
   danger-js:
+    timeout-minutes: 3
     runs-on: ubuntu-latest
     if: github.event.action != 'closed'
     steps:
@@ -31,6 +34,7 @@ jobs:
           DANGER_GITHUB_API_TOKEN: ${{ github.token }}
   
   congratulate:
+    timeout-minutes: 3
     runs-on: ubuntu-latest
     if: github.event.action == 'closed' && github.event.pull_request.merged == true
     steps:

.github/workflows/ci-website.yaml

@@ -3,37 +3,62 @@ on:
   push:
     branches:
       - main
-    paths:
-      - 'package.json'
-      - 'packages/twenty-website/**'
+
   pull_request:
-    paths:
-      - 'package.json'
-      - 'packages/twenty-website/**'
+    
+
 concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
   cancel-in-progress: true
 
 jobs:
   website-build:
+    timeout-minutes: 3
     runs-on: ubuntu-latest
     services:
       postgres:
-        image: twentycrm/twenty-postgres
+        image: twentycrm/twenty-postgres-spilo
         env:
-          POSTGRES_PASSWORD: twenty
-          POSTGRES_USER: twenty
+          PGUSER_SUPERUSER: postgres
+          PGPASSWORD_SUPERUSER: twenty
+          ALLOW_NOSSL: "true"
+          SPILO_PROVIDER: "local"
         ports:
           - 5432:5432
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
     steps:
       - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - name: Check for changed files
+        id: changed-files
+        uses: tj-actions/changed-files@v11
+        with:
+          files: 'package.json, packages/twenty-website/**'
+
       - name: Install dependencies
+        if: steps.changed-files.outputs.changed == 'true' 
         uses: ./.github/workflows/actions/yarn-install
+
+      - name: Server / Create DB
+        if: steps.changed-files.outputs.any_changed == 'true'
+        run: PGPASSWORD=twenty psql -h localhost -p 5432 -U postgres -d postgres -c 'CREATE DATABASE "default";'
+
       - name: Website / Run migrations
+        if: steps.changed-files.outputs.changed == 'true' 
         run: npx nx database:migrate twenty-website 
         env:
-          DATABASE_PG_URL: postgres://twenty:twenty@localhost:5432/default
+          DATABASE_PG_URL: postgres://postgres:twenty@localhost:5432/default
       - name: Website / Build Website
+        if: steps.changed-files.outputs.changed == 'true' 
         run: npx nx build twenty-website
         env:
-          DATABASE_PG_URL: postgres://twenty:twenty@localhost:5432/default
+          DATABASE_PG_URL: postgres://postgres:twenty@localhost:5432/default
+
+      - name: Mark as VALID
+        if: steps.changed-files.outputs.changed != 'true'  # If no changes, mark as valid
+        run: echo "No relevant changes detected. CI is valid."    

.github/workflows/playwright.yml.bak

@@ -1,27 +0,0 @@
-name: Playwright Tests
-on:
-  push:
-    branches: [ main, master ]
-  pull_request:
-    branches: [ main, master ]
-jobs:
-  test:
-    timeout-minutes: 60
-    runs-on: ubuntu-latest
-    steps:
-    - uses: actions/checkout@v4
-    - uses: actions/setup-node@v4
-      with:
-        node-version: lts/*
-    - name: Install dependencies
-      run: npm install -g yarn && yarn
-    - name: Install Playwright Browsers
-      run: yarn playwright install --with-deps
-    - name: Run Playwright tests
-      run: yarn test:e2e companies
-    - uses: actions/upload-artifact@v4
-      if: always()
-      with:
-        name: playwright-report
-        path: playwright-report/
-        retention-days: 30

.gitignore

@@ -29,3 +29,4 @@ storybook-static
 .nyc_output
 test-results/
 dump.rdb
+.tinyb

.vscode/settings.json

@@ -45,5 +45,5 @@
   "search.exclude": {
     "**/.yarn": true,
   },
-  "eslint.debug": true
+  "eslint.debug": true,
 }

.vscode/twenty.code-workspace

@@ -24,10 +24,6 @@
       "name": "packages/twenty-emails",
       "path": "../packages/twenty-emails"
     },
-    {
-      "name": "packages/twenty-postgres",
-      "path": "../packages/twenty-postgres"
-    },
     {
       "name": "packages/twenty-server",
       "path": "../packages/twenty-server"

LICENSE

@@ -1,3 +1,8 @@
+
+This project is mostly licensed under the GNU General Public License (GPL) as described below. However, certain files within this project are licensed under a different commercial license. These files are clearly marked with the following comment at the top of the file: /* @license Enterprise */
+Files with this comment are not licensed under the aGPL v3, but instead are subject to the commercial license terms defined later in this file. 
+
+
                     GNU AFFERO GENERAL PUBLIC LICENSE
                        Version 3, 19 November 2007
 
@@ -659,3 +664,47 @@ specific requirements.
 if any, to sign a "copyright disclaimer" for the program, if necessary.
 For more information on this, and how to apply and follow the GNU AGPL, see
 <https://www.gnu.org/licenses/>.
+
+
+
+------------------------------------
+
+
+
+                    The Twenty.com Commercial License (the “Commercial License”)
+                    Copyright (c) 2023-present Twenty.com, PBC
+
+With regard to Twenty's Software:
+
+This part of the software and associated documentation files (the "Software") may only be
+used in production, if you (and any entity that you represent) have agreed to,
+and are in compliance with, the Terms available
+at https://twenty.com/legal/terms, or other agreements governing
+the use of the Software, as mutually agreed by you and Twenty.com, PBC ("Twenty"),
+and otherwise have a valid Twenty Enterprise Edition subscription
+for the correct number of hosts and seats as defined in the Commercial Terms.
+Subject to the foregoing sentence,
+you are free to modify this Software and publish patches to the Software. You agree
+that Twenty and/or its licensors (as applicable) retain all right, title and interest in
+and to all such modifications and/or patches, and all such modifications and/or
+patches may only be used, copied, modified, displayed, distributed, or otherwise
+exploited with a valid Commercial Subscription for the correct number of hosts and seats.
+Notwithstanding the foregoing, you may copy and modify the Software for development
+and testing purposes, without requiring a subscription. You agree that Twenty.Com and/or
+its licensors (as applicable) retain all right, title and interest in and to all such
+modifications. You are not granted any other rights beyond what is expressly stated herein.
+Subject to the foregoing, it is forbidden to copy, merge, publish, distribute, sublicense,
+and/or sell the Software.
+
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+For all third party components incorporated into the Twenty Software, those
+components are licensed under the original license provided by the owner of the
+applicable component.

Makefile

@@ -1,26 +1,20 @@
-docker-dev-build:
-	make -C packages/twenty-docker dev-build
-
-docker-dev-up:
-	make -C packages/twenty-docker dev-up
-
-docker-dev-start:
-	make -C packages/twenty-docker dev-start
-
-docker-dev-stop:
-	make -C packages/twenty-docker dev-stop
-
-docker-dev-sh:
-	make -C packages/twenty-docker dev-sh
-
 postgres-on-docker:
-	make -C packages/twenty-postgres provision-on-docker
+	docker run -d \
+	--name twenty_pg \
+	-e PGUSER_SUPERUSER=postgres \
+	-e PGPASSWORD_SUPERUSER=twenty \
+	-e ALLOW_NOSSL=true \
+	-v twenty_db_data:/home/postgres/pgdata \
+	-p 5432:5432 \
+	twentycrm/twenty-postgres-spilo:latest
+	@echo "Waiting for PostgreSQL to be ready..."
+	@until PGPASSWORD=twenty psql -h localhost -p 5432 -U postgres -d postgres \
+		-c 'SELECT pg_is_in_recovery();' 2>/dev/null | grep -q 'f'; do \
+		sleep 1; \
+	done
+	PGPASSWORD=twenty psql -h localhost -p 5432 -U postgres -d postgres \
+		-c "CREATE DATABASE \"default\" WITH OWNER postgres;" \
+		-c "CREATE DATABASE \"test\" WITH OWNER postgres;"
 
-postgres-on-macos-arm:
-	make -C packages/twenty-postgres provision-on-macos-arm
-
-postgres-on-macos-intel:
-	make -C packages/twenty-postgres provision-on-macos-intel
-
-postgres-on-linux:
-	make -C packages/twenty-postgres provision-on-linux
+redis-on-docker:
+	docker run -d --name twenty_redis -p 6379:6379 redis/redis-stack-server:latest

README.md

@@ -1,12 +1,3 @@
-<p align="center">
-  <a href="https://oss.gg/">
-    <picture>
-      <source media="(prefers-color-scheme: dark)" srcset="https://github.com/twentyhq/twenty/blob/33be2dbbe14eea00445010ecb9cd53ed603c01d5/packages/twenty-website/public/images/readme/Github%20Read-me%20banner.png">
-      <source media="(prefers-color-scheme: light)" srcset="https://github.com/twentyhq/twenty/blob/33be2dbbe14eea00445010ecb9cd53ed603c01d5/packages/twenty-website/public/images/readme/Github%20Read-me%20banner.png">
-      <img src="./packages/twenty-website/public/images/readme/Github%20Read-me%20banner.png" alt="Hacktoberfest" />
-    </picture>
-  </a>
-</p>
 
 <br>
 <p align="center">

install.sh

@@ -45,7 +45,7 @@ trap on_exit EXIT
 
 # Use environment variables VERSION and BRANCH, with defaults if not set
 version=${VERSION:-$(curl -s https://api.github.com/repos/twentyhq/twenty/releases/latest | grep '"tag_name":' | cut -d '"' -f 4)}
-branch=${BRANCH:-main}
+branch=${BRANCH:-$version}
 
 echo "🚀 Using version $version and branch $branch"
 
@@ -72,7 +72,7 @@ done
 echo "📁 Creating directory '$dir_name'"
 mkdir -p "$dir_name" && cd "$dir_name" || { echo "❌ Failed to create/access directory '$dir_name'"; exit 1; }
 
-# Copy the twenty/packages/twenty-docker/docker-compose.yml file in it
+# Copy twenty/packages/twenty-docker/docker-compose.yml in it
 echo -e "\t• Copying docker-compose.yml"
 curl -sLo docker-compose.yml https://raw.githubusercontent.com/twentyhq/twenty/$branch/packages/twenty-docker/docker-compose.yml
 
@@ -91,10 +91,9 @@ fi
 
 # Generate random strings for secrets
 echo "# === Randomly generated secrets ===" >>.env
-echo "ACCESS_TOKEN_SECRET=$(openssl rand -base64 32)" >>.env
-echo "LOGIN_TOKEN_SECRET=$(openssl rand -base64 32)" >>.env
-echo "REFRESH_TOKEN_SECRET=$(openssl rand -base64 32)" >>.env
-echo "FILE_TOKEN_SECRET=$(openssl rand -base64 32)" >>.env
+echo "APP_SECRET=$(openssl rand -base64 32)" >>.env
+echo "" >>.env
+echo "PGPASSWORD_SUPERUSER=$(openssl rand -hex 16)" >>.env
 echo "" >>.env
 echo "POSTGRES_ADMIN_PASSWORD=$(openssl rand -base64 32)" >>.env
 

nx.json

@@ -108,12 +108,11 @@
     "storybook:build": {
       "executor": "nx:run-commands",
       "cache": true,
-      "dependsOn": ["^build"],
       "inputs": ["^default", "excludeTests"],
       "outputs": ["{projectRoot}/{options.output-dir}"],
       "options": {
         "cwd": "{projectRoot}",
-        "command": "storybook build",
+        "command": "VITE_DISABLE_ESLINT_CHECKER=true storybook build",
         "output-dir": "storybook-static",
         "config-dir": ".storybook"
       }
@@ -192,16 +191,7 @@
       "executor": "nx:run-commands",
       "options": {
         "commands": [
-          "npx concurrently --kill-others --success=first -n SB,TEST 'nx storybook:serve:static {projectName} --port={args.port}' 'npx wait-on tcp:{args.port} && nx storybook:test {projectName} --port={args.port}'"
-        ],
-        "port": 6006
-      }
-    },
-    "storybook:serve-and-test:static:performance": {
-      "executor": "nx:run-commands",
-      "options": {
-        "commands": [
-          "npx concurrently --kill-others --success=first -n SB,TEST 'nx storybook:serve:dev {projectName} --configuration=performance --port={args.port}' 'npx wait-on tcp:{args.port} && nx storybook:test:no-coverage {projectName} --port={args.port} --configuration=performance'"
+          "npx concurrently --kill-others --success=first -n SB,TEST 'nx storybook:serve:static {projectName} --port={args.port} --configuration={args.performance}' 'npx wait-on tcp:{args.port} && nx storybook:test {projectName} --port={args.port} --configuration={args.scope}'"
         ],
         "port": 6006
       }

oss-gg/twenty-content-challenges/1-create-youtube-video-about-20.md

@@ -1,21 +0,0 @@
-**Side Quest**: Create a YouTube Video about Twenty showcasing a specific way to use Twenty effectively.
-**Points**: 750 Points
-**Proof**: Add your oss handle and YouTube video link to the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » YouTube Link: https://link.to/content
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 02-October-2024 by [yourhandle](https://oss.gg/yourhandle) YouTube Link: [YouTube](https://twenty.com/)
-
----

oss-gg/twenty-content-challenges/2-write-blog-post-about-20.md

@@ -1,21 +0,0 @@
-**Side Quest**: Write a blog post about sharing your experience using Twenty in a detailed format on any platform.
-**Points**: 750 Points
-**Proof**: Add your oss handle and blog link to the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » blog Link: https://link.to/content
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 02-October-2024 by [yourhandle](https://oss.gg/yourhandle) blog Link: [blog](https://twenty.com/)
-
----

oss-gg/twenty-content-challenges/3-write-selfthost-guide-blog-post-20.md

@@ -1,21 +0,0 @@
-**Side Quest**: Write a blog post about self-hosting Twenty in a detailed format on any platform.
-**Points**: 750 Points
-**Proof**: Add your oss handle and blog link to the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » blog Link: https://link.to/content
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 02-October-2024 by [yourhandle](https://oss.gg/yourhandle) blog Link: [blog](https://twenty.com/)
-
----

oss-gg/twenty-content-challenges/4-create-promotional-video-20-share.md

@@ -1,21 +0,0 @@
-**Side Quest**: Create a promotional video for Twenty and share it on social media.
-**Points**: 750 Points
-**Proof**: Add your oss handle and video link to the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » video Link: https://link.to/content
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 02-October-2024 by [yourhandle](https://oss.gg/yourhandle) video Link: [video](https://twenty.com/)
-
----

oss-gg/twenty-design-challenges/1-design-promotional-poster-20-share.md

@@ -1,23 +0,0 @@
-**Side Quest**: Design a promotional poster of Twenty and share it on social media.
-**Points**: 300 Points
-**Proof**: Add your oss handle and poster link to the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » poster Link: https://link.to/content
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 02-October-2024 by [yourhandle](https://oss.gg/yourhandle) poster Link: [poster](https://twenty.com/)
-
-» 11-October-2024 by [thefool76](https://oss.gg/thefool76) poster Link: [poster](https://drive.google.com/file/d/1cIC1eitvY6zKVTXKq2LnVrS_2Ho9H8-P/view?usp=sharing)
-
----

oss-gg/twenty-design-challenges/2-design-new-logo-twenty.md

@@ -1,24 +0,0 @@
-**Side Quest**: Design/Create new Twenty logo, tweet your design, and mention @twentycrm.
-**Points**: 300 Points
-**Proof**: Create a logo uploade it on any of the platform and add your oss handle and logo link to the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » Logo Link: https://link.to/content » tweet Link: https://link.to/content
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 08-October-2024 by [adityadeshlahre](https://oss.gg/adityadeshlahre) Logo Link: [logo](https://drive.google.com/drive/folders/13k22xMnX2fhnWK94vas_hO1t-ImqXcHZ?usp=drive_link) » tweet Link: [tweet](https://x.com/adityadeshlahre/status/1843354963176718374)
-
-» 11-October-2024 by [thefool76](https://oss.gg/thefool76) Logo Link: [logo](https://drive.google.com/file/d/1DxSwNY_i90kGgWzPQj5SxScBz_6r02l4/view?usp=sharing) » tweet Link: [tweet](https://x.com/thefool1135/status/1844693487067034008)
-
-
----

oss-gg/twenty-design-challenges/3-create-custom-interfact-theme-20.md

@@ -1,21 +0,0 @@
-**Side Quest**: Duplicate the Figma file from the main repo and customize the variables to create a unique interface theme for Twenty.
-**Points**: 750 Points
-**Proof**: Add your oss handle and Figma link to the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » Figma Link: https://link.to/content 
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 02-October-2024 by [yourhandle](https://oss.gg/yourhandle) Figma Link: [Figma](https://twenty.com/)
-
----

oss-gg/twenty-dev-challenges/1-write-migration-script-other-crm-to-20.md

@@ -1,21 +0,0 @@
-**Side Quest**: Develop a script to facilitate the migration of data from another CRM to Twenty. 
-**Points**: 750 Points
-**Proof**: Add your oss handle and record video and share link to the list below. In video show the working proof of your created script.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » video Link: https://link.to/content
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 02-October-2024 by [yourhandle](https://oss.gg/yourhandle) video Link: [video](https://twenty.com/)
-
----

oss-gg/twenty-dev-challenges/2-create-raycast-integration-for-20.md

@@ -1,21 +0,0 @@
-**Side Quest**: Develop an integration for Raycast that enables users to create records on any object within Twenty directly from Raycast.
-**Points**: 1500 Points
-**Proof**: Add your oss handle and record video and share link to the list below. In video show the workflow of the your integration created and perform some task.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » video Link: https://link.to/content
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 02-October-2024 by [yourhandle](https://oss.gg/yourhandle) video Link: [video](https://twenty.com/)
-
----

oss-gg/twenty-no-code-challenges/1-create-n8n-template-integrate-20-API.md

@@ -1,21 +0,0 @@
-**Side Quest**: Create an n8n workflow that empowers Twenty by connecting it to another tool.
-**Points**: 750 Points
-**Proof**: Add your oss handle and template link to the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » template Link: https://link.to/content
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 02-October-2024 by [yourhandle](https://oss.gg/yourhandle) template Link: [template](https://twenty.com/)
-
----

oss-gg/twenty-no-code-challenges/2-write-selfthost-guide-blog-post-20.md

@@ -1,21 +0,0 @@
-**Side Quest**: Write a comprehensive guide on how to integrate Twenty with marketing automation tool (n8n, Zapier). Include a concrete use case and explain how to leverage AI to write API requests for non-developers and share it.
-**Points**: 1500 Points
-**Proof**: Add your oss handle and guide link to the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR oss.gg HANDLE » guide Link: https://link.to/content
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 02-October-2024 by [yourhandle](https://oss.gg/yourhandle) guide Link: [guide](https://twenty.com/)
-
----

oss-gg/twenty-side-quest/1-quote-tweet-20-oss-gg-launch.md

@@ -1,30 +0,0 @@
-**Side Quest**: Like & Re-Tweet oss.gg Launch Tweet. Quote-tweet it tagging @twentycrm to say you’ll be contributing.
-**Points**: 50 Points
-**Proof**: Add a screenshot of the retweet to the PR description. Add a link to your retweet in the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR NAME
-» Link to Tweet: https://x.com/...
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 10-October-2024 by Devansh Baghel
-» Link to Tweet: https://x.com/DevanshBaghel5/status/1844359648037748954
-
-» 11-October-2024 by Bhavesh Mishra
-» Link to Tweet: https://x.com/thefool1135/status/1844453425188405326
-
-» 11-October-2024 by Chirag Arora
-» Link to Tweet: https://x.com/Chirag8023/status/1844689900668682699
-
-» 11-October-2024 by Aritra Sadhukhan
-» Link to Tweet: https://x.com/AritraDevelops/status/1844670236512878646

oss-gg/twenty-side-quest/2-tweet-about-fav-twenty-feature.md

@@ -1,26 +0,0 @@
-**Side Quest**: Share a tweet about your favorite feature in Twenty. Tweet about your favorite feature in Twenty and mention @twentycrm.
-**Points**: 50 Points
-**Proof**: Add a screenshot of the tweet to the PR description. Add a link to your tweet in the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR NAME
-» Link to Tweet: https://x.com/...
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 10-October-2024 by Devansh Baghel
-» Link to Tweet: https://x.com/DevanshBaghel5/status/1844384722119704972
-
-» 11-October-2024 by Bhavesh Mishra
-» Link to Tweet: https://x.com/thefool1135/status/1844456500380696969
-
----

oss-gg/twenty-side-quest/3-bug-report.md

@@ -1,23 +0,0 @@
-**Side Quest**: Create a bug report. Use the Twenty bug issue template to report a bug in detail, including steps to reproduce it.
-**Points**: 50-150 Points
-**Proof**: Add a link to your bug report in the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR NAME
-» Link to bug report: https://github.com/twentyhq/twenty/issues/...
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 10-October-2024 by Devansh Baghel
-» Link to bug report: https://github.com/twentyhq/twenty/issues/7560
-
----

oss-gg/twenty-side-quest/4-meme-magic.md

@@ -1,26 +0,0 @@
-**Side Quest**: Meme Magic: Craft a meme where the number twenty plays a role. Tweet it, and tag @twentycrm.
-**Points**: 150 Points
-**Proof**: Add a screenshot of meme to the PR description. Add a link to your tweet in the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR NAME
-» Link to Tweet: https://x.com/...
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 10-October-2024 by Teddy ASSIH
-» Link to Tweet: https://x.com/ion_finisher/status/1844389252253299173
-
-» 11-October-2024 by Bhavesh Mishra
-» Link to Tweet: https://x.com/thefool1135/status/1844458836402503931
-
----

oss-gg/twenty-side-quest/5-gif-magic.md

@@ -1,26 +0,0 @@
-**Side Quest**: Gif Magic: Create a gif related to Twenty. Tweet it, and tag  @twentycrm.
-**Points**: 150 Points
-**Proof**: Add a screenshot of GIF on Giphy to the PR description. Add a link to your GIPHY in the list below.
-
-Please follow the following schema:
-
----
-
-» 05-April-2024 by YOUR NAME
-» Link to gif: https://giphy.com/...
-
----
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 10-October-2024 by Teddy ASSIH
-» Link to gif: https://giphy.com/gifs/oss-crm-twenty-VWDHAIlGTbc6Nqdza9
-
-» 11-October-2024 by Bhavesh Mishra
-» Link to gif: https://shorturl.at/yln9H
-
----

oss-gg/twenty-side-quest/6-quest-wizard.md

@@ -1,19 +0,0 @@
-**Side Quest**: Complete all Twenty side quests
-**Points**: 300 Points
-**Proof**: Add screenshots for each side quest to the PR description. Add your name to the list below.
-
-Please follow the following schema:
-
----
-
- » 05-April-2024 by YOUR NAME
-
-////////////////////////////
-
-Your turn 👇
-
-////////////////////////////
-
-» 01-October-2024 by X
-
----

package.json

@@ -23,6 +23,7 @@
     "@linaria/core": "^6.2.0",
     "@linaria/react": "^6.2.1",
     "@mdx-js/react": "^3.0.0",
+    "@microsoft/microsoft-graph-client": "^3.0.7",
     "@nestjs/apollo": "^11.0.5",
     "@nestjs/axios": "^3.0.1",
     "@nestjs/cli": "^9.0.0",
@@ -49,6 +50,7 @@
     "@stoplight/elements": "^8.0.5",
     "@swc/jest": "^0.2.29",
     "@tabler/icons-react": "^2.44.0",
+    "@tiptap/extension-hard-break": "^2.9.1",
     "@types/dompurify": "^3.0.5",
     "@types/facepaint": "^1.2.5",
     "@types/lodash.camelcase": "^4.3.7",
@@ -176,6 +178,7 @@
     "scroll-into-view": "^1.16.2",
     "semver": "^7.5.4",
     "sharp": "^0.32.1",
+    "slash": "^5.1.0",
     "stripe": "^14.17.0",
     "ts-key-enum": "^2.0.12",
     "tslib": "^2.3.0",
@@ -199,6 +202,7 @@
     "@graphql-codegen/typescript": "^3.0.4",
     "@graphql-codegen/typescript-operations": "^3.0.4",
     "@graphql-codegen/typescript-react-apollo": "^3.3.7",
+    "@microsoft/microsoft-graph-types": "^2.40.0",
     "@nestjs/cli": "^9.0.0",
     "@nestjs/schematics": "^9.0.0",
     "@nestjs/testing": "^9.0.0",
@@ -294,6 +298,7 @@
     "eslint-plugin-jsx-a11y": "^6.8.0",
     "eslint-plugin-prefer-arrow": "^1.2.3",
     "eslint-plugin-prettier": "^5.1.2",
+    "eslint-plugin-project-structure": "^3.9.1",
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-react-refresh": "^0.4.4",
@@ -347,7 +352,7 @@
   "version": "0.2.1",
   "nx": {},
   "scripts": {
-    "start": "npx nx run-many -t start -p twenty-server twenty-front"
+    "start": "npx concurrently --kill-others 'npx nx run-many -t start -p twenty-server twenty-front' 'npx wait-on tcp:3000 && npx nx run twenty-server:worker'"
   },
   "workspaces": {
     "packages": [

packages/twenty-chrome-extension/src/options/Loading.tsx

@@ -1,6 +1,5 @@
-import styled from '@emotion/styled';
-
 import { Loader } from '@/ui/display/loader/components/Loader';
+import styled from '@emotion/styled';
 
 const StyledContainer = styled.div`
   align-items: center;

packages/twenty-chrome-extension/src/options/modules/ui/display/typography/components/H2Title.tsx

@@ -3,7 +3,7 @@ import styled from '@emotion/styled';
 type H2TitleProps = {
   title: string;
   description?: string;
-  addornment?: React.ReactNode;
+  adornment?: React.ReactNode;
 };
 
 const StyledContainer = styled.div`
@@ -33,11 +33,11 @@ const StyledDescription = styled.h3`
   margin-top: ${({ theme }) => theme.spacing(3)};
 `;
 
-export const H2Title = ({ title, description, addornment }: H2TitleProps) => (
+export const H2Title = ({ title, description, adornment }: H2TitleProps) => (
   <StyledContainer>
     <StyledTitleContainer>
       <StyledTitle>{title}</StyledTitle>
-      {addornment}
+      {adornment}
     </StyledTitleContainer>
     {description && <StyledDescription>{description}</StyledDescription>}
   </StyledContainer>

packages/twenty-chrome-extension/src/options/modules/ui/input/components/TextInput.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import styled from '@emotion/styled';
+import React, { useId } from 'react';
 
 interface TextInputProps {
   label?: string;
@@ -18,7 +18,7 @@ const StyledContainer = styled.div<{ fullWidth?: boolean }>`
   margin-bottom: ${({ theme }) => theme.spacing(4)};
 `;
 
-const StyledLabel = styled.span`
+const StyledLabel = styled.label`
   color: ${({ theme }) => theme.font.color.light};
   font-size: ${({ theme }) => theme.font.size.xs};
   font-weight: ${({ theme }) => theme.font.weight.semiBold};
@@ -65,12 +65,15 @@ const TextInput: React.FC<TextInputProps> = ({
   placeholder,
   icon,
 }) => {
+  const inputId = useId();
+
   return (
     <StyledContainer fullWidth={fullWidth}>
-      {label && <StyledLabel>{label}</StyledLabel>}
+      {label && <StyledLabel htmlFor={inputId}>{label}</StyledLabel>}
       <StyledInputContainer>
         {icon && <StyledIcon>{icon}</StyledIcon>}
         <StyledInput
+          id={inputId}
           type="text"
           value={value}
           onChange={(e) => onChange(e.target.value)}

packages/twenty-docker/.env.example

@@ -1,18 +1,15 @@
 TAG=latest
 
-# POSTGRES_ADMIN_PASSWORD=replace_me_with_a_strong_password
+#PGUSER_SUPERUSER=postgres
+#PGPASSWORD_SUPERUSER=replace_me_with_a_strong_password
 
 PG_DATABASE_HOST=db:5432
+REDIS_URL=redis://redis:6379
 
 SERVER_URL=http://localhost:3000
-# REDIS_HOST=redis
-# REDIS_PORT=6379
 
 # Use openssl rand -base64 32 for each secret
-# ACCESS_TOKEN_SECRET=replace_me_with_a_random_string_access
-# LOGIN_TOKEN_SECRET=replace_me_with_a_random_string_login
-# REFRESH_TOKEN_SECRET=replace_me_with_a_random_string_refresh
-# FILE_TOKEN_SECRET=replace_me_with_a_random_string_refresh
+# APP_SECRET=replace_me_with_a_random_string
 
 SIGN_IN_PREFILLED=true
 

packages/twenty-docker/Makefile

@@ -1,37 +1,9 @@
-dev-build:
-	@docker compose -f dev/docker-compose.yml down -v
-	@docker compose -f dev/docker-compose.yml build
-
-dev-up:
-	@docker compose -f dev/docker-compose.yml up -d
-
-dev-start:
-	@docker compose -f dev/docker-compose.yml start
-
-dev-stop:
-	@docker compose -f dev/docker-compose.yml stop
-
-dev-down:
-	@docker compose -f dev/docker-compose.yml down -v
-
-dev-sh:
-	@docker compose -f dev/docker-compose.yml exec twenty-dev sh
-
-dev-postgres-build:
-	@docker stop twenty_postgres || true
-	@docker rm twenty_postgres || true
-	@docker volume rm twenty_db_data || true
-	@docker compose -f dev/docker-compose.yml up --build postgres -d
-
 prod-build:
 	@cd ../.. && docker build -f ./packages/twenty-docker/twenty/Dockerfile --tag twenty . && cd -
 
 prod-run:
 	@docker run -d -p 3000:3000 --name twenty twenty
 
-prod-postgres-build:
-	@cd ../.. && docker build -f ./packages/twenty-docker/twenty-postgres/Dockerfile --tag twenty-postgres . && cd -
-
 prod-postgres-run:
 	@docker run -d -p 5432:5432 -e POSTGRES_USER=postgres -e POSTGRES_PASSWORD=postgres --name twenty-postgres twenty-postgres
 
@@ -40,11 +12,3 @@ prod-website-build:
 
 prod-website-run:
 	@docker run -d -p 3000:3000 --name twenty-website twenty-website
-
-release-postgres:
-	@cd ../.. && docker buildx build \
-		--push \
-		--no-cache \
-		--platform linux/amd64,linux/arm64 \
-		-f ./packages/twenty-docker/twenty-postgres/Dockerfile -t twentycrm/twenty-postgres:$(version) -t twentycrm/twenty-postgres:latest . \
-		&& cd -

packages/twenty-docker/docker-compose.yml

@@ -22,11 +22,10 @@ services:
       - "3000:3000"
     environment:
       PORT: 3000
-      PG_DATABASE_URL: postgres://twenty:twenty@${PG_DATABASE_HOST}/default
+      PG_DATABASE_URL: postgres://${PGUSER_SUPERUSER:-postgres}:${PGPASSWORD_SUPERUSER:-twenty}@${PG_DATABASE_HOST:-db:5432}/default
       SERVER_URL: ${SERVER_URL}
       FRONT_BASE_URL: ${FRONT_BASE_URL:-$SERVER_URL}
-      REDIS_PORT: ${REDIS_PORT:-6379}
-      REDIS_HOST: ${REDIS_HOST:-redis}
+      REDIS_URL: ${REDIS_URL:-redis://redis:6379}
 
       ENABLE_DB_MIGRATIONS: "true"
 
@@ -36,10 +35,7 @@ services:
       STORAGE_S3_NAME: ${STORAGE_S3_NAME}
       STORAGE_S3_ENDPOINT: ${STORAGE_S3_ENDPOINT}
 
-      ACCESS_TOKEN_SECRET: ${ACCESS_TOKEN_SECRET}
-      LOGIN_TOKEN_SECRET: ${LOGIN_TOKEN_SECRET}
-      REFRESH_TOKEN_SECRET: ${REFRESH_TOKEN_SECRET}
-      FILE_TOKEN_SECRET: ${FILE_TOKEN_SECRET}
+      APP_SECRET: ${APP_SECRET}
     depends_on:
       change-vol-ownership:
         condition: service_completed_successfully
@@ -56,11 +52,10 @@ services:
     image: twentycrm/twenty:${TAG}
     command: ["yarn", "worker:prod"]
     environment:
-      PG_DATABASE_URL: postgres://twenty:twenty@${PG_DATABASE_HOST}/default
+      PG_DATABASE_URL: postgres://${PGUSER_SUPERUSER:-postgres}:${PGPASSWORD_SUPERUSER:-twenty}@${PG_DATABASE_HOST:-db:5432}/default
       SERVER_URL: ${SERVER_URL}
       FRONT_BASE_URL: ${FRONT_BASE_URL:-$SERVER_URL}
-      REDIS_PORT: ${REDIS_PORT:-6379}
-      REDIS_HOST: ${REDIS_HOST:-redis}
+      REDIS_URL: ${REDIS_URL:-redis://redis:6379}
 
       ENABLE_DB_MIGRATIONS: "false" # it already runs on the server
 
@@ -69,10 +64,7 @@ services:
       STORAGE_S3_NAME: ${STORAGE_S3_NAME}
       STORAGE_S3_ENDPOINT: ${STORAGE_S3_ENDPOINT}
 
-      ACCESS_TOKEN_SECRET: ${ACCESS_TOKEN_SECRET}
-      LOGIN_TOKEN_SECRET: ${LOGIN_TOKEN_SECRET}
-      REFRESH_TOKEN_SECRET: ${REFRESH_TOKEN_SECRET}
-      FILE_TOKEN_SECRET: ${FILE_TOKEN_SECRET}
+      APP_SECRET: ${APP_SECRET}
     depends_on:
       db:
         condition: service_healthy
@@ -81,13 +73,16 @@ services:
     restart: always
 
   db:
-    image: twentycrm/twenty-postgres:${TAG}
+    image: twentycrm/twenty-postgres-spilo:${TAG}
     volumes:
-      - db-data:/bitnami/postgresql
+      - db-data:/home/postgres/pgdata
     environment:
-      POSTGRES_PASSWORD: ${POSTGRES_ADMIN_PASSWORD}
+      PGUSER_SUPERUSER: ${PGUSER_SUPERUSER:-postgres}
+      PGPASSWORD_SUPERUSER: ${PGPASSWORD_SUPERUSER:-twenty}
+      ALLOW_NOSSL: "true"
+      SPILO_PROVIDER: "local"
     healthcheck:
-      test: pg_isready -U twenty -d default
+      test: pg_isready -U ${PGUSER_SUPERUSER:-postgres} -h localhost -d postgres
       interval: 5s
       timeout: 5s
       retries: 10
@@ -95,8 +90,6 @@ services:
 
   redis:
     image: redis
-    ports:
-      - "6379:6379"
     restart: always
 
 volumes:

packages/twenty-docker/k8s/manifests/deployment-db.yaml

@@ -30,10 +30,10 @@ spec:
           image: twentycrm/twenty-postgres:latest
           imagePullPolicy: Always
           env:
-            - name: POSTGRES_PASSWORD
+            - name: PGUSER_SUPERUSER
+              value: "postgres"
+            - name: PGPASSWORD_SUPERUSER
               value: "twenty"
-            - name: BITNAMI_DEBUG
-              value: "true"
           ports:
             - containerPort: 5432
               name: tcp
@@ -48,7 +48,7 @@ spec:
           stdin: true
           tty: true
           volumeMounts:
-            - mountPath: /bitnami/postgresql
+            - mountPath: /home/postgres/pgdata
               name: twentycrm-db-data
       dnsPolicy: ClusterFirst
       restartPolicy: Always

packages/twenty-docker/k8s/manifests/deployment-server.yaml

@@ -40,11 +40,9 @@ spec:
             - name: FRONT_BASE_URL
               value: "https://crm.example.com:443"
             - name: "PG_DATABASE_URL"
-              value: "postgres://twenty:twenty@twenty-db.twentycrm.svc.cluster.local/default"
-            - name: "REDIS_HOST"
-              value: "twentycrm-redis.twentycrm.svc.cluster.local"
-            - name: "REDIS_PORT"
-              value: 6379
+              value: "postgres://postgres:twenty@twenty-db.twentycrm.svc.cluster.local/default"
+            - name: "REDIS_URL"
+              value: "redis://twentycrm-redis.twentycrm.svc.cluster.local:6379"
             - name: ENABLE_DB_MIGRATIONS
               value: "true"
             - name: SIGN_IN_PREFILLED
@@ -57,26 +55,11 @@ spec:
               value: "7d"
             - name: "LOGIN_TOKEN_EXPIRES_IN"
               value: "1h"
-            - name: ACCESS_TOKEN_SECRET
+            - name: APP_SECRET
               valueFrom:
                 secretKeyRef:
                   name: tokens
                   key: accessToken
-            - name: LOGIN_TOKEN_SECRET
-              valueFrom:
-                secretKeyRef:
-                  name: tokens
-                  key: loginToken
-            - name: REFRESH_TOKEN_SECRET
-              valueFrom:
-                secretKeyRef:
-                  name: tokens
-                  key: refreshToken
-            - name: FILE_TOKEN_SECRET
-              valueFrom:
-                secretKeyRef:
-                  name: tokens
-                  key: fileToken
           ports:
             - containerPort: 3000
               name: http-tcp

packages/twenty-docker/k8s/manifests/deployment-worker.yaml

@@ -31,7 +31,7 @@ spec:
             - name: FRONT_BASE_URL
               value: "https://crm.example.com:443"
             - name: PG_DATABASE_URL
-              value: "postgres://twenty:twenty@twenty-db.twentycrm.svc.cluster.local/default"
+              value: "postgres://postgres:twenty@twenty-db.twentycrm.svc.cluster.local/default"
             - name: ENABLE_DB_MIGRATIONS
               value: "false" # it already runs on the server
             - name: STORAGE_TYPE
@@ -40,30 +40,13 @@ spec:
               value: "bull-mq"
             - name: "CACHE_STORAGE_TYPE"
               value: "redis"
-            - name: "REDIS_HOST"
-              value: "twentycrm-redis.twentycrm.svc.cluster.local"
-            - name: "REDIS_PORT"
-              value: 6379
-            - name: ACCESS_TOKEN_SECRET
+            - name: "REDIS_URL"
+              value: "redis://twentycrm-redis.twentycrm.svc.cluster.local:6379"
+            - name: APP_SECRET
               valueFrom:
                 secretKeyRef:
                   name: tokens
                   key: accessToken
-            - name: LOGIN_TOKEN_SECRET
-              valueFrom:
-                secretKeyRef:
-                  name: tokens
-                  key: loginToken
-            - name: REFRESH_TOKEN_SECRET
-              valueFrom:
-                secretKeyRef:
-                  name: tokens
-                  key: refreshToken
-            - name: FILE_TOKEN_SECRET
-              valueFrom:
-                secretKeyRef:
-                  name: tokens
-                  key: fileToken
           command:
             - yarn
             - worker:prod

packages/twenty-docker/k8s/terraform/README.md

@@ -51,7 +51,7 @@ To make configuration changes to how this doc is generated, see `./.terraform-do
 | <a name="input_twentycrm_app_hostname"></a> [twentycrm\_app\_hostname](#input\_twentycrm\_app\_hostname) | The protocol, DNS fully qualified hostname, and port used to access TwentyCRM in your environment. Ex: https://crm.example.com:443 | `string` | n/a | yes |
 | <a name="input_twentycrm_pgdb_admin_password"></a> [twentycrm\_pgdb\_admin\_password](#input\_twentycrm\_pgdb\_admin\_password) | TwentyCRM password for postgres database. | `string` | n/a | yes |
 | <a name="input_twentycrm_app_name"></a> [twentycrm\_app\_name](#input\_twentycrm\_app\_name) | A friendly name prefix to use for every component deployed. | `string` | `"twentycrm"` | no |
-| <a name="input_twentycrm_db_image"></a> [twentycrm\_db\_image](#input\_twentycrm\_db\_image) | TwentyCRM image for database deployment. This defaults to latest. | `string` | `"twentycrm/twenty-postgres:latest"` | no |
+| <a name="input_twentycrm_db_image"></a> [twentycrm\_db\_image](#input\_twentycrm\_db\_image) | TwentyCRM image for database deployment. This defaults to latest. | `string` | `"twentycrm/twenty-postgres-spilo:latest"` | no |
 | <a name="input_twentycrm_db_pv_capacity"></a> [twentycrm\_db\_pv\_capacity](#input\_twentycrm\_db\_pv\_capacity) | Storage capacity provisioned for database persistent volume. | `string` | `"10Gi"` | no |
 | <a name="input_twentycrm_db_pv_path"></a> [twentycrm\_db\_pv\_path](#input\_twentycrm\_db\_pv\_path) | Local path to use to store the physical volume if using local storage on nodes. | `string` | `""` | no |
 | <a name="input_twentycrm_db_pvc_requests"></a> [twentycrm\_db\_pvc\_requests](#input\_twentycrm\_db\_pvc\_requests) | Storage capacity reservation for database persistent volume claim. | `string` | `"10Gi"` | no |

packages/twenty-docker/k8s/terraform/deployment-server.tf

@@ -61,12 +61,8 @@ resource "kubernetes_deployment" "twentycrm_server" {
             value = "postgres://twenty:${var.twentycrm_pgdb_admin_password}@${kubernetes_service.twentycrm_db.metadata.0.name}.${kubernetes_namespace.twentycrm.metadata.0.name}.svc.cluster.local/default"
           }
           env {
-            name  = "REDIS_HOST"
-            value = "${kubernetes_service.twentycrm_redis.metadata.0.name}.${kubernetes_namespace.twentycrm.metadata.0.name}.svc.cluster.local"
-          }
-          env {
-            name  = "REDIS_PORT"
-            value = 6379
+            name  = "REDIS_URL"
+            value = "redis://${kubernetes_service.twentycrm_redis.metadata.0.name}.${kubernetes_namespace.twentycrm.metadata.0.name}.svc.cluster.local:6379"
           }
           env {
             name  = "ENABLE_DB_MIGRATIONS"
@@ -95,7 +91,7 @@ resource "kubernetes_deployment" "twentycrm_server" {
             value = "1h"
           }
           env {
-            name = "ACCESS_TOKEN_SECRET"
+            name = "APP_SECRET"
             value_from {
               secret_key_ref {
                 name = "tokens"
@@ -104,36 +100,6 @@ resource "kubernetes_deployment" "twentycrm_server" {
             }
           }
 
-          env {
-            name = "LOGIN_TOKEN_SECRET"
-            value_from {
-              secret_key_ref {
-                name = "tokens"
-                key  = "loginToken"
-              }
-            }
-          }
-
-          env {
-            name = "REFRESH_TOKEN_SECRET"
-            value_from {
-              secret_key_ref {
-                name = "tokens"
-                key  = "refreshToken"
-              }
-            }
-          }
-
-          env {
-            name = "FILE_TOKEN_SECRET"
-            value_from {
-              secret_key_ref {
-                name = "tokens"
-                key  = "fileToken"
-              }
-            }
-          }
-
           port {
             container_port = 3000
             protocol       = "TCP"

packages/twenty-docker/k8s/terraform/deployment-worker.tf

@@ -59,13 +59,8 @@ resource "kubernetes_deployment" "twentycrm_worker" {
           }
 
           env {
-            name  = "REDIS_HOST"
-            value = "${kubernetes_service.twentycrm_redis.metadata.0.name}.${kubernetes_namespace.twentycrm.metadata.0.name}.svc.cluster.local"
-          }
-
-          env {
-            name  = "REDIS_PORT"
-            value = 6379
+            name  = "REDIS_URL"
+            value = "redis://${kubernetes_service.twentycrm_redis.metadata.0.name}.${kubernetes_namespace.twentycrm.metadata.0.name}.svc.cluster.local:6379"
           }
 
           env {
@@ -83,7 +78,7 @@ resource "kubernetes_deployment" "twentycrm_worker" {
           }
 
           env {
-            name = "ACCESS_TOKEN_SECRET"
+            name = "APP_SECRET"
             value_from {
               secret_key_ref {
                 name = "tokens"
@@ -92,36 +87,6 @@ resource "kubernetes_deployment" "twentycrm_worker" {
             }
           }
 
-          env {
-            name = "LOGIN_TOKEN_SECRET"
-            value_from {
-              secret_key_ref {
-                name = "tokens"
-                key  = "loginToken"
-              }
-            }
-          }
-
-          env {
-            name = "REFRESH_TOKEN_SECRET"
-            value_from {
-              secret_key_ref {
-                name = "tokens"
-                key  = "refreshToken"
-              }
-            }
-          }
-
-          env {
-            name = "FILE_TOKEN_SECRET"
-            value_from {
-              secret_key_ref {
-                name = "tokens"
-                key  = "fileToken"
-              }
-            }
-          }
-
           resources {
             requests = {
               cpu    = "250m"

packages/twenty-docker/k8s/terraform/variables.tf

@@ -29,7 +29,7 @@ variable "twentycrm_server_image" {
 
 variable "twentycrm_db_image" {
   type        = string
-  default     = "twentycrm/twenty-postgres:latest"
+  default     = "twentycrm/twenty-postgres-spilo:latest"
   description = "TwentyCRM image for database deployment. This defaults to latest."
 }
 

packages/twenty-docker/scripts/1-click.sh

@@ -0,0 +1,12 @@
+pull_version=${VERSION:-$(curl -s https://api.github.com/repos/twentyhq/twenty/releases/latest | grep '"tag_name":' | cut -d '"' -f 4)}
+pull_branch=${BRANCH:-$pull_version}
+
+version_num=${pull_version#v}
+target_version="0.32.4"
+
+# We moved the install script to a different location in v0.32.4
+if [[ -n "$BRANCH" ]] || [[ "$(printf '%s\n' "$target_version" "$version_num" | sort -V | head -n1)" != "$version_num" ]]; then
+  curl -sL "https://raw.githubusercontent.com/twentyhq/twenty/$pull_branch/packages/twenty-docker/scripts/install.sh" | bash -s -- "$VERSION" "$BRANCH"
+else
+  curl -sL "https://raw.githubusercontent.com/twentyhq/twenty/$pull_branch/install.sh" | bash -s -- "$VERSION" "$BRANCH"
+fi

packages/twenty-docker/scripts/install.sh

@@ -0,0 +1,166 @@
+#!/bin/bash
+
+echo "🔧 Checking dependencies..."
+if ! command -v docker &>/dev/null; then
+  echo -e "\t❌ Docker is not installed or not in PATH. Please install Docker first.\n\t\tSee https://docs.docker.com/get-docker/"
+  exit 1
+fi
+# Check if docker compose plugin is installed
+if ! docker compose version &>/dev/null; then
+  echo -e "\t❌ Docker Compose is not installed or not in PATH (n.b. docker-compose is deprecated)\n\t\tUpdate docker or install docker-compose-plugin\n\t\tOn Linux: sudo apt-get install docker-compose-plugin\n\t\tSee https://docs.docker.com/compose/install/"
+  exit 1
+fi
+# Check if docker is started
+if ! docker info &>/dev/null; then
+  echo -e "\t❌ Docker is not running.\n\t\tPlease start Docker Desktop, Docker or check documentation at https://docs.docker.com/config/daemon/start/"
+  exit 1
+fi
+if ! command -v curl &>/dev/null; then
+  echo -e "\t❌ Curl is not installed or not in PATH.\n\t\tOn macOS: brew install curl\n\t\tOn Linux: sudo apt install curl"
+  exit 1
+fi
+
+# Check if docker compose version is >= 2
+if [ "$(docker compose version --short | cut -d' ' -f3 | cut -d'.' -f1)" -lt 2 ]; then
+  echo -e "\t❌ Docker Compose is outdated. Please update Docker Compose to version 2 or higher.\n\t\tSee https://docs.docker.com/compose/install/linux/"
+  exit 1
+fi
+# Check if docker-compose is installed, if so issue a warning if version is < 2
+if command -v docker-compose &>/dev/null; then
+  if [ "$(docker-compose version --short | cut -d' ' -f3 | cut -d'.' -f1)" -lt 2 ]; then
+    echo -e "\n\t⚠️ 'docker-compose' is installed but outdated. Make sure to use 'docker compose' or to upgrade 'docker-compose' to version 2.\n\t\tSee https://docs.docker.com/compose/install/standalone/\n"
+  fi
+fi
+
+# Catch errors
+set -e
+function on_exit {
+  # $? is the exit status of the last command executed
+  local exit_status=$?
+  if [ $exit_status -ne 0 ]; then
+    echo "❌ Something went wrong, exiting: $exit_status"
+  fi
+}
+trap on_exit EXIT
+
+# Use environment variables VERSION and BRANCH, with defaults if not set
+version=${VERSION:-$(curl -s https://api.github.com/repos/twentyhq/twenty/releases/latest | grep '"tag_name":' | cut -d '"' -f 4)}
+branch=${BRANCH:-$version}
+
+echo "🚀 Using version $version and branch $branch"
+
+dir_name="twenty"
+function ask_directory {
+  read -p "📁 Enter the directory name to setup the project (default: $dir_name): " answer
+  if [ -n "$answer" ]; then
+    dir_name=$answer
+  fi
+}
+
+ask_directory
+
+while [ -d "$dir_name" ]; do
+  read -p "🚫 Directory '$dir_name' already exists. Do you want to overwrite it? (y/N) " answer
+  if [ "$answer" = "y" ]; then
+    break
+  else
+    ask_directory
+  fi
+done
+
+# Create a directory named twenty
+echo "📁 Creating directory '$dir_name'"
+mkdir -p "$dir_name" && cd "$dir_name" || { echo "❌ Failed to create/access directory '$dir_name'"; exit 1; }
+
+# Copy twenty/packages/twenty-docker/docker-compose.yml in it
+echo -e "\t• Copying docker-compose.yml"
+curl -sLo docker-compose.yml https://raw.githubusercontent.com/twentyhq/twenty/$branch/packages/twenty-docker/docker-compose.yml
+
+# Copy twenty/packages/twenty-docker/.env.example to .env
+echo -e "\t• Setting up .env file"
+curl -sLo .env https://raw.githubusercontent.com/twentyhq/twenty/$branch/packages/twenty-docker/.env.example
+
+# Replace TAG=latest by TAG=<latest_release or version input>
+if [[ $(uname) == "Darwin" ]]; then
+  # Running on macOS
+  sed -i '' "s/TAG=latest/TAG=$version/g" .env
+else
+  # Assuming Linux
+  sed -i'' "s/TAG=latest/TAG=$version/g" .env
+fi
+
+# Generate random strings for secrets
+echo "# === Randomly generated secrets ===" >>.env
+echo "APP_SECRET=$(openssl rand -base64 32)" >>.env
+echo "" >>.env
+echo "PGPASSWORD_SUPERUSER=$(openssl rand -hex 16)" >>.env
+
+echo -e "\t• .env configuration completed"
+
+port=3000
+# Check if command nc is available
+if command -v nc &> /dev/null; then
+  # Check if port 3000 is already in use, propose to change it
+  while nc -zv localhost $port &>/dev/null; do
+    read -p "🚫 Port $port is already in use. Do you want to use another port? (Y/n) " answer
+    if [ "$answer" = "n" ]; then
+      continue
+    fi
+    read -p "Enter a new port number: " new_port
+    if [[ $(uname) == "Darwin" ]]; then
+      sed -i '' "s/$port:$port/$new_port:$port/g" docker-compose.yml
+      sed -E -i '' "s|^SERVER_URL=http://localhost:[0-9]+|SERVER_URL=http://localhost:$new_port|g" .env
+    else
+      sed -i'' "s/$port:$port/$new_port:$port/g" docker-compose.yml
+      sed -E -i'' "s|^SERVER_URL=http://localhost:[0-9]+|SERVER_URL=http://localhost:$new_port|g" .env
+    fi
+    port=$new_port
+  done
+fi
+
+# Ask user if they want to start the project
+read -p "🚀 Do you want to start the project now? (Y/n) " answer
+if [ "$answer" = "n" ]; then
+  echo "✅ Project setup completed. Run 'docker compose up -d' to start."
+  exit 0
+else
+  echo "🐳 Starting Docker containers..."
+  docker compose up -d
+  # Check if port is listening
+  echo "Waiting for server to be healthy, it might take a few minutes while we initialize the database..."
+  # Tail logs of the server until it's ready
+  docker compose logs -f server &
+  pid=$!
+  while [ ! $(docker inspect --format='{{.State.Health.Status}}' twenty-server-1) = "healthy" ]; do
+    sleep 1
+  done
+  kill $pid
+  echo ""
+  echo "✅ Server is up and running"
+fi
+
+function ask_open_browser {
+  read -p "🌐 Do you want to open the project in your browser? (Y/n) " answer
+  if [ "$answer" = "n" ]; then
+    echo "✅ Setup completed. Access your project at http://localhost:$port"
+    exit 0
+  fi
+}
+
+# Ask user if they want to open the project
+# Running on macOS
+if [[ $(uname) == "Darwin" ]]; then
+  ask_open_browser
+
+  open "http://localhost:$port"
+# Assuming Linux
+else
+  # xdg-open is not installed, we could be running in a non gui environment
+  if command -v xdg-open >/dev/null 2>&1; then
+    ask_open_browser
+
+    xdg-open "http://localhost:$port"
+  else
+    echo "✅ Setup completed. Your project is available at http://localhost:$port"
+  fi
+fi

packages/twenty-docker/twenty-postgres-spilo/Dockerfile

@@ -1,13 +1,12 @@
 ARG POSTGRES_VERSION=15
 ARG SPILO_VERSION=3.2-p1
-ARG PG_GRAPHQL_VERSION=1.5.6
 ARG WRAPPERS_VERSION=0.2.0
 
 # Build the mysql_fdw extension
-FROM debian:bookworm as build-mysql_fdw
+FROM debian:bookworm AS build-mysql_fdw
 ARG POSTGRES_VERSION
 
-ENV DEBIAN_FRONTEND noninteractive
+ENV DEBIAN_FRONTEND=noninteractive
 RUN apt update && \
     apt install -y \
     build-essential \
@@ -18,14 +17,14 @@ RUN apt update && \
 
 # Install mysql_fdw
 RUN git clone https://github.com/EnterpriseDB/mysql_fdw.git
-WORKDIR mysql_fdw
+WORKDIR /mysql_fdw
 RUN make USE_PGXS=1
 
 
 # Build libssl for wrappers
-FROM ubuntu:22.04 as build-libssl
+FROM ubuntu:22.04 AS build-libssl
 
-ENV DEBIAN_FRONTEND noninteractive
+ENV DEBIAN_FRONTEND=noninteractive
 RUN apt update && \
     apt install -y \
     build-essential \
@@ -38,10 +37,9 @@ WORKDIR /build/openssl
 RUN ./config && make && make install
 
 
-# Extend the Spilo image with the pg_graphql and mysql_fdw extensions
+# Extend the Spilo image with the mysql_fdw extensions
 FROM ghcr.io/zalando/spilo-${POSTGRES_VERSION}:${SPILO_VERSION}
 ARG POSTGRES_VERSION
-ARG PG_GRAPHQL_VERSION
 ARG WRAPPERS_VERSION
 ARG TARGETARCH
 
@@ -63,14 +61,6 @@ RUN curl -L "https://github.com/supabase/wrappers/releases/download/v${WRAPPERS_
 COPY --from=build-libssl /usr/local/lib/libssl* /usr/local/lib/libcrypto*  /usr/lib/
 COPY --from=build-libssl /usr/local/lib/engines-1.1 /usr/lib/engines-1.1
 
-# Copy pg_graphql
-COPY ./packages/twenty-postgres/linux/${TARGETARCH}/${POSTGRES_VERSION}/pg_graphql/${PG_GRAPHQL_VERSION}/pg_graphql--${PG_GRAPHQL_VERSION}.sql \
-    /usr/share/postgresql/${POSTGRES_VERSION}/extension
-COPY ./packages/twenty-postgres/linux/${TARGETARCH}/${POSTGRES_VERSION}/pg_graphql/${PG_GRAPHQL_VERSION}/pg_graphql.control \
-    /usr/share/postgresql/${POSTGRES_VERSION}/extension
-COPY ./packages/twenty-postgres/linux/${TARGETARCH}/${POSTGRES_VERSION}/pg_graphql/${PG_GRAPHQL_VERSION}/pg_graphql.so \
-    /usr/lib/postgresql/${POSTGRES_VERSION}/lib/pg_graphql.so
-
 # Copy mysql_fdw
 COPY --from=build-mysql_fdw /mysql_fdw/mysql_fdw.so \
     /usr/lib/postgresql/${POSTGRES_VERSION}/lib/mysql_fdw.so

packages/twenty-docker/twenty-postgres/Dockerfile

@@ -1,54 +0,0 @@
-ARG IMAGE_TAG='15.5.0-debian-11-r15'
-
-FROM bitnami/postgresql:${IMAGE_TAG}
-
-ARG PG_MAIN_VERSION=15
-ARG PG_GRAPHQL_VERSION=1.5.6
-ARG WRAPPERS_VERSION=0.2.0
-ARG TARGETARCH
-
-USER root
-
-RUN set -eux; \
-    ARCH="$(dpkg --print-architecture)"; \
-    case "${ARCH}" in \
-       aarch64|arm64) \
-         TARGETARCH='arm64'; \
-         ;; \
-       amd64|x86_64) \
-         TARGETARCH='amd64'; \
-         ;; \
-       *) \
-         echo "Unsupported arch: ${ARCH}"; \
-         exit 1; \
-         ;; \
-    esac;
-
-RUN apt update && apt install build-essential git curl default-libmysqlclient-dev -y
-
-# Install precompiled pg_graphql extensions
-COPY ./packages/twenty-postgres/linux/${TARGETARCH}/${PG_MAIN_VERSION}/pg_graphql/${PG_GRAPHQL_VERSION}/pg_graphql--${PG_GRAPHQL_VERSION}.sql \
-    /opt/bitnami/postgresql/share/extension/
-COPY ./packages/twenty-postgres/linux/${TARGETARCH}/${PG_MAIN_VERSION}/pg_graphql/${PG_GRAPHQL_VERSION}/pg_graphql.control \
-    /opt/bitnami/postgresql/share/extension/
-COPY ./packages/twenty-postgres/linux/${TARGETARCH}/${PG_MAIN_VERSION}/pg_graphql/${PG_GRAPHQL_VERSION}/pg_graphql.so \
-    /opt/bitnami/postgresql/lib/
-
-# Install precompiled supabase wrappers extensions
-RUN curl -L "https://github.com/supabase/wrappers/releases/download/v${WRAPPERS_VERSION}/wrappers-v${WRAPPERS_VERSION}-pg${PG_MAIN_VERSION}-${TARGETARCH}-linux-gnu.deb" -o wrappers.deb
-RUN dpkg --install wrappers.deb
-RUN cp /usr/share/postgresql/${PG_MAIN_VERSION}/extension/wrappers* /opt/bitnami/postgresql/share/extension/
-RUN cp /usr/lib/postgresql/${PG_MAIN_VERSION}/lib/wrappers* /opt/bitnami/postgresql/lib/
-
-RUN export PATH=/usr/local/pgsql/bin/:$PATH
-RUN export PATH=/usr/local/mysql/bin/:$PATH
-RUN git clone https://github.com/EnterpriseDB/mysql_fdw.git
-WORKDIR mysql_fdw
-RUN make USE_PGXS=1
-RUN make USE_PGXS=1 install
-
-COPY ./packages/twenty-docker/twenty-postgres/init.sql /docker-entrypoint-initdb.d/
-
-USER 1001
-ENTRYPOINT ["/opt/bitnami/scripts/postgresql/entrypoint.sh"]
-CMD ["/opt/bitnami/scripts/postgresql/run.sh"]

packages/twenty-docker/twenty-postgres/init.sql

@@ -1,4 +0,0 @@
-CREATE DATABASE "default";
-CREATE DATABASE "test";
-CREATE USER twenty PASSWORD 'twenty';
-ALTER ROLE twenty superuser;

packages/twenty-docker/twenty/Dockerfile

@@ -52,9 +52,10 @@ RUN apk add --no-cache curl jq
 
 RUN npm install -g tsx
 
+RUN apk add --no-cache postgresql-client
+
 COPY ./packages/twenty-docker/twenty/entrypoint.sh /app/entrypoint.sh
 RUN chmod +x /app/entrypoint.sh
-
 WORKDIR /app/packages/twenty-server
 
 ARG REACT_APP_SERVER_BASE_URL

packages/twenty-docker/twenty/entrypoint.sh

@@ -1,9 +1,18 @@
 #!/bin/sh
+set -e
 
 # Check if the initialization has already been done and that we enabled automatic migration
 if [ "${ENABLE_DB_MIGRATIONS}" = "true" ] && [ ! -f /app/docker-data/db_status ]; then
     echo "Running database setup and migrations..."
 
+    # Creating the database if it doesn't exist
+    PGUSER=$(echo $PG_DATABASE_URL | awk -F '//' '{print $2}' | awk -F ':' '{print $1}')
+    PGPASS=$(echo $PG_DATABASE_URL | awk -F ':' '{print $3}' | awk -F '@' '{print $1}')
+    PGHOST=$(echo $PG_DATABASE_URL | awk -F '@' '{print $2}' | awk -F ':' '{print $1}')
+    PGPORT=$(echo $PG_DATABASE_URL | awk -F ':' '{print $4}' | awk -F '/' '{print $1}')
+    PGPASSWORD=${PGPASS} psql -h ${PGHOST} -p ${PGPORT} -U ${PGUSER} -d postgres -tc "SELECT 1 FROM pg_database WHERE datname = 'default'" | grep -q 1 || \
+    PGPASSWORD=${PGPASS} psql -h ${PGHOST} -p ${PGPORT} -U ${PGUSER} -d postgres -c "CREATE DATABASE \"default\""
+
     # Run setup and migration scripts
     NODE_OPTIONS="--max-old-space-size=1500" tsx ./scripts/setup-db.ts
     yarn database:migrate:prod

packages/twenty-e2e-testing/drivers/env_variables.ts

@@ -0,0 +1,22 @@
+import * as fs from 'fs';
+import path from 'path';
+
+export const envVariables = (variables: string) => {
+  let payload = `
+  PG_DATABASE_URL=postgres://postgres:twenty@localhost:5432/default
+  FRONT_BASE_URL=http://localhost:3001
+  ACCESS_TOKEN_SECRET=replace_me_with_a_random_string_access
+  LOGIN_TOKEN_SECRET=replace_me_with_a_random_string_login
+  REFRESH_TOKEN_SECRET=replace_me_with_a_random_string_refresh
+  FILE_TOKEN_SECRET=replace_me_with_a_random_string_refresh
+  REDIS_URL=redis://localhost:6379
+  `;
+  payload = payload.concat(variables);
+  fs.writeFile(
+    path.join(__dirname, '..', '..', 'twenty-server', '.env'),
+    payload,
+    (err) => {
+      throw err;
+    },
+  );
+};

packages/twenty-e2e-testing/lib/pom/helper/confirmationModal.ts

@@ -0,0 +1,36 @@
+import { Locator, Page } from '@playwright/test';
+
+export class ConfirmationModal {
+  private readonly input: Locator;
+  private readonly cancelButton: Locator;
+  private readonly confirmButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.input = page.getByTestId('confirmation-modal-input');
+    this.cancelButton = page.getByRole('button', { name: 'Cancel' });
+    this.confirmButton = page.getByTestId('confirmation-modal-confirm-button');
+  }
+
+  async typePlaceholderToInput() {
+    await this.page
+      .getByTestId('confirmation-modal-input')
+      .fill(
+        await this.page
+          .getByTestId('confirmation-modal-input')
+          .getAttribute('placeholder'),
+      );
+  }
+
+  async typePhraseToInput(value: string) {
+    await this.page.getByTestId('confirmation-modal-input').fill(value);
+  }
+
+  async clickCancelButton() {
+    await this.page.getByRole('button', { name: 'Cancel' }).click();
+  }
+
+  async clickConfirmButton() {
+    await this.page.getByTestId('confirmation-modal-confirm-button').click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/helper/formatDate.function.ts

@@ -0,0 +1,28 @@
+const nth = (d: number) => {
+  if (d > 3 && d < 21) return 'th';
+  switch (d % 10) {
+    case 1:
+      return 'st';
+    case 2:
+      return 'nd';
+    case 3:
+      return 'rd';
+    default:
+      return 'th';
+  }
+};
+
+// label looks like this: Choose Wednesday, October 30th, 2024
+// eslint-disable-next-line prefer-arrow/prefer-arrow-functions
+export function formatDate(value: string): string {
+  const date = new Date(value);
+  return 'Choose '.concat(
+    date.toLocaleDateString('en-US', { weekday: 'long' }),
+    ', ',
+    date.toLocaleDateString('en-US', { month: 'long' }),
+    ' ',
+    nth(date.getDate()),
+    ', ',
+    date.toLocaleDateString('en-US', { year: 'numeric' }),
+  );
+}

packages/twenty-e2e-testing/lib/pom/helper/googleLogin.ts

@@ -0,0 +1,6 @@
+import { Locator, Page } from '@playwright/test';
+
+export class GoogleLogin {
+  // TODO: map all things like inputs and buttons
+  //  (what's the correct way for proceeding with Google interaction? log in each time test is performed?)
+}

packages/twenty-e2e-testing/lib/pom/helper/iconSelect.ts

@@ -0,0 +1,23 @@
+import { Locator, Page } from '@playwright/test';
+
+export class IconSelect {
+  private readonly iconSelectButton: Locator;
+  private readonly iconSearchInput: Locator;
+
+  constructor(public readonly page: Page) {
+    this.iconSelectButton = page.getByLabel('Click to select icon (');
+    this.iconSearchInput = page.getByPlaceholder('Search icon');
+  }
+
+  async selectIcon(name: string) {
+    await this.iconSelectButton.click();
+    await this.iconSearchInput.fill(name);
+    await this.page.getByTitle(name).click();
+  }
+
+  async selectRelationIcon(name: string) {
+    await this.iconSelectButton.nth(1).click();
+    await this.iconSearchInput.fill(name);
+    await this.page.getByTitle(name).click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/helper/insertFieldData.ts

@@ -0,0 +1,267 @@
+import { Locator, Page } from '@playwright/test';
+import { formatDate } from './formatDate.function';
+
+export class InsertFieldData {
+  private readonly address1Input: Locator;
+  private readonly address2Input: Locator;
+  private readonly cityInput: Locator;
+  private readonly stateInput: Locator;
+  private readonly postCodeInput: Locator;
+  private readonly countrySelect: Locator;
+  private readonly arrayValueInput: Locator;
+  private readonly arrayAddValueButton: Locator;
+  // boolean react after click so no need to write special locator
+  private readonly currencySelect: Locator;
+  private readonly currencyAmountInput: Locator;
+  private readonly monthSelect: Locator;
+  private readonly yearSelect: Locator;
+  private readonly previousMonthButton: Locator;
+  private readonly nextMonthButton: Locator;
+  private readonly clearDateButton: Locator;
+  private readonly dateInput: Locator;
+  private readonly firstNameInput: Locator;
+  private readonly lastNameInput: Locator;
+  private readonly addURLButton: Locator;
+  private readonly setAsPrimaryButton: Locator;
+  private readonly addPhoneButton: Locator;
+  private readonly addMailButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.address1Input = page.locator(
+      '//label[contains(., "ADDRESS 1")]/../div[last()]/input',
+    );
+    this.address2Input = page.locator(
+      '//label[contains(., "ADDRESS 2")]/../div[last()]/input',
+    );
+    this.cityInput = page.locator(
+      '//label[contains(., "CITY")]/../div[last()]/input',
+    );
+    this.stateInput = page.locator(
+      '//label[contains(., "STATE")]/../div[last()]/input',
+    );
+    this.postCodeInput = page.locator(
+      '//label[contains(., "POST CODE")]/../div[last()]/input',
+    );
+    this.countrySelect = page.locator(
+      '//span[contains(., "COUNTRY")]/../div[last()]/input',
+    );
+    this.arrayValueInput = page.locator("//input[@placeholder='Enter value']");
+    this.arrayAddValueButton = page.locator(
+      "//div[@data-testid='tooltip' and contains(.,'Add item')]",
+    );
+    this.currencySelect = page.locator(
+      '//body/div[last()]/div/div/div[first()]/div/div',
+    );
+    this.currencyAmountInput = page.locator("//input[@placeholder='Currency']");
+    this.monthSelect; // TODO: add once some other attributes are added
+    this.yearSelect;
+    this.previousMonthButton;
+    this.nextMonthButton;
+    this.clearDateButton = page.locator(
+      "//div[@data-testid='tooltip' and contains(., 'Clear')]",
+    );
+    this.dateInput = page.locator("//input[@placeholder='Type date and time']");
+    this.firstNameInput = page.locator("//input[@placeholder='First name']"); // may fail if placeholder is `F‌‌irst name` instead of `First name`
+    this.lastNameInput = page.locator("//input[@placeholder='Last name']"); // may fail if placeholder is `L‌‌ast name` instead of `Last name`
+    this.addURLButton = page.locator(
+      "//div[@data-testid='tooltip' and contains(., 'Add URL')]",
+    );
+    this.setAsPrimaryButton = page.locator(
+      "//div[@data-testid='tooltip' and contains(., 'Set as primary')]",
+    );
+    this.addPhoneButton = page.locator(
+      "//div[@data-testid='tooltip' and contains(., 'Add Phone')]",
+    );
+    this.addMailButton = page.locator(
+      "//div[@data-testid='tooltip' and contains(., 'Add Email')]",
+    );
+  }
+
+  // address
+  async typeAddress1(value: string) {
+    await this.address1Input.fill(value);
+  }
+
+  async typeAddress2(value: string) {
+    await this.address2Input.fill(value);
+  }
+
+  async typeCity(value: string) {
+    await this.cityInput.fill(value);
+  }
+
+  async typeState(value: string) {
+    await this.stateInput.fill(value);
+  }
+
+  async typePostCode(value: string) {
+    await this.postCodeInput.fill(value);
+  }
+
+  async selectCountry(value: string) {
+    await this.countrySelect.click();
+    await this.page
+      .locator(`//div[@data-testid='tooltip' and contains(., '${value}')]`)
+      .click();
+  }
+
+  // array
+  async typeArrayValue(value: string) {
+    await this.arrayValueInput.fill(value);
+  }
+
+  async clickAddItemButton() {
+    await this.arrayAddValueButton.click();
+  }
+
+  // currency
+  async selectCurrency(value: string) {
+    await this.currencySelect.click();
+    await this.page
+      .locator(`//div[@data-testid='tooltip' and contains(., '${value}')]`)
+      .click();
+  }
+
+  async typeCurrencyAmount(value: string) {
+    await this.currencyAmountInput.fill(value);
+  }
+
+  // date(-time)
+  async typeDate(value: string) {
+    await this.dateInput.fill(value);
+  }
+
+  async selectMonth(value: string) {
+    await this.monthSelect.click();
+    await this.page
+      .locator(`//div[@data-testid='tooltip' and contains(., '${value}')]`)
+      .click();
+  }
+
+  async selectYear(value: string) {
+    await this.yearSelect.click();
+    await this.page
+      .locator(`//div[@data-testid='tooltip' and contains(., '${value}')]`)
+      .click();
+  }
+
+  async clickPreviousMonthButton() {
+    await this.previousMonthButton.click();
+  }
+
+  async clickNextMonthButton() {
+    await this.nextMonthButton.click();
+  }
+
+  async selectDay(value: string) {
+    await this.page
+      .locator(`//div[@aria-label='${formatDate(value)}']`)
+      .click();
+  }
+
+  async clearDate() {
+    await this.clearDateButton.click();
+  }
+
+  // email
+  async typeEmail(value: string) {
+    await this.page.locator(`//input[@placeholder='Email']`).fill(value);
+  }
+
+  async clickAddMailButton() {
+    await this.addMailButton.click();
+  }
+
+  // full name
+  async typeFirstName(name: string) {
+    await this.firstNameInput.fill(name);
+  }
+
+  async typeLastName(name: string) {
+    await this.lastNameInput.fill(name);
+  }
+
+  // JSON
+  // placeholder is dependent on the name of field
+  async typeJSON(placeholder: string, value: string) {
+    await this.page
+      .locator(`//input[@placeholder='${placeholder}']`)
+      .fill(value);
+  }
+
+  // link
+  async typeLink(value: string) {
+    await this.page.locator("//input[@placeholder='URL']").fill(value);
+  }
+
+  async clickAddURL() {
+    await this.addURLButton.click();
+  }
+
+  // (multi-)select
+  async selectValue(value: string) {
+    await this.page
+      .locator(`//div[@data-testid='tooltip' and contains(., '${value}')]`)
+      .click();
+  }
+
+  // number
+  // placeholder is dependent on the name of field
+  async typeNumber(placeholder: string, value: string) {
+    await this.page
+      .locator(`//input[@placeholder='${placeholder}']`)
+      .fill(value);
+  }
+
+  // phones
+  async selectCountryPhoneCode(countryCode: string) {
+    await this.page
+      .locator(
+        `//div[@data-testid='tooltip' and contains(., '${countryCode}')]`,
+      )
+      .click();
+  }
+
+  async typePhoneNumber(value: string) {
+    await this.page.locator(`//input[@placeholder='Phone']`).fill(value);
+  }
+
+  async clickAddPhoneButton() {
+    await this.addPhoneButton.click();
+  }
+
+  // rating
+  // if adding rating for the first time, hover must be used
+  async selectRating(rating: number) {
+    await this.page.locator(`//div[@role='slider']/div[${rating}]`).click();
+  }
+
+  // text
+  // placeholder is dependent on the name of field
+  async typeText(placeholder: string, value: string) {
+    await this.page
+      .locator(`//input[@placeholder='${placeholder}']`)
+      .fill(value);
+  }
+
+  async clickSetAsPrimaryButton() {
+    await this.setAsPrimaryButton.click();
+  }
+
+  async searchValue(value: string) {
+    await this.page.locator(`//div[@placeholder='Search']`).fill(value);
+  }
+
+  async clickEditButton() {
+    await this.page
+      .locator("//div[@data-testid='tooltip' and contains(., 'Edit')]")
+      .click();
+  }
+
+  async clickDeleteButton() {
+    await this.page
+      .locator("//div[@data-testid='tooltip' and contains(., 'Delete')]")
+      .click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/helper/stripePage.ts

@@ -0,0 +1,5 @@
+import { Locator, Page } from '@playwright/test';
+
+export class StripePage {
+  // TODO: implement all necessary methods (staging/sandbox page - does it differ anyhow from normal page?)
+}

packages/twenty-e2e-testing/lib/pom/helper/uploadImage.ts

@@ -0,0 +1,25 @@
+import { Locator, Page } from '@playwright/test';
+
+export class UploadImage {
+  private readonly imagePreview: Locator;
+  private readonly uploadButton: Locator;
+  private readonly removeButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.imagePreview = page.locator('.css-6eut39'); //TODO: add attribute to make it independent of theme
+    this.uploadButton = page.getByRole('button', { name: 'Upload' });
+    this.removeButton = page.getByRole('button', { name: 'Remove' });
+  }
+
+  async clickImagePreview() {
+    await this.imagePreview.click();
+  }
+
+  async clickUploadButton() {
+    await this.uploadButton.click();
+  }
+
+  async clickRemoveButton() {
+    await this.removeButton.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/leftMenu.ts

@@ -0,0 +1,115 @@
+import { Locator, Page } from '@playwright/test';
+
+export class LeftMenu {
+  private readonly workspaceDropdown: Locator;
+  private readonly leftMenu: Locator;
+  private readonly searchSubTab: Locator;
+  private readonly settingsTab: Locator;
+  private readonly peopleTab: Locator;
+  private readonly companiesTab: Locator;
+  private readonly opportunitiesTab: Locator;
+  private readonly opportunitiesTabAll: Locator;
+  private readonly opportunitiesTabByStage: Locator;
+  private readonly tasksTab: Locator;
+  private readonly tasksTabAll: Locator;
+  private readonly tasksTabByStatus: Locator;
+  private readonly notesTab: Locator;
+  private readonly rocketsTab: Locator;
+  private readonly workflowsTab: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.workspaceDropdown = page.getByTestId('workspace-dropdown');
+    this.leftMenu = page.getByRole('button').first();
+    this.searchSubTab = page.getByText('Search');
+    this.settingsTab = page.getByRole('link', { name: 'Settings' });
+    this.peopleTab = page.getByRole('link', { name: 'People' });
+    this.companiesTab = page.getByRole('link', { name: 'Companies' });
+    this.opportunitiesTab = page.getByRole('link', { name: 'Opportunities' });
+    this.opportunitiesTabAll = page.getByRole('link', {
+      name: 'All',
+      exact: true,
+    });
+    this.opportunitiesTabByStage = page.getByRole('link', { name: 'By Stage' });
+    this.tasksTab = page.getByRole('link', { name: 'Tasks' });
+    this.tasksTabAll = page.getByRole('link', { name: 'All tasks' });
+    this.tasksTabByStatus = page.getByRole('link', { name: 'Notes' });
+    this.notesTab = page.getByRole('link', { name: 'Notes' });
+    this.rocketsTab = page.getByRole('link', { name: 'Rockets' });
+    this.workflowsTab = page.getByRole('link', { name: 'Workflows' });
+  }
+
+  async selectWorkspace(workspaceName: string) {
+    await this.workspaceDropdown.click();
+    await this.page
+      .getByTestId('tooltip')
+      .filter({ hasText: workspaceName })
+      .click();
+  }
+
+  async changeLeftMenu() {
+    await this.leftMenu.click();
+  }
+
+  async openSearchTab() {
+    await this.searchSubTab.click();
+  }
+
+  async goToSettings() {
+    await this.settingsTab.click();
+  }
+
+  async goToPeopleTab() {
+    await this.peopleTab.click();
+  }
+
+  async goToCompaniesTab() {
+    await this.companiesTab.click();
+  }
+
+  async goToOpportunitiesTab() {
+    await this.opportunitiesTab.click();
+  }
+
+  async goToOpportunitiesTableView() {
+    await this.opportunitiesTabAll.click();
+  }
+
+  async goToOpportunitiesKanbanView() {
+    await this.opportunitiesTabByStage.click();
+  }
+
+  async goToTasksTab() {
+    await this.tasksTab.click();
+  }
+
+  async goToTasksTableView() {
+    await this.tasksTabAll.click();
+  }
+
+  async goToTasksKanbanView() {
+    await this.tasksTabByStatus.click();
+  }
+
+  async goToNotesTab() {
+    await this.notesTab.click();
+  }
+
+  async goToRocketsTab() {
+    await this.rocketsTab.click();
+  }
+
+  async goToWorkflowsTab() {
+    await this.workflowsTab.click();
+  }
+
+  async goToCustomObject(customObjectName: string) {
+    await this.page.getByRole('link', { name: customObjectName }).click();
+  }
+
+  async goToCustomObjectView(name: string) {
+    await this.page.getByRole('link', { name: name }).click();
+  }
+}
+
+export default LeftMenu;

packages/twenty-e2e-testing/lib/pom/loginPage.ts

@@ -0,0 +1,187 @@
+import { Locator, Page } from '@playwright/test';
+
+export class LoginPage {
+  private readonly loginWithGoogleButton: Locator;
+  private readonly loginWithEmailButton: Locator;
+  private readonly termsOfServiceLink: Locator;
+  private readonly privacyPolicyLink: Locator;
+  private readonly emailField: Locator;
+  private readonly continueButton: Locator;
+  private readonly forgotPasswordButton: Locator;
+  private readonly passwordField: Locator;
+  private readonly revealPasswordButton: Locator;
+  private readonly signInButton: Locator;
+  private readonly signUpButton: Locator;
+  private readonly previewImageButton: Locator;
+  private readonly uploadImageButton: Locator;
+  private readonly deleteImageButton: Locator;
+  private readonly workspaceNameField: Locator;
+  private readonly firstNameField: Locator;
+  private readonly lastNameField: Locator;
+  private readonly syncEverythingWithGoogleRadio: Locator;
+  private readonly syncSubjectAndMetadataWithGoogleRadio: Locator;
+  private readonly syncMetadataWithGoogleRadio: Locator;
+  private readonly syncWithGoogleButton: Locator;
+  private readonly noSyncButton: Locator;
+  private readonly inviteLinkField1: Locator;
+  private readonly inviteLinkField2: Locator;
+  private readonly inviteLinkField3: Locator;
+  private readonly copyInviteLink: Locator;
+  private readonly finishButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.loginWithGoogleButton = page.getByRole('button', {
+      name: 'Continue with Google',
+    });
+    this.loginWithEmailButton = page.getByRole('button', {
+      name: 'Continue With Email',
+    });
+    this.termsOfServiceLink = page.getByRole('link', {
+      name: 'Terms of Service',
+    });
+    this.privacyPolicyLink = page.getByRole('link', { name: 'Privacy Policy' });
+    this.emailField = page.getByPlaceholder('Email');
+    this.continueButton = page.getByRole('button', {
+      name: 'Continue',
+      exact: true,
+    });
+    this.forgotPasswordButton = page.getByText('Forgot your password?');
+    this.passwordField = page.getByPlaceholder('Password');
+    this.revealPasswordButton = page.getByTestId('reveal-password-button');
+    this.signInButton = page.getByRole('button', { name: 'Sign in' });
+    this.signUpButton = page.getByRole('button', { name: 'Sign up' });
+    this.previewImageButton = page.locator('.css-1qzw107'); // TODO: fix
+    this.uploadImageButton = page.getByRole('button', { name: 'Upload' });
+    this.deleteImageButton = page.getByRole('button', { name: 'Remove' });
+    this.workspaceNameField = page.getByPlaceholder('Apple');
+    this.firstNameField = page.getByPlaceholder('Tim');
+    this.lastNameField = page.getByPlaceholder('Cook');
+    this.syncEverythingWithGoogleRadio = page.locator(
+      'input[value="SHARE_EVERYTHING"]',
+    );
+    this.syncSubjectAndMetadataWithGoogleRadio = page.locator(
+      'input[value="SUBJECT"]',
+    );
+    this.syncMetadataWithGoogleRadio = page.locator('input[value="METADATA"]');
+    this.syncWithGoogleButton = page.getByRole('button', {
+      name: 'Sync with Google',
+    });
+    this.noSyncButton = page.getByText('Continue without sync');
+    this.inviteLinkField1 = page.getByPlaceholder('tim@apple.dev');
+    this.inviteLinkField2 = page.getByPlaceholder('craig@apple.dev');
+    this.inviteLinkField3 = page.getByPlaceholder('mike@apple.dev');
+    this.copyInviteLink = page.getByRole('button', {
+      name: 'Copy invitation link',
+    });
+    this.finishButton = page.getByRole('button', { name: 'Finish' });
+  }
+
+  async loginWithGoogle() {
+    await this.loginWithGoogleButton.click();
+  }
+
+  async clickLoginWithEmail() {
+    await this.loginWithEmailButton.click();
+  }
+
+  async clickContinueButton() {
+    await this.continueButton.click();
+  }
+
+  async clickTermsLink() {
+    await this.termsOfServiceLink.click();
+  }
+
+  async clickPrivacyPolicyLink() {
+    await this.privacyPolicyLink.click();
+  }
+
+  async typeEmail(email: string) {
+    await this.emailField.fill(email);
+  }
+
+  async typePassword(email: string) {
+    await this.passwordField.fill(email);
+  }
+
+  async clickSignInButton() {
+    await this.signInButton.click();
+  }
+
+  async clickSignUpButton() {
+    await this.signUpButton.click();
+  }
+
+  async clickForgotPassword() {
+    await this.forgotPasswordButton.click();
+  }
+
+  async revealPassword() {
+    await this.revealPasswordButton.click();
+  }
+
+  async previewImage() {
+    await this.previewImageButton.click();
+  }
+
+  async clickUploadImage() {
+    await this.uploadImageButton.click();
+  }
+
+  async deleteImage() {
+    await this.deleteImageButton.click();
+  }
+
+  async typeWorkspaceName(workspaceName: string) {
+    await this.workspaceNameField.fill(workspaceName);
+  }
+
+  async typeFirstName(firstName: string) {
+    await this.firstNameField.fill(firstName);
+  }
+
+  async typeLastName(lastName: string) {
+    await this.lastNameField.fill(lastName);
+  }
+
+  async clickSyncEverythingWithGoogleRadio() {
+    await this.syncEverythingWithGoogleRadio.click();
+  }
+
+  async clickSyncSubjectAndMetadataWithGoogleRadio() {
+    await this.syncSubjectAndMetadataWithGoogleRadio.click();
+  }
+
+  async clickSyncMetadataWithGoogleRadio() {
+    await this.syncMetadataWithGoogleRadio.click();
+  }
+
+  async clickSyncWithGoogleButton() {
+    await this.syncWithGoogleButton.click();
+  }
+
+  async noSyncWithGoogle() {
+    await this.noSyncButton.click();
+  }
+
+  async typeInviteLink1(email: string) {
+    await this.inviteLinkField1.fill(email);
+  }
+
+  async typeInviteLink2(email: string) {
+    await this.inviteLinkField2.fill(email);
+  }
+
+  async typeInviteLink3(email: string) {
+    await this.inviteLinkField3.fill(email);
+  }
+
+  async clickCopyInviteLink() {
+    await this.copyInviteLink.click();
+  }
+
+  async clickFinishButton() {
+    await this.finishButton.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/mainPage.ts

@@ -0,0 +1,196 @@
+import { Locator, Page } from '@playwright/test';
+
+export class MainPage {
+  // TODO: add missing elements (advanced filters, import/export popups)
+  private readonly tableViews: Locator;
+  private readonly addViewButton: Locator;
+  private readonly viewIconSelect: Locator;
+  private readonly viewNameInput: Locator;
+  private readonly viewTypeSelect: Locator;
+  private readonly createViewButton: Locator;
+  private readonly deleteViewButton: Locator;
+  private readonly filterButton: Locator;
+  private readonly searchFieldInput: Locator;
+  private readonly advancedFilterButton: Locator;
+  private readonly addFilterButton: Locator;
+  private readonly resetFilterButton: Locator;
+  private readonly saveFilterAsViewButton: Locator;
+  private readonly sortButton: Locator;
+  private readonly sortOrderButton: Locator;
+  private readonly optionsButton: Locator;
+  private readonly fieldsButton: Locator;
+  private readonly goBackButton: Locator;
+  private readonly hiddenFieldsButton: Locator;
+  private readonly editFieldsButton: Locator;
+  private readonly importButton: Locator;
+  private readonly exportButton: Locator;
+  private readonly deletedRecordsButton: Locator;
+  private readonly createNewRecordButton: Locator;
+  private readonly addToFavoritesButton: Locator;
+  private readonly deleteFromFavoritesButton: Locator;
+  private readonly exportBottomBarButton: Locator;
+  private readonly deleteRecordsButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.tableViews = page.getByText('·');
+    this.addViewButton = page
+      .getByTestId('tooltip')
+      .filter({ hasText: /^Add view$/ });
+    this.viewIconSelect = page.getByLabel('Click to select icon (');
+    this.viewNameInput; // can be selected using only actual value
+    this.viewTypeSelect = page.locator(
+      "//span[contains(., 'View type')]/../div",
+    );
+    this.createViewButton = page.getByRole('button', { name: 'Create' });
+    this.deleteViewButton = page.getByRole('button', { name: 'Delete' });
+    this.filterButton = page.getByText('Filter');
+    this.searchFieldInput = page.getByPlaceholder('Search fields');
+    this.advancedFilterButton = page
+      .getByTestId('tooltip')
+      .filter({ hasText: /^Advanced filter$/ });
+    this.addFilterButton = page.getByRole('button', { name: 'Add Filter' });
+    this.resetFilterButton = page.getByTestId('cancel-button');
+    this.saveFilterAsViewButton = page.getByRole('button', {
+      name: 'Save as new view',
+    });
+    this.sortButton = page.getByText('Sort');
+    this.sortOrderButton = page.locator('//li');
+    this.optionsButton = page.getByText('Options');
+    this.fieldsButton = page.getByText('Fields');
+    this.goBackButton = page.getByTestId('dropdown-menu-header-end-icon');
+    this.hiddenFieldsButton = page
+      .getByTestId('tooltip')
+      .filter({ hasText: /^Hidden Fields$/ });
+    this.editFieldsButton = page
+      .getByTestId('tooltip')
+      .filter({ hasText: /^Edit Fields$/ });
+    this.importButton = page
+      .getByTestId('tooltip')
+      .filter({ hasText: /^Import$/ });
+    this.exportButton = page
+      .getByTestId('tooltip')
+      .filter({ hasText: /^Export$/ });
+    this.deletedRecordsButton = page
+      .getByTestId('tooltip')
+      .filter({ hasText: /^Deleted */ });
+    this.createNewRecordButton = page.getByTestId('add-button');
+    this.addToFavoritesButton = page.getByText('Add to favorites');
+    this.deleteFromFavoritesButton = page.getByText('Delete from favorites');
+    this.exportBottomBarButton = page.getByText('Export');
+    this.deleteRecordsButton = page.getByText('Delete');
+  }
+
+  async clickTableViews() {
+    await this.tableViews.click();
+  }
+
+  async clickAddViewButton() {
+    await this.addViewButton.click();
+  }
+
+  async typeViewName(name: string) {
+    await this.viewNameInput.clear();
+    await this.viewNameInput.fill(name);
+  }
+
+  // name can be either be 'Table' or 'Kanban'
+  async selectViewType(name: string) {
+    await this.viewTypeSelect.click();
+    await this.page.getByTestId('tooltip').filter({ hasText: name }).click();
+  }
+
+  async createView() {
+    await this.createViewButton.click();
+  }
+
+  async deleteView() {
+    await this.deleteViewButton.click();
+  }
+
+  async clickFilterButton() {
+    await this.filterButton.click();
+  }
+
+  async searchFields(name: string) {
+    await this.searchFieldInput.clear();
+    await this.searchFieldInput.fill(name);
+  }
+
+  async clickAdvancedFilterButton() {
+    await this.advancedFilterButton.click();
+  }
+
+  async addFilter() {
+    await this.addFilterButton.click();
+  }
+
+  async resetFilter() {
+    await this.resetFilterButton.click();
+  }
+
+  async saveFilterAsView() {
+    await this.saveFilterAsViewButton.click();
+  }
+
+  async clickSortButton() {
+    await this.sortButton.click();
+  }
+
+  //can be Ascending or Descending
+  async setSortOrder(name: string) {
+    await this.sortOrderButton.click();
+    await this.page.getByTestId('tooltip').filter({ hasText: name }).click();
+  }
+
+  async clickOptionsButton() {
+    await this.optionsButton.click();
+  }
+
+  async clickFieldsButton() {
+    await this.fieldsButton.click();
+  }
+
+  async clickBackButton() {
+    await this.goBackButton.click();
+  }
+
+  async clickHiddenFieldsButton() {
+    await this.hiddenFieldsButton.click();
+  }
+
+  async clickEditFieldsButton() {
+    await this.editFieldsButton.click();
+  }
+
+  async clickImportButton() {
+    await this.importButton.click();
+  }
+
+  async clickExportButton() {
+    await this.exportButton.click();
+  }
+
+  async clickDeletedRecordsButton() {
+    await this.deletedRecordsButton.click();
+  }
+
+  async clickCreateNewRecordButton() {
+    await this.createNewRecordButton.click();
+  }
+
+  async clickAddToFavoritesButton() {
+    await this.addToFavoritesButton.click();
+  }
+
+  async clickDeleteFromFavoritesButton() {
+    await this.deleteFromFavoritesButton.click();
+  }
+
+  async clickExportBottomBarButton() {
+    await this.exportBottomBarButton.click();
+  }
+
+  async clickDeleteRecordsButton() {
+    await this.deleteRecordsButton.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/recordDetails.ts

@@ -0,0 +1,150 @@
+import { Locator, Page } from '@playwright/test';
+
+export class RecordDetails {
+  // TODO: add missing components in tasks, notes, files, emails, calendar tabs
+  private readonly closeRecordButton: Locator;
+  private readonly previousRecordButton: Locator;
+  private readonly nextRecordButton: Locator;
+  private readonly favoriteRecordButton: Locator;
+  private readonly addShowPageButton: Locator;
+  private readonly moreOptionsButton: Locator;
+  private readonly deleteButton: Locator;
+  private readonly uploadProfileImageButton: Locator;
+  private readonly timelineTab: Locator;
+  private readonly tasksTab: Locator;
+  private readonly notesTab: Locator;
+  private readonly filesTab: Locator;
+  private readonly emailsTab: Locator;
+  private readonly calendarTab: Locator;
+  private readonly detachRelationButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+  }
+
+  async clickCloseRecordButton() {
+    await this.closeRecordButton.click();
+  }
+
+  async clickPreviousRecordButton() {
+    await this.previousRecordButton.click();
+  }
+
+  async clickNextRecordButton() {
+    await this.nextRecordButton.click();
+  }
+
+  async clickFavoriteRecordButton() {
+    await this.favoriteRecordButton.click();
+  }
+
+  async createRelatedNote() {
+    await this.addShowPageButton.click();
+    await this.page
+      .locator('//div[@data-testid="tooltip" and contains(., "Note")]')
+      .click();
+  }
+
+  async createRelatedTask() {
+    await this.addShowPageButton.click();
+    await this.page
+      .locator('//div[@data-testid="tooltip" and contains(., "Task")]')
+      .click();
+  }
+
+  async clickMoreOptionsButton() {
+    await this.moreOptionsButton.click();
+  }
+
+  async clickDeleteRecordButton() {
+    await this.deleteButton.click();
+  }
+
+  async clickUploadProfileImageButton() {
+    await this.uploadProfileImageButton.click();
+  }
+
+  async goToTimelineTab() {
+    await this.timelineTab.click();
+  }
+
+  async goToTasksTab() {
+    await this.tasksTab.click();
+  }
+
+  async goToNotesTab() {
+    await this.notesTab.click();
+  }
+
+  async goToFilesTab() {
+    await this.filesTab.click();
+  }
+
+  async goToEmailsTab() {
+    await this.emailsTab.click();
+  }
+
+  async goToCalendarTab() {
+    await this.calendarTab.click();
+  }
+
+  async clickField(name: string) {
+    await this.page
+      .locator(
+        `//div[@data-testid='tooltip' and contains(., '${name}']/../../../div[last()]/div/div`,
+      )
+      .click();
+  }
+
+  async clickFieldWithButton(name: string) {
+    await this.page
+      .locator(
+        `//div[@data-testid='tooltip' and contains(., '${name}']/../../../div[last()]/div/div`,
+      )
+      .hover();
+    await this.page
+      .locator(
+        `//div[@data-testid='tooltip' and contains(., '${name}']/../../../div[last()]/div/div[last()]/div/button`,
+      )
+      .click();
+  }
+
+  async clickRelationEditButton(name: string) {
+    await this.page.getByRole('heading').filter({ hasText: name }).hover();
+    await this.page
+      .locator(`//header[contains(., "${name}")]/div[last()]/div/button`)
+      .click();
+  }
+
+  async detachRelation(name: string) {
+    await this.page.locator(`//a[contains(., "${name}")]`).hover();
+    await this.page
+      .locator(`, //a[contains(., "${name}")]/../div[last()]/div/div/button`)
+      .hover();
+    await this.detachRelationButton.click();
+  }
+
+  async deleteRelationRecord(name: string) {
+    await this.page.locator(`//a[contains(., "${name}")]`).hover();
+    await this.page
+      .locator(`, //a[contains(., "${name}")]/../div[last()]/div/div/button`)
+      .hover();
+    await this.deleteButton.click();
+  }
+
+  async selectRelationRecord(name: string) {
+    await this.page
+      .locator(`//div[@data-testid="tooltip" and contains(., "${name}")]`)
+      .click();
+  }
+
+  async searchRelationRecord(name: string) {
+    await this.page.getByPlaceholder('Search').fill(name);
+  }
+
+  async createNewRelationRecord() {
+    await this.page
+      .locator('//div[@data-testid="tooltip" and contains(., "Add New")]')
+      .click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/accountsSection.ts

@@ -0,0 +1,54 @@
+import { Locator, Page } from '@playwright/test';
+
+export class AccountsSection {
+  private readonly addAccountButton: Locator;
+  private readonly deleteAccountButton: Locator;
+  private readonly addBlocklistField: Locator;
+  private readonly addBlocklistButton: Locator;
+  private readonly connectWithGoogleButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.addAccountButton = page.getByRole('button', { name: 'Add account' });
+    this.deleteAccountButton = page
+      .getByTestId('tooltip')
+      .getByText('Remove account');
+    this.addBlocklistField = page.getByPlaceholder(
+      'eddy@gmail.com, @apple.com',
+    );
+    this.addBlocklistButton = page.getByRole('button', {
+      name: 'Add to blocklist',
+    });
+    this.connectWithGoogleButton = page.getByRole('button', {
+      name: 'Connect with Google',
+    });
+  }
+
+  async clickAddAccount() {
+    await this.addAccountButton.click();
+  }
+
+  async deleteAccount(email: string) {
+    await this.page
+      .locator(`//span[contains(., "${email}")]/../div/div/div/button`)
+      .click();
+    await this.deleteAccountButton.click();
+  }
+
+  async addToBlockList(domain: string) {
+    await this.addBlocklistField.fill(domain);
+    await this.addBlocklistButton.click();
+  }
+
+  async removeFromBlocklist(domain: string) {
+    await this.page
+      .locator(
+        `//div[@data-testid='tooltip' and contains(., '${domain}')]/../../div[last()]/button`,
+      )
+      .click();
+  }
+
+  async linkGoogleAccount() {
+    await this.connectWithGoogleButton.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/calendarSection.ts

@@ -0,0 +1,30 @@
+import { Locator, Page } from '@playwright/test';
+
+export class CalendarSection {
+  private readonly eventVisibilityEverythingOption: Locator;
+  private readonly eventVisibilityMetadataOption: Locator;
+  private readonly contactAutoCreation: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.eventVisibilityEverythingOption = page.locator(
+      'input[value="SHARE_EVERYTHING"]',
+    );
+    this.eventVisibilityMetadataOption = page.locator(
+      'input[value="METADATA"]',
+    );
+    this.contactAutoCreation = page.getByRole('checkbox').nth(1);
+  }
+
+  async changeVisibilityToEverything() {
+    await this.eventVisibilityEverythingOption.click();
+  }
+
+  async changeVisibilityToMetadata() {
+    await this.eventVisibilityMetadataOption.click();
+  }
+
+  async toggleAutoCreation() {
+    await this.contactAutoCreation.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/dataModelSection.ts

@@ -0,0 +1,189 @@
+import { Locator, Page } from '@playwright/test';
+
+export class DataModelSection {
+  private readonly searchObjectInput: Locator;
+  private readonly addObjectButton: Locator;
+  private readonly objectSingularNameInput: Locator;
+  private readonly objectPluralNameInput: Locator;
+  private readonly objectDescription: Locator;
+  private readonly synchronizeLabelAPIToggle: Locator;
+  private readonly objectAPISingularNameInput: Locator;
+  private readonly objectAPIPluralNameInput: Locator;
+  private readonly objectMoreOptionsButton: Locator;
+  private readonly editObjectButton: Locator;
+  private readonly deleteObjectButton: Locator;
+  private readonly activeSection: Locator;
+  private readonly inactiveSection: Locator;
+  private readonly searchFieldInput: Locator;
+  private readonly addFieldButton: Locator;
+  private readonly viewFieldDetailsMoreOptionsButton: Locator;
+  private readonly nameFieldInput: Locator;
+  private readonly descriptionFieldInput: Locator;
+  private readonly deactivateMoreOptionsButton: Locator;
+  private readonly activateMoreOptionsButton: Locator;
+  private readonly deactivateButton: Locator; // TODO: add attribute to make it one button
+  private readonly activateButton: Locator;
+  private readonly cancelButton: Locator;
+  private readonly saveButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.searchObjectInput = page.getByPlaceholder('Search an object...');
+    this.addObjectButton = page.getByRole('button', { name: 'Add object' });
+    this.objectSingularNameInput = page.getByPlaceholder('Listing', {
+      exact: true,
+    });
+    this.objectPluralNameInput = page.getByPlaceholder('Listings', {
+      exact: true,
+    });
+    this.objectDescription = page.getByPlaceholder('Write a description');
+    this.synchronizeLabelAPIToggle = page.getByRole('checkbox').nth(1);
+    this.objectAPISingularNameInput = page.getByPlaceholder('listing', {
+      exact: true,
+    });
+    this.objectAPIPluralNameInput = page.getByPlaceholder('listings', {
+      exact: true,
+    });
+    this.objectMoreOptionsButton = page.getByLabel('Object Options');
+    this.editObjectButton = page.getByTestId('tooltip').getByText('Edit');
+    this.deactivateMoreOptionsButton = page
+      .getByTestId('tooltip')
+      .getByText('Deactivate');
+    this.activateMoreOptionsButton = page
+      .getByTestId('tooltip')
+      .getByText('Activate');
+    this.deleteObjectButton = page.getByTestId('tooltip').getByText('Delete');
+    this.activeSection = page.getByText('Active', { exact: true });
+    this.inactiveSection = page.getByText('Inactive');
+    this.searchFieldInput = page.getByPlaceholder('Search a field...');
+    this.addFieldButton = page.getByRole('button', { name: 'Add field' });
+    this.viewFieldDetailsMoreOptionsButton = page
+      .getByTestId('tooltip')
+      .getByText('View');
+    this.nameFieldInput = page.getByPlaceholder('Employees');
+    this.descriptionFieldInput = page.getByPlaceholder('Write a description');
+    this.deactivateButton = page.getByRole('button', { name: 'Deactivate' });
+    this.activateButton = page.getByRole('button', { name: 'Activate' });
+    this.cancelButton = page.getByRole('button', { name: 'Cancel' });
+    this.saveButton = page.getByRole('button', { name: 'Save' });
+  }
+
+  async searchObject(name: string) {
+    await this.searchObjectInput.fill(name);
+  }
+
+  async clickAddObjectButton() {
+    await this.addObjectButton.click();
+  }
+
+  async typeObjectSingularName(name: string) {
+    await this.objectSingularNameInput.fill(name);
+  }
+
+  async typeObjectPluralName(name: string) {
+    await this.objectPluralNameInput.fill(name);
+  }
+
+  async typeObjectDescription(name: string) {
+    await this.objectDescription.fill(name);
+  }
+
+  async toggleSynchronizeLabelAPI() {
+    await this.synchronizeLabelAPIToggle.click();
+  }
+
+  async typeObjectSingularAPIName(name: string) {
+    await this.objectAPISingularNameInput.fill(name);
+  }
+
+  async typeObjectPluralAPIName(name: string) {
+    await this.objectAPIPluralNameInput.fill(name);
+  }
+
+  async checkObjectDetails(name: string) {
+    await this.page.getByRole('link').filter({ hasText: name }).click();
+  }
+
+  async activateInactiveObject(name: string) {
+    await this.page
+      .locator(`//div[@title="${name}"]/../../div[last()]`)
+      .click();
+    await this.activateButton.click();
+  }
+
+  // object can be deleted only if is custom and inactive
+  async deleteInactiveObject(name: string) {
+    await this.page
+      .locator(`//div[@title="${name}"]/../../div[last()]`)
+      .click();
+    await this.deleteObjectButton.click();
+  }
+
+  async editObjectDetails() {
+    await this.objectMoreOptionsButton.click();
+    await this.editObjectButton.click();
+  }
+
+  async deactivateObjectWithMoreOptions() {
+    await this.objectMoreOptionsButton.click();
+    await this.deactivateButton.click();
+  }
+
+  async searchField(name: string) {
+    await this.searchFieldInput.fill(name);
+  }
+
+  async checkFieldDetails(name: string) {
+    await this.page.locator(`//div[@title="${name}"]`).click();
+  }
+
+  async checkFieldDetailsWithButton(name: string) {
+    await this.page
+      .locator(`//div[@title="${name}"]/../../div[last()]`)
+      .click();
+    await this.viewFieldDetailsMoreOptionsButton.click();
+  }
+
+  async deactivateFieldWithButton(name: string) {
+    await this.page
+      .locator(`//div[@title="${name}"]/../../div[last()]`)
+      .click();
+    await this.deactivateMoreOptionsButton.click();
+  }
+
+  async activateFieldWithButton(name: string) {
+    await this.page
+      .locator(`//div[@title="${name}"]/../../div[last()]`)
+      .click();
+    await this.activateMoreOptionsButton.click();
+  }
+
+  async clickAddFieldButton() {
+    await this.addFieldButton.click();
+  }
+
+  async typeFieldName(name: string) {
+    await this.nameFieldInput.clear();
+    await this.nameFieldInput.fill(name);
+  }
+
+  async typeFieldDescription(description: string) {
+    await this.descriptionFieldInput.clear();
+    await this.descriptionFieldInput.fill(description);
+  }
+
+  async clickInactiveSection() {
+    await this.inactiveSection.click();
+  }
+
+  async clickActiveSection() {
+    await this.activeSection.click();
+  }
+
+  async clickCancelButton() {
+    await this.cancelButton.click();
+  }
+
+  async clickSaveButton() {
+    await this.saveButton.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/developersSection.ts

@@ -0,0 +1,123 @@
+import { Locator, Page } from '@playwright/test';
+
+export class DevelopersSection {
+  private readonly readDocumentationButton: Locator;
+  private readonly createAPIKeyButton: Locator;
+  private readonly regenerateAPIKeyButton: Locator;
+  private readonly nameOfAPIKeyInput: Locator;
+  private readonly expirationDateAPIKeySelect: Locator;
+  private readonly createWebhookButton: Locator;
+  private readonly webhookURLInput: Locator;
+  private readonly webhookDescription: Locator;
+  private readonly webhookFilterObjectSelect: Locator;
+  private readonly webhookFilterActionSelect: Locator;
+  private readonly cancelButton: Locator;
+  private readonly saveButton: Locator;
+  private readonly deleteButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.readDocumentationButton = page.getByRole('link', {
+      name: 'Read documentation',
+    });
+    this.createAPIKeyButton = page.getByRole('link', {
+      name: 'Create API Key',
+    });
+    this.createWebhookButton = page.getByRole('link', {
+      name: 'Create Webhook',
+    });
+    this.nameOfAPIKeyInput = page
+      .getByPlaceholder('E.g. backoffice integration')
+      .first();
+    this.expirationDateAPIKeySelect = page
+      .locator('div')
+      .filter({ hasText: /^Never$/ })
+      .nth(3); // good enough if expiration date will change only 1 time
+    this.regenerateAPIKeyButton = page.getByRole('button', {
+      name: 'Regenerate Key',
+    });
+    this.webhookURLInput = page.getByPlaceholder('URL');
+    this.webhookDescription = page.getByPlaceholder('Write a description');
+    this.webhookFilterObjectSelect = page
+      .locator('div')
+      .filter({ hasText: /^All Objects$/ })
+      .nth(3); // works only for first filter
+    this.webhookFilterActionSelect = page
+      .locator('div')
+      .filter({ hasText: /^All Actions$/ })
+      .nth(3); // works only for first filter
+    this.cancelButton = page.getByRole('button', { name: 'Cancel' });
+    this.saveButton = page.getByRole('button', { name: 'Save' });
+    this.deleteButton = page.getByRole('button', { name: 'Delete' });
+  }
+
+  async openDocumentation() {
+    await this.readDocumentationButton.click();
+  }
+
+  async createAPIKey() {
+    await this.createAPIKeyButton.click();
+  }
+
+  async typeAPIKeyName(name: string) {
+    await this.nameOfAPIKeyInput.clear();
+    await this.nameOfAPIKeyInput.fill(name);
+  }
+
+  async selectAPIExpirationDate(date: string) {
+    await this.expirationDateAPIKeySelect.click();
+    await this.page.getByText(date, { exact: true }).click();
+  }
+
+  async regenerateAPIKey() {
+    await this.regenerateAPIKeyButton.click();
+  }
+
+  async deleteAPIKey() {
+    await this.deleteButton.click();
+  }
+
+  async deleteWebhook() {
+    await this.deleteButton.click();
+  }
+
+  async createWebhook() {
+    await this.createWebhookButton.click();
+  }
+
+  async typeWebhookURL(url: string) {
+    await this.webhookURLInput.fill(url);
+  }
+
+  async typeWebhookDescription(description: string) {
+    await this.webhookDescription.fill(description);
+  }
+
+  async selectWebhookObject(object: string) {
+    // TODO: finish
+  }
+
+  async selectWebhookAction(action: string) {
+    // TODO: finish
+  }
+
+  async deleteWebhookFilter() {
+    // TODO: finish
+  }
+
+  async clickCancelButton() {
+    await this.cancelButton.click();
+  }
+
+  async clickSaveButton() {
+    await this.saveButton.click();
+  }
+
+  async checkAPIKeyDetails(name: string) {
+    await this.page.locator(`//a/div[contains(.,'${name}')][first()]`).click();
+  }
+
+  async checkWebhookDetails(name: string) {
+    await this.page.locator(`//a/div[contains(.,'${name}')][first()]`).click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/emailsSection.ts

@@ -0,0 +1,61 @@
+import { Locator, Page } from '@playwright/test';
+
+export class EmailsSection {
+  private readonly visibilityEverythingRadio: Locator;
+  private readonly visibilitySubjectRadio: Locator;
+  private readonly visibilityMetadataRadio: Locator;
+  private readonly autoCreationReceivedRadio: Locator;
+  private readonly autoCreationSentRadio: Locator;
+  private readonly autoCreationNoneRadio: Locator;
+  private readonly excludeNonProfessionalToggle: Locator;
+  private readonly excludeGroupToggle: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.visibilityEverythingRadio = page.locator(
+      'input[value="SHARE_EVERYTHING"]',
+    );
+    this.visibilitySubjectRadio = page.locator('input[value="SUBJECT"]');
+    this.visibilityMetadataRadio = page.locator('input[value="METADATA"]');
+    this.autoCreationReceivedRadio = page.locator(
+      'input[value="SENT_AND_RECEIVED"]',
+    );
+    this.autoCreationSentRadio = page.locator('input[value="SENT"]');
+    this.autoCreationNoneRadio = page.locator('input[value="NONE"]');
+    // first checkbox is advanced settings toggle
+    this.excludeNonProfessionalToggle = page.getByRole('checkbox').nth(1);
+    this.excludeGroupToggle = page.getByRole('checkbox').nth(2);
+  }
+
+  async changeVisibilityToEverything() {
+    await this.visibilityEverythingRadio.click();
+  }
+
+  async changeVisibilityToSubject() {
+    await this.visibilitySubjectRadio.click();
+  }
+
+  async changeVisibilityToMetadata() {
+    await this.visibilityMetadataRadio.click();
+  }
+
+  async changeAutoCreationToAll() {
+    await this.autoCreationReceivedRadio.click();
+  }
+
+  async changeAutoCreationToSent() {
+    await this.autoCreationSentRadio.click();
+  }
+
+  async changeAutoCreationToNone() {
+    await this.autoCreationNoneRadio.click();
+  }
+
+  async toggleExcludeNonProfessional() {
+    await this.excludeNonProfessionalToggle.click();
+  }
+
+  async toggleExcludeGroup() {
+    await this.excludeGroupToggle.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/experienceSection.ts

@@ -0,0 +1,55 @@
+import { Locator, Page } from '@playwright/test';
+
+export class ExperienceSection {
+  private readonly lightThemeButton: Locator;
+  private readonly darkThemeButton: Locator;
+  private readonly timezoneDropdown: Locator;
+  private readonly dateFormatDropdown: Locator;
+  private readonly timeFormatDropdown: Locator;
+  private readonly searchInput: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.lightThemeButton = page.getByText('AaLight'); // it works
+    this.darkThemeButton = page.getByText('AaDark');
+    this.timezoneDropdown = page.locator(
+      '//span[contains(., "Time zone")]/../div/div/div',
+    );
+    this.dateFormatDropdown = page.locator(
+      '//span[contains(., "Date format")]/../div/div/div',
+    );
+    this.timeFormatDropdown = page.locator(
+      '//span[contains(., "Time format")]/../div/div/div',
+    );
+    this.searchInput = page.getByPlaceholder('Search');
+  }
+
+  async changeThemeToLight() {
+    await this.lightThemeButton.click();
+  }
+
+  async changeThemeToDark() {
+    await this.darkThemeButton.click();
+  }
+
+  async selectTimeZone(timezone: string) {
+    await this.timezoneDropdown.click();
+    await this.page.getByText(timezone, { exact: true }).click();
+  }
+
+  async selectTimeZoneWithSearch(timezone: string) {
+    await this.timezoneDropdown.click();
+    await this.searchInput.fill(timezone);
+    await this.page.getByText(timezone, { exact: true }).click();
+  }
+
+  async selectDateFormat(dateFormat: string) {
+    await this.dateFormatDropdown.click();
+    await this.page.getByText(dateFormat, { exact: true }).click();
+  }
+
+  async selectTimeFormat(timeFormat: string) {
+    await this.timeFormatDropdown.click();
+    await this.page.getByText(timeFormat, { exact: true }).click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/functionsSection.ts

@@ -0,0 +1,159 @@
+import { Locator, Page } from '@playwright/test';
+
+export class FunctionsSection {
+  private readonly newFunctionButton: Locator;
+  private readonly functionNameInput: Locator;
+  private readonly functionDescriptionInput: Locator;
+  private readonly editorTab: Locator;
+  private readonly codeEditorField: Locator;
+  private readonly resetButton: Locator;
+  private readonly publishButton: Locator;
+  private readonly testButton: Locator;
+  private readonly testTab: Locator;
+  private readonly runFunctionButton: Locator;
+  private readonly inputField: Locator;
+  private readonly settingsTab: Locator;
+  private readonly searchVariableInput: Locator;
+  private readonly addVariableButton: Locator;
+  private readonly nameVariableInput: Locator;
+  private readonly valueVariableInput: Locator;
+  private readonly cancelVariableButton: Locator;
+  private readonly saveVariableButton: Locator;
+  private readonly editVariableButton: Locator;
+  private readonly deleteVariableButton: Locator;
+  private readonly cancelButton: Locator;
+  private readonly saveButton: Locator;
+  private readonly deleteButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.newFunctionButton = page.getByRole('button', { name: 'New Function' });
+    this.functionNameInput = page.getByPlaceholder('Name');
+    this.functionDescriptionInput = page.getByPlaceholder('Description');
+    this.editorTab = page.getByTestId('tab-editor');
+    this.codeEditorField = page.getByTestId('dummyInput'); // TODO: fix
+    this.resetButton = page.getByRole('button', { name: 'Reset' });
+    this.publishButton = page.getByRole('button', { name: 'Publish' });
+    this.testButton = page.getByRole('button', { name: 'Test' });
+    this.testTab = page.getByTestId('tab-test');
+    this.runFunctionButton = page.getByRole('button', { name: 'Run Function' });
+    this.inputField = page.getByTestId('dummyInput'); // TODO: fix
+    this.settingsTab = page.getByTestId('tab-settings');
+    this.searchVariableInput = page.getByPlaceholder('Search a variable');
+    this.addVariableButton = page.getByRole('button', { name: 'Add Variable' });
+    this.nameVariableInput = page.getByPlaceholder('Name').nth(1);
+    this.valueVariableInput = page.getByPlaceholder('Value');
+    this.cancelVariableButton = page.locator('.css-uwqduk').first(); // TODO: fix
+    this.saveVariableButton = page.locator('.css-uwqduk').nth(1); // TODO: fix
+    this.editVariableButton = page.getByText('Edit', { exact: true });
+    this.deleteVariableButton = page.getByText('Delete', { exact: true });
+    this.cancelButton = page.getByRole('button', { name: 'Cancel' });
+    this.saveButton = page.getByRole('button', { name: 'Save' });
+    this.deleteButton = page.getByRole('button', { name: 'Delete function' });
+  }
+
+  async clickNewFunction() {
+    await this.newFunctionButton.click();
+  }
+
+  async typeFunctionName(name: string) {
+    await this.functionNameInput.fill(name);
+  }
+
+  async typeFunctionDescription(description: string) {
+    await this.functionDescriptionInput.fill(description);
+  }
+
+  async checkFunctionDetails(name: string) {
+    await this.page.getByRole('link', { name: `${name} nodejs18.x` }).click();
+  }
+
+  async clickEditorTab() {
+    await this.editorTab.click();
+  }
+
+  async clickResetButton() {
+    await this.resetButton.click();
+  }
+
+  async clickPublishButton() {
+    await this.publishButton.click();
+  }
+
+  async clickTestButton() {
+    await this.testButton.click();
+  }
+
+  async typeFunctionCode() {
+    // TODO: finish once utils are merged
+  }
+
+  async clickTestTab() {
+    await this.testTab.click();
+  }
+
+  async runFunction() {
+    await this.runFunctionButton.click();
+  }
+
+  async typeFunctionInput() {
+    // TODO: finish once utils are merged
+  }
+
+  async clickSettingsTab() {
+    await this.settingsTab.click();
+  }
+
+  async searchVariable(name: string) {
+    await this.searchVariableInput.fill(name);
+  }
+
+  async addVariable() {
+    await this.addVariableButton.click();
+  }
+
+  async typeVariableName(name: string) {
+    await this.nameVariableInput.fill(name);
+  }
+
+  async typeVariableValue(value: string) {
+    await this.valueVariableInput.fill(value);
+  }
+
+  async editVariable(name: string) {
+    await this.page
+      .locator(
+        `//div[@data-testid='tooltip' and contains(., '${name}')]/../../div[last()]/div/div/button`,
+      )
+      .click();
+    await this.editVariableButton.click();
+  }
+
+  async deleteVariable(name: string) {
+    await this.page
+      .locator(
+        `//div[@data-testid='tooltip' and contains(., '${name}')]/../../div[last()]/div/div/button`,
+      )
+      .click();
+    await this.deleteVariableButton.click();
+  }
+
+  async cancelVariable() {
+    await this.cancelVariableButton.click();
+  }
+
+  async saveVariable() {
+    await this.saveVariableButton.click();
+  }
+
+  async clickCancelButton() {
+    await this.cancelButton.click();
+  }
+
+  async clickSaveButton() {
+    await this.saveButton.click();
+  }
+
+  async clickDeleteButton() {
+    await this.deleteButton.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/generalSection.ts

@@ -0,0 +1,29 @@
+import { Locator, Page } from '@playwright/test';
+
+export class GeneralSection {
+  private readonly workspaceNameField: Locator;
+  private readonly supportSwitch: Locator;
+  private readonly deleteWorkspaceButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.workspaceNameField = page.getByPlaceholder('Apple');
+    this.supportSwitch = page.getByRole('checkbox').nth(1);
+    this.deleteWorkspaceButton = page.getByRole('button', {
+      name: 'Delete workspace',
+    });
+  }
+
+  async changeWorkspaceName(workspaceName: string) {
+    await this.workspaceNameField.clear();
+    await this.workspaceNameField.fill(workspaceName);
+  }
+
+  async changeSupportSwitchState() {
+    await this.supportSwitch.click();
+  }
+
+  async clickDeleteWorkSpaceButton() {
+    await this.deleteWorkspaceButton.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/membersSection.ts

@@ -0,0 +1,48 @@
+import { Locator, Page } from '@playwright/test';
+
+export class MembersSection {
+  private readonly inviteMembersField: Locator;
+  private readonly inviteMembersButton: Locator;
+  private readonly inviteLinkButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.inviteMembersField = page.getByPlaceholder(
+      'tim@apple.com, jony.ive@apple',
+    );
+    this.inviteMembersButton = page.getByRole('button', { name: 'Invite' });
+    this.inviteLinkButton = page.getByRole('button', { name: 'Copy link' });
+  }
+
+  async copyInviteLink() {
+    await this.inviteLinkButton.click();
+  }
+
+  async sendInviteEmail(email: string) {
+    await this.inviteMembersField.click();
+    await this.inviteMembersField.fill(email);
+    await this.inviteMembersButton.click();
+  }
+
+  async deleteMember(email: string) {
+    await this.page
+      .locator(`//div[contains(., '${email}')]/../../div[last()]/div/button`)
+      .click();
+  }
+
+  async deleteInviteEmail(email: string) {
+    await this.page
+      .locator(
+        `//div[contains(., '${email}')]/../../div[last()]/div/button[first()]`,
+      )
+      .click();
+  }
+
+  async refreshInviteEmail(email: string) {
+    await this.page
+      .locator(
+        `//div[contains(., '${email}')]/../../div[last()]/div/button[last()]`,
+      )
+      .click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/newFieldSection.ts

@@ -0,0 +1,250 @@
+import { Locator, Page } from '@playwright/test';
+
+export class NewFieldSection {
+  private readonly searchTypeFieldInput: Locator;
+  private readonly currencyFieldLink: Locator;
+  private readonly currencyDefaultUnitSelect: Locator;
+  private readonly emailsFieldLink: Locator;
+  private readonly linksFieldLink: Locator;
+  private readonly phonesFieldLink: Locator;
+  private readonly addressFieldLink: Locator;
+  private readonly textFieldLink: Locator;
+  private readonly numberFieldLink: Locator;
+  private readonly decreaseDecimalsButton: Locator;
+  private readonly decimalsNumberInput: Locator;
+  private readonly increaseDecimalsButton: Locator;
+  private readonly booleanFieldLink: Locator;
+  private readonly defaultBooleanSelect: Locator;
+  private readonly dateTimeFieldLink: Locator;
+  private readonly dateFieldLink: Locator;
+  private readonly relativeDateToggle: Locator;
+  private readonly selectFieldLink: Locator;
+  private readonly multiSelectFieldLink: Locator;
+  private readonly setAsDefaultOptionButton: Locator;
+  private readonly removeOptionButton: Locator;
+  private readonly addOptionButton: Locator;
+  private readonly ratingFieldLink: Locator;
+  private readonly JSONFieldLink: Locator;
+  private readonly arrayFieldLink: Locator;
+  private readonly relationFieldLink: Locator;
+  private readonly relationTypeSelect: Locator;
+  private readonly objectDestinationSelect: Locator;
+  private readonly relationFieldNameInput: Locator;
+  private readonly fullNameFieldLink: Locator;
+  private readonly UUIDFieldLink: Locator;
+  private readonly nameFieldInput: Locator;
+  private readonly descriptionFieldInput: Locator;
+
+  constructor(public readonly page: Page) {
+    this.searchTypeFieldInput = page.getByPlaceholder('Search a type');
+    this.currencyFieldLink = page.getByRole('link', { name: 'Currency' });
+    this.currencyDefaultUnitSelect = page.locator(
+      "//span[contains(., 'Default Unit')]/../div",
+    );
+    this.emailsFieldLink = page.getByRole('link', { name: 'Emails' }).nth(1);
+    this.linksFieldLink = page.getByRole('link', { name: 'Links' });
+    this.phonesFieldLink = page.getByRole('link', { name: 'Phones' });
+    this.addressFieldLink = page.getByRole('link', { name: 'Address' });
+    this.textFieldLink = page.getByRole('link', { name: 'Text' });
+    this.numberFieldLink = page.getByRole('link', { name: 'Number' });
+    this.decreaseDecimalsButton = page.locator(
+      "//div[contains(., 'Number of decimals')]/../div[last()]/div/div/button[2]",
+    );
+    this.decimalsNumberInput = page.locator(
+      // would be better if first div was span tag
+      "//div[contains(., 'Number of decimals')]/../div[last()]/div/div/div/div/input[2]",
+    );
+    this.increaseDecimalsButton = page.locator(
+      "//div[contains(., 'Number of decimals')]/../div[last()]/div/div/button[3]",
+    );
+    this.booleanFieldLink = page.getByRole('link', { name: 'True/False' });
+    this.defaultBooleanSelect = page.locator(
+      "//span[contains(., 'Default Value')]/../div",
+    );
+    this.dateTimeFieldLink = page.getByRole('link', { name: 'Date and Time' });
+    this.dateFieldLink = page.getByRole('link', { name: 'Date' });
+    this.relativeDateToggle = page.getByRole('checkbox').nth(1);
+    this.selectFieldLink = page.getByRole('link', { name: 'Select' });
+    this.multiSelectFieldLink = page.getByRole('link', {
+      name: 'Multi-select',
+    });
+    this.setAsDefaultOptionButton = page
+      .getByTestId('tooltip')
+      .getByText('Set as default');
+    this.removeOptionButton = page
+      .getByTestId('tooltip')
+      .getByText('Remove option');
+    this.addOptionButton = page.getByRole('button', { name: 'Add option' });
+    this.ratingFieldLink = page.getByRole('link', { name: 'Rating' });
+    this.JSONFieldLink = page.getByRole('link', { name: 'JSON' });
+    this.arrayFieldLink = page.getByRole('link', { name: 'Array' });
+    this.relationFieldLink = page.getByRole('link', { name: 'Relation' });
+    this.relationTypeSelect = page.locator(
+      "//span[contains(., 'Relation type')]/../div",
+    );
+    this.objectDestinationSelect = page.locator(
+      "//span[contains(., 'Object destination')]/../div",
+    );
+    this.relationIconSelect = page.getByLabel('Click to select icon (').nth(1);
+    this.relationFieldNameInput = page.getByPlaceholder('Field name');
+    this.fullNameFieldLink = page.getByRole('link', { name: 'Full Name' });
+    this.UUIDFieldLink = page.getByRole('link', { name: 'Unique ID' });
+    this.nameFieldInput = page.getByPlaceholder('Employees');
+    this.descriptionFieldInput = page.getByPlaceholder('Write a description');
+  }
+
+  async searchTypeField(name: string) {
+    await this.searchTypeFieldInput.fill(name);
+  }
+
+  async clickCurrencyType() {
+    await this.currencyFieldLink.click();
+  }
+
+  async selectDefaultUnit(name: string) {
+    await this.currencyDefaultUnitSelect.click();
+    await this.page.getByTestId('tooltip').filter({ hasText: name }).click();
+  }
+
+  async clickEmailsType() {
+    await this.emailsFieldLink.click();
+  }
+
+  async clickLinksType() {
+    await this.linksFieldLink.click();
+  }
+
+  async clickPhonesType() {
+    await this.phonesFieldLink.click();
+  }
+
+  async clickAddressType() {
+    await this.addressFieldLink.click();
+  }
+
+  async clickTextType() {
+    await this.textFieldLink.click();
+  }
+
+  async clickNumberType() {
+    await this.numberFieldLink.click();
+  }
+
+  async decreaseDecimals() {
+    await this.decreaseDecimalsButton.click();
+  }
+
+  async typeNumberOfDecimals(amount: number) {
+    await this.decimalsNumberInput.fill(String(amount));
+  }
+
+  async increaseDecimals() {
+    await this.increaseDecimalsButton.click();
+  }
+
+  async clickBooleanType() {
+    await this.booleanFieldLink.click();
+  }
+
+  // either True of False
+  async selectDefaultBooleanValue(value: string) {
+    await this.defaultBooleanSelect.click();
+    await this.page.getByTestId('tooltip').filter({ hasText: value }).click();
+  }
+
+  async clickDateTimeType() {
+    await this.dateTimeFieldLink.click();
+  }
+
+  async clickDateType() {
+    await this.dateFieldLink.click();
+  }
+
+  async toggleRelativeDate() {
+    await this.relativeDateToggle.click();
+  }
+
+  async clickSelectType() {
+    await this.selectFieldLink.click();
+  }
+
+  async clickMultiSelectType() {
+    await this.multiSelectFieldLink.click();
+  }
+
+  async addSelectOption() {
+    await this.addOptionButton.click();
+  }
+
+  async setOptionAsDefault() {
+    // TODO: finish
+    await this.setAsDefaultOptionButton.click();
+  }
+
+  async deleteSelectOption() {
+    // TODO: finish
+    await this.removeOptionButton.click();
+  }
+
+  async changeOptionAPIName() {
+    // TODO: finish
+  }
+
+  async changeOptionColor() {
+    // TODO: finish
+  }
+
+  async changeOptionName() {
+    // TODO: finish
+  }
+
+  async clickRatingType() {
+    await this.ratingFieldLink.click();
+  }
+
+  async clickJSONType() {
+    await this.JSONFieldLink.click();
+  }
+
+  async clickArrayType() {
+    await this.arrayFieldLink.click();
+  }
+
+  async clickRelationType() {
+    await this.relationFieldLink.click();
+  }
+
+  // either 'Has many' or 'Belongs to one'
+  async selectRelationType(name: string) {
+    await this.relationTypeSelect.click();
+    await this.page.getByTestId('tooltip').filter({ hasText: name }).click();
+  }
+
+  async selectObjectDestination(name: string) {
+    await this.objectDestinationSelect.click();
+    await this.page.getByTestId('tooltip').filter({ hasText: name }).click();
+  }
+
+  async typeRelationName(name: string) {
+    await this.relationFieldNameInput.clear();
+    await this.relationFieldNameInput.fill(name);
+  }
+
+  async clickFullNameType() {
+    await this.fullNameFieldLink.click();
+  }
+
+  async clickUUIDType() {
+    await this.UUIDFieldLink.click();
+  }
+
+  async typeFieldName(name: string) {
+    await this.nameFieldInput.clear();
+    await this.nameFieldInput.fill(name);
+  }
+
+  async typeFieldDescription(description: string) {
+    await this.descriptionFieldInput.clear();
+    await this.descriptionFieldInput.fill(description);
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/profileSection.ts

@@ -0,0 +1,44 @@
+import { Locator, Page } from '@playwright/test';
+
+export class ProfileSection {
+  private readonly firstNameField: Locator;
+  private readonly lastNameField: Locator;
+  private readonly emailField: Locator;
+  private readonly changePasswordButton: Locator;
+  private readonly deleteAccountButton: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.firstNameField = page.getByPlaceholder('Tim');
+    this.lastNameField = page.getByPlaceholder('Cook');
+    this.emailField = page.getByRole('textbox').nth(2);
+    this.changePasswordButton = page.getByRole('button', {
+      name: 'Change Password',
+    });
+    this.deleteAccountButton = page.getByRole('button', {
+      name: 'Delete account',
+    });
+  }
+
+  async changeFirstName(firstName: string) {
+    await this.firstNameField.clear();
+    await this.firstNameField.fill(firstName);
+  }
+
+  async changeLastName(lastName: string) {
+    await this.lastNameField.clear();
+    await this.lastNameField.fill(lastName);
+  }
+
+  async getEmail() {
+    await this.emailField.textContent();
+  }
+
+  async sendChangePasswordEmail() {
+    await this.changePasswordButton.click();
+  }
+
+  async deleteAccount() {
+    await this.deleteAccountButton.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settings/securitySection.ts

@@ -0,0 +1,13 @@
+import { Locator, Page } from '@playwright/test';
+
+export class SecuritySection {
+  private readonly inviteByLinkToggle: Locator;
+
+  constructor(public readonly page: Page) {
+    this.inviteByLinkToggle = page.locator('input[type="checkbox"]').nth(1);
+  }
+
+  async toggleInviteByLink() {
+    await this.inviteByLinkToggle.click();
+  }
+}

packages/twenty-e2e-testing/lib/pom/settingsPage.ts

@@ -0,0 +1,104 @@
+import { Locator, Page } from '@playwright/test';
+
+export class SettingsPage {
+  private readonly exitSettingsLink: Locator;
+  private readonly profileLink: Locator;
+  private readonly experienceLink: Locator;
+  private readonly accountsLink: Locator;
+  private readonly emailsLink: Locator;
+  private readonly calendarsLink: Locator;
+  private readonly generalLink: Locator;
+  private readonly membersLink: Locator;
+  private readonly dataModelLink: Locator;
+  private readonly developersLink: Locator;
+  private readonly functionsLink: Locator;
+  private readonly securityLink: Locator;
+  private readonly integrationsLink: Locator;
+  private readonly releasesLink: Locator;
+  private readonly logoutLink: Locator;
+  private readonly advancedToggle: Locator;
+
+  constructor(public readonly page: Page) {
+    this.page = page;
+    this.exitSettingsLink = page.getByRole('button', { name: 'Exit Settings' });
+    this.profileLink = page.getByRole('link', { name: 'Profile' });
+    this.experienceLink = page.getByRole('link', { name: 'Experience' });
+    this.accountsLink = page.getByRole('link', { name: 'Accounts' });
+    this.emailsLink = page.getByRole('link', { name: 'Emails', exact: true });
+    this.calendarsLink = page.getByRole('link', { name: 'Calendars' });
+    this.generalLink = page.getByRole('link', { name: 'General' });
+    this.membersLink = page.getByRole('link', { name: 'Members' });
+    this.dataModelLink = page.getByRole('link', { name: 'Data model' });
+    this.developersLink = page.getByRole('link', { name: 'Developers' });
+    this.functionsLink = page.getByRole('link', { name: 'Functions' });
+    this.integrationsLink = page.getByRole('link', { name: 'Integrations' });
+    this.securityLink = page.getByRole('link', { name: 'Security' });
+    this.releasesLink = page.getByRole('link', { name: 'Releases' });
+    this.logoutLink = page.getByText('Logout');
+    this.advancedToggle = page.locator('input[type="checkbox"]').first();
+  }
+
+  async leaveSettingsPage() {
+    await this.exitSettingsLink.click();
+  }
+
+  async goToProfileSection() {
+    await this.profileLink.click();
+  }
+
+  async goToExperienceSection() {
+    await this.experienceLink.click();
+  }
+
+  async goToAccountsSection() {
+    await this.accountsLink.click();
+  }
+
+  async goToEmailsSection() {
+    await this.emailsLink.click();
+  }
+
+  async goToCalendarsSection() {
+    await this.calendarsLink.click();
+  }
+
+  async goToGeneralSection() {
+    await this.generalLink.click();
+  }
+
+  async goToMembersSection() {
+    await this.membersLink.click();
+  }
+
+  async goToDataModelSection() {
+    await this.dataModelLink.click();
+  }
+
+  async goToDevelopersSection() {
+    await this.developersLink.click();
+  }
+
+  async goToFunctionsSection() {
+    await this.functionsLink.click();
+  }
+
+  async goToSecuritySection() {
+    await this.securityLink.click();
+  }
+
+  async goToIntegrationsSection() {
+    await this.integrationsLink.click();
+  }
+
+  async goToReleasesIntegration() {
+    await this.releasesLink.click();
+  }
+
+  async logout() {
+    await this.logoutLink.click();
+  }
+
+  async toggleAdvancedSettings() {
+    await this.advancedToggle.click();
+  }
+}

packages/twenty-e2e-testing/lib/utils/keyboardShortcuts.ts

@@ -0,0 +1,94 @@
+import { Page } from '@playwright/test';
+
+const MAC = process.platform === 'darwin';
+
+async function keyDownCtrlOrMeta(page: Page) {
+  if (MAC) {
+    await page.keyboard.down('Meta');
+  } else {
+    await page.keyboard.down('Control');
+  }
+}
+
+async function keyUpCtrlOrMeta(page: Page) {
+  if (MAC) {
+    await page.keyboard.up('Meta');
+  } else {
+    await page.keyboard.up('Control');
+  }
+}
+
+export async function withCtrlOrMeta(page: Page, key: () => Promise<void>) {
+  await keyDownCtrlOrMeta(page);
+  await key();
+  await keyUpCtrlOrMeta(page);
+}
+
+export async function selectAllByKeyboard(page: Page) {
+  await keyDownCtrlOrMeta(page);
+  await page.keyboard.press('a', { delay: 50 });
+  await keyUpCtrlOrMeta(page);
+}
+
+export async function copyByKeyboard(page: Page) {
+  await keyDownCtrlOrMeta(page);
+  await page.keyboard.press('c', { delay: 50 });
+  await keyUpCtrlOrMeta(page);
+}
+
+export async function cutByKeyboard(page: Page) {
+  await keyDownCtrlOrMeta(page);
+  await page.keyboard.press('x', { delay: 50 });
+  await keyUpCtrlOrMeta(page);
+}
+
+export async function pasteByKeyboard(page: Page) {
+  await keyDownCtrlOrMeta(page);
+  await page.keyboard.press('v', { delay: 50 });
+  await keyUpCtrlOrMeta(page);
+}
+
+export async function companiesShortcut(page: Page) {
+  await page.keyboard.press('g', { delay: 50 });
+  await page.keyboard.press('c');
+}
+
+export async function notesShortcut(page: Page) {
+  await page.keyboard.press('g', { delay: 50 });
+  await page.keyboard.press('n');
+}
+
+export async function opportunitiesShortcut(page: Page) {
+  await page.keyboard.press('g', { delay: 50 });
+  await page.keyboard.press('o');
+}
+
+export async function peopleShortcut(page: Page) {
+  await page.keyboard.press('g', { delay: 50 });
+  await page.keyboard.press('p');
+}
+
+export async function rocketsShortcut(page: Page) {
+  await page.keyboard.press('g', { delay: 50 });
+  await page.keyboard.press('r');
+}
+
+export async function tasksShortcut(page: Page) {
+  await page.keyboard.press('g', { delay: 50 });
+  await page.keyboard.press('t');
+}
+
+export async function workflowsShortcut(page: Page) {
+  await page.keyboard.press('g', { delay: 50 });
+  await page.keyboard.press('w');
+}
+
+export async function settingsShortcut(page: Page) {
+  await page.keyboard.press('g', { delay: 50 });
+  await page.keyboard.press('s');
+}
+
+export async function customShortcut(page: Page, shortcut: string) {
+  await page.keyboard.press('g', { delay: 50 });
+  await page.keyboard.press(shortcut);
+}

packages/twenty-e2e-testing/lib/utils/pasteCodeToCodeEditor.ts

@@ -0,0 +1,14 @@
+import { Locator, Page } from '@playwright/test';
+import { selectAllByKeyboard } from './keyboardShortcuts';
+
+// https://github.com/microsoft/playwright/issues/14126
+// code must have \n at the end of lines otherwise everything will be in one line
+export const pasteCodeToCodeEditor = async (
+  page: Page,
+  locator: Locator,
+  code: string,
+) => {
+  await locator.click();
+  await selectAllByKeyboard(page);
+  await page.keyboard.type(code);
+};

packages/twenty-e2e-testing/lib/utils/uploadFile.ts

@@ -0,0 +1,15 @@
+import { Page } from '@playwright/test';
+import path from 'path';
+
+export const fileUploader = async (
+  page: Page,
+  trigger: () => Promise<void>,
+  filename: string,
+) => {
+  const fileChooserPromise = page.waitForEvent('filechooser');
+  await trigger();
+  const fileChooser = await fileChooserPromise;
+  await fileChooser.setFiles(
+    path.join(__dirname, '..', 'test_files', filename),
+  );
+};

packages/twenty-e2e-testing/tests/companies.spec.ts

@@ -1,7 +1,4 @@
 import { test, expect } from '../lib/fixtures/screenshot';
-import { config } from 'dotenv';
-import path = require('path');
-config({ path: path.resolve(__dirname, '..', '.env') });
 
 test.describe('Basic check', () => {
   test('Checking if table in Companies is visible', async ({ page }) => {

packages/twenty-emails/package.json

@@ -1,6 +1,6 @@
 {
   "name": "twenty-emails",
-  "version": "0.31.1",
+  "version": "0.33.0",
   "description": "",
   "author": "",
   "private": true,

packages/twenty-front/.env.example

@@ -2,6 +2,10 @@ REACT_APP_SERVER_BASE_URL=http://localhost:3000
 GENERATE_SOURCEMAP=false
 
 # ———————— Optional ————————
+# REACT_APP_PORT=3001
 # CHROMATIC_PROJECT_TOKEN=
 # VITE_DISABLE_TYPESCRIPT_CHECKER=true
-# VITE_DISABLE_ESLINT_CHECKER=true
+# VITE_DISABLE_ESLINT_CHECKER=true
+# VITE_ENABLE_SSL=false
+# SSL_KEY_PATH="./certs/your-cert.key"
+# SSL_CERT_PATH="./certs/your-cert.crt"

packages/twenty-front/.eslintrc.cjs

@@ -1,3 +1,5 @@
+const path = require('path');
+
 module.exports = {
   extends: ['../../.eslintrc.cjs', '../../.eslintrc.react.cjs'],
   ignorePatterns: [
@@ -21,7 +23,16 @@ module.exports = {
       parserOptions: {
         project: ['packages/twenty-front/tsconfig.{json,*.json}'],
       },
-      rules: {},
+      plugins: ['project-structure'],
+      settings: {
+        'project-structure/folder-structure-config-path':path.resolve(
+          __dirname,
+          'folderStructure.json'
+        )
+      },
+      rules: {
+        'project-structure/folder-structure': 'error',
+      },
     },
   ],
 };

packages/twenty-front/.gitignore

@@ -41,4 +41,7 @@ dist-ssr
 *.sw?
 
 .vite/
-.nyc_output/
+.nyc_output/
+
+# eslint-plugin-project-structure
+projectStructure.cache.json

packages/twenty-front/.storybook/main.ts

@@ -50,8 +50,13 @@ const config: StorybookConfig = {
     const { mergeConfig } = await import('vite');
 
     return mergeConfig(config, {
-      // Add dependencies to pre-optimization
+      resolve: {
+        alias: {
+          'react-dom/client': 'react-dom/profiling',
+        },
+      },
     });
   },
+  logLevel: 'error',
 };
 export default config;

packages/twenty-front/.storybook/preview.tsx

@@ -29,6 +29,7 @@ initialize({
       with payload ${JSON.stringify(requestBody)}\n
       This request should be mocked with MSW`);
   },
+  quiet: true,
 });
 
 const preview: Preview = {

packages/twenty-front/folderStructure.json

@@ -0,0 +1,65 @@
+{
+  "$schema": "../../node_modules/eslint-plugin-project-structure/folderStructure.schema.json",
+  "projectRoot": "packages/twenty-front",
+  "structureRoot": "src",
+  "regexParameters": {
+    "camelCase": "^[a-z]+([A-Za-z0-9]+)+",
+    "kebab-case": "[a-z][a-z0-9]*(?:-[a-z0-9]+)*"
+  },
+  "structure": [
+    { "name": "*" },
+    { "name": "*", "children": [] },
+    { "name": "modules", "ruleId": "modulesFolderRule" }
+  ],
+  "rules": {
+    "modulesFolderRule": {
+      "children": [
+        { "ruleId": "moduleFolderRule" },
+        { "name": "types", "children": [] }
+      ]
+    },
+
+    "moduleFolderRule": {
+      "name": "{kebab-case}",
+      "folderRecursionLimit": 6,
+      "children": [
+        { "ruleId": "moduleFolderRule" },
+        { "name": "hooks", "ruleId": "hooksLeafFolderRule" },
+        { "name": "utils", "ruleId": "utilsLeafFolderRule" },
+        { "name": "states", "children": [] },
+        { "name": "types", "children": [] },
+        { "name": "graphql", "children": [] },
+        { "name": "components", "children": [] },
+        { "name": "effect-components", "children": [] },
+        { "name": "constants", "children": [] },
+        { "name": "validation-schemas", "children": [] },
+        { "name": "contexts", "children": [] },
+        { "name": "scopes", "children": [] },
+        { "name": "services", "children": [] },
+        { "name": "errors", "children": [] }
+      ]
+    },
+
+    "hooksLeafFolderRule": {
+      "folderRecursionLimit": 2,
+      "children": [
+        { "name": "use{PascalCase}.(ts|tsx)" },
+        {
+          "name": "__tests__",
+          "children": [{ "name": "use{PascalCase}.test.(ts|tsx)" }]
+        },
+        { "name": "internal", "ruleId": "hooksLeafFolderRule" }
+      ]
+    },
+
+    "utilsLeafFolderRule": {
+      "children": [
+        { "name": "{camelCase}.ts" },
+        {
+          "name": "__tests__",
+          "children": [{ "name": "{camelCase}.test.ts" }]
+        }
+      ]
+    }
+  }
+}

packages/twenty-front/index.html

@@ -6,7 +6,6 @@
     <link rel="icon" href="/icons/android/android-launchericon-48-48.png" />
     <link rel="apple-touch-icon" href="/icons/ios/192.png" />
 
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta name="theme-color" content="#000000" />
     <meta name="description" content="A modern open-source CRM" />
     <meta
@@ -30,6 +29,22 @@
 
     <title>Twenty</title>
     <script src="/env-config.js"></script>
+
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <script type="module">
+      const disableInputAutoZoom = () => {
+        const viewportMetadata = document.querySelector('meta[name=viewport]');
+
+        if (viewportMetadata !== null) {
+          viewportMetadata.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0');
+        }
+      }
+
+      const isIOS = /iPad|iPhone/.test(navigator.userAgent);
+      if (isIOS) {
+        disableInputAutoZoom();
+      }
+    </script>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

packages/twenty-front/jest.config.ts

@@ -25,9 +25,9 @@ const jestConfig: JestConfigWithTsJest = {
   extensionsToTreatAsEsm: ['.ts', '.tsx'],
   coverageThreshold: {
     global: {
-      statements: 60,
+      statements: 58,
       lines: 55,
-      functions: 50,
+      functions: 47,
     },
   },
   collectCoverageFrom: ['<rootDir>/src/**/*.ts'],

packages/twenty-front/nyc.config.cjs

@@ -10,7 +10,7 @@ const modulesCoverage = {
   branches: 25,
   statements: 49,
   lines: 50,
-  functions: 40,
+  functions: 38,
   include: ['src/modules/**/*'],
   exclude: ['src/**/*.ts'],
 };

packages/twenty-front/package.json

@@ -1,6 +1,6 @@
 {
   "name": "twenty-front",
-  "version": "0.31.1",
+  "version": "0.33.0",
   "private": true,
   "type": "module",
   "scripts": {
@@ -33,6 +33,12 @@
     "@nivo/calendar": "^0.87.0",
     "@nivo/core": "^0.87.0",
     "@nivo/line": "^0.87.0",
+    "@tiptap/extension-document": "^2.9.0",
+    "@tiptap/extension-paragraph": "^2.9.0",
+    "@tiptap/extension-placeholder": "^2.9.0",
+    "@tiptap/extension-text": "^2.9.0",
+    "@tiptap/extension-text-style": "^2.8.0",
+    "@tiptap/react": "^2.8.0",
     "@xyflow/react": "^12.0.4",
     "transliteration": "^2.3.5"
   }