@cdc/dashboard 4.24.7 → 4.24.9-1

package/src/helpers/tests/addValuesToDashboardFilters.test.ts

@@ -0,0 +1,44 @@
+import { SharedFilter } from '../../types/SharedFilter'
+import { addValuesToDashboardFilters } from '../addValuesToDashboardFilters'
+
+describe('addValuesToDashboardFilters', () => {
+  const colA = { columnName: 'colA', id: 11, active: 'apple', values: [], type: 'datafilter' } as SharedFilter
+  const colB = { columnName: 'colB', id: 22, active: '1', values: [], type: 'datafilter' } as SharedFilter
+  const colC = { columnName: 'colC', id: 33, values: [], setByQueryParameter: 'colC', type: 'datafilter' } as SharedFilter
+
+  const data = {
+    key: [
+      { colA: 'apple', colB: 3, colC: 'abc' },
+      { colA: 'apple', colB: 1, colC: 'bcd' },
+      { colA: 'pear', colB: 4, colC: 'test' }
+    ]
+  }
+  const filters = [colA, colC, colB]
+  it('adds filter values', () => {
+    const newFilters = addValuesToDashboardFilters(filters, data)
+    expect(newFilters[0].values).toEqual(['apple', 'pear'])
+  })
+  it('converts to multiselect', () => {
+    colA.multiSelect = true
+    const newFilters = addValuesToDashboardFilters(filters, data)
+    expect(newFilters[0].active).toEqual(['apple'])
+  })
+
+  it('sets active value by query string', () => {
+    delete window.location
+    window.location = new URL('https://www.example.com?colC=test')
+    const newFilters = addValuesToDashboardFilters(filters, data)
+    expect(newFilters[1].active).toEqual('test')
+  })
+  const colA2 = { apiFilter: { valueSelector: 'colA' }, id: 11, active: 'apple', values: [], type: 'urlfilter' } as SharedFilter
+  const colB2 = { apiFilter: { valueSelector: 'colB' }, id: 22, active: '1', values: [], type: 'urlfilter' } as SharedFilter
+  const colC2 = { apiFilter: { valueSelector: 'colC' }, id: 33, values: [], setByQueryParameter: 'colC', type: 'urlfilter' } as SharedFilter
+  const filters2 = [colA2, colC2, colB2]
+  it('skips urlfilters', () => {
+    // urlfilter reloading happens in the dashboard in the loadAPIFilters function
+    delete window.location
+    window.location = new URL('https://www.example.com?colC=test')
+    const newFilters = addValuesToDashboardFilters(filters2, data)
+    expect(newFilters[1].active).toEqual(undefined)
+  })
+})

package/src/helpers/tests/apiFilterHelpers.test.ts

