Merge branch 'twentyhq:main' into contribute

.github/workflows/ci-front.yaml

@@ -63,6 +63,21 @@ jobs:
         run: npx nx reset:env twenty-front
       - name: Run storybook tests
         run: npx nx storybook:static:test twenty-front --configuration=${{ matrix.storybook_scope }}
+  front-sb-test-performance:
+    runs-on: ci-8-cores
+    env:
+      REACT_APP_SERVER_BASE_URL: http://localhost:3000
+    steps:
+      - name: Fetch local actions
+        uses: actions/checkout@v4
+      - name: Install dependencies
+        uses: ./.github/workflows/actions/yarn-install
+      - name: Install Playwright
+        run: cd packages/twenty-front && npx playwright install
+      - name: Front / Write .env
+        run: npx nx reset:env twenty-front
+      - name: Run storybook tests
+        run: npx nx storybook:performance:test twenty-front
   front-chromatic-deployment:
     if: contains(github.event.pull_request.labels.*.name, 'run-chromatic') || github.event_name == 'push'
     needs: front-sb-build

nx.json

@@ -177,6 +177,17 @@
         "port": 6006
       }
     },
+    "storybook:test:nocoverage": {
+      "executor": "nx:run-commands",
+      "inputs": ["^default", "excludeTests"],
+      "options": {
+        "cwd": "{projectRoot}",
+        "commands": [
+          "test-storybook --url http://localhost:{args.port} --maxWorkers=3"
+        ],
+        "port": 6006
+      }
+    },
     "storybook:static:test": {
       "executor": "nx:run-commands",
       "options": {
@@ -186,6 +197,15 @@
         "port": 6006
       }
     },
+    "storybook:performance:test": {
+      "executor": "nx:run-commands",
+      "options": {
+        "commands": [
+          "npx concurrently --kill-others --success=first -n SB,TEST 'nx storybook:dev {projectName} --configuration=performance --port={args.port}' 'npx wait-on tcp:{args.port} && nx storybook:test:nocoverage {projectName} --port={args.port} --configuration=performance'"
+        ],
+        "port": 6006
+      }
+    },
     "chromatic": {
       "executor": "nx:run-commands",
       "options": {

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

@@ -17,6 +17,10 @@ const computeStoriesGlob = () => {
     ];
   }
 
+  if (process.env.STORYBOOK_SCOPE === 'performance') {
+    return ['../src/modules/**/*.perf.stories.@(js|jsx|ts|tsx)'];
+  }
+
   if (process.env.STORYBOOK_SCOPE === 'ui-docs') {
     return ['../src/modules/ui/**/*.docs.mdx'];
   }

packages/twenty-front/.storybook/test-runner-jest.config.js

@@ -1,5 +1,7 @@
 import { getJestConfig } from '@storybook/test-runner';
 
+const MINUTES_IN_MS = 60 * 1000;
+
 /**
  * @type {import('@jest/types').Config.InitialOptions}
  */
@@ -9,5 +11,5 @@ export default {
   /** Add your own overrides below
    * @see https://jestjs.io/docs/configuration
    */
-  testTimeout: process.env.STORYBOOK_SCOPE === 'pages' ? 60000 : 15000,
+  testTimeout: 2 * MINUTES_IN_MS,
 };

packages/twenty-front/project.json

@@ -81,6 +81,12 @@
             "NODE_OPTIONS": "--max_old_space_size=5000",
             "STORYBOOK_SCOPE": "pages"
           }
+        },
+        "performance": { 
+          "env": {
+            "NODE_OPTIONS": "--max_old_space_size=5000",
+            "STORYBOOK_SCOPE": "performance"
+          }
         }
       }
     },
