sanity-plugin-media 4.1.1 → 4.2.0

package/src/modules/notifications/epics.test.ts

@@ -0,0 +1,373 @@
+// @vitest-environment node
+
+import {describe, expect, it, vi} from 'vitest'
+import {
+  notificationsAssetsDeleteCompleteEpic,
+  notificationsAssetsDeleteErrorEpic,
+  notificationsAssetsTagsAddCompleteEpic,
+  notificationsAssetsTagsRemoveCompleteEpic,
+  notificationsAssetsUpdateCompleteEpic,
+  notificationsAssetsUploadCompleteEpic,
+  notificationsGenericErrorEpic,
+  notificationsTagCreateCompleteEpic,
+  notificationsTagDeleteCompleteEpic,
+  notificationsTagUpdateCompleteEpic
+} from './index'
+import {assetsActions, initialState as assetsInitialState} from '../assets'
+import {ASSETS_ACTIONS} from '../assets/actions'
+import {tagsActions} from '../tags'
+import {uploadsActions} from '../uploads'
+import {createEpicTestStore} from '../../__tests__/fixtures/createEpicTestStore'
+import {createMockSanityClient} from '../../__tests__/fixtures/mockSanityClient'
+import type {AssetItem, AssetType, ImageAsset, Tag} from '../../types'
+
+const sampleAsset = {
+  _id: 'a1',
+  _type: 'sanity.imageAsset',
+  _createdAt: '',
+  _updatedAt: '',
+  _rev: 'r1',
+  originalFilename: 'x.png',
+  size: 1,
+  mimeType: 'image/png',
+  url: 'https://example.com/x.png'
+} as ImageAsset
+
+const sampleAsset2 = {
+  ...sampleAsset,
+  _id: 'a2'
+} as ImageAsset
+
+const sampleTag: Tag = {
+  _id: 't1',
+  _type: 'media.tag',
+  _createdAt: '',
+  _updatedAt: '',
+  _rev: 'tr',
+  name: {_type: 'slug', current: 'alpha'}
+}
+
+const assetItem = (asset: ImageAsset): AssetItem => ({
+  _type: 'asset',
+  asset,
+  picked: false,
+  updating: false
+})
+
+function assetsWithRows(rows: Record<string, AssetItem>) {
+  return {
+    ...assetsInitialState,
+    assetTypes: ['image'] as AssetType[],
+    allIds: Object.keys(rows),
+    byIds: rows
+  }
+}
+
+describe('notificationsAssetsDeleteCompleteEpic', () => {
+  it('adds info notification with pluralized asset count', async () => {
+    const store = createEpicTestStore(
+      notificationsAssetsDeleteCompleteEpic,
+      createMockSanityClient({}),
+      {}
+    )
+    store.dispatch(assetsActions.deleteComplete({assetIds: ['x', 'y']}))
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items).toEqual([
+        {asset: undefined, status: 'info', title: '2 assets deleted'}
+      ])
+    })
+  })
+})
+
+describe('notificationsAssetsDeleteErrorEpic', () => {
+  it('adds error notification with count', async () => {
+    const store = createEpicTestStore(
+      notificationsAssetsDeleteErrorEpic,
+      createMockSanityClient({}),
+      {
+        assets: assetsWithRows({
+          a1: {...assetItem(sampleAsset), updating: true}
+        })
+      }
+    )
+    store.dispatch(assetsActions.deleteError({assetIds: ['a1'], error: {} as any}))
+    await vi.waitFor(() => {
+      const [n] = store.getState().notifications.items
+      expect(n.status).toBe('error')
+      expect(n.title).toBe(
+        'Unable to delete 1 asset. Please review any asset errors and try again.'
+      )
+    })
+  })
+})
+
+describe('notificationsAssetsUploadCompleteEpic', () => {
+  it('adds info notification from upload check results count', async () => {
+    const store = createEpicTestStore(
+      notificationsAssetsUploadCompleteEpic,
+      createMockSanityClient({}),
+      {}
+    )
+    store.dispatch(
+      uploadsActions.checkComplete({
+        results: {h1: 'id1', h2: null}
+      })
+    )
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items).toEqual([
+        {asset: undefined, status: 'info', title: 'Uploaded 2 assets'}
+      ])
+    })
+  })
+})
+
+const tagsWithTagUpdating = {
+  allIds: ['t1'],
+  byIds: {
+    t1: {_type: 'tag' as const, tag: sampleTag, picked: false, updating: true}
+  },
+  creating: false,
+  fetchCount: -1,
+  fetching: false,
+  panelVisible: true
+}
+
+describe('notificationsAssetsTagsAddCompleteEpic', () => {
+  it('adds info notification with asset count', async () => {
+    const store = createEpicTestStore(
+      notificationsAssetsTagsAddCompleteEpic,
+      createMockSanityClient({}),
+      {
+        assets: assetsWithRows({
+          a1: {...assetItem(sampleAsset), updating: true},
+          a2: {...assetItem(sampleAsset2), updating: true}
+        }),
+        tags: tagsWithTagUpdating
+      }
+    )
+    store.dispatch(
+      ASSETS_ACTIONS.tagsAddComplete({
+        assets: [assetItem(sampleAsset), assetItem(sampleAsset2)],
+        tag: sampleTag
+      })
+    )
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items).toEqual([
+        {asset: undefined, status: 'info', title: 'Tag added to 2 assets'}
+      ])
+    })
+  })
+})
+
+describe('notificationsAssetsTagsRemoveCompleteEpic', () => {
+  it('adds info notification with asset count', async () => {
+    const store = createEpicTestStore(
+      notificationsAssetsTagsRemoveCompleteEpic,
+      createMockSanityClient({}),
+      {
+        assets: assetsWithRows({
+          a1: {...assetItem(sampleAsset), updating: true}
+        }),
+        tags: tagsWithTagUpdating
+      }
+    )
+    store.dispatch(
+      ASSETS_ACTIONS.tagsRemoveComplete({
+        assets: [assetItem(sampleAsset)],
+        tag: sampleTag
+      })
+    )
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items).toEqual([
+        {asset: undefined, status: 'info', title: 'Tag removed from 1 asset'}
+      ])
+    })
+  })
+})
+
+describe('notificationsAssetsUpdateCompleteEpic', () => {
+  it('batches multiple updateComplete actions into one notification after buffer window', async () => {
+    vi.useFakeTimers()
+    const store = createEpicTestStore(
+      notificationsAssetsUpdateCompleteEpic,
+      createMockSanityClient({}),
+      {
+        assets: assetsWithRows({
+          a1: {...assetItem(sampleAsset), updating: true},
+          a2: {...assetItem(sampleAsset2), updating: true}
+        })
+      }
+    )
+
+    store.dispatch(assetsActions.updateComplete({asset: sampleAsset}))
+    store.dispatch(assetsActions.updateComplete({asset: sampleAsset2}))
+    await vi.advanceTimersByTimeAsync(2000)
+
+    expect(store.getState().notifications.items).toEqual([
+      {asset: undefined, status: 'info', title: '2 assets updated'}
+    ])
+    vi.useRealTimers()
+  })
+
+  it('emits separate notifications when updates fall in different buffer windows', async () => {
+    vi.useFakeTimers()
+    const store = createEpicTestStore(
+      notificationsAssetsUpdateCompleteEpic,
+      createMockSanityClient({}),
+      {
+        assets: assetsWithRows({
+          a1: {...assetItem(sampleAsset), updating: true},
+          a2: {...assetItem(sampleAsset2), updating: true}
+        })
+      }
+    )
+
+    store.dispatch(assetsActions.updateComplete({asset: sampleAsset}))
+    await vi.advanceTimersByTimeAsync(2000)
+    store.dispatch(assetsActions.updateComplete({asset: sampleAsset2}))
+    await vi.advanceTimersByTimeAsync(2000)
+
+    expect(store.getState().notifications.items).toEqual([
+      {asset: undefined, status: 'info', title: '1 asset updated'},
+      {asset: undefined, status: 'info', title: '1 asset updated'}
+    ])
+    vi.useRealTimers()
+  })
+})
+
+describe('notificationsGenericErrorEpic', () => {
+  it('maps assets.updateError to error notification title', async () => {
+    const store = createEpicTestStore(notificationsGenericErrorEpic, createMockSanityClient({}), {
+      assets: assetsWithRows({
+        a1: {...assetItem(sampleAsset), updating: true}
+      })
+    })
+    store.dispatch(
+      assetsActions.updateError({
+        asset: sampleAsset,
+        error: {message: 'patch failed', statusCode: 500}
+      })
+    )
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items).toEqual([
+        {asset: undefined, status: 'error', title: 'An error occurred: patch failed'}
+      ])
+    })
+  })
+
+  it('maps assets.fetchError (bare HttpError payload) to error notification title', async () => {
+    const store = createEpicTestStore(notificationsGenericErrorEpic, createMockSanityClient({}), {
+      assets: {
+        ...assetsInitialState,
+        assetTypes: ['image'] as AssetType[],
+        fetching: true
+      }
+    })
+    store.dispatch(
+      assetsActions.fetchError({
+        message: 'fetch failed',
+        statusCode: 503
+      })
+    )
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items[0].title).toBe('An error occurred: fetch failed')
+    })
+  })
+
+  it('maps tags.createError to error notification title', async () => {
+    const store = createEpicTestStore(notificationsGenericErrorEpic, createMockSanityClient({}), {
+      tags: {
+        creating: true,
+        creatingError: undefined,
+        allIds: [],
+        byIds: {},
+        fetchCount: -1,
+        fetching: false,
+        panelVisible: true
+      } as any
+    })
+    store.dispatch(
+      tagsActions.createError({
+        name: 'n',
+        error: {message: 'tag create', statusCode: 400}
+      })
+    )
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items[0].title).toBe('An error occurred: tag create')
+    })
+  })
+
+  it('maps uploads.uploadError to error notification title', async () => {
+    const store = createEpicTestStore(notificationsGenericErrorEpic, createMockSanityClient({}), {
+      uploads: {allIds: ['h'], byIds: {h: {} as any}}
+    })
+    store.dispatch(
+      uploadsActions.uploadError({
+        hash: 'h',
+        error: {message: 'upload bad', statusCode: 413}
+      })
+    )
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items[0].title).toBe('An error occurred: upload bad')
+    })
+  })
+})
+
+describe('notificationsTagCreateCompleteEpic', () => {
+  it('adds tag created notification', async () => {
+    const store = createEpicTestStore(
+      notificationsTagCreateCompleteEpic,
+      createMockSanityClient({}),
+      {}
+    )
+    store.dispatch(tagsActions.createComplete({tag: sampleTag}))
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items).toEqual([
+        {asset: undefined, status: 'info', title: 'Tag created'}
+      ])
+    })
+  })
+})
+
+describe('notificationsTagDeleteCompleteEpic', () => {
+  it('adds tag deleted notification', async () => {
+    const store = createEpicTestStore(
+      notificationsTagDeleteCompleteEpic,
+      createMockSanityClient({}),
+      {}
+    )
+    store.dispatch(tagsActions.deleteComplete({tagId: 't1'}))
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items).toEqual([
+        {asset: undefined, status: 'info', title: 'Tag deleted'}
+      ])
+    })
+  })
+})
+
+describe('notificationsTagUpdateCompleteEpic', () => {
+  it('adds tag updated notification', async () => {
+    const store = createEpicTestStore(
+      notificationsTagUpdateCompleteEpic,
+      createMockSanityClient({}),
+      {
+        tags: {
+          allIds: ['t1'],
+          byIds: {
+            t1: {_type: 'tag', tag: sampleTag, picked: false, updating: true}
+          },
+          creating: false,
+          fetchCount: -1,
+          fetching: false,
+          panelVisible: true
+        }
+      }
+    )
+    store.dispatch(tagsActions.updateComplete({tag: sampleTag}))
+    await vi.waitFor(() => {
+      expect(store.getState().notifications.items).toEqual([
+        {asset: undefined, status: 'info', title: 'Tag updated'}
+      ])
+    })
+  })
+})