@@ -0,0 +1,155 @@
+import { setAutoLoadDefaultValue, getToFetch, getFilterValues, getLoadingFilterMemo } from '../apiFilterHelpers'
+import _ from 'lodash'
+import type { APIFilterDropdowns } from '../../components/DashboardFilters'
+
+describe('getLoadingFilterMemo', () => {
+  it('should return correct APIFilterDropdowns for valid inputs', () => {
+    const sharedAPIFilters = ['endpoint1', 'endpoint2']
+    const apiFilterDropdowns: APIFilterDropdowns = {
+      endpoint1: { text: 'text1', value: 'value1' }
+    }
+    const expectedOutput: APIFilterDropdowns = {
+      endpoint1: { text: 'text1', value: 'value1' },
+      endpoint2: null
+    }
+    expect(getLoadingFilterMemo(sharedAPIFilters, apiFilterDropdowns)).toEqual(expectedOutput)
+  })
+
+  it('should return an empty object for empty sharedAPIFilters', () => {
+    const sharedAPIFilters: string[] = []
+    const apiFilterDropdowns: APIFilterDropdowns = {
+      endpoint1: { text: 'text1', value: 'value1' }
+    }
+    const expectedOutput: APIFilterDropdowns = {}
+    expect(getLoadingFilterMemo(sharedAPIFilters, apiFilterDropdowns)).toEqual(expectedOutput)
+  })
+
+  it('should return APIFilterDropdowns with null values for empty apiFilterDropdowns', () => {
+    const sharedAPIFilters = ['endpoint1', 'endpoint2']
+    const apiFilterDropdowns: APIFilterDropdowns = {}
+    const expectedOutput: APIFilterDropdowns = {
+      endpoint1: null,
+      endpoint2: null
+    }
+    expect(getLoadingFilterMemo(sharedAPIFilters, apiFilterDropdowns)).toEqual(expectedOutput)
+  })
+
+  it('should not overwrite existing data in apiFilterDropdowns, so return original dropdowns', () => {
+    const sharedAPIFilters = ['endpoint1', 'endpoint2']
+    const apiFilterDropdowns: APIFilterDropdowns = {
+      endpoint1: { text: 'text1', value: 'value1' },
+      endpoint2: { text: 'text2', value: 'value2' }
+    }
+    expect(getLoadingFilterMemo(sharedAPIFilters, apiFilterDropdowns)).toEqual(apiFilterDropdowns)
+  })
+})
+
+describe('getFilterValues', () => {
+  it('should return correct filter values for valid inputs', () => {
+    const data = [{ key1: 'value1', key2: 'value2' }]
+    const apiFilter = { textSelector: 'key1', valueSelector: 'key2' }
+    const expectedOutput = [{ text: 'value1', value: 'value2' }]
+    expect(getFilterValues(data, apiFilter)).toEqual(expectedOutput)
+    delete apiFilter.textSelector
+    const expectedOutput2 = [{ text: 'value2', value: 'value2' }]
+    expect(getFilterValues(data, apiFilter)).toEqual(expectedOutput2)
+  })
+})
+
+describe('getToFetch', () => {
+  it('should return an empty object when sharedAPIFilters is empty', () => {
+    const result = getToFetch([], {})
+    expect(result).toEqual({})
+  })
+
+  it('should return an object with endpoints when apiFilterDropdowns is empty', () => {
+    const sharedAPIFilters = [{ apiFilter: { apiEndpoint: '/endpoint1' }, parents: [] }]
+    const result = getToFetch(sharedAPIFilters, {})
+    expect(result).toEqual({ '/endpoint1': ['/endpoint1', 0] })
+  })
+
+  it('should return and empty object when sharedAPIFilters contains filters with no parents', () => {
+    const sharedAPIFilters = [{ apiFilter: { apiEndpoint: '/endpoint1' }, parents: [] }]
+    const apiFilterDropdowns = { '/endpoint1': true }
+    const result = getToFetch(sharedAPIFilters, apiFilterDropdowns)
+    expect(result).toEqual({})
+  })
+
+  it('should return an empty object when parentParams contains an empty value', () => {
+    const sharedAPIFilters = [
+      { key: 'parent1', apiFilter: { apiEndpoint: '/endpoint1' }, parents: [] },
+      { apiFilter: { apiEndpoint: '/endpoint1' }, parents: ['parent1'] }
+    ]
+    const apiFilterDropdowns = { '/endpoint1': true }
+    const result = getToFetch(sharedAPIFilters, apiFilterDropdowns)
+    expect(result).toEqual({})
+  })
+
+  it('should return an empty object when parentParams contains an empty value', () => {
+    const sharedAPIFilters = [
+      { key: 'parent1', value: '', apiFilter: { apiEndpoint: '/endpoint1' }, parents: [] },
+      { apiFilter: { apiEndpoint: '/endpoint1' }, parents: ['parent1'] }
+    ]
+    const apiFilterDropdowns = { '/endpoint1': true }
+    const result = getToFetch(sharedAPIFilters, apiFilterDropdowns)
+    expect(result).toEqual({})
+  })
+})
+
+describe('setAutoLoadDefaultValue', () => {
+  const dropdownOptions = [
+    { value: 'option1', label: 'Option 1' },
+    { value: 'option2', label: 'Option 2' }
+  ]
+
+  const sharedFilters = [
+    { key: 'filter1', active: null, queuedActive: null, parents: [] },
+    { key: 'filter2', active: null, queuedActive: null, parents: ['filter1'] }
+  ]
+
+  it('should return the original filter when autoLoadFilterIndexes is empty', () => {
+    const result = setAutoLoadDefaultValue(0, dropdownOptions, sharedFilters, [])
+    expect(result).toEqual(sharedFilters[0])
+  })
+
+  it('should return the original filter when dropdownOptions is empty', () => {
+    const result = setAutoLoadDefaultValue(0, [], sharedFilters, [0])
+    expect(result).toEqual(sharedFilters[0])
+  })
+
+  it('should return the original filter when dropdownOptions is undefined', () => {
+    const result = setAutoLoadDefaultValue(0, undefined, sharedFilters, [0])
+    expect(result).toEqual(sharedFilters[0])
+  })
+
+  it('should return the original filter when sharedFilterIndex is not in autoLoadFilterIndexes', () => {
+    const result = setAutoLoadDefaultValue(0, dropdownOptions, sharedFilters, [1])
+    expect(result).toEqual(sharedFilters[0])
+  })
+
+  it('should return the original filter when not all parent filters are selected', () => {
+    const result = setAutoLoadDefaultValue(1, dropdownOptions, sharedFilters, [1])
+    expect(result).toEqual(sharedFilters[1])
+  })
+
+  it('should assign the default value from dropdownOptions when no active value is set', () => {
+    const sharedFiltersCopy = _.cloneDeep(sharedFilters)
+    sharedFiltersCopy[0].active = null
+    const result = setAutoLoadDefaultValue(0, dropdownOptions, sharedFiltersCopy, [0])
+    expect(result.active).toEqual('option1')
+  })
+
+  it('should retain the current active value if it exists in dropdownOptions', () => {
+    const sharedFiltersCopy = _.cloneDeep(sharedFilters)
+    sharedFiltersCopy[0].active = 'option1'
+    const result = setAutoLoadDefaultValue(0, dropdownOptions, sharedFiltersCopy, [0])
+    expect(result.active).toEqual('option1')
+  })
+
+  it('should assign the default value if the current active value does not exist in dropdownOptions', () => {
+    const sharedFiltersCopy = _.cloneDeep(sharedFilters)
+    sharedFiltersCopy[0].active = 'nonexistent'
+    const result = setAutoLoadDefaultValue(0, dropdownOptions, sharedFiltersCopy, [0])
+    expect(result.active).toEqual('option1')
+  })
+})

