@sanity/sdk 0.0.0-chore-react-18-compat.1 → 0.0.0-chore-react-18-compat.3

package/src/auth/refreshStampedToken.ts

@@ -1,68 +1,179 @@
-import {distinctUntilChanged, filter, interval, map, switchMap, takeWhile} from 'rxjs'
+import {
+  distinctUntilChanged,
+  filter,
+  firstValueFrom,
+  from,
+  map,
+  Observable,
+  type Subscription,
+  switchMap,
+  takeWhile,
+  timer,
+} from 'rxjs'
 
-import {type ActionContext, createInternalAction} from '../resources/createAction'
+import {type StoreContext} from '../store/defineStore'
 import {DEFAULT_API_VERSION} from './authConstants'
 import {AuthStateType} from './authStateType'
 import {type AuthState, type AuthStoreState} from './authStore'
 
+const REFRESH_INTERVAL = 12 * 60 * 60 * 1000 // 12 hours in milliseconds
+const LOCK_NAME = 'sanity-token-refresh-lock'
+
+function getLastRefreshTime(storageArea: Storage | undefined, storageKey: string): number {
+  try {
+    const data = storageArea?.getItem(`${storageKey}_last_refresh`)
+    return data ? parseInt(data, 10) : 0
+  } catch {
+    return 0
+  }
+}
+
+function setLastRefreshTime(storageArea: Storage | undefined, storageKey: string): void {
+  try {
+    storageArea?.setItem(`${storageKey}_last_refresh`, Date.now().toString())
+  } catch {
+    // Ignore storage errors
+  }
+}
+
+function getNextRefreshDelay(storageArea: Storage | undefined, storageKey: string): number {
+  const lastRefresh = getLastRefreshTime(storageArea, storageKey)
+  if (!lastRefresh) return 0
+
+  const now = Date.now()
+  const nextRefreshTime = lastRefresh + REFRESH_INTERVAL
+  return Math.max(0, nextRefreshTime - now)
+}
+
+function createTokenRefreshStream(
+  token: string,
+  clientFactory: AuthStoreState['options']['clientFactory'],
+  apiHost: string | undefined,
+): Observable<{token: string}> {
+  return new Observable((subscriber) => {
+    const client = clientFactory({
+      apiVersion: DEFAULT_API_VERSION,
+      requestTagPrefix: 'sdk.token-refresh',
+      useProjectHostname: false,
+      token,
+      ignoreBrowserTokenWarning: true,
+      ...(apiHost && {apiHost}),
+    })
+
+    const subscription = client.observable
+      .request<{token: string}>({
+        uri: 'auth/refresh-token',
+        method: 'POST',
+        body: {
+          token,
+        },
+      })
+      .subscribe(subscriber)
+
+    return () => subscription.unsubscribe()
+  })
+}
+
+async function acquireTokenRefreshLock(
+  refreshFn: () => Promise<void>,
+  storageArea: Storage | undefined,
+  storageKey: string,
+): Promise<boolean> {
+  if (!navigator.locks) {
+    return true // If Web Locks API is not supported, proceed with refresh
+  }
+
+  try {
+    // Hold the lock for the entire session
+    const result = await navigator.locks.request(LOCK_NAME, {mode: 'exclusive'}, async (lock) => {
+      if (!lock) return false
+
+      // Start a continuous refresh cycle while we hold the lock
+      while (true) {
+        const delay = getNextRefreshDelay(storageArea, storageKey)
+        if (delay > 0) {
+          await new Promise((resolve) => setTimeout(resolve, delay))
+        }
+        await refreshFn()
+        setLastRefreshTime(storageArea, storageKey)
+        await new Promise((resolve) => setTimeout(resolve, REFRESH_INTERVAL))
+      }
+    })
+    return result === true
+  } catch {
+    return false // If lock acquisition fails, return false
+  }
+}
+
 /**
  * @internal
  */
