From ece0b56a3dd2198416ba37e75447a8efcacbb129 Mon Sep 17 00:00:00 2001 From: Dominik Buszowiecki Date: Mon, 30 Mar 2026 15:18:51 -0400 Subject: [PATCH] fix(dashboards): Stop passing list page query params to dashboard details The dashboards list page was forwarding its query parameters (sort, filter, search) to dashboard detail links. This caused unintended params to appear in dashboard detail URLs when navigating from the list page. Remove query param forwarding from DashboardGrid card links, DashboardTable name links, and the onCreate/loadDashboard/onPreview navigation functions in the manage index. Co-Authored-By: Claude Opus 4.6 --- .../dashboards/manage/dashboardGrid.spec.tsx | 49 +++++-------------- .../views/dashboards/manage/dashboardGrid.tsx | 15 +----- .../dashboards/manage/dashboardTable.spec.tsx | 22 ++------- .../dashboards/manage/dashboardTable.tsx | 14 +----- .../views/dashboards/manage/index.spec.tsx | 5 +- static/app/views/dashboards/manage/index.tsx | 20 ++------ 6 files changed, 20 insertions(+), 105 deletions(-) diff --git a/static/app/views/dashboards/manage/dashboardGrid.spec.tsx b/static/app/views/dashboards/manage/dashboardGrid.spec.tsx index d9ac3775c24853..d9c2b8c8888053 100644 --- a/static/app/views/dashboards/manage/dashboardGrid.spec.tsx +++ b/static/app/views/dashboards/manage/dashboardGrid.spec.tsx @@ -1,9 +1,7 @@ import {DashboardListItemFixture} from 'sentry-fixture/dashboard'; -import {LocationFixture} from 'sentry-fixture/locationFixture'; import {OrganizationFixture} from 'sentry-fixture/organization'; import {UserFixture} from 'sentry-fixture/user'; -import {initializeOrg} from 'sentry-test/initializeOrg'; import { render, renderGlobalModal, @@ -25,8 +23,6 @@ describe('Dashboards - DashboardGrid', () => { features: ['dashboards-basic', 'dashboards-edit', 'discover-query'], }); - const {router} = initializeOrg(); - beforeEach(() => { MockApiClient.clearMockResponses(); @@ -106,7 +102,6 @@ describe('Dashboards - DashboardGrid', () => { onDashboardsChange={jest.fn()} organization={organization} dashboards={[]} - location={router.location} columnCount={3} rowCount={3} /> @@ -124,7 +119,6 @@ describe('Dashboards - DashboardGrid', () => { onDashboardsChange={jest.fn()} organization={organization} dashboards={dashboards} - location={router.location} columnCount={3} rowCount={3} /> @@ -140,7 +134,6 @@ describe('Dashboards - DashboardGrid', () => { onDashboardsChange={jest.fn()} organization={organization} dashboards={dashboards} - location={router.location} columnCount={3} rowCount={3} /> @@ -156,42 +149,28 @@ describe('Dashboards - DashboardGrid', () => { ); }); - it('persists global selection headers', () => { + it('does not forward query params from the list page to dashboard links', () => { render( - ); - - expect(screen.getByRole('link', {name: 'Dashboard 1'})).toHaveAttribute( - 'href', - '/organizations/org-slug/dashboard/1/?statsPeriod=7d' - ); - }); - - it('does not forward search query parameter to dashboard links', () => { - render( - + />, + { + initialRouterConfig: { + location: { + pathname: '/organizations/org-slug/dashboards/', + query: {sort: 'title', query: 'agent'}, + }, + }, + } ); expect(screen.getByRole('link', {name: 'Dashboard 1'})).toHaveAttribute( 'href', - '/organizations/org-slug/dashboard/1/?statsPeriod=7d' + '/organizations/org-slug/dashboard/1/' ); }); @@ -200,7 +179,6 @@ describe('Dashboards - DashboardGrid', () => { { { { { onDashboardsChange={jest.fn()} organization={organization} dashboards={dashboards} - location={router.location} columnCount={3} rowCount={3} />, @@ -383,7 +357,6 @@ describe('Dashboards - DashboardGrid', () => { onDashboardsChange={jest.fn()} organization={organization} dashboards={dashboards} - location={router.location} columnCount={3} rowCount={3} />, diff --git a/static/app/views/dashboards/manage/dashboardGrid.tsx b/static/app/views/dashboards/manage/dashboardGrid.tsx index a70f67c68cc06f..8ce43191c6b3c1 100644 --- a/static/app/views/dashboards/manage/dashboardGrid.tsx +++ b/static/app/views/dashboards/manage/dashboardGrid.tsx @@ -1,6 +1,5 @@ import {Fragment, useEffect, useState} from 'react'; import styled from '@emotion/styled'; -import type {Location} from 'history'; import isEqual from 'lodash/isEqual'; import {Button} from '@sentry/scraps/button'; @@ -36,7 +35,6 @@ type Props = { api: Client; columnCount: number; dashboards: DashboardListItem[] | undefined; - location: Location; onDashboardsChange: () => void; organization: Organization; rowCount: number; @@ -46,7 +44,6 @@ type Props = { function DashboardGrid({ api, organization, - location, dashboards, onDashboardsChange, rowCount, @@ -167,13 +164,6 @@ function DashboardGrid({ return ; } - // TODO(__SENTRY_USING_REACT_ROUTER_SIX): We can remove this later, react - // router 6 handles empty query objects without appending a trailing ? - const {query: _searchQuery, ...queryWithoutSearch} = location.query; - const queryLocation = { - ...(Object.keys(queryWithoutSearch).length > 0 ? {query: queryWithoutSearch} : {}), - }; - function renderMiniDashboards() { // on pagination, render no dashboards to show placeholders while loading if ( @@ -189,10 +179,7 @@ function DashboardGrid({ {dashboardLimitData => ( { ); }); - it('persists global selection headers', async () => { - render( - - ); - - expect(await screen.findByRole('link', {name: 'Dashboard 1'})).toHaveAttribute( - 'href', - '/organizations/org-slug/dashboard/1/?statsPeriod=7d' - ); - }); - - it('does not forward search query parameter to dashboard links', async () => { + it('does not forward query params from the list page to dashboard links', async () => { render( { dashboards={dashboards} location={{ ...LocationFixture(), - query: {query: 'agent', statsPeriod: '7d'}, + query: {sort: 'title', query: 'agent', statsPeriod: '7d'}, }} /> ); expect(await screen.findByRole('link', {name: 'Dashboard 1'})).toHaveAttribute( 'href', - '/organizations/org-slug/dashboard/1/?statsPeriod=7d' + '/organizations/org-slug/dashboard/1/' ); }); diff --git a/static/app/views/dashboards/manage/dashboardTable.tsx b/static/app/views/dashboards/manage/dashboardTable.tsx index dd581aaa3f87fc..77911b2e7c2ec5 100644 --- a/static/app/views/dashboards/manage/dashboardTable.tsx +++ b/static/app/views/dashboards/manage/dashboardTable.tsx @@ -146,13 +146,6 @@ function DashboardTable({ {key: ResponseKeys.CREATED, name: t('Created'), width: COL_WIDTH_UNDEFINED}, ]; - // TODO(__SENTRY_USING_REACT_ROUTER_SIX): We can remove this later, react - // router 6 handles empty query objects without appending a trailing ? - const {query: _searchQuery, ...queryWithoutSearch} = location.query; - const queryLocation = { - ...(Object.keys(queryWithoutSearch).length > 0 ? {query: queryWithoutSearch} : {}), - }; - function renderHeadCell(column: GridColumnOrder) { if (column.key in SortKeys) { const urlSort = decodeScalar(location.query.sort, 'mydashboards'); @@ -212,12 +205,7 @@ function DashboardTable({ if (column.key === ResponseKeys.NAME) { return ( - + {dataRow[ResponseKeys.NAME]} diff --git a/static/app/views/dashboards/manage/index.spec.tsx b/static/app/views/dashboards/manage/index.spec.tsx index a9e0fd8276493d..1aed58bc3fe193 100644 --- a/static/app/views/dashboards/manage/index.spec.tsx +++ b/static/app/views/dashboards/manage/index.spec.tsx @@ -123,10 +123,7 @@ describe('Dashboards > Detail', () => { await userEvent.click(await screen.findByTestId('dashboard-create')); - expect(mockNavigate).toHaveBeenCalledWith({ - pathname: '/organizations/org-slug/dashboards/new/', - query: {}, - }); + expect(mockNavigate).toHaveBeenCalledWith('/organizations/org-slug/dashboards/new/'); }); it('can sort', async () => { diff --git a/static/app/views/dashboards/manage/index.tsx b/static/app/views/dashboards/manage/index.tsx index 4e90d37c651b40..83f33befc65cc4 100644 --- a/static/app/views/dashboards/manage/index.tsx +++ b/static/app/views/dashboards/manage/index.tsx @@ -494,7 +494,6 @@ function ManageDashboards() { api={api} dashboards={dashboards} organization={organization} - location={location} onDashboardsChange={() => refetchDashboards()} isLoading={isLoading} rowCount={rowCount} @@ -543,19 +542,12 @@ function ManageDashboards() { ); } - const {query: _query, ...queryWithoutSearch} = location.query; - function onCreate() { trackAnalytics('dashboards_manage.create.start', { organization, }); - navigate( - normalizeUrl({ - pathname: `/organizations/${organization.slug}/dashboards/new/`, - query: queryWithoutSearch, - }) - ); + navigate(normalizeUrl(`/organizations/${organization.slug}/dashboards/new/`)); } async function onAdd(dashboard: DashboardDetails) { @@ -578,10 +570,7 @@ function ManageDashboards() { function loadDashboard(dashboardId: string) { navigate( - normalizeUrl({ - pathname: `/organizations/${organization.slug}/dashboards/${dashboardId}/`, - query: queryWithoutSearch, - }) + normalizeUrl(`/organizations/${organization.slug}/dashboards/${dashboardId}/`) ); } @@ -592,10 +581,7 @@ function ManageDashboards() { }); navigate( - normalizeUrl({ - pathname: `/organizations/${organization.slug}/dashboards/new/${dashboardId}/`, - query: queryWithoutSearch, - }) + normalizeUrl(`/organizations/${organization.slug}/dashboards/new/${dashboardId}/`) ); }