Cherry-pick twentyhq#16206：修復看板視圖新建時沒有資料的問題

- 新增 mainGroupByFieldMetadataId 欄位到 View entity
- 新增資料庫遷移 1764680275312-addMainGroupByFieldMetadataId
- 補齊 usePersistViewGroup.ts 的 createViewGroups、deleteViewGroups、destroyViewGroups 函數
- 啟用 viewFragment.ts 的 mainGroupByFieldMetadataId 查詢
- 新增 isPersistingViewFieldsState 狀態
- 更新 ViewPicker 相關組件支援 mainGroupByFieldMetadataId

Author: notyenyu-creator

.cursor/rules/README.mdc

@@ -12,6 +12,7 @@ This directory contains Twenty's development guidelines and best practices in th
 ### Core Guidelines
 - **architecture.mdc** - Project overview, technology stack, and infrastructure setup (Always Applied)
 - **nx-rules.mdc** - Nx workspace guidelines and best practices (Auto-attached to Nx files)
+- **server-migrations.mdc** - Backend migration and TypeORM guidelines for `twenty-server` (Auto-attached to server entities and migration files)
 
 ### Code Quality
 - **typescript-guidelines.mdc** - TypeScript best practices and conventions (Auto-attached to .ts/.tsx files)
@@ -40,7 +41,7 @@ You can manually reference any rule using the `@ruleName` syntax:
 - `@testing-guidelines` - Get testing recommendations
 
 ### Rule Types Used
-- **Always Applied** - Loaded in every context (architecture.mdc, README.mdc)  
+- **Always Applied** - Loaded in every context (architecture.mdc, README.mdc)
 - **Auto Attached** - Loaded when matching file patterns are referenced
 - **Agent Requested** - Available for AI to include when relevant
 - **Manual** - Only included when explicitly mentioned

.cursor/rules/server-migrations.mdc

@@ -0,0 +1,29 @@
+---
+description: Guidelines for generating and managing TypeORM migrations in twenty-server
+globs: [
+  "packages/twenty-server/src/**/*.entity.ts",
+  "packages/twenty-server/src/database/typeorm/**/*.ts"
+]
+alwaysApply: false
+---
+
+## Server Migrations (twenty-server)
+
+- **When changing an entity, always generate a migration**
+  - If you modify a `*.entity.ts` file in `packages/twenty-server/src`, you **must** generate a corresponding TypeORM migration instead of manually editing the database schema.
+  - Use the Nx + TypeORM command from the project root:
+
+    ```bash
+    npx nx run twenty-server:typeorm migration:generate src/database/typeorm/core/migrations/common/[name] -d src/database/typeorm/core/core.datasource.ts
+    ```
+
+  - Replace `[name]` with a descriptive, kebab-case migration name that reflects the change (for example, `add-agent-turn-evaluation`).
+
+- **Prefer generated migrations over manual edits**
+  - Let TypeORM infer schema changes from the updated entities; only adjust the generated migration file manually if absolutely necessary (for example, for data backfills or complex constraints).
+  - Keep schema changes (DDL) in these generated migrations and avoid mixing in heavy data migrations unless there is a strong reason and clear comments.
+
+- **Keep migrations consistent and reversible**
+  - Ensure the generated migration includes both `up` and `down` logic that correctly applies and reverts the entity change when possible.
+  - Do not delete or rewrite existing, committed migrations unless you are explicitly working on a pre-release branch where history rewrites are allowed by team conventions.
+

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