-export const refreshStampedToken = createInternalAction(
-  ({state}: ActionContext<AuthStoreState>) => {
-    const {clientFactory, apiHost, storageArea, storageKey} = state.get().options
-
-    const refreshToken$ = state.observable.pipe(
-      map(({authState}) => authState),
-      filter(
-        (authState): authState is Extract<AuthState, {type: AuthStateType.LOGGED_IN}> =>
-          authState.type === AuthStateType.LOGGED_IN,
-      ),
-      distinctUntilChanged(),
-      filter((authState) => authState.token.includes('-st')), // Ensure we only try to refresh stamped tokens
-      switchMap((authState) =>
-        interval(10 * 60 * 1000).pipe(
-          takeWhile(() => state.get().authState.type === AuthStateType.LOGGED_IN),
-          map(() => authState.token),
-          distinctUntilChanged(),
-          map((token) =>
-            clientFactory({
-              apiVersion: DEFAULT_API_VERSION,
-              requestTagPrefix: 'sdk.token-refresh',
-              useProjectHostname: false,
-              token,
-              ignoreBrowserTokenWarning: true,
-              ...(apiHost && {apiHost}),
-            }),
-          ),
-          switchMap((client) =>
-            client.observable.request<{token: string}>({
-              uri: 'auth/refresh-token',
-              method: 'POST',
-              body: {
-                token: authState.token,
-              },
-            }),
+export const refreshStampedToken = ({state}: StoreContext<AuthStoreState>): Subscription => {
+  const {clientFactory, apiHost, storageArea, storageKey} = state.get().options
+
+  const refreshToken$ = state.observable.pipe(
+    map((storeState) => ({
+      authState: storeState.authState,
+      dashboardContext: storeState.dashboardContext,
+    })),
+    filter(
+      (
+        storeState,
+      ): storeState is {
+        authState: Extract<AuthState, {type: AuthStateType.LOGGED_IN}>
+        dashboardContext: AuthStoreState['dashboardContext']
+      } => storeState.authState.type === AuthStateType.LOGGED_IN,
+    ),
+    distinctUntilChanged(),
+    filter((storeState) => storeState.authState.token.includes('-st')), // Ensure we only try to refresh stamped tokens
+    switchMap((storeState) => {
+      // Create a function that performs a single refresh
+      const performRefresh = async () => {
+        const response = await firstValueFrom(
+          createTokenRefreshStream(storeState.authState.token, clientFactory, apiHost),
+        )
+
+        state.set('setRefreshStampedToken', (prev) => ({
+          authState:
+            prev.authState.type === AuthStateType.LOGGED_IN
+              ? {...prev.authState, token: response.token}
+              : prev.authState,
+        }))
+        storageArea?.setItem(storageKey, JSON.stringify({token: response.token}))
+      }
+
+      // If in dashboard context, use simple timer-based refresh
+      if (storeState.dashboardContext) {
+        return timer(0, REFRESH_INTERVAL).pipe(
+          takeWhile(() => storeState.authState.type === AuthStateType.LOGGED_IN),
+          switchMap(() =>
+            createTokenRefreshStream(storeState.authState.token, clientFactory, apiHost),
           ),
-        ),
-      ),
-    )
-
-    return function () {
-      return refreshToken$.subscribe({
-        next: (response) => {
-          state.set('setRefreshStampedToken', (prev) => ({
-            authState:
-              prev.authState.type === AuthStateType.LOGGED_IN
-                ? {...prev.authState, token: response.token}
-                : prev.authState,
-          }))
-          storageArea?.setItem(storageKey, JSON.stringify({token: response.token}))
-        },
-        error: (error) => {
-          state.set('setRefreshStampedTokenError', {authState: {type: AuthStateType.ERROR, error}})
-        },
-      })
-    }
-  },
-)
+        )
+      }
+
+      // If not in dashboard context, use lock-based refresh with timing coordination
+      return from(acquireTokenRefreshLock(performRefresh, storageArea, storageKey)).pipe(
+        filter((hasLock) => hasLock),
+        // This observable will never emit after the first value
+        // because acquireTokenRefreshLock handles the refresh loop internally
+        map(() => ({token: storeState.authState.token})),
+      )
+    }),
+  )
+
+  return refreshToken$.subscribe({
+    next: (response) => {
+      state.set('setRefreshStampedToken', (prev) => ({
+        authState:
+          prev.authState.type === AuthStateType.LOGGED_IN
+            ? {...prev.authState, token: response.token}
+            : prev.authState,
+      }))
+      storageArea?.setItem(storageKey, JSON.stringify({token: response.token}))
+    },
+    error: (error) => {
+      state.set('setRefreshStampedTokenError', {authState: {type: AuthStateType.ERROR, error}})
+    },
+  })
+}

package/src/auth/subscribeToStateAndFetchCurrentUser.test.ts

@@ -2,8 +2,8 @@ import {type CurrentUser} from '@sanity/types'
 import {delay, of, throwError} from 'rxjs'
 import {beforeEach, describe, it} from 'vitest'
 
-import {createSanityInstance} from '../instance/sanityInstance'
-import {createResourceState} from '../resources/createResource'
+import {createSanityInstance} from '../store/createSanityInstance'
+import {createStoreState} from '../store/createStoreState'
 import {AuthStateType} from './authStateType'
 import {authStore} from './authStore'
 import {subscribeToStateAndFetchCurrentUser} from './subscribeToStateAndFetchCurrentUser'
@@ -20,7 +20,7 @@ describe('subscribeToStateAndFetchCurrentUser', () => {
     const clientFactory = vi.fn().mockReturnValue(mockClient)
     const instance = createSanityInstance({projectId: 'p', dataset: 'd', auth: {clientFactory}})
 
-    const state = createResourceState(authStore.getInitialState(instance))
+    const state = createStoreState(authStore.getInitialState(instance))
     const subscription = subscribeToStateAndFetchCurrentUser({state, instance})
 
     expect(state.get()).toMatchObject({authState: {type: AuthStateType.LOGGED_OUT}})
@@ -51,7 +51,7 @@ describe('subscribeToStateAndFetchCurrentUser', () => {
     const clientFactory = vi.fn().mockReturnValue(mockClient)
     const instance = createSanityInstance({projectId: 'p', dataset: 'd', auth: {clientFactory}})
 
-    const state = createResourceState(authStore.getInitialState(instance))
+    const state = createStoreState(authStore.getInitialState(instance))
     const subscription = subscribeToStateAndFetchCurrentUser({state, instance})
 
     expect(state.get()).toMatchObject({authState: {type: AuthStateType.LOGGED_OUT}})
@@ -86,7 +86,7 @@ describe('subscribeToStateAndFetchCurrentUser', () => {
     const clientFactory = vi.fn().mockReturnValue(mockClient)
     const instance = createSanityInstance({projectId: 'p', dataset: 'd', auth: {clientFactory}})
 
-    const state = createResourceState(authStore.getInitialState(instance))
+    const state = createStoreState(authStore.getInitialState(instance))
     const subscription = subscribeToStateAndFetchCurrentUser({state, instance})
 
     expect(state.get()).toMatchObject({authState: {type: AuthStateType.LOGGED_OUT}})

package/src/auth/subscribeToStateAndFetchCurrentUser.ts

@@ -1,55 +1,53 @@
 import {type CurrentUser} from '@sanity/types'
-import {distinctUntilChanged, filter, map, switchMap} from 'rxjs'
+import {distinctUntilChanged, filter, map, type Subscription, switchMap} from 'rxjs'
 
-import {type ActionContext, createInternalAction} from '../resources/createAction'
+import {type StoreContext} from '../store/defineStore'
 import {DEFAULT_API_VERSION, REQUEST_TAG_PREFIX} from './authConstants'
 import {AuthStateType} from './authStateType'
 import {type AuthState, type AuthStoreState} from './authStore'
 
-export const subscribeToStateAndFetchCurrentUser = createInternalAction(
-  ({state}: ActionContext<AuthStoreState>) => {
-    const {clientFactory, apiHost} = state.get().options
+export const subscribeToStateAndFetchCurrentUser = ({
+  state,
+}: StoreContext<AuthStoreState>): Subscription => {
+  const {clientFactory, apiHost} = state.get().options
 
-    const currentUser$ = state.observable
-      .pipe(
-        map(({authState}) => authState),
-        filter(
-          (authState): authState is Extract<AuthState, {type: AuthStateType.LOGGED_IN}> =>
-            authState.type === AuthStateType.LOGGED_IN && !authState.currentUser,
-        ),
-        map((authState) => authState.token),
-        distinctUntilChanged(),
-      )
-      .pipe(
-        map((token) =>
-          clientFactory({
-            apiVersion: DEFAULT_API_VERSION,
-            requestTagPrefix: REQUEST_TAG_PREFIX,
-            token,
-            ignoreBrowserTokenWarning: true,
-            useProjectHostname: false,
-            ...(apiHost && {apiHost}),
-          }),
-        ),
-        switchMap((client) =>
-          client.observable.request<CurrentUser>({uri: '/users/me', method: 'GET'}),
-        ),
-      )
+  const currentUser$ = state.observable
+    .pipe(
+      map(({authState}) => authState),
+      filter(
+        (authState): authState is Extract<AuthState, {type: AuthStateType.LOGGED_IN}> =>
+          authState.type === AuthStateType.LOGGED_IN && !authState.currentUser,
+      ),
+      map((authState) => authState.token),
+      distinctUntilChanged(),
+    )
+    .pipe(
+      map((token) =>
+        clientFactory({
+          apiVersion: DEFAULT_API_VERSION,
+          requestTagPrefix: REQUEST_TAG_PREFIX,
+          token,
+          ignoreBrowserTokenWarning: true,
+          useProjectHostname: false,
+          ...(apiHost && {apiHost}),
+        }),
+      ),
+      switchMap((client) =>
+        client.observable.request<CurrentUser>({uri: '/users/me', method: 'GET'}),
+      ),
+    )
 
-    return function () {
-      return currentUser$.subscribe({
-        next: (currentUser) => {
-          state.set('setCurrentUser', (prev) => ({
-            authState:
-              prev.authState.type === AuthStateType.LOGGED_IN
-                ? {...prev.authState, currentUser}
-                : prev.authState,
-          }))
-        },
-        error: (error) => {
-          state.set('setError', {authState: {type: AuthStateType.ERROR, error}})
-        },
-      })
-    }
-  },
-)
+  return currentUser$.subscribe({
+    next: (currentUser) => {
+      state.set('setCurrentUser', (prev) => ({
+        authState:
+          prev.authState.type === AuthStateType.LOGGED_IN
+            ? {...prev.authState, currentUser}
+            : prev.authState,
+      }))
+    },
+    error: (error) => {
+      state.set('setError', {authState: {type: AuthStateType.ERROR, error}})
+    },
+  })
+}

package/src/auth/subscribeToStorageEventsAndSetToken.test.ts

@@ -1,9 +1,8 @@
 import {Observable, Subject} from 'rxjs'
 import {beforeEach, describe, it} from 'vitest'
 
-import {createSanityInstance} from '../instance/sanityInstance'
-import {type SanityInstance} from '../instance/types'
-import {createResourceState} from '../resources/createResource'
+import {createSanityInstance, type SanityInstance} from '../store/createSanityInstance'
+import {createStoreState} from '../store/createStoreState'
 import {AuthStateType} from './authStateType'
 import {authStore} from './authStore'
 import {subscribeToStorageEventsAndSetToken} from './subscribeToStorageEventsAndSetToken'
@@ -35,7 +34,7 @@ describe('subscribeToStorageEventsAndSetToken', () => {
   })
 
   it('sets the state to logged in when a matching storage event returns a token', () => {
-    const state = createResourceState(authStore.getInitialState(instance))
+    const state = createStoreState(authStore.getInitialState(instance))
     const {storageKey} = state.get().options
     const subscription = subscribeToStorageEventsAndSetToken({state, instance})
 
@@ -55,7 +54,7 @@ describe('subscribeToStorageEventsAndSetToken', () => {
 
   it('sets the state to logged in when a matching storage event returns null', () => {
     vi.mocked(getTokenFromStorage).mockReturnValue('existing-token')
-    const state = createResourceState(authStore.getInitialState(instance))
+    const state = createStoreState(authStore.getInitialState(instance))
     const {storageKey} = state.get().options
 
     const subscription = subscribeToStorageEventsAndSetToken({state, instance})

package/src/auth/subscribeToStorageEventsAndSetToken.ts

@@ -1,31 +1,29 @@
-import {defer, distinctUntilChanged, filter, map} from 'rxjs'
+import {defer, distinctUntilChanged, filter, map, type Subscription} from 'rxjs'
 
-import {type ActionContext, createInternalAction} from '../resources/createAction'
+import {type StoreContext} from '../store/defineStore'
 import {AuthStateType} from './authStateType'
 import {type AuthStoreState} from './authStore'
 import {getStorageEvents, getTokenFromStorage} from './utils'
 
-export const subscribeToStorageEventsAndSetToken = createInternalAction(
-  ({state}: ActionContext<AuthStoreState>) => {
-    const {storageArea, storageKey} = state.get().options
+export const subscribeToStorageEventsAndSetToken = ({
+  state,
+}: StoreContext<AuthStoreState>): Subscription => {
+  const {storageArea, storageKey} = state.get().options
 
-    const tokenFromStorage$ = defer(getStorageEvents).pipe(
-      filter(
-        (e): e is StorageEvent & {newValue: string} =>
-          e.storageArea === storageArea && e.key === storageKey,
-      ),
-      map(() => getTokenFromStorage(storageArea, storageKey)),
-      distinctUntilChanged(),
-    )
+  const tokenFromStorage$ = defer(getStorageEvents).pipe(
+    filter(
+      (e): e is StorageEvent & {newValue: string} =>
+        e.storageArea === storageArea && e.key === storageKey,
+    ),
+    map(() => getTokenFromStorage(storageArea, storageKey)),
+    distinctUntilChanged(),
+  )
 
-    return function () {
-      return tokenFromStorage$.subscribe((token) => {
-        state.set('updateTokenFromStorageEvent', {
-          authState: token
-            ? {type: AuthStateType.LOGGED_IN, token, currentUser: null}
-            : {type: AuthStateType.LOGGED_OUT, isDestroyingSession: false},
-        })
-      })
-    }
-  },
-)
+  return tokenFromStorage$.subscribe((token) => {
+    state.set('updateTokenFromStorageEvent', {
+      authState: token
+        ? {type: AuthStateType.LOGGED_IN, token, currentUser: null}
+        : {type: AuthStateType.LOGGED_OUT, isDestroyingSession: false},
+    })
+  })
+}