fix: remove default tab title (#6178)

* fix: remove default tab title

* fix: add default tab title for route table

* chore: update migration

* fix: mobile

* fix: e2e errors

packages/core/client/src/modules/menu/PageMenuItem.tsx

@@ -85,7 +85,6 @@ export const PageMenuItem = () => {
       children: [
         {
           type: NocoBaseDesktopRouteType.tabs,
-          title: '{{t("Unnamed")}}',
           schemaUid: tabSchemaUid,
           tabSchemaName,
           hidden: true,

packages/core/client/src/modules/menu/__e2e__/dragAndDrop.test.ts

@@ -23,6 +23,7 @@ test('single page', async ({ page, mockPage }) => {
   await page.getByLabel('block-item-TreeSelect-Target').locator('.ant-select').click();
   await page.locator('.ant-select-dropdown').getByText(pageTitle2).click();
   await page.getByRole('button', { name: 'OK', exact: true }).click();
+  await page.waitForTimeout(500);
   const page1 = await page.getByRole('menu').getByText(pageTitle1).boundingBox();
   const page2 = await page.getByRole('menu').getByText(pageTitle2).boundingBox();
   //拖拽菜单排序符合预期

packages/core/client/src/schema-component/antd/menu/Menu.Designer.tsx

@@ -190,7 +190,6 @@ const InsertMenuItems = (props) => {
             children: [
               {
                 type: NocoBaseDesktopRouteType.tabs,
-                title: '{{t("Unnamed")}}',
                 schemaUid: tabSchemaUid,
                 tabSchemaName,
                 hidden: true,
@@ -199,12 +198,14 @@ const InsertMenuItems = (props) => {
           });
 
           // 2. 然后再把路由移动到对应的位置
+          if (insertPositionToMethod[insertPosition]) {
             await moveRoute({
               sourceId: data?.data?.id,
               targetId: route?.id,
               sortField: 'sort',
               method: insertPositionToMethod[insertPosition],
             });
+          }
 
           // 3. 插入一个对应的 Schema
           dn.insertAdjacent(
@@ -267,12 +268,14 @@ const InsertMenuItems = (props) => {
           );
 
           // 2. 然后再把路由移动到对应的位置
+          if (insertPositionToMethod[insertPosition]) {
             await moveRoute({
               sourceId: data?.data?.id,
               targetId: route?.id,
               sortField: 'sort',
               method: insertPositionToMethod[insertPosition],
             });
+          }
 
           // 3. 插入一个对应的 Schema
           dn.insertAdjacent(insertPosition, {

packages/core/test/src/e2e/e2eUtils.ts

@@ -614,7 +614,7 @@ const _test = base.extend<ExtendUtils>({
     const page = await getPage(browser);
 
     const deletePage = async (pageName: string) => {
-      await page.getByText(pageName, { exact: true }).hover();
+      await page.getByLabel(pageName, { exact: true }).hover();
       await page.getByRole('button', { name: 'designer-schema-settings-' }).hover();
       await page.getByRole('menuitem', { name: 'Delete', exact: true }).click();
       await page.getByRole('button', { name: 'OK', exact: true }).click();

packages/plugins/@nocobase/plugin-client/src/client/routesTableSchema.tsx

@@ -11,6 +11,7 @@
 import { CheckOutlined, CloseOutlined } from '@ant-design/icons';
 import { useField, useForm } from '@formily/react';
 import {
+  CollectionField,
   css,
   getGroupMenuSchema,
   getLinkMenuSchema,
@@ -426,7 +427,6 @@ export const createRoutesTableSchema = (collectionName: string, basename: string
                                       schemaUid: tabSchemaUid,
                                       parentId: res?.data?.data?.id,
                                       type: NocoBaseDesktopRouteType.tabs,
-                                      title: '{{t("Unnamed")}}',
                                       tabSchemaName,
                                       hidden: true,
                                     });
@@ -488,7 +488,17 @@ export const createRoutesTableSchema = (collectionName: string, basename: string
             properties: {
               title: {
                 type: 'string',
-                'x-component': 'CollectionField',
+                'x-component': function Com(props) {
+                  const record = useCollectionRecordData();
+                  const { t } = useTranslation();
+                  let value = props.value;
+
+                  if (record.type === NocoBaseDesktopRouteType.tabs && _.isNil(props.value)) {
+                    value = t('Unnamed');
+                  }
+
+                  return <CollectionField {...props} value={value} />;
+                },
                 'x-read-pretty': true,
                 'x-component-props': {
                   ellipsis: true,
@@ -565,8 +575,7 @@ export const createRoutesTableSchema = (collectionName: string, basename: string
                   }
 
                   if (recordData.type === NocoBaseDesktopRouteType.page) {
-                    const path = `${basenameOfCurrentRouter.slice(0, -1)}${basename}/${
+                    const path = `${basenameOfCurrentRouter.slice(0, -1)}${basename}/${isMobile ? recordData.schemaUid : recordData.menuSchemaUid
-                      isMobile ? recordData.schemaUid : recordData.menuSchemaUid
                       }`;
                     // 在点击 Access 按钮时，会用到
                     recordData._path = path;
@@ -889,7 +898,6 @@ export const createRoutesTableSchema = (collectionName: string, basename: string
                                           await createRoute({
                                             parentId: res?.data?.data?.id,
                                             type: NocoBaseDesktopRouteType.tabs,
-                                            title: '{{t("Unnamed")}}',
                                             schemaUid: tabSchemaUid,
                                             tabSchemaName,
                                             hidden: true,

packages/plugins/@nocobase/plugin-client/src/server/migrations/2024122912211-transform-menu-schema-to-routes.ts

@@ -165,7 +165,7 @@ export async function schemaToRoutes(schema: any, uiSchemas: any) {
     // Tab
     return {
       type: 'tabs',
-      title: item.title || '{{t("Unnamed")}}',
+      title: item.title,
       icon: item['x-component-props']?.icon,
       schemaUid: item['x-uid'],
       tabSchemaName: key,

packages/plugins/@nocobase/plugin-mobile/src/client/mobile-layout/mobile-tab-bar/types/MobileTabBar.Page/initializer.tsx

@@ -69,7 +69,6 @@ export const mobileTabBarSchemaInitializerItem: SchemaInitializerItemActionModal
           values: {
             type: 'tabs',
             parentId,
-            title: 'Unnamed',
             schemaUid: firstTabUid,
             hidden: true,
           } as MobileRouteItem,

packages/plugins/@nocobase/plugin-mobile/src/client/pages/dynamic-page/header/tabs/MobilePageTabs.tsx

@@ -12,6 +12,7 @@ import React, { FC, useCallback } from 'react';
 import { Navigate, useNavigate, useParams } from 'react-router-dom';
 
 import { DndContext, DndContextProps, Icon, SortableItem, useCompile } from '@nocobase/client';
+import { useTranslation } from 'react-i18next';
 import { useMobileRoutes } from '../../../../mobile-providers';
 import { useMobilePage } from '../../context';
 import { MobilePageTabInitializer } from './initializer';
@@ -24,6 +25,7 @@ export const MobilePageTabs: FC = () => {
   const displayTabs = activeTabBarItem?.enableTabs === undefined ? _displayTabs : activeTabBarItem.enableTabs;
 
   const compile = useCompile();
+  const { t } = useTranslation();
 
   const navigate = useNavigate();
   const { componentCls, hashId } = useStyles();
@@ -60,19 +62,20 @@ export const MobilePageTabs: FC = () => {
         <Tabs activeKey={activeKey} onChange={handleChange} className="nb-mobile-page-tabs-list">
           {activeTabBarItem.children?.map((item) => {
             if (item.hideInMenu) return null;
+            const title = item.title ? compile(item.title) : t('Unnamed');
             return (
               <Tabs.Tab
-                data-testid={`mobile-page-tabs-${item.title}`}
+                data-testid={`mobile-page-tabs-${title}`}
                 title={
                   <SortableItem id={item.id as any}>
                     <MobilePageTabsSettings tab={item} />
                     {item.icon ? (
                       <Space>
                         <Icon type={item.icon} />
-                        {compile(item.title)}
+                        {title}
                       </Space>
                     ) : (
-                      compile(item.title)
+                      title
                     )}
                   </SortableItem>
                 }