package/src/modules/notifications/index.ts

@@ -1,5 +1,6 @@
 import {type PayloadAction, createSlice} from '@reduxjs/toolkit'
-import type {ImageAsset, MyEpic} from '../../types'
+import type {AnyAction} from 'redux'
+import type {HttpError, ImageAsset, MyEpic} from '../../types'
 import pluralize from 'pluralize'
 import {ofType} from 'redux-observable'
 import {of} from 'rxjs'
@@ -19,6 +20,25 @@ type NotificationsReducerState = {
   items: Notification[]
 }
 
+function messageFromGenericErrorPayload(payload: unknown): string {
+  if (!payload || typeof payload !== 'object') {
+    return 'Unknown error'
+  }
+  if (
+    'error' in payload &&
+    payload.error &&
+    typeof payload.error === 'object' &&
+    payload.error !== null &&
+    'message' in payload.error
+  ) {
+    return String((payload.error as HttpError).message)
+  }
+  if ('message' in payload && typeof (payload as HttpError).message === 'string') {
+    return String((payload as HttpError).message)
+  }
+  return 'Unknown error'
+}
+
 const initialState = {
   items: []
 } as NotificationsReducerState
@@ -144,12 +164,12 @@ export const notificationsGenericErrorEpic: MyEpic = action$ =>
       tagsActions.updateError.type,
       uploadsActions.uploadError.type
     ),