@@ -670,6 +670,7 @@ export type CoreView = {
   kanbanAggregateOperation?: Maybe<AggregateOperations>;
   kanbanAggregateOperationFieldMetadataId?: Maybe<Scalars['UUID']>;
   key?: Maybe<ViewKey>;
+  mainGroupByFieldMetadataId?: Maybe<Scalars['UUID']>;
   name: Scalars['String'];
   objectMetadataId: Scalars['UUID'];
   openRecordIn: ViewOpenRecordIn;
@@ -966,6 +967,7 @@ export type CreateViewInput = {
   kanbanAggregateOperation?: InputMaybe<AggregateOperations>;
   kanbanAggregateOperationFieldMetadataId?: InputMaybe<Scalars['UUID']>;
   key?: InputMaybe<ViewKey>;
+  mainGroupByFieldMetadataId?: InputMaybe<Scalars['UUID']>;
   name: Scalars['String'];
   objectMetadataId: Scalars['UUID'];
   openRecordIn?: InputMaybe<ViewOpenRecordIn>;
@@ -4399,6 +4401,7 @@ export type UpdateViewInput = {
   isCompact?: InputMaybe<Scalars['Boolean']>;
   kanbanAggregateOperation?: InputMaybe<AggregateOperations>;
   kanbanAggregateOperationFieldMetadataId?: InputMaybe<Scalars['UUID']>;
+  mainGroupByFieldMetadataId?: InputMaybe<Scalars['UUID']>;
   name?: InputMaybe<Scalars['String']>;
   openRecordIn?: InputMaybe<ViewOpenRecordIn>;
   position?: InputMaybe<Scalars['Float']>;

packages/twenty-front/src/generated/graphql.ts

@@ -670,6 +670,7 @@ export type CoreView = {
   kanbanAggregateOperation?: Maybe<AggregateOperations>;
   kanbanAggregateOperationFieldMetadataId?: Maybe<Scalars['UUID']>;
   key?: Maybe<ViewKey>;
+  mainGroupByFieldMetadataId?: Maybe<Scalars['UUID']>;
   name: Scalars['String'];
   objectMetadataId: Scalars['UUID'];
   openRecordIn: ViewOpenRecordIn;
@@ -930,6 +931,7 @@ export type CreateViewInput = {
   kanbanAggregateOperation?: InputMaybe<AggregateOperations>;
   kanbanAggregateOperationFieldMetadataId?: InputMaybe<Scalars['UUID']>;
   key?: InputMaybe<ViewKey>;
+  mainGroupByFieldMetadataId?: InputMaybe<Scalars['UUID']>;
   name: Scalars['String'];
   objectMetadataId: Scalars['UUID'];
   openRecordIn?: InputMaybe<ViewOpenRecordIn>;
@@ -4237,6 +4239,7 @@ export type UpdateViewInput = {
   isCompact?: InputMaybe<Scalars['Boolean']>;
   kanbanAggregateOperation?: InputMaybe<AggregateOperations>;
   kanbanAggregateOperationFieldMetadataId?: InputMaybe<Scalars['UUID']>;
+  mainGroupByFieldMetadataId?: InputMaybe<Scalars['UUID']>;
   name?: InputMaybe<Scalars['String']>;
   openRecordIn?: InputMaybe<ViewOpenRecordIn>;
   position?: InputMaybe<Scalars['Float']>;

packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupsContent.tsx

@@ -113,13 +113,10 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => {
         >
           {currentView?.key !== 'INDEX' && (
             <>
-              <SelectableListItem
-                itemId="GroupBy"
-                onEnter={() => onContentChange('recordGroupFields')}
-              >
+              <SelectableListItem itemId="GroupBy">
                 <MenuItem
                   focused={selectedItemId === 'GroupBy'}
-                  onClick={() => onContentChange('recordGroupFields')}
+                  disabled
                   LeftIcon={IconLayoutList}
                   text={t`Group by`}
                   contextualText={recordGroupFieldMetadata?.label}

packages/twenty-front/src/modules/object-record/record-index/hooks/useHandleRecordGroupField.ts

@@ -5,6 +5,7 @@ import { useSetRecordGroups } from '@/object-record/record-group/hooks/useSetRec
 import { useLoadRecordIndexStates } from '@/object-record/record-index/hooks/useLoadRecordIndexStates';
 import { useRecoilComponentCallbackState } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackState';
 import { usePersistView } from '@/views/hooks/internal/usePersistView';
+import { usePersistViewGroupRecords } from '@/views/hooks/internal/usePersistViewGroup';
 import { useGetViewFromPrefetchState } from '@/views/hooks/useGetViewFromPrefetchState';
 import { useRefreshCoreViewsByObjectMetadataId } from '@/views/hooks/useRefreshCoreViewsByObjectMetadataId';
 import { type ViewGroup } from '@/views/types/ViewGroup';
@@ -16,6 +17,8 @@ import { type CoreView } from '~/generated/graphql';
 import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull';
 
 export const useHandleRecordGroupField = () => {
+  const { createViewGroups, deleteViewGroups } = usePersistViewGroupRecords();
+
   const currentViewIdCallbackState = useRecoilComponentCallbackState(
     contextStoreCurrentViewIdComponentState,
   );
@@ -138,6 +141,8 @@ export const useHandleRecordGroupField = () => {
       objectMetadataItem,
       refreshCoreViewsByObjectMetadataId,
       loadRecordIndexStates,
+      createViewGroups,
+      deleteViewGroups,
     ],
   );
 

packages/twenty-front/src/modules/views/graphql/fragments/viewFragment.ts

@@ -24,6 +24,7 @@ export const VIEW_FRAGMENT = gql`
     openRecordIn
     kanbanAggregateOperation
     kanbanAggregateOperationFieldMetadataId
+    mainGroupByFieldMetadataId
     anyFieldFilterValue
     calendarFieldMetadataId
     calendarLayout

packages/twenty-front/src/modules/views/hooks/internal/usePersistViewGroup.ts

@@ -8,19 +8,89 @@ import { ApolloError } from '@apollo/client';
 import { t } from '@lingui/core/macro';
 import { isDefined } from 'twenty-shared/utils';
 import {
-  type UpdateCoreViewGroupMutationVariables,
-  useUpdateCoreViewGroupMutation,
+    type CreateManyCoreViewGroupsMutationVariables,
+    type DeleteCoreViewGroupMutationVariables,
+    type DestroyCoreViewGroupMutationVariables,
+    type UpdateCoreViewGroupMutationVariables,
+    useCreateManyCoreViewGroupsMutation,
+    useDeleteCoreViewGroupMutation,
+    useDestroyCoreViewGroupMutation,
+    useUpdateCoreViewGroupMutation,
 } from '~/generated/graphql';
 
 export const usePersistViewGroupRecords = () => {
   const { triggerViewGroupOptimisticEffect } =
     useTriggerViewGroupOptimisticEffect();
 
+  const [createManyCoreViewGroupsMutation] =
+    useCreateManyCoreViewGroupsMutation();
   const [updateCoreViewGroupMutation] = useUpdateCoreViewGroupMutation();
+  const [deleteCoreViewGroupMutation] = useDeleteCoreViewGroupMutation();
+  const [destroyCoreViewGroupMutation] = useDestroyCoreViewGroupMutation();
 
   const { handleMetadataError } = useMetadataErrorHandler();
   const { enqueueErrorSnackBar } = useSnackBar();
 
+  const createViewGroups = useCallback(
+    async (
+      createCoreViewGroupInputs: CreateManyCoreViewGroupsMutationVariables,
+    ): Promise<
+      MetadataRequestResult<Awaited<
+        ReturnType<typeof createManyCoreViewGroupsMutation>
+      > | null>
+    > => {
+      if (
+        !Array.isArray(createCoreViewGroupInputs.inputs) ||
+        createCoreViewGroupInputs.inputs.length === 0
+      ) {
+        return {
+          status: 'successful',
+          response: null,
+        };
+      }
+
+      try {
+        const result = await createManyCoreViewGroupsMutation({
+          variables: createCoreViewGroupInputs,
+          update: (_cache, { data }) => {
+            const createdViewGroups = data?.createManyCoreViewGroups;
+            if (!isDefined(createdViewGroups)) {
+              return;
+            }
+
+            triggerViewGroupOptimisticEffect({
+              createdViewGroups,
+            });
+          },
+        });
+
+        return {
+          status: 'successful',
+          response: result,
+        };
+      } catch (error) {
+        if (error instanceof ApolloError) {
+          handleMetadataError(error, {
+            primaryMetadataName: 'viewGroup',
+          });
+        } else {
+          enqueueErrorSnackBar({ message: t`An error occurred.` });
+        }
+
+        return {
+          status: 'failed',
+          error,
+        };
+      }
+    },
+    [
+      triggerViewGroupOptimisticEffect,
+      createManyCoreViewGroupsMutation,
+      handleMetadataError,
+      enqueueErrorSnackBar,
+    ],
+  );
+
   const updateViewGroups = useCallback(
     async (
       updateCoreViewGroupInputs: UpdateCoreViewGroupMutationVariables[],
@@ -82,7 +152,117 @@ export const usePersistViewGroupRecords = () => {
     ],
   );
 
+  const deleteViewGroups = useCallback(
+    async (
+      deleteCoreViewGroupInputs: DeleteCoreViewGroupMutationVariables[],
+    ): Promise<
+      MetadataRequestResult<
+        Awaited<ReturnType<typeof deleteCoreViewGroupMutation>>[]
+      >
+    > => {
+      if (deleteCoreViewGroupInputs.length === 0) {
+        return {
+          status: 'successful',
+          response: [],
+        };
+      }
+
+      try {
+        const results = await Promise.all(
+          deleteCoreViewGroupInputs.map((variables) =>
+            deleteCoreViewGroupMutation({
+              variables,
+              update: (_cache, { data }) => {
+                const deletedViewGroup = data?.deleteCoreViewGroup;
+                if (!isDefined(deletedViewGroup)) {
+                  return;
+                }
+
+                triggerViewGroupOptimisticEffect({
+                  deletedViewGroups: [deletedViewGroup],
+                });
+              },
+            }),
+          ),
+        );
+
+        return {
+          status: 'successful',
+          response: results,
+        };
+      } catch (error) {
+        if (error instanceof ApolloError) {
+          handleMetadataError(error, {
+            primaryMetadataName: 'viewGroup',
+          });
+        } else {
+          enqueueErrorSnackBar({ message: t`An error occurred.` });
+        }
+
+        return {
+          status: 'failed',
+          error,
+        };
+      }
+    },
+    [
+      triggerViewGroupOptimisticEffect,
+      deleteCoreViewGroupMutation,
+      handleMetadataError,
+      enqueueErrorSnackBar,
+    ],
+  );
+
+  const destroyViewGroups = useCallback(
+    async (
+      destroyCoreViewGroupInputs: DestroyCoreViewGroupMutationVariables[],
+    ): Promise<
+      MetadataRequestResult<
+        Awaited<ReturnType<typeof destroyCoreViewGroupMutation>>[]
+      >
+    > => {
+      if (destroyCoreViewGroupInputs.length === 0) {
+        return {
+          status: 'successful',
+          response: [],
+        };
+      }
+
+      try {
+        const results = await Promise.all(
+          destroyCoreViewGroupInputs.map((variables) =>
+            destroyCoreViewGroupMutation({
+              variables,
+            }),
+          ),
+        );
+
+        return {
+          status: 'successful',
+          response: results,
+        };
+      } catch (error) {
+        if (error instanceof ApolloError) {
+          handleMetadataError(error, {
+            primaryMetadataName: 'viewGroup',
+          });
+        } else {
+          enqueueErrorSnackBar({ message: t`An error occurred.` });
+        }
+
+        return {
+          status: 'failed',
+          error,
+        };
+      }
+    },
+    [destroyCoreViewGroupMutation, handleMetadataError, enqueueErrorSnackBar],
+  );
+
   return {
+    createViewGroups,
     updateViewGroups,
+    deleteViewGroups,
+    destroyViewGroups,
   };
 };