package/src/helpers/tests/getFilteredData.test.ts

@@ -0,0 +1,86 @@
+import _ from 'lodash'
+import { SharedFilter } from '../../types/SharedFilter'
+import { getFilteredData } from '../getFilteredData'
+
+describe('getFilteredData', () => {
+  const sharedFilterDefaults = { values: [], showDropdown: true, id: 123, parents: [], key: 'key' }
+  const data = {
+    data1: [
+      { id: 1, name: 'Alice', age: 25 },
+      { id: 2, name: 'Bob', age: 30 },
+      { id: 3, name: 'Charlie', age: 35 }
+    ]
+  }
+  const state = {
+    data,
+    config: {
+      dashboard: {
+        sharedFilters: []
+      },
+      visualizations: {
+        vizA: { dataKey: 'data1' }
+      },
+      rows: [{ dataKey: 'data1' }]
+    }
+  }
+
+  it('should apply data to rows when there are no applicable filters', () => {
+    expect(getFilteredData(state)).toEqual({ '0': data.data1 })
+  })
+
+  it('should filter visualizations', () => {
+    const sharedFilters: SharedFilter[] = [
+      {
+        usedBy: ['vizA'],
+        active: 'Alice',
+        columnName: 'name',
+        ...sharedFilterDefaults
+      }
+    ]
+    const config = { ...state.config, dashboard: { sharedFilters } }
+    expect(getFilteredData({ ...state, config })).toEqual({ '0': data.data1, vizA: [data.data1[0]] })
+  })
+
+  it('should filter visualizations and rows', () => {
+    const sharedFilters: SharedFilter[] = [
+      {
+        usedBy: ['vizA', '0'],
+        active: 'Alice',
+        columnName: 'name',
+        ...sharedFilterDefaults
+      }
+    ]
+    const config = { ...state.config, dashboard: { sharedFilters } }
+    expect(getFilteredData({ ...state, config })).toEqual({ '0': [data.data1[0]], vizA: [data.data1[0]] })
+  })
+
+  it('should use initialFilteredData', () => {
+    const initialFilteredData = { newData: [data.data1[1]] }
+    const sharedFilters: SharedFilter[] = [
+      {
+        usedBy: ['vizA', '0'],
+        active: 'Alice',
+        columnName: 'name',
+        ...sharedFilterDefaults
+      }
+    ]
+    const config = { ...state.config, dashboard: { sharedFilters } }
+    expect(getFilteredData({ ...state, config }, initialFilteredData)).toEqual({ newData: [data.data1[1]], '0': [data.data1[0]], vizA: [data.data1[0]] })
+  })
+
+  it('should filter visualizations and rows', () => {
+    const sharedFilters: SharedFilter[] = [
+      {
+        usedBy: ['vizA', '0'],
+        active: 'Alice',
+        columnName: 'name',
+        ...sharedFilterDefaults
+      }
+    ]
+    const dataOverride = _.cloneDeep(data)
+    dataOverride.data1[0] = { id: 1, name: 'Alice', age: 30 }
+    const config = { ...state.config, dashboard: { sharedFilters } }
+    const filteredData = getFilteredData({ ...state, config }, undefined, dataOverride)
+    expect(filteredData.vizA[0].age).toEqual(30)
+  })
+})

