From 20a7e9a657e3a3025192d98682d60ae6a491b99a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=A2=AB=E9=9B=A8=E6=B0=B4=E8=BF=87=E6=BB=A4=E7=9A=84?=
 =?UTF-8?q?=E7=A9=BA=E6=B0=94-Rairn?= <958414905@qq.com>
Date: Tue, 11 Jul 2023 17:52:45 +0800
Subject: [PATCH] fix: should only show one scroll bar in drop-down menu
 (#2231)

---
 .../src/schema-initializer/SchemaInitializer.tsx    | 13 ++-----------
 .../core/client/src/schema-initializer/style.ts     |  5 +++++
 .../client/src/schema-settings/SchemaSettings.tsx   | 13 -------------
 3 files changed, 7 insertions(+), 24 deletions(-)

diff --git a/packages/core/client/src/schema-initializer/SchemaInitializer.tsx b/packages/core/client/src/schema-initializer/SchemaInitializer.tsx
index 4b00874f56..e0a4a56b3b 100644
--- a/packages/core/client/src/schema-initializer/SchemaInitializer.tsx
+++ b/packages/core/client/src/schema-initializer/SchemaInitializer.tsx
@@ -1,4 +1,3 @@
-import { css } from '@emotion/css';
 import { ISchema, observer, useForm } from '@formily/react';
 import { error, isString } from '@nocobase/utils/client';
 import { Button, Dropdown, MenuProps, Switch } from 'antd';
@@ -17,13 +16,6 @@ import {
   SchemaInitializerItemProps,
 } from './types';
 
-const overlayClassName = css`
-  .ant-dropdown-menu-item-group-list {
-    max-height: 40vh;
-    overflow: auto;
-  }
-`;
-
 const defaultWrap = (s: ISchema) => s;
 
 export const SchemaInitializerItemContext = createContext(null);
@@ -156,7 +148,7 @@ SchemaInitializer.Button = observer(
                 key: item.key || `item-group-${indexA}`,
                 label,
                 title: label,
-                popupClassName: styles.nbMenuItemGroup,
+                popupClassName: styles.nbMenuItemSubMenu,
                 children: renderItems(item.children),
               }
             );
@@ -175,7 +167,6 @@ SchemaInitializer.Button = observer(
         <Dropdown
           className={classNames('nb-schema-initializer-button')}
           openClassName={`nb-schema-initializer-button-open`}
-          overlayClassName={classNames('nb-schema-initializer-button-overlay', overlayClassName)}
           open={visible}
           onOpenChange={(open) => {
             // 如果不清空输入框的值，那么下次打开的时候会出现上次输入的值
@@ -184,7 +175,7 @@ SchemaInitializer.Button = observer(
           }}
           menu={{
             style: {
-              maxHeight: '60vh',
+              maxHeight: '50vh',
               overflowY: 'auto',
             },
             items: menuItems.current,
diff --git a/packages/core/client/src/schema-initializer/style.ts b/packages/core/client/src/schema-initializer/style.ts
index 6bc0def6b4..73971a9f87 100644
--- a/packages/core/client/src/schema-initializer/style.ts
+++ b/packages/core/client/src/schema-initializer/style.ts
@@ -5,6 +5,11 @@ export const useStyles = createStyles(({ token }) => {
     nbMenuItemGroup: {
       maxHeight: '50vh',
       overflowY: 'auto',
+    },
+
+    nbMenuItemSubMenu: {
+      maxHeight: '50vh',
+      overflowY: 'auto',
       boxShadow: token.boxShadowSecondary,
       borderRadius: token.borderRadiusLG,
     },
diff --git a/packages/core/client/src/schema-settings/SchemaSettings.tsx b/packages/core/client/src/schema-settings/SchemaSettings.tsx
index bb9cc606b3..3f9318a61e 100644
--- a/packages/core/client/src/schema-settings/SchemaSettings.tsx
+++ b/packages/core/client/src/schema-settings/SchemaSettings.tsx
@@ -1,4 +1,3 @@
-import { css } from '@emotion/css';
 import { ArrayCollapse, ArrayItems, FormDialog, FormItem, FormLayout, Input } from '@formily/antd-v5';
 import { Field, GeneralField, createForm } from '@formily/core';
 import { ISchema, Schema, SchemaOptionsContext, useField, useFieldSchema, useForm } from '@formily/react';
@@ -18,7 +17,6 @@ import {
   Space,
   Switch,
 } from 'antd';
-import classNames from 'classnames';
 import _, { cloneDeep } from 'lodash';
 import React, {
   ReactNode,
@@ -131,16 +129,6 @@ export const SchemaSettingsProvider: React.FC<SchemaSettingsProviderProps> = (pr
   );
 };
 
-const overlayClassName = classNames(
-  'nb-schema-initializer-button-overlay',
-  css`
-    .ant-dropdown-menu-item-group-list {
-      max-height: 40vh;
-      overflow: auto;
-    }
-  `,
-);
-
 export const SchemaSettings: React.FC<SchemaSettingsProps> & SchemaSettingsNested = (props) => {
   const { title, dn, ...others } = props;
   const [visible, setVisible] = useState(false);
@@ -165,7 +153,6 @@ export const SchemaSettings: React.FC<SchemaSettingsProps> & SchemaSettingsNeste
           changeMenu(open);
         }}
         menu={{ items }}
-        overlayClassName={overlayClassName}
       >
         {typeof title === 'string' ? <span>{title}</span> : title}
       </Dropdown>