@@ -89,46 +95,62 @@
       "configurations": {
         "docs": { "env": { "STORYBOOK_SCOPE": "ui-docs" } },
         "modules": { "env": { "STORYBOOK_SCOPE": "modules" } },
-        "pages": { "env": { "STORYBOOK_SCOPE": "pages" } }
+        "pages": { "env": { "STORYBOOK_SCOPE": "pages" } },
+        "performance": { "env": { "STORYBOOK_SCOPE": "performance" } }
       }
     },
     "storybook:static": {
       "options": { "port": 6006 },
       "configurations": {
         "docs": { "env": { "STORYBOOK_SCOPE": "ui-docs" } },
         "modules": { "env": { "STORYBOOK_SCOPE": "modules" } },
-        "pages": { "env": { "STORYBOOK_SCOPE": "pages" } }
+        "pages": { "env": { "STORYBOOK_SCOPE": "pages" } },
+        "performance": { "env": { "STORYBOOK_SCOPE": "performance" } }
       }
     },
     "storybook:coverage": {
       "configurations": {
         "text": {},
         "docs": { "env": { "STORYBOOK_SCOPE": "ui-docs" } },
         "modules": { "env": { "STORYBOOK_SCOPE": "modules" } },
-        "pages": { "env": { "STORYBOOK_SCOPE": "pages" } }
+        "pages": { "env": { "STORYBOOK_SCOPE": "pages" } },
+        "performance": { "env": { "STORYBOOK_SCOPE": "performance" } }
       }
     },
     "storybook:test": {
       "options": { "port": 6006 },
       "configurations": {
         "docs": { "env": { "STORYBOOK_SCOPE": "ui-docs" } },
         "modules": { "env": { "STORYBOOK_SCOPE": "modules" } },
-        "pages": { "env": { "STORYBOOK_SCOPE": "pages" } }
+        "pages": { "env": { "STORYBOOK_SCOPE": "pages" } },
+        "performance": { "env": { "STORYBOOK_SCOPE": "performance" } }
+
+      }
+    },
+    "storybook:test:nocoverage": {
+      "configurations": {
+        "docs": { "env": { "STORYBOOK_SCOPE": "ui-docs" } },
+        "modules": { "env": { "STORYBOOK_SCOPE": "modules" } },
+        "pages": { "env": { "STORYBOOK_SCOPE": "pages" } },
+        "performance": { "env": { "STORYBOOK_SCOPE": "performance" } }
+
       }
     },
     "storybook:static:test": {
       "options": {
         "commands": [
-          "npx concurrently --kill-others --success=first -n SB,TEST 'nx storybook:static {projectName} --port={args.port}' 'npx wait-on tcp:{args.port} && nx storybook:test {projectName} --port={args.port} --configuration={args.scope}'"
+          "npx concurrently --kill-others --success=first -n SB,TEST 'nx storybook:static {projectName} --configuration={args.scope} --port={args.port}' 'npx wait-on tcp:{args.port} && nx storybook:test {projectName} --port={args.port} --configuration={args.scope}'"
         ],
         "port": 6006
       },
       "configurations": {
         "docs": { "scope": "ui-docs" },
         "modules": { "scope": "modules" },
-        "pages": { "scope": "pages" }
+        "pages": { "scope": "pages" },
+        "performance": { "scope": "performance" }
       }
     },
