From e0ffad0561a144113caab2d40cae10b7ba78bbed Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=B8=85?= Date: Fri, 12 Nov 2021 09:49:26 +0800 Subject: [PATCH] feat(layout): support remove default title (#4013) * feat(layout): support remove default title * SettingDrawer do not has title --- packages/layout/src/BasicLayout.tsx | 1 - .../src/components/SettingDrawer/index.tsx | 1 + .../src/components/SiderMenu/SiderMenu.tsx | 2 +- .../src/components/TopNavHeader/index.less | 3 +- packages/layout/src/defaultSettings.ts | 3 +- packages/layout/src/getPageTitle.ts | 2 +- tests/layout/__snapshots__/demo.test.ts.snap | 84 ------------------- .../__snapshots__/pageContainer.test.tsx.snap | 31 +------ tests/layout/getPageTitle.test.tsx | 2 +- tests/layout/settingDrawer.test.tsx | 1 - 10 files changed, 8 insertions(+), 122 deletions(-) diff --git a/packages/layout/src/BasicLayout.tsx b/packages/layout/src/BasicLayout.tsx index da33591dea13..dc9b0f249ea6 100644 --- a/packages/layout/src/BasicLayout.tsx +++ b/packages/layout/src/BasicLayout.tsx @@ -510,7 +510,6 @@ const BasicLayout: React.FC = (props) => { }, [location.pathname, location.pathname?.search]); const [hasFooterToolbar, setHasFooterToolbar] = useState(false); - useDocumentTitle(pageTitleInfo, props.title || false); return ( diff --git a/packages/layout/src/components/SettingDrawer/index.tsx b/packages/layout/src/components/SettingDrawer/index.tsx index a7bdd687f87f..77c456758388 100644 --- a/packages/layout/src/components/SettingDrawer/index.tsx +++ b/packages/layout/src/components/SettingDrawer/index.tsx @@ -434,6 +434,7 @@ const SettingDrawer: React.FC = (props) => { } } preStateRef.current = nextState; + delete nextState.title; setSettingState(nextState); }; diff --git a/packages/layout/src/components/SiderMenu/SiderMenu.tsx b/packages/layout/src/components/SiderMenu/SiderMenu.tsx index 915802913940..78e5cae3180a 100644 --- a/packages/layout/src/components/SiderMenu/SiderMenu.tsx +++ b/packages/layout/src/components/SiderMenu/SiderMenu.tsx @@ -33,7 +33,7 @@ export const defaultRenderLogoAndTitle = ( return null; } const logoDom = defaultRenderLogo(logo); - const titleDom =

{title}

; + const titleDom =

{title ?? 'Ant Design Pro'}

; if (renderFunction) { // when collapsed, no render title diff --git a/packages/layout/src/components/TopNavHeader/index.less b/packages/layout/src/components/TopNavHeader/index.less index 11e77879cc4f..3b13ff7c52cf 100644 --- a/packages/layout/src/components/TopNavHeader/index.less +++ b/packages/layout/src/components/TopNavHeader/index.less @@ -46,7 +46,8 @@ height: 100%; overflow: hidden; - img { + img, + a > svg { display: inline-block; height: 32px; vertical-align: middle; diff --git a/packages/layout/src/defaultSettings.ts b/packages/layout/src/defaultSettings.ts index 49470e3f122e..b6a4211f3d0a 100644 --- a/packages/layout/src/defaultSettings.ts +++ b/packages/layout/src/defaultSettings.ts @@ -45,7 +45,7 @@ export type PureSettings = { * * @name Layout 的 title，也会显示在浏览器标签上 */ - title: string | false; + title?: string | false; /** * Your custom iconfont Symbol script Url eg：//at.alicdn.com/t/font_1039637_btcrd5co4w.js * 注意：如果需要图标多色，Iconfont 图标项目里要进行批量去色处理 Usage: https://github.com/ant-design/ant-design-pro/pull/3517 @@ -72,7 +72,6 @@ const defaultSettings: ProSettings = { fixedHeader: false, fixSiderbar: false, headerHeight: 48, - title: 'Ant Design Pro', iconfontUrl: '', primaryColor: 'daybreak', splitMenus: false, diff --git a/packages/layout/src/getPageTitle.ts b/packages/layout/src/getPageTitle.ts index b088a25dab74..a7fb20606667 100644 --- a/packages/layout/src/getPageTitle.ts +++ b/packages/layout/src/getPageTitle.ts @@ -63,7 +63,7 @@ const getPageTitleInfo = ( breadcrumb, breadcrumbMap, formatMessage, - title = 'Ant Design Pro', + title, menu = { locale: false, }, diff --git a/tests/layout/__snapshots__/demo.test.ts.snap b/tests/layout/__snapshots__/demo.test.ts.snap index c99f3b244094..e15452883e4b 100644 --- a/tests/layout/__snapshots__/demo.test.ts.snap +++ b/tests/layout/__snapshots__/demo.test.ts.snap @@ -3958,20 +3958,6 @@ exports[`layout demos 📸 renders ./packages/layout/src/demos/AlwaysDefaultOpen
-
-
- - Ant Design Pro - -
-
@@ -5058,20 +5044,6 @@ exports[`layout demos 📸 renders ./packages/layout/src/demos/DefaultOpenAllMen
-
-
- - Ant Design Pro - -
-
@@ -5478,20 +5450,6 @@ exports[`layout demos 📸 renders ./packages/layout/src/demos/IconFont.tsx corr
-
-
- - Ant Design Pro - -
-
@@ -6042,20 +6000,6 @@ exports[`layout demos 📸 renders ./packages/layout/src/demos/MenuGroup.tsx cor
-
-
- - Ant Design Pro - -
-
@@ -6640,20 +6584,6 @@ exports[`layout demos 📸 renders ./packages/layout/src/demos/MultipleMenuOnePa
-
-
- - Ant Design Pro - -
-
@@ -13586,20 +13516,6 @@ exports[`layout demos 📸 renders ./packages/layout/src/demos/dynamicMenu.tsx c
-
-
- - Ant Design Pro - -
-
diff --git a/tests/layout/__snapshots__/pageContainer.test.tsx.snap b/tests/layout/__snapshots__/pageContainer.test.tsx.snap index 28da31cc69be..9f26162cbdb1 100644 --- a/tests/layout/__snapshots__/pageContainer.test.tsx.snap +++ b/tests/layout/__snapshots__/pageContainer.test.tsx.snap @@ -488,22 +488,7 @@ exports[`PageContainer 🐲 FooterToolbar should know width 1`] = ` >
-
-
- - Ant Design Pro - -
-
-
+ />
-
-
- - Ant Design Pro - -
-
diff --git a/tests/layout/getPageTitle.test.tsx b/tests/layout/getPageTitle.test.tsx index 37de2362dd73..6b5cd303f9b0 100644 --- a/tests/layout/getPageTitle.test.tsx +++ b/tests/layout/getPageTitle.test.tsx @@ -136,7 +136,7 @@ describe('getPageTitle', () => { ...pageProps, title: undefined, }); - expect(title).toBe('one - Ant Design Pro'); + expect(title).toBe('one'); }); it('🗒️ breadcrumb is null ', () => { diff --git a/tests/layout/settingDrawer.test.tsx b/tests/layout/settingDrawer.test.tsx index f8caba9f04ae..b1b51e977e2f 100644 --- a/tests/layout/settingDrawer.test.tsx +++ b/tests/layout/settingDrawer.test.tsx @@ -94,7 +94,6 @@ describe('settingDrawer.test', () => { fixedHeader: true, fixSiderbar: false, headerHeight: 48, - title: 'Ant Design Pro', iconfontUrl: '', primaryColor: 'daybreak', splitMenus: false,