refactor: navigateStickyParams method accepts multiple params at once

sanity-io · Oct 28, 2024 · 152f9c8 · 152f9c8
1 parent 40e4e84
commit 152f9c8
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 29 deletions.
diff --git a/packages/sanity/src/core/releases/hooks/usePerspective.tsx b/packages/sanity/src/core/releases/hooks/usePerspective.tsx
@@ -45,23 +45,23 @@ export function usePerspective(): PerspectiveValue {
   const excludedPerspectives = router.stickyParams.excludedPerspectives?.split(',')
 
   // TODO: Should it be possible to set the perspective within a pane, rather than globally?
-  const setPerspective = (releaseId: string | undefined) => {
-    let perspectiveParam = ''
-
-    if (releaseId === 'published') {
-      perspectiveParam = 'published'
-    } else if (releaseId !== 'drafts') {
-      perspectiveParam = `bundle.${releaseId}`
-    }
-
-    router.navigate({
-      ...router.state,
-      _searchParams: [
-        ['excludedPerspectives', ''],
-        ['perspective', perspectiveParam],
-      ],
-    })
-  }
+  const setPerspective = useCallback(
+    (releaseId: string | undefined) => {
+      let perspectiveParam = ''
+
+      if (releaseId === 'published') {
+        perspectiveParam = 'published'
+      } else if (releaseId !== 'drafts') {
+        perspectiveParam = `bundle.${releaseId}`
+      }
+
+      router.navigateStickyParams({
+        excludedPerspectives: '',
+        perspective: perspectiveParam,
+      })
+    },
+    [router],
+  )
 
   const selectedBundle =
     perspective && releases
@@ -108,7 +108,7 @@ export function usePerspective(): PerspectiveValue {
         nextExcludedPerspectives.push(excludedPerspectiveId)
       }
 
-      router.navigateStickyParam('excludedPerspectives', nextExcludedPerspectives.toString())
+      router.navigateStickyParams({excludedPerspectives: nextExcludedPerspectives.toString()})
     },
     [excludedPerspectives, router],
   )

diff --git a/packages/sanity/src/core/releases/navbar/GlobalPerspectiveMenuItem.tsx b/packages/sanity/src/core/releases/navbar/GlobalPerspectiveMenuItem.tsx
@@ -118,7 +118,7 @@ export const GlobalPerspectiveMenuItem = forwardRef<
   )
 
   const isReleasePerspectiveExcluded = isPerspectiveExcluded(releasePerspectiveId)
-  const canReleaseBeExcluded = inRange || (release._id === 'published' && !!currentGlobalBundle)
+  const canReleaseBeExcluded = inRange && !last
 
   return (
     <GlobalPerspectiveMenuItemIndicator

diff --git a/packages/sanity/src/router/RouterProvider.tsx b/packages/sanity/src/router/RouterProvider.tsx
@@ -118,15 +118,30 @@ export function RouterProvider(props: RouterProviderProps): ReactElement {
     [routerProp, state],
   )
 
-  const handleNavigateStickyParam = useCallback(
-    (param: string, value: string | undefined, options: NavigateOptions = {}) => {
-      if (!STICKY_PARAMS.includes(param)) {
-        throw new Error('Parameter is not sticky')
+  const handleNavigateStickyParams = useCallback(
+    (params: Record<string, string | undefined>, options: NavigateOptions = {}) => {
+      const hasInvalidParam = Object.keys(params).some((param) => !STICKY_PARAMS.includes(param))
+      if (hasInvalidParam) {
+        throw new Error('One or more parameters are not sticky')
       }
+
+      const allNextSearchParams = [...(state._searchParams || []), ...Object.entries(params)]
+
+      const searchParams = Object.entries(
+        allNextSearchParams.reduce(
+          (deduppedSearchParams, [key, value]) => ({
+            ...deduppedSearchParams,
+            [key]: value,
+          }),
+          [],
+        ),
+      )
+
+      // Trigger the navigation with updated _searchParams
       onNavigate({
         path: resolvePathFromState({
           ...state,
-          _searchParams: [[param, value || '']],
+          _searchParams: searchParams,
         }),
         replace: options.replace,
       })
@@ -177,7 +192,7 @@ export function RouterProvider(props: RouterProviderProps): ReactElement {
     () => ({
       navigate,
       navigateIntent,
-      navigateStickyParam: handleNavigateStickyParam,
+      navigateStickyParams: handleNavigateStickyParams,
       navigateUrl: onNavigate,
       resolveIntentLink,
       resolvePathFromState,
@@ -186,7 +201,7 @@ export function RouterProvider(props: RouterProviderProps): ReactElement {
       perspectiveState,
     }),
     [
-      handleNavigateStickyParam,
+      handleNavigateStickyParams,
       navigate,
       navigateIntent,
       onNavigate,

diff --git a/packages/sanity/src/router/types.ts b/packages/sanity/src/router/types.ts
@@ -265,9 +265,12 @@ export interface RouterContextValue {
   navigateUrl: (opts: {path: string; replace?: boolean}) => void
 
   /**
-   * Navigates to the current URL with the sticky url search param set to the given value
+   * Navigates to the current URL with the sticky url search param set to the given values
    */
-  navigateStickyParam: (param: string, value: string, options?: NavigateOptions) => void
+  navigateStickyParams: (
+    params: Record<string, string | undefined>,
+    options?: NavigateOptions,
+  ) => void
 
   /**
    * Navigates to the given router state.

diff --git a/packages/sanity/src/ui-components/inputs/DateInputs/calendar/Calendar.tsx b/packages/sanity/src/ui-components/inputs/DateInputs/calendar/Calendar.tsx
@@ -27,7 +27,7 @@ import {YearInput} from './YearInput'
 export const MONTH_PICKER_VARIANT = {
   select: 'select',
   carousel: 'carousel',
-}
+} as const
 
 export type CalendarProps = Omit<ComponentProps<'div'>, 'onSelect'> & {
   selectTime?: boolean