Open nemccarthy opened 2 months ago
Hey @nemccarthy! I'm here to help you with any bugs or questions you have regarding Superset. Let's squash those bugs together!
I found a similar unsolved discussion that might be relevant to your issue: Embedded dashboard: hide edit chart title link, which was last updated on 2024-09-04 [1].
To hide the username and last modified timestamp in the dashboard header for the embedded use case in Superset version 4.1.0rc2, you need to modify the titlePanelAdditionalItems
array in the render
method of the Header
component. Specifically, you should remove the MetadataBar
component from this array.
Here is the relevant part of the code with the MetadataBar
component removed:
return (
<div
css={headerContainerStyle}
data-test="dashboard-header-container"
data-test-id={dashboardInfo.id}
className="dashboard-header-container"
>
<PageHeaderWithActions
editableTitleProps={{
title: dashboardTitle,
canEdit: userCanEdit && editMode,
onSave: this.handleChangeText,
placeholder: t('Add the name of the dashboard'),
label: t('Dashboard title'),
showTooltip: false,
}}
certificatiedBadgeProps={{
certifiedBy: dashboardInfo.certified_by,
details: dashboardInfo.certification_details,
}}
faveStarProps={{
itemId: dashboardInfo.id,
fetchFaveStar: this.props.fetchFaveStar,
saveFaveStar: this.props.saveFaveStar,
isStarred: this.props.isStarred,
showTooltip: true,
}}
titlePanelAdditionalItems={[
!editMode && (
<PublishedStatus
dashboardId={dashboardInfo.id}
isPublished={isPublished}
savePublished={this.props.savePublished}
canEdit={userCanEdit}
canSave={userCanSaveAs}
visible={!editMode}
/>
),
// Remove the MetadataBar component to hide username and last modified timestamp
]}
rightPanelAdditionalItems={
<div className="button-container">
{userCanSaveAs && (
<div
className="button-container"
data-test="dashboard-edit-actions"
>
{editMode && (
<div css={actionButtonsStyle}>
<div className="undoRedo">
<Tooltip
id="dashboard-undo-tooltip"
title={t('Undo the action')}
>
<StyledUndoRedoButton
type="text"
disabled={undoLength < 1}
onClick={undoLength && onUndo}
>
<Icons.Undo
css={[
undoRedoStyle,
this.state.emphasizeUndo && undoRedoEmphasized,
undoLength < 1 && undoRedoDisabled,
]}
data-test="undo-action"
iconSize="xl"
/>
</StyledUndoRedoButton>
</Tooltip>
<Tooltip
id="dashboard-redo-tooltip"
title={t('Redo the action')}
>
<StyledUndoRedoButton
type="text"
disabled={redoLength < 1}
onClick={redoLength && onRedo}
>
<Icons.Redo
css={[
undoRedoStyle,
this.state.emphasizeRedo && undoRedoEmphasized,
redoLength < 1 && undoRedoDisabled,
]}
data-test="redo-action"
iconSize="xl"
/>
</StyledUndoRedoButton>
</Tooltip>
</div>
<Button
css={discardBtnStyle}
buttonSize="small"
onClick={this.constructor.discardChanges}
buttonStyle="default"
data-test="discard-changes-button"
aria-label={t('Discard')}
>
{t('Discard')}
</Button>
<Button
css={saveBtnStyle}
buttonSize="small"
disabled={!hasUnsavedChanges}
buttonStyle="primary"
onClick={this.overwriteDashboard}
data-test="header-save-button"
aria-label={t('Save')}
>
{t('Save')}
</Button>
</div>
)}
</div>
)}
{editMode ? (
<UndoRedoKeyListeners
onUndo={this.handleCtrlZ}
onRedo={this.handleCtrlY}
/>
) : (
<div css={actionButtonsStyle}>
{NavExtension && <NavExtension />}
{userCanEdit && (
<Button
buttonStyle="secondary"
onClick={this.toggleEditMode}
data-test="edit-dashboard-button"
className="action-button"
css={editButtonStyle}
aria-label={t('Edit dashboard')}
>
{t('Edit dashboard')}
</Button>
)}
</div>
)}
</div>
}
menuDropdownProps={{
getPopupContainer: triggerNode =>
triggerNode.closest('.header-with-actions'),
visible: this.state.isDropdownVisible,
onVisibleChange: this.setIsDropdownVisible,
}}
additionalActionsMenu={
<ConnectedHeaderActionsDropdown
addSuccessToast={this.props.addSuccessToast}
addDangerToast={this.props.addDangerToast}
dashboardId={dashboardInfo.id}
dashboardTitle={dashboardTitle}
dashboardInfo={dashboardInfo}
dataMask={dataMask}
layout={layout}
expandedSlices={expandedSlices}
customCss={customCss}
colorNamespace={colorNamespace}
colorScheme={colorScheme}
onSave={onSave}
onChange={onChange}
forceRefreshAllCharts={this.forceRefresh}
startPeriodicRender={this.startPeriodicRender}
refreshFrequency={refreshFrequency}
shouldPersistRefreshFrequency={shouldPersistRefreshFrequency}
setRefreshFrequency={setRefreshFrequency}
updateCss={updateCss}
editMode={editMode}
hasUnsavedChanges={hasUnsavedChanges}
userCanEdit={userCanEdit}
userCanShare={userCanShare}
userCanSave={userCanSaveAs}
userCanCurate={userCanCurate}
isLoading={isLoading}
showPropertiesModal={this.showPropertiesModal}
manageEmbedded={this.showEmbedModal}
refreshLimit={refreshLimit}
refreshWarning={refreshWarning}
lastModifiedTime={lastModifiedTime}
isDropdownVisible={this.state.isDropdownVisible}
setIsDropdownVisible={this.setIsDropdownVisible}
logEvent={logEvent}
/>
}
showFaveStar={user?.userId && dashboardInfo?.id}
showTitlePanelItems
/>
{this.state.showingPropertiesModal && (
<PropertiesModal
dashboardId={dashboardInfo.id}
dashboardInfo={dashboardInfo}
dashboardTitle={dashboardTitle}
show={this.state.showingPropertiesModal}
onHide={this.hidePropertiesModal}
colorScheme={this.props.colorScheme}
onSubmit={handleOnPropertiesChange}
onlyApply
/>
)}
{userCanCurate && (
<DashboardEmbedModal
show={this.state.showingEmbedModal}
onHide={this.hideEmbedModal}
dashboardId={dashboardInfo.id}
/>
)}
<Global
styles={css`
.ant-menu-vertical {
border-right: none;
}
`}
/>
</div>
);
By removing the MetadataBar
component, the username and last modified timestamp will no longer be displayed in the dashboard header [2].
To continue talking to Dosu, mention @dosu.
Looks like npm run lint-fix
might solve a lot of the CI problems :)
Bug description
The latest 4.1.0rc2 has in the dashboard header a username and last modified timestamp. This doesn't make sense for the embedded use case and should be hidden from the dashboard title.
This should be hidden just like the Published tag as this is metadata that doesnt make sense outside of the superset app.
Introduced in #27857
How to reproduce the bug
Screenshots/recordings
Superset version
master / latest-dev
Python version
3.9
Node version
16
Browser
Chrome
Additional context
No response
Checklist