diff --git a/static/app/views/releases/detail/index.tsx b/static/app/views/releases/detail/index.tsx index e2ea5e94789d6a..f16881540351d1 100644 --- a/static/app/views/releases/detail/index.tsx +++ b/static/app/views/releases/detail/index.tsx @@ -1,6 +1,8 @@ import {createContext} from 'react'; import {RouteComponentProps} from 'react-router'; import styled from '@emotion/styled'; +import {Location} from 'history'; +import isEqual from 'lodash/isEqual'; import pick from 'lodash/pick'; import Alert from 'app/components/alert'; @@ -10,7 +12,7 @@ import NoProjectMessage from 'app/components/noProjectMessage'; import GlobalSelectionHeader from 'app/components/organizations/globalSelectionHeader'; import {getParams} from 'app/components/organizations/globalSelectionHeader/getParams'; import PickProjectToContinue from 'app/components/pickProjectToContinue'; -import {URL_PARAM} from 'app/constants/globalSelectionHeader'; +import {PAGE_URL_PARAM, URL_PARAM} from 'app/constants/globalSelectionHeader'; import {IconInfo, IconWarning} from 'app/icons'; import {t} from 'app/locale'; import {PageContent} from 'app/styles/organization'; @@ -90,6 +92,21 @@ class ReleasesDetail extends AsyncView { }; } + componentDidUpdate(prevProps, prevContext: Record) { + const {organization, params, location} = this.props; + + if ( + prevProps.params.release !== params.release || + prevProps.organization.slug !== organization.slug || + !isEqual( + this.pickLocationQuery(prevProps.location), + this.pickLocationQuery(location) + ) + ) { + super.componentDidUpdate(prevProps, prevContext); + } + } + getEndpoints(): ReturnType { const {organization, location, params, releaseMeta} = this.props; @@ -104,7 +121,7 @@ class ReleasesDetail extends AsyncView { { query: { adoptionStages: 1, - ...getParams(pick(location.query, [...Object.values(URL_PARAM)])), + ...getParams(this.pickLocationQuery(location)), }, }, ], @@ -133,6 +150,13 @@ class ReleasesDetail extends AsyncView { return endpoints; } + pickLocationQuery(location: Location) { + return pick(location.query, [ + ...Object.values(URL_PARAM), + ...Object.values(PAGE_URL_PARAM), + ]); + } + renderError(...args) { const possiblyWrongProject = Object.values(this.state.errors).find( e => e?.status === 404 || e?.status === 403 @@ -227,8 +251,15 @@ class ReleasesDetailContainer extends AsyncComponent< } componentDidUpdate(prevProps, prevContext: Record) { - super.componentDidUpdate(prevProps, prevContext); + const {organization, params} = this.props; + this.removeGlobalDateTimeFromUrl(); + if ( + prevProps.params.release !== params.release || + prevProps.organization.slug !== organization.slug + ) { + super.componentDidUpdate(prevProps, prevContext); + } } removeGlobalDateTimeFromUrl() { diff --git a/static/app/views/releases/detail/overview/releaseComparisonChart/index.tsx b/static/app/views/releases/detail/overview/releaseComparisonChart/index.tsx index f188461c69cceb..08544115c52b78 100644 --- a/static/app/views/releases/detail/overview/releaseComparisonChart/index.tsx +++ b/static/app/views/releases/detail/overview/releaseComparisonChart/index.tsx @@ -138,7 +138,15 @@ function ReleaseComparisonChart({ fetchEventsTotals(); fetchIssuesTotals(); } - }, [period, start, end, organization.slug, location]); + }, [ + period, + start, + end, + organization.slug, + location.query.project, + location.query.environment?.toString(), + release.version, + ]); useEffect(() => { const chartInUrl = decodeScalar(location.query.chart) as ReleaseComparisonChartType;