From e03b5b873b8cf6babb64d2da1b15a73b425f8147 Mon Sep 17 00:00:00 2001
From: Zeke Zhang <958414905@qq.com>
Date: Wed, 29 May 2024 13:08:53 +0800
Subject: [PATCH] chore: add group title to Table item action settings (#4516)

---
 .../table/TableActionColumnInitializers.tsx   | 217 +++++++++---------
 1 file changed, 112 insertions(+), 105 deletions(-)

diff --git a/packages/core/client/src/modules/blocks/data-blocks/table/TableActionColumnInitializers.tsx b/packages/core/client/src/modules/blocks/data-blocks/table/TableActionColumnInitializers.tsx
index 039ff3d9bb..c37c70be86 100644
--- a/packages/core/client/src/modules/blocks/data-blocks/table/TableActionColumnInitializers.tsx
+++ b/packages/core/client/src/modules/blocks/data-blocks/table/TableActionColumnInitializers.tsx
@@ -155,111 +155,118 @@ const commonOptions = {
   },
   items: [
     {
-      type: 'item',
-      title: '{{t("View")}}',
-      name: 'view',
-      Component: 'ViewActionInitializer',
-      schema: {
-        'x-component': 'Action.Link',
-        'x-action': 'view',
-        'x-decorator': 'ACLActionProvider',
-      },
-    },
-    {
-      type: 'item',
-      name: 'edit',
-      title: '{{t("Edit")}}',
-      Component: 'UpdateActionInitializer',
-      schema: {
-        'x-component': 'Action.Link',
-        'x-action': 'update',
-        'x-decorator': 'ACLActionProvider',
-      },
-      useVisible() {
-        const collection = useCollection_deprecated();
-        return (collection.template !== 'view' || collection?.writableView) && collection.template !== 'sql';
-      },
-    },
-    {
-      type: 'item',
-      title: '{{t("Delete")}}',
-      name: 'delete',
-      Component: 'DestroyActionInitializer',
-      schema: {
-        'x-component': 'Action.Link',
-        'x-action': 'destroy',
-        'x-decorator': 'ACLActionProvider',
-      },
-      useVisible() {
-        const collection = useCollection_deprecated();
-        return (collection.template !== 'view' || collection?.writableView) && collection.template !== 'sql';
-      },
-    },
-    {
-      type: 'item',
-      title: '{{t("Disassociate")}}',
-      name: 'disassociate',
-      Component: 'DisassociateActionInitializer',
-      schema: {
-        'x-component': 'Action.Link',
-        'x-action': 'disassociate',
-        'x-acl-action': 'destroy',
-        'x-decorator': 'ACLActionProvider',
-      },
-      useVisible() {
-        const props = useDataBlockProps();
-        const collection = useCollection_deprecated();
-        return (
-          !!props?.association &&
-          (collection.template !== 'view' || collection?.writableView) &&
-          collection.template !== 'sql'
-        );
-      },
-    },
-    {
-      type: 'item',
-      title: '{{t("Add child")}}',
-      name: 'addChildren',
-      Component: 'CreateChildInitializer',
-      schema: {
-        'x-component': 'Action.Link',
-        'x-action': 'create',
-        'x-decorator': 'ACLActionProvider',
-      },
-      useVisible() {
-        const fieldSchema = useFieldSchema();
-        const collection = useCollection_deprecated();
-        const { treeTable } = fieldSchema?.parent?.parent['x-decorator-props'] || {};
-        return collection.tree && treeTable;
-      },
-    },
-    {
-      type: 'item',
-      title: '{{t("Popup")}}',
-      name: 'popup',
-      Component: 'PopupActionInitializer',
-    },
-    {
-      type: 'item',
-      title: '{{t("Update record")}}',
-      name: 'updateRecord',
-      Component: 'UpdateRecordActionInitializer',
-      useVisible() {
-        const collection = useCollection_deprecated();
-        return (collection.template !== 'view' || collection?.writableView) && collection.template !== 'sql';
-      },
-    },
-    {
-      name: 'customRequest',
-      title: '{{t("Custom request")}}',
-      Component: 'CustomRequestInitializer',
-      schema: {
-        'x-action': 'customize:table:request',
-      },
-      useVisible() {
-        const collection = useCollection_deprecated();
-        return (collection.template !== 'view' || collection?.writableView) && collection.template !== 'sql';
-      },
+      type: 'itemGroup',
+      name: 'actions',
+      title: '{{t("Configure actions")}}',
+      children: [
+        {
+          type: 'item',
+          title: '{{t("View")}}',
+          name: 'view',
+          Component: 'ViewActionInitializer',
+          schema: {
+            'x-component': 'Action.Link',
+            'x-action': 'view',
+            'x-decorator': 'ACLActionProvider',
+          },
+        },
+        {
+          type: 'item',
+          name: 'edit',
+          title: '{{t("Edit")}}',
+          Component: 'UpdateActionInitializer',
+          schema: {
+            'x-component': 'Action.Link',
+            'x-action': 'update',
+            'x-decorator': 'ACLActionProvider',
+          },
+          useVisible() {
+            const collection = useCollection_deprecated();
+            return (collection.template !== 'view' || collection?.writableView) && collection.template !== 'sql';
+          },
+        },
+        {
+          type: 'item',
+          title: '{{t("Delete")}}',
+          name: 'delete',
+          Component: 'DestroyActionInitializer',
+          schema: {
+            'x-component': 'Action.Link',
+            'x-action': 'destroy',
+            'x-decorator': 'ACLActionProvider',
+          },
+          useVisible() {
+            const collection = useCollection_deprecated();
+            return (collection.template !== 'view' || collection?.writableView) && collection.template !== 'sql';
+          },
+        },
+        {
+          type: 'item',
+          title: '{{t("Disassociate")}}',
+          name: 'disassociate',
+          Component: 'DisassociateActionInitializer',
+          schema: {
+            'x-component': 'Action.Link',
+            'x-action': 'disassociate',
+            'x-acl-action': 'destroy',
+            'x-decorator': 'ACLActionProvider',
+          },
+          useVisible() {
+            const props = useDataBlockProps();
+            const collection = useCollection_deprecated();
+            return (
+              !!props?.association &&
+              (collection.template !== 'view' || collection?.writableView) &&
+              collection.template !== 'sql'
+            );
+          },
+        },
+        {
+          type: 'item',
+          title: '{{t("Add child")}}',
+          name: 'addChildren',
+          Component: 'CreateChildInitializer',
+          schema: {
+            'x-component': 'Action.Link',
+            'x-action': 'create',
+            'x-decorator': 'ACLActionProvider',
+          },
+          useVisible() {
+            const fieldSchema = useFieldSchema();
+            const collection = useCollection_deprecated();
+            const { treeTable } = fieldSchema?.parent?.parent['x-decorator-props'] || {};
+            return collection.tree && treeTable;
+          },
+        },
+        {
+          type: 'item',
+          title: '{{t("Popup")}}',
+          name: 'popup',
+          Component: 'PopupActionInitializer',
+        },
+        {
+          type: 'item',
+          title: '{{t("Update record")}}',
+          name: 'updateRecord',
+          Component: 'UpdateRecordActionInitializer',
+          useVisible() {
+            const collection = useCollection_deprecated();
+            return (collection.template !== 'view' || collection?.writableView) && collection.template !== 'sql';
+          },
+        },
+        {
+          name: 'customRequest',
+          title: '{{t("Custom request")}}',
+          Component: 'CustomRequestInitializer',
+          schema: {
+            'x-action': 'customize:table:request',
+          },
+          useVisible() {
+            const collection = useCollection_deprecated();
+            return (collection.template !== 'view' || collection?.writableView) && collection.template !== 'sql';
+          },
+        },
+      ],
     },
     {
       name: 'divider',