-    mergeMap((action: {payload: {error: {message: string}}}) => {
-      const error = action.payload?.error
+    mergeMap((action: AnyAction) => {
+      const title = `An error occurred: ${messageFromGenericErrorPayload(action.payload)}`
       return of(
         notificationsSlice.actions.add({
           status: 'error',
-          title: `An error occured: ${error.message}`
+          title
         })
       )
     })

package/src/modules/notifications/reducer.test.ts

@@ -0,0 +1,53 @@
+// @vitest-environment node
+
+import {describe, expect, it} from 'vitest'
+import notificationsReducer, {notificationsActions} from './index'
+import type {ImageAsset} from '../../types'
+import {createTestRootState} from '../../__tests__/fixtures/rootState'
+
+const sampleAsset = {
+  _id: 'a1',
+  _type: 'sanity.imageAsset',
+  _createdAt: '',
+  _updatedAt: '',
+  _rev: 'r1',
+  originalFilename: 'x.png',
+  size: 1,
+  mimeType: 'image/png',
+  url: 'https://example.com/x.png'
+} as ImageAsset
+
+describe('notificationsReducer', () => {
+  it('starts with no items', () => {
+    const state = notificationsReducer(undefined, {type: '@@init'})
+    expect(state.items).toEqual([])
+  })
+
+  it('add appends a notification with asset, status, and title', () => {
+    const prev = createTestRootState().notifications
+    const next = notificationsReducer(
+      prev,
+      notificationsActions.add({
+        asset: sampleAsset,
+        status: 'success',
+        title: 'Done'
+      })
+    )
+    expect(next.items).toHaveLength(1)
+    expect(next.items[0]).toEqual({
+      asset: sampleAsset,
+      status: 'success',
+      title: 'Done'
+    })
+  })
+
+  it('add allows partial payloads', () => {
+    let state = createTestRootState().notifications
+    state = notificationsReducer(state, notificationsActions.add({status: 'error', title: 'X'}))
+    state = notificationsReducer(state, notificationsActions.add({title: 'Y'}))
+    expect(state.items).toEqual([
+      {asset: undefined, status: 'error', title: 'X'},
+      {asset: undefined, status: undefined, title: 'Y'}
+    ])
+  })
+})

package/src/modules/search/index.test.ts

@@ -0,0 +1,35 @@
+// @vitest-environment node
+
+import {describe, expect, it} from 'vitest'
+import searchReducer, {searchActions} from './index'
+import {inputs} from '../../config/searchFacets'
+
+describe('search slice', () => {
+  it('facetsAdd assigns an id and appends facet', () => {
+    let state = searchReducer(undefined, {type: '@@INIT'} as never)
+    state = searchReducer(state, searchActions.facetsAdd({facet: {...inputs.title}}))
+    expect(state.facets).toHaveLength(1)
+    expect(state.facets[0].name).toBe('title')
+    expect(state.facets[0].id).toBeDefined()
+  })
+
+  it('querySet updates search string', () => {
+    let state = searchReducer(undefined, {type: '@@INIT'} as never)
+    state = searchReducer(state, searchActions.querySet({searchQuery: 'cats'}))
+    expect(state.query).toBe('cats')
+  })
+
+  it('facetsClear removes all facets', () => {
+    let state = searchReducer(undefined, {type: '@@INIT'} as never)
+    state = searchReducer(state, searchActions.facetsAdd({facet: {...inputs.title}}))
+    state = searchReducer(state, searchActions.facetsClear())
+    expect(state.facets).toHaveLength(0)
+  })
+
+  it('facetsRemoveByName filters facets', () => {
+    let state = searchReducer(undefined, {type: '@@INIT'} as never)
+    state = searchReducer(state, searchActions.facetsAdd({facet: {...inputs.title}}))
+    state = searchReducer(state, searchActions.facetsRemoveByName({facetName: 'title'}))
+    expect(state.facets).toHaveLength(0)
+  })
+})

package/src/modules/selectors.test.ts

@@ -0,0 +1,20 @@
+// @vitest-environment node
+
+import {describe, expect, it} from 'vitest'
+import type {RootReducerState} from './types'
+import {selectCombinedItems} from './selectors'
+
+describe('selectCombinedItems', () => {
+  it('places upload items before asset items', () => {
+    const state = {
+      assets: {allIds: ['a1', 'a2']},
+      uploads: {allIds: ['u1']}
+    } as RootReducerState
+
+    expect(selectCombinedItems(state)).toEqual([
+      {id: 'u1', type: 'upload'},
+      {id: 'a1', type: 'asset'},
+      {id: 'a2', type: 'asset'}
+    ])
+  })
+})

package/src/modules/tags/epics.test.ts

@@ -0,0 +1,95 @@
+// @vitest-environment node
+
+import {describe, expect, it, vi} from 'vitest'
+import {of} from 'rxjs'
+import {tagsCreateEpic, tagsDeleteEpic, tagsActions} from './index'
+import {createEpicTestStore} from '../../__tests__/fixtures/createEpicTestStore'
+import {
+  createMockSanityClient,
+  mockTransactionCommit
+} from '../../__tests__/fixtures/mockSanityClient'
+import type {Tag} from '../../types'
+
+const sampleTag: Tag = {
+  _id: 't1',
+  _type: 'media.tag',
+  _createdAt: '',
+  _updatedAt: '',
+  _rev: 'tr',
+  name: {_type: 'slug', current: 'alpha'}
+}
+
+describe('tagsCreateEpic', () => {
+  it('creates tag when checkTagName passes', async () => {
+    const client = createMockSanityClient({
+      fetch: vi.fn().mockResolvedValue(0),
+      observable: {
+        create: vi.fn(() => of(sampleTag))
+      }
+    })
+
+    const store = createEpicTestStore(tagsCreateEpic, client)
+    store.dispatch(tagsActions.createRequest({name: 'alpha'}))
+
+    await vi.waitFor(() => {
+      expect(store.getState().tags.byIds.t1?.tag).toEqual(sampleTag)
+      expect(client.observable.create).toHaveBeenCalled()
+    })
+  })
+
+  it('dispatches createError when tag exists', async () => {
+    const client = createMockSanityClient({
+      fetch: vi.fn().mockResolvedValue(1),
+      observable: {
+        create: vi.fn(() => of(sampleTag))
+      }
+    })
+
+    const store = createEpicTestStore(tagsCreateEpic, client)
+    store.dispatch(tagsActions.createRequest({name: 'dup'}))
+
+    await vi.waitFor(() => {
+      expect(store.getState().tags.creatingError?.statusCode).toBe(409)
+      expect(client.observable.create).not.toHaveBeenCalled()
+    })
+  })
+})
+
+describe('tagsDeleteEpic', () => {
+  it('fetches referencing assets and commits transaction', async () => {
+    const tx = mockTransactionCommit(undefined)
+    const client = createMockSanityClient({
+      observable: {
+        fetch: vi.fn(() =>
+          of([
+            {_id: 'a1', _rev: 'r1', opt: {}},
+            {_id: 'a2', _rev: 'r2', opt: {}}
+          ])
+        )
+      },
+      transaction: vi.fn(() => tx)
+    })
+
+    const store = createEpicTestStore(tagsDeleteEpic, client, {
+      tags: {
+        allIds: ['t1'],
+        byIds: {
+          t1: {_type: 'tag', tag: sampleTag, picked: false, updating: false}
+        },
+        creating: false,
+        fetchCount: -1,
+        fetching: false,
+        panelVisible: true
+      }
+    })
+
+    store.dispatch(tagsActions.deleteRequest({tag: sampleTag}))
+
+    await vi.waitFor(() => {
+      expect(tx.patch).toHaveBeenCalled()
+      expect(tx.delete).toHaveBeenCalledWith('t1')
+      expect(tx.commit).toHaveBeenCalled()
+      expect(store.getState().tags.byIds.t1).toBeUndefined()
+    })
+  })
+})

package/src/modules/tags/index.test.ts

@@ -0,0 +1,41 @@
+// @vitest-environment node
+
+import {describe, expect, it} from 'vitest'
+import type {Tag} from '../../types'
+import tagsReducer, {tagsActions} from './index'
+
+const sampleTag: Tag = {
+  _id: 'tag-1',
+  _type: 'media.tag',
+  _createdAt: '2020-01-01',
+  _updatedAt: '2020-01-01',
+  _rev: 'r1',
+  name: {_type: 'slug', current: 'alpha'}
+}
+
+describe('tags slice', () => {
+  it('createComplete adds tag', () => {
+    let state = tagsReducer(undefined, {type: '@@INIT'} as never)
+    state = tagsReducer(state, tagsActions.createComplete({tag: sampleTag}))
+    expect(state.allIds).toContain('tag-1')
+    expect(state.byIds['tag-1'].tag).toEqual(sampleTag)
+    expect(state.creating).toBe(false)
+  })
+
+  it('deleteComplete removes tag', () => {
+    let state = tagsReducer(undefined, {type: '@@INIT'} as never)
+    state = tagsReducer(state, tagsActions.createComplete({tag: sampleTag}))
+    state = tagsReducer(state, tagsActions.deleteComplete({tagId: 'tag-1'}))
+    expect(state.allIds).not.toContain('tag-1')
+    expect(state.byIds['tag-1']).toBeUndefined()
+  })
+
+  it('fetchComplete hydrates tag list', () => {
+    let state = tagsReducer(undefined, {type: '@@INIT'} as never)
+    state = tagsReducer(state, tagsActions.fetchRequest())
+    expect(state.fetching).toBe(true)
+    state = tagsReducer(state, tagsActions.fetchComplete({tags: [sampleTag]}))
+    expect(state.fetching).toBe(false)
+    expect(state.byIds['tag-1'].tag).toEqual(sampleTag)
+  })
+})