fix(starfish): Date filter persistence bug (#54391)

static/app/components/datePageFilter.tsx

@@ -29,7 +29,12 @@ type Props = Omit<
   resetParamsOnChange?: string[];
 };
 
-function OldDatePageFilter({resetParamsOnChange, disabled, ...props}: Props) {
+function OldDatePageFilter({
+  resetParamsOnChange,
+  disabled,
+  storageNamespace,
+  ...props
+}: Props) {
   const router = useRouter();
   const {selection, desyncedFilters} = usePageFilters();
   const organization = useOrganization();
@@ -42,7 +47,11 @@ function OldDatePageFilter({resetParamsOnChange, disabled, ...props}: Props) {
       ...startEndUtc,
     };
 
-    updateDateTime(newTimePeriod, router, {save: true, resetParams: resetParamsOnChange});
+    updateDateTime(newTimePeriod, router, {
+      save: true,
+      resetParams: resetParamsOnChange,
+      storageNamespace,
+    });
   };
 
   const customDropdownButton = ({getActorProps, isOpen}) => {

static/app/components/organizations/datePageFilter.tsx

@@ -34,6 +34,7 @@ export function DatePageFilter({
   menuWidth,
   triggerProps = {},
   resetParamsOnChange,
+  storageNamespace,
   ...selectProps
 }: DatePageFilterProps) {
   const router = useRouter();
@@ -58,6 +59,7 @@ export function DatePageFilter({
         updateDateTime(newTimePeriod, router, {
           save: true,
           resetParams: resetParamsOnChange,
+          storageNamespace,
         });
       }}
       menuTitle={menuTitle ?? t('Filter Time Range')}

static/app/components/organizations/pageFilters/persistence.tsx

@@ -39,7 +39,9 @@ export function setPageFiltersStorage(
 ) {
   const {selection, pinnedFilters} = PageFiltersStore.getState();
 
-  const {state: currentStoredState} = getPageFilterStorage(orgSlug) ?? {state: null};
+  const {state: currentStoredState} = getPageFilterStorage(orgSlug, storageNamespace) ?? {
+    state: null,
+  };
 
   const projects = updateFilters.has('projects')
     ? selection.projects

static/app/components/organizations/timeRangeSelector/index.tsx

@@ -189,6 +189,10 @@ export interface TimeRangeSelectorProps extends DefaultProps, WithRouterProps {
    * Show the pin button in the dropdown's header actions
    */
   showPin?: boolean;
+  /**
+   * Optional prefix for the storage key, for areas of the app that need separate pagefilters (i.e Starfish)
+   */
+  storageNamespace?: string;
 }
 
 type State = {

static/app/components/timeRangeSelector.tsx

@@ -119,6 +119,10 @@ export interface TimeRangeSelectorProps
    * Start date value for absolute date selector
    */
   start?: DateString;
+  /**
+   * Optional prefix for the storage key, for areas of the app that need separate pagefilters (i.e Starfish)
+   */
+  storageNamespace?: string;
   /**
    * Default initial value for using UTC
    */

static/app/views/starfish/components/datePicker.tsx

@@ -8,6 +8,7 @@ function StarfishDatePicker() {
     <DatePageFilter
       defaultPeriod="24h"
       alignDropdown="left"
+      storageNamespace="starfish"
       onChange={({start, end, relative}) => {
         trackAnalytics('starfish.page_filter.data_change', {
           organization,