+    "storybook:performance:test": {},
     "graphql:generate": {
       "executor": "nx:run-commands",
       "defaultConfiguration": "data",

packages/twenty-front/src/generated-metadata/gql.ts

@@ -14,14 +14,14 @@ import { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/
  */
 const documents = {
     "\n  fragment RemoteServerFields on RemoteServer {\n    id\n    createdAt\n    foreignDataWrapperId\n    foreignDataWrapperOptions\n    foreignDataWrapperType\n    userMappingOptions {\n      user\n    }\n    updatedAt\n    schema\n  }\n": types.RemoteServerFieldsFragmentDoc,
-    "\n  fragment RemoteTableFields on RemoteTable {\n    id\n    name\n    schema\n    status\n  }\n": types.RemoteTableFieldsFragmentDoc,
+    "\n  fragment RemoteTableFields on RemoteTable {\n    id\n    name\n    schema\n    status\n    schemaPendingUpdates\n  }\n": types.RemoteTableFieldsFragmentDoc,
     "\n  \n  mutation createServer($input: CreateRemoteServerInput!) {\n    createOneRemoteServer(input: $input) {\n      ...RemoteServerFields\n    }\n  }\n": types.CreateServerDocument,
     "\n  mutation deleteServer($input: RemoteServerIdInput!) {\n    deleteOneRemoteServer(input: $input) {\n      id\n    }\n  }\n": types.DeleteServerDocument,
     "\n  \n  mutation syncRemoteTable($input: RemoteTableInput!) {\n    syncRemoteTable(input: $input) {\n      ...RemoteTableFields\n    }\n  }\n": types.SyncRemoteTableDocument,
     "\n  \n  mutation unsyncRemoteTable($input: RemoteTableInput!) {\n    unsyncRemoteTable(input: $input) {\n      ...RemoteTableFields\n    }\n  }\n": types.UnsyncRemoteTableDocument,
     "\n  \n  mutation updateServer($input: UpdateRemoteServerInput!) {\n    updateOneRemoteServer(input: $input) {\n      ...RemoteServerFields\n    }\n  }\n": types.UpdateServerDocument,
     "\n  \n  query GetManyDatabaseConnections($input: RemoteServerTypeInput!) {\n    findManyRemoteServersByType(input: $input) {\n      ...RemoteServerFields\n    }\n  }\n": types.GetManyDatabaseConnectionsDocument,
-    "\n  \n  query GetManyRemoteTables($input: RemoteServerIdInput!) {\n    findAvailableRemoteTablesByServerId(input: $input) {\n      ...RemoteTableFields\n    }\n  }\n": types.GetManyRemoteTablesDocument,
+    "\n  \n  query GetManyRemoteTables($input: FindManyRemoteTablesInput!) {\n    findAvailableRemoteTablesByServerId(input: $input) {\n      ...RemoteTableFields\n    }\n  }\n": types.GetManyRemoteTablesDocument,
     "\n  \n  query GetOneDatabaseConnection($input: RemoteServerIdInput!) {\n    findOneRemoteServerById(input: $input) {\n      ...RemoteServerFields\n    }\n  }\n": types.GetOneDatabaseConnectionDocument,
     "\n  mutation CreateOneObjectMetadataItem($input: CreateOneObjectInput!) {\n    createOneObject(input: $input) {\n      id\n      dataSourceId\n      nameSingular\n      namePlural\n      labelSingular\n      labelPlural\n      description\n      icon\n      isCustom\n      isActive\n      createdAt\n      updatedAt\n      labelIdentifierFieldMetadataId\n      imageIdentifierFieldMetadataId\n    }\n  }\n": types.CreateOneObjectMetadataItemDocument,
     "\n  mutation CreateOneFieldMetadataItem($input: CreateOneFieldMetadataInput!) {\n    createOneField(input: $input) {\n      id\n      type\n      name\n      label\n      description\n      icon\n      isCustom\n      isActive\n      isNullable\n      createdAt\n      updatedAt\n      defaultValue\n      options\n    }\n  }\n": types.CreateOneFieldMetadataItemDocument,
@@ -55,7 +55,7 @@ export function graphql(source: "\n  fragment RemoteServerFields on RemoteServer
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
-export function graphql(source: "\n  fragment RemoteTableFields on RemoteTable {\n    id\n    name\n    schema\n    status\n  }\n"): (typeof documents)["\n  fragment RemoteTableFields on RemoteTable {\n    id\n    name\n    schema\n    status\n  }\n"];
+export function graphql(source: "\n  fragment RemoteTableFields on RemoteTable {\n    id\n    name\n    schema\n    status\n    schemaPendingUpdates\n  }\n"): (typeof documents)["\n  fragment RemoteTableFields on RemoteTable {\n    id\n    name\n    schema\n    status\n    schemaPendingUpdates\n  }\n"];
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
@@ -83,7 +83,7 @@ export function graphql(source: "\n  \n  query GetManyDatabaseConnections($input
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
-export function graphql(source: "\n  \n  query GetManyRemoteTables($input: RemoteServerIdInput!) {\n    findAvailableRemoteTablesByServerId(input: $input) {\n      ...RemoteTableFields\n    }\n  }\n"): (typeof documents)["\n  \n  query GetManyRemoteTables($input: RemoteServerIdInput!) {\n    findAvailableRemoteTablesByServerId(input: $input) {\n      ...RemoteTableFields\n    }\n  }\n"];
+export function graphql(source: "\n  \n  query GetManyRemoteTables($input: FindManyRemoteTablesInput!) {\n    findAvailableRemoteTablesByServerId(input: $input) {\n      ...RemoteTableFields\n    }\n  }\n"): (typeof documents)["\n  \n  query GetManyRemoteTables($input: FindManyRemoteTablesInput!) {\n    findAvailableRemoteTablesByServerId(input: $input) {\n      ...RemoteTableFields\n    }\n  }\n"];
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */