Merge branch 'main' into next (#4791)

* fix: external data source not reloading when title field is updated (#4786)

* style: list block style improve (#4785)

* chore(client): change default icon size of icon picker

---------

Co-authored-by: Katherine <katherine_15995@163.com>

packages/core/client/src/schema-component/antd/grid/Grid.tsx

@@ -358,16 +358,7 @@ export const Grid: any = observer(
     return (
       <FilterBlockProvider>
         <GridContext.Provider value={gridContextValue}>
-          <div
-            className={cls(
-              'nb-grid-container',
-              // css`
-              //   & {
-              //     margin-bottom: ${designable ? 0 : -token.marginLG}px;
-              //   }
-              // `,
-            )}
-          >
+          <div className={cls('nb-grid-container')}>
             <div className={cls(`nb-grid ${styles.container}`)} style={{ position: 'relative' }} ref={gridRef}>
               <div className="nb-grid-warp">
                 <DndWrapper dndContext={props.dndContext}>

packages/core/client/src/schema-component/antd/icon-picker/IconPicker.tsx

@@ -46,10 +46,10 @@ const useStyle = (isSearchable: IconPickerProps['searchable']) =>
   })();
 
 function IconField(props: IconPickerProps) {
-  const { fontSizeHeading3 } = theme.useToken().token;
+  const { fontSizeXL } = theme.useToken().token;
   const availableIcons = [...icons.keys()];
   const layout = useFormLayout();
-  const { value, onChange, disabled, iconSize = fontSizeHeading3, searchable = true } = props;
+  const { value, onChange, disabled, iconSize = fontSizeXL, searchable = true } = props;
   const [visible, setVisible] = useState(false);
   const [filteredIcons, setFilteredIcons] = useState(availableIcons);
   const { t } = useTranslation();

packages/core/client/src/schema-component/antd/list/List.tsx

@@ -75,18 +75,18 @@ const InternalList = (props) => {
           componentCls,
           hashId,
           css`
-            .ant-spin-nested-loading {
+            .nb-list-container {
               height: ${height ? height + 'px' : '100%'};
-              overflow-y: ${height ? 'auto' : 'null'};
-              .ant-spin-container {
-                width: 100%;
-                overflow-x: clip;
-                padding-right: ${token.paddingSM + 'px'};
-              }
+              overflow-y: auto;
+              margin-left: -${token.marginLG}px;
+              margin-right: -${token.marginLG}px;
+              padding-left: ${token.marginLG}px;
+              padding-right: ${token.marginLG}px;
             }
           `,
         )}
       >
+        <div className="nb-list-container">
           <AntdList
             {...props}
             pagination={
@@ -115,6 +115,7 @@ const InternalList = (props) => {
                 })
               : null}
           </AntdList>
+        </div>
         <Designer />
       </SortableItem>
     </SchemaComponentOptions>,

packages/plugins/@nocobase/plugin-data-source-manager/src/client/component/CollectionsManager/components/TitleField.tsx

@@ -16,6 +16,7 @@ import {
   useAPIClient,
   withDynamicSchemaProps,
   useProps,
+  useDataSourceManager,
 } from '@nocobase/client';
 import { useRemoteCollectionContext } from '../CollectionFields';
 
@@ -24,7 +25,7 @@ export const TitleField = withDynamicSchemaProps(
     const { t } = useTranslation();
     const { isTitleField } = useCollectionManager_deprecated();
     const [loadingRecord, setLoadingRecord] = React.useState(null);
-
+    const dm = useDataSourceManager();
     // 新版 UISchema（1.0 之后）中已经废弃了 useProps，这里之所以继续保留是为了兼容旧版的 UISchema
     const { setTitleField, filterByTk, dataSourceKey } = useProps(props);
 
@@ -41,6 +42,7 @@ export const TitleField = withDynamicSchemaProps(
       message.success(t('Saved successfully'));
       refreshRM();
       setTitleField(checked ? record.name : 'id');
+      await dm.getDataSource(dataSourceKey).reload();
       setLoadingRecord(null);
     };
     return isTitleField(record) ? (