This is an automated email from the ASF dual-hosted git repository. diegopucci pushed a commit to branch geido/feat/progressive-dashboard-header in repository https://gitbox.apache.org/repos/asf/superset.git
commit 670ef0ea4f483f608377d8048ca86796817f564a Author: Diego Pucci <[email protected]> AuthorDate: Tue Oct 15 17:33:19 2024 +0300 chore(Dashboard): Load title --- .../src/components/DynamicEditableTitle/index.tsx | 24 ++++++++++++++++++---- .../src/dashboard/components/Header/index.jsx | 2 +- 2 files changed, 21 insertions(+), 5 deletions(-) diff --git a/superset-frontend/src/components/DynamicEditableTitle/index.tsx b/superset-frontend/src/components/DynamicEditableTitle/index.tsx index dd43919438..dc6fa5b93f 100644 --- a/superset-frontend/src/components/DynamicEditableTitle/index.tsx +++ b/superset-frontend/src/components/DynamicEditableTitle/index.tsx @@ -30,13 +30,15 @@ import { import { css, SupersetTheme, t } from '@superset-ui/core'; import { Tooltip } from 'src/components/Tooltip'; import { useResizeDetector } from 'react-resize-detector'; +import { Skeleton } from 'src/components'; export type DynamicEditableTitleProps = { - title: string; - placeholder: string; + title?: string; + placeholder?: string; onSave: (title: string) => void; canEdit: boolean; - label: string | undefined; + label?: string | undefined; + loading?: boolean; }; const titleStyles = (theme: SupersetTheme) => css` @@ -84,6 +86,7 @@ export const DynamicEditableTitle = memo( onSave, canEdit, label, + loading, }: DynamicEditableTitleProps) => { const [isEditing, setIsEditing] = useState(false); const [currentTitle, setCurrentTitle] = useState(title || ''); @@ -96,7 +99,9 @@ export const DynamicEditableTitle = memo( }); useEffect(() => { - setCurrentTitle(title); + if (title) { + setCurrentTitle(title); + } }, [title]); useEffect(() => { @@ -173,6 +178,17 @@ export const DynamicEditableTitle = memo( [canEdit], ); + if (!title || loading) { + return ( + <Skeleton.Button + active + css={css` + min-width: 300px; + `} + /> + ); + } + return ( <div css={titleStyles} ref={containerRef}> <Tooltip diff --git a/superset-frontend/src/dashboard/components/Header/index.jsx b/superset-frontend/src/dashboard/components/Header/index.jsx index a69c152fdd..9feb086bfc 100644 --- a/superset-frontend/src/dashboard/components/Header/index.jsx +++ b/superset-frontend/src/dashboard/components/Header/index.jsx @@ -528,7 +528,7 @@ class Header extends PureComponent { <PageHeaderWithActions editableTitleProps={{ title: dashboardTitle, - canEdit: userCanEdit && editMode, + canEdit: !!(userCanEdit && editMode), onSave: this.handleChangeText, placeholder: t('Add the name of the dashboard'), label: t('Dashboard title'),