package/src/helpers/tests/loadAPIFiltersWrapper.test.ts

@@ -0,0 +1,220 @@
+import { vi } from 'vitest'
+import { loadAPIFiltersFactory } from '../loadAPIFilters'
+import { faker } from '@faker-js/faker'
+import _ from 'lodash'
+import { SharedFilter } from '../../types/SharedFilter'
+
+faker.seed(123)
+
+const endpointMockData = {
+  'cdc.gov/filters/Sex': [
+    { Sex: 'male', Abbreviation: 'M' },
+    { Sex: 'female', Abbreviation: 'F' }
+  ],
+  'cdc.gov/filters/Quarter': [{ Quarter: 'Q1' }, { Quarter: 'Q2' }, { Quarter: 'Q3' }, { Quarter: 'Q4' }],
+  'cdc.gov/filters/YearQuarter': [
+    { Year: 2020, YearQuarter: '2020Q1' },
+    { Year: 2021, YearQuarter: '2021Q1' }
+  ]
+}
+
+const sharedFilters = [
+  {
+    key: 'Sex',
+    active: 'F',
+    showDropdown: true,
+    type: 'urlfilter',
+    apiFilter: {
+      apiEndpoint: 'cdc.gov/filters/Sex',
+      valueSelector: 'Abbreviation',
+      textSelector: 'Sex'
+    }
+  },
+  {
+    key: 'Quarter',
+    showDropdown: true,
+    type: 'urlfilter',
+    apiFilter: {
+      apiEndpoint: 'cdc.gov/filters/Quarter',
+      valueSelector: 'Quarter',
+      textSelector: ''
+    },
+    parents: ['Sex']
+  },
+  {
+    key: 'YearQuarter',
+    showDropdown: true,
+    type: 'urlfilter',
+    apiFilter: {
+      apiEndpoint: 'cdc.gov/filters/YearQuarter',
+      valueSelector: 'Year',
+      textSelector: 'YearQuarter'
+    },
+    parents: ['Sex', 'Quarter'],
+    filterStyle: 'multi-select'
+  }
+] as SharedFilter[]
+
+const fetch = vi.fn(endpoint => {
+  const baseEndpoint = endpoint.split('?')[0]
+  return Promise.resolve({
+    json: () => Promise.resolve(endpointMockData[baseEndpoint])
+  })
+})
+
+global.fetch = fetch
+
+describe('loadAPIFiltersFactory', () => {
+  const dispatch = vi.fn()
+  const setAPIFilterDropdowns = vi.fn()
+  const apiFilterDropdowns = {
+    'cdc.gov/filters/Sex': [
+      { text: 'male', value: 'M' },
+      { text: 'female', value: 'F' }
+    ]
+  }
+  afterEach(() => {
+    vi.restoreAllMocks()
+  })
+  const loadAPIFilters = loadAPIFiltersFactory(dispatch, setAPIFilterDropdowns, [2])
+  it('creates a function', () => {
+    expect(typeof loadAPIFilters).toEqual('function')
+  })
+
+  it('loadAPIFilters() should return a promise', async () => {
+    const result = loadAPIFilters([], apiFilterDropdowns)
+    expect(result).toBeInstanceOf(Promise)
+    await result
+  })
+
+  it('loadAPIFilters() load dropdowns for children when parent is selected', async () => {
+    const newSharedFilters = await loadAPIFilters(sharedFilters, apiFilterDropdowns)
+    expect(dispatch).toHaveBeenCalledTimes(1)
+    expect(setAPIFilterDropdowns).toHaveBeenCalledTimes(1)
+
+    const expectedDropdowns = {
+      'cdc.gov/filters/Quarter': [
+        {
+          text: 'Q1',
+          value: 'Q1'
+        },
+        {
+          text: 'Q2',
+          value: 'Q2'
+        },
+        {
+          text: 'Q3',
+          value: 'Q3'
+        },
+        {
+          text: 'Q4',
+          value: 'Q4'
+        }
+      ],
+      'cdc.gov/filters/Sex': [
+        {
+          text: 'male',
+          value: 'M'
+        },
+        {
+          text: 'female',
+          value: 'F'
+        }
+      ]
+    }
+
+    expect(setAPIFilterDropdowns).toHaveBeenCalledWith(expectedDropdowns)
+    expect(fetch).toHaveBeenCalledTimes(1)
+    expect(newSharedFilters).toEqual(sharedFilters)
+  })
+
+  it('loadAPIFilters() load dropdowns for children when parents are selected, and autoload any autoloading filters', async () => {
+    sharedFilters[1].active = 'Q1'
+    const newSharedFilters = await loadAPIFilters(sharedFilters, apiFilterDropdowns)
+    expect(dispatch).toHaveBeenCalledTimes(1)
+    expect(setAPIFilterDropdowns).toHaveBeenCalledTimes(1)
+
+    const expectedDropdowns = {
+      'cdc.gov/filters/Quarter': [
+        {
+          text: 'Q1',
+          value: 'Q1'
+        },
+        {
+          text: 'Q2',
+          value: 'Q2'
+        },
+        {
+          text: 'Q3',
+          value: 'Q3'
+        },
+        {
+          text: 'Q4',
+          value: 'Q4'
+        }
+      ],
+      'cdc.gov/filters/Sex': [
+        {
+          text: 'male',
+          value: 'M'
+        },
+        {
+          text: 'female',
+          value: 'F'
+        }
+      ],
+      'cdc.gov/filters/YearQuarter': [
+        { value: 2020, text: '2020Q1' },
+        { value: 2021, text: '2021Q1' }
+      ]
+    }
+
+    expect(setAPIFilterDropdowns).toHaveBeenCalledWith(expectedDropdowns)
+    expect(fetch).toHaveBeenCalledTimes(2)
+    expect(newSharedFilters[2].active).toEqual([2020])
+  })
+  it('returns new active values for multiselect', async () => {
+    const _sharedFilters = _.cloneDeep(sharedFilters)
+    _sharedFilters[1].active = 'Q1'
+    _sharedFilters[2].active = ['2020', '2021']
+    const apiDropdownsLoaded = {
+      'cdc.gov/filters/Quarter': [
+        {
+          text: 'Q1',
+          value: 'Q1'
+        },
+        {
+          text: 'Q2',
+          value: 'Q2'
+        },
+        {
+          text: 'Q3',
+          value: 'Q3'
+        },
+        {
+          text: 'Q4',
+          value: 'Q4'
+        }
+      ],
+      'cdc.gov/filters/Sex': [
+        {
+          text: 'male',
+          value: 'M'
+        },
+        {
+          text: 'female',
+          value: 'F'
+        }
+      ],
+      'cdc.gov/filters/YearQuarter': [
+        { value: '2020', text: '2020Q1' },
+        { value: '2021', text: '2021Q1' }
+      ]
+    }
+    const newSharedFilters = await loadAPIFilters(_sharedFilters, apiDropdownsLoaded)
+    expect(dispatch).toHaveBeenCalledTimes(1)
+    expect(setAPIFilterDropdowns).toHaveBeenCalledTimes(1)
+
+    expect(newSharedFilters[2].active).toEqual(['2020', '2021'])
+  })
+})