@cdc/map 4.25.8 → 4.25.10

package/src/helpers/applyColorToLegend.ts

@@ -1,7 +1,44 @@
-import colorPalettes from '@cdc/core/data/colorPalettes'
+import { mapColorPalettes as colorPalettes } from '@cdc/core/data/colorPalettes'
 import chroma from 'chroma-js'
-import { type MapConfig } from '@cdc/map/src/types/MapConfig'
-import { colorDistributions } from './colorDistributions'
+import { type MapConfig } from '../types/MapConfig'
+import { mapV1ColorDistribution } from '@cdc/core/helpers/palettes/colorDistributions'
+import { getColorPaletteVersion } from '@cdc/core/helpers/getColorPaletteVersion'
+
+// Palette name migrations from v1 to v2
+const mapPaletteNameMigrations = {
+  yelloworangered: 'sequential_yellow_orange_red',
+  yelloworangebrown: 'sequential_yellow_orange_brown',
+  pinkpurple: 'sequential_pink_purple',
+  pinkpurplereverse: 'sequential_pink_purplereverse',
+  bluegreen: 'sequential_blue_green',
+  bluegreenreverse: 'sequential_blue_greenreverse',
+  orangered: 'sequential_orange_red',
+  orangeredreverse: 'sequential_orange_redreverse',
+  red: 'sequential_red',
+  redreverse: 'sequential_redreverse',
+  greenblue: 'sequential_green_blue',
+  greenbluereverse: 'sequential_green_bluereverse',
+  yelloworangeredreverse: 'sequential_yellow_orange_redreverse',
+  yelloworangebrownreverse: 'sequential_yellow_orange_brownreverse',
+  yellowpurple: 'divergent_yellow_purple',
+  yellowpurplereverse: 'divergent_yellow_purplereverse',
+  qualitative1: 'qualitative1',
+  qualitative2: 'qualitative2',
+  qualitative3: 'qualitative3',
+  qualitative4: 'qualitative4',
+  qualitative9: 'qualitative9',
+  'sequential-blue-2(MPX)': 'sequential_blue_extended',
+  'sequential-blue-2(MPX)reverse': 'sequential_blue_extendedreverse',
+  'sequential-orange(MPX)': 'sequential_orange_extended',
+  'sequential-orange(MPX)reverse': 'sequential_orange_extendedreverse',
+  colorblindsafe: 'colorblindsafe',
+  qualitative1reverse: 'qualitative1reverse',
+  qualitative2reverse: 'qualitative2reverse',
+  qualitative3reverse: 'qualitative3reverse',
+  qualitative4reverse: 'qualitative4reverse',
+  qualitative9reverse: 'qualitative9reverse',
+  colorblindsafereverse: 'colorblindsafereverse'
+}
 
 type LegendItem = {
   special: boolean
@@ -17,39 +54,98 @@ type LegendItem = {
 export const applyColorToLegend = (legendIdx: number, config: MapConfig, result: LegendItem[] = []): string => {
   if (!config) throw new Error('Config is required')
 
-  const { legend, customColors, general, color } = config
-  const { geoType, palette } = general
-  const specialClasses = legend?.specialClasses ?? []
-  const mapColorPalette = customColors ?? colorPalettes[color] ?? colorPalettes['bluegreen']
+  const { legend, general } = config
+  const { geoType, palette = { name: 'bluegreen', isReversed: false } } = general
+  // Support both migrated (general.palette.name) and legacy (config.color) palette locations
+  const version = getColorPaletteVersion(config)
+  let color = general?.palette?.name || config.color || palette.name || 'bluegreen'
+
+  // Apply palette migration if needed (v1 name -> v2 name)
+  if (mapPaletteNameMigrations[color]) {
+    color = mapPaletteNameMigrations[color]
+  }
+
+  // Try multiple approaches to find the palette
+  let mapColorPalette = general?.palette?.customColors
+
+  if (!mapColorPalette) {
+    // Try the detected version first
+    mapColorPalette = colorPalettes?.[`v${version}`]?.[color]
+  }
+
+  if (!mapColorPalette) {
+    // Try v2 explicitly
+    mapColorPalette = colorPalettes?.v2?.[color]
+  }
+
+  if (!mapColorPalette) {
+    // Try v1 with original color name
+    const originalColor = general?.palette?.name || config.color || palette.name || 'bluegreen'
+    mapColorPalette = colorPalettes?.v1?.[originalColor]
+  }
+
+  if (!mapColorPalette) {
+    // Final fallback
+    mapColorPalette = colorPalettes.v1['bluegreen']
+  }
 
   // Handle Region Maps need for a 10th color
   if (geoType === 'us-region' && mapColorPalette.length < 10 && mapColorPalette.length > 8) {
-    const newColor = chroma(mapColorPalette[palette.isReversed ? 0 : 8])
+    const newColor = chroma(mapColorPalette[config.general.palette.isReversed ? 0 : 8])
       .darken(0.75)
       .hex()
-    palette.isReversed ? mapColorPalette.unshift(newColor) : mapColorPalette.push(newColor)
+    config.general.palette.isReversed ? mapColorPalette.unshift(newColor) : mapColorPalette.push(newColor)
   }
 
-  const colorIdx = legendIdx - specialClasses.length
+  // Count actual special classes in the result array
+  const actualSpecialClassCount = result.filter(item => item.special).length
+  const colorIdx = legendIdx - actualSpecialClassCount
 
   // Handle special classes coloring
   if (result[legendIdx]?.special) {
-    const specialClassColors = chroma.scale(['#D4D4D4', '#939393']).colors(specialClasses.length)
-    return specialClassColors[legendIdx]
+    const specialClassColors = chroma.scale(['#D4D4D4', '#939393']).colors(actualSpecialClassCount)
+    const specialClassIdx = result.slice(0, legendIdx + 1).filter(item => item.special).length - 1
+    return specialClassColors[specialClassIdx]
   }
 
   // Use qualitative color palettes directly
-  if (color.includes('qualitative')) return mapColorPalette[colorIdx]
+  if (color.includes('qualitative')) {
+    return mapColorPalette[colorIdx]
+  }
+
+  // Determine color distribution based on non-special items
+  // For numeric legends, use the configured numberOfItems for consistent color distribution
+  // For category legends, use the actual result length
+  const isNumericLegend = legend && ['equalnumber', 'equalinterval'].includes(legend.type)
+  const nonSpecialItemCount = isNumericLegend
+    ? (legend.numberOfItems || result.length)
+    : result.length - actualSpecialClassCount
 
-  // Determine color distribution
   const amt =
-    Math.max(result.length - specialClasses.length, 1) < 10
-      ? Math.max(result.length - specialClasses.length, 1)
-      : Object.keys(colorDistributions).length
-  const distributionArray = colorDistributions[amt] ?? []
+    Math.max(nonSpecialItemCount, 1) < 10
+      ? Math.max(nonSpecialItemCount, 1)
+      : Object.keys(mapV1ColorDistribution).length
+  const distributionArray = mapV1ColorDistribution[amt] ?? []
+
+  // Safety check to ensure mapColorPalette exists and is an array
+  if (!mapColorPalette || !Array.isArray(mapColorPalette) || mapColorPalette.length === 0) {
+    console.warn('No valid color palette found, returning gray fallback')
+    return '#d3d3d3'
+  }
 
   const specificColor =
-    distributionArray[legendIdx - specialClasses.length] ?? mapColorPalette[colorIdx] ?? mapColorPalette.at(-1)
+    distributionArray[colorIdx] ?? mapColorPalette[colorIdx] ?? mapColorPalette[mapColorPalette.length - 1]
+
+  if (typeof specificColor === 'number') {
+    return specificColor < mapColorPalette.length
+      ? mapColorPalette[specificColor]
+      : mapColorPalette[mapColorPalette.length - 1]
+  }
+
+  if (typeof specificColor === 'string') {
+    return specificColor
+  }
 
-  return mapColorPalette[specificColor]
+  // Final fallback
+  return mapColorPalette[0] || '#d3d3d3'
 }

package/src/helpers/applyLegendToRow.ts

@@ -1,7 +1,9 @@
-import { generateColorsArray, hashObj } from '../helpers'
-import colorPalettes from '@cdc/core/data/colorPalettes'
+import { generateColorsArray } from '@cdc/core/helpers/generateColorsArray'
+import { hashObj, DEFAULT_MAP_BACKGROUND } from '../helpers'
+import { mapColorPalettes as colorPalettes } from '@cdc/core/data/colorPalettes'
 import { MapConfig } from '../types/MapConfig'
 import { type RuntimeLegend } from '../types/runtimeLegend'
+import { getColorPaletteVersion } from '@cdc/core/helpers/getColorPaletteVersion'
 
 type Memo<T> = { current: Map<string, T> }
 
@@ -14,8 +16,9 @@ export const applyLegendToRow = (
 ): string[] => {
   if (!config) return null
 
-  const { general, color, legend } = config
+  const { general, legend } = config
   const { type } = general
+  const color = general.palette?.name ?? 'bluegreenreverse'
   const { showSpecialClassesLast } = legend
 
   try {
@@ -25,21 +28,22 @@ export const applyLegendToRow = (
     }
 
     if (type === 'navigation') {
-      const mapColorPalette = colorPalettes[color] ?? colorPalettes['bluegreenreverse']
+      const mapColorPalette =
+        colorPalettes[`v${getColorPaletteVersion(config)}`]?.[color] ?? colorPalettes.v1['bluegreenreverse']
       return generateColorsArray(mapColorPalette[3])
     }
 
     const hash = hashObj(rowObj)
 
     if (!legendMemo.current.has(hash)) {
-      return generateColorsArray()
+      return generateColorsArray(DEFAULT_MAP_BACKGROUND)
     }
 
     const idx = legendMemo.current.get(hash)!
     const disabledIdx = showSpecialClassesLast ? legendSpecialClassLastMemo.current.get(hash) ?? idx : idx
 
     if (runtimeLegend.items?.[disabledIdx]?.disabled) {
-      return generateColorsArray()
+      return generateColorsArray(DEFAULT_MAP_BACKGROUND)
     }
 
     const legendBinColor = runtimeLegend.items.find(o => o.bin === idx)?.color

package/src/helpers/componentHelpers.ts

@@ -0,0 +1,8 @@
+/**
+ * Builds CSS class names for the main map section container
+ */
+export const buildSectionClassNames = (viewport: string, headerColor: string, hasError: boolean): string => {
+  const classes = ['cove-component__content', 'cdc-map-inner-container', viewport, headerColor]
+  if (hasError) classes.push('type-map--has-error')
+  return classes.join(' ')
+}

package/src/helpers/constants.ts

@@ -42,3 +42,15 @@ export const GEOCODE_TYPES = {
 } as const
 
 export const DEFAULT_MAP_BACKGROUND = '#DFE1E2'
+
+// Component constants
+export const LOGO_MAX_WIDTH = '50px'
+export const STORYBOOK_PORT = 6006
+
+// CSV Parsing Configuration
+export const CSV_PARSE_CONFIG = {
+  header: true,
+  dynamicTyping: true,
+  skipEmptyLines: true,
+  encoding: 'utf-8'
+} as const

package/src/helpers/dataTableHelpers.ts

@@ -0,0 +1,6 @@
+/**
+ * Determines if the data table should be shown based on current state
+ */
+export const shouldShowDataTable = (config: any, table: any, general: any, loading: boolean): boolean => {
+  return !config?.runtime?.editorErrorMessage.length && table.forceDisplay && general.type !== 'navigation' && !loading
+}

package/src/helpers/displayGeoName.ts

@@ -56,6 +56,6 @@ export const displayGeoName = (key: string, convertFipsCodes = true): string =>
   if (value?.length === 2 || value === 'U.S. Virgin Islands') {
     return value
   } else {
-    return titleCase(value)
+    return value
   }
 }

package/src/helpers/generateRuntimeLegend.ts

@@ -14,8 +14,13 @@ import _ from 'lodash'
 import * as d3 from 'd3'
 
 // Cdc
-import colorPalettes from '@cdc/core/data/colorPalettes'
+import { mapColorPalettes as colorPalettes } from '@cdc/core/data/colorPalettes'
 import { supportedCountries } from '../data/supported-geos'
+import { getColorPaletteVersion } from '@cdc/core/helpers/getColorPaletteVersion'
+import { v2ColorDistribution } from '@cdc/core/helpers/palettes/colorDistributions'
+
+// Types
+import { MapConfig, DataRow, RuntimeFilters } from '../types/MapConfig'
 
 type LegendItem = {
   special?: boolean
@@ -34,11 +39,11 @@ export type GeneratedLegend = {
 }
 
 export const generateRuntimeLegend = (
-  configObj,
-  runtimeData: object[],
+  configObj: MapConfig,
+  runtimeData: DataRow[],
   hash: string,
-  setConfig: Function,
-  runtimeFilters: object[],
+  setConfig: (newMapConfig: MapConfig) => void,
+  runtimeFilters: RuntimeFilters,
   legendMemo: React.MutableRefObject<Map<string, number>>,
   legendSpecialClassLastMemo: React.MutableRefObject<Map<string, number>>
 ): GeneratedLegend | [] => {
@@ -331,8 +336,35 @@ export const generateRuntimeLegend = (
           numberOfRows -= chunkAmt
         }
       } else {
-        let colors = colorPalettes[configObj.color]
-        let colorRange = colors.slice(0, legend.numberOfItems)
+        const paletteName = configObj.general?.palette?.name || configObj.color
+        const version = getColorPaletteVersion(configObj)
+        let colors = colorPalettes?.[`v${version}`]?.[paletteName]
+        // Fallback to a default palette if none is selected or found
+        if (!colors) {
+          const defaultPalette = version === 1 ? 'sequential_blue_green' : 'sequential_blue'
+          colors = colorPalettes?.[`v${version}`]?.[defaultPalette]
+        }
+
+        if (!colors) {
+          console.warn('No color palette found, using fallback colors')
+          colors = ['#d3d3d3', '#a0a0a0', '#707070', '#404040'] // Gray fallback
+        }
+
+        // Check if we should use v2 distribution logic for better contrast
+        const isSequentialOrDivergent =
+          paletteName && (paletteName.includes('sequential') || paletteName.includes('divergent'))
+        const useV2Distribution =
+          version === 2 && isSequentialOrDivergent && colors.length === 9 && legend.numberOfItems <= 9
+
+        let colorRange
+        if (useV2Distribution && v2ColorDistribution[legend.numberOfItems]) {
+          // Use strategic color distribution for v2 sequential/divergent palettes
+          const distributionIndices = v2ColorDistribution[legend.numberOfItems]
+          colorRange = distributionIndices.map(index => colors[index])
+        } else {
+          // Use existing logic for v1 palettes and other cases
+          colorRange = colors.slice(0, legend.numberOfItems)
+        }
 
         const getDomain = () => {
           // backwards compatibility
@@ -559,7 +591,11 @@ export const generateRuntimeLegend = (
     return result
   } catch (e) {
     console.error(e)
-    return []
+    return {
+      fromHash: null,
+      runtimeDataHash: null,
+      items: []
+    }
   }
 }
 

package/src/helpers/generateRuntimeLegendHash.ts

@@ -2,12 +2,13 @@ import { hashObj } from './hashObj'
 import { MapConfig } from '../types/MapConfig'
 
 export const generateRuntimeLegendHash = (config: MapConfig, runtimeFilters) => {
+  const { name: paletteName } = config.general.palette
   return hashObj({
     unified: config.legend.unified ?? false,
     equalNumberOptIn: config.general.equalNumberOptIn ?? false,
     specialClassesLast: config.legend.showSpecialClassesLast ?? false,
-    color: config.color,
-    customColors: config.customColors,
+    color: paletteName,
+    customColors: config.general?.palette?.customColors,
     numberOfItems: config.legend.numberOfItems,
     type: config.legend.type,
     separateZero: config.legend.separateZero ?? false,
@@ -16,6 +17,7 @@ export const generateRuntimeLegendHash = (config: MapConfig, runtimeFilters) =>
     specialClasses: config.legend.specialClasses,
     geoType: config.general.geoType,
     data: config.data,
+    palette: config.general.palette,
     filters: {
       ...config.filters
     },

package/src/helpers/getColumnNames.ts

@@ -8,7 +8,7 @@ type ColumnNames = {
   categoricalColumnName: string | null
 } | null
 
-export const getColumnNames = (columns?: Pick<MapConfig, 'columns'>): ColumnNames => {
+export const getColumnNames = (columns?: MapConfig['columns']): ColumnNames => {
   if (!columns) return null
   const geoColumnName = columns.geo?.name || null
   const primaryColumnName = columns.primary?.name || null

package/src/helpers/getPatternForRow.ts

@@ -0,0 +1,36 @@
+import { MapConfig } from '../types/MapConfig'
+
+export interface PatternInfo {
+  pattern?: string
+  dataKey: string
+  size?: string
+  patternIndex: number
+  color?: string
+}
+
+export const getPatternForRow = (
+  rowObj: Record<string, any>,
+  config: MapConfig
+): PatternInfo | null => {
+  if (!config.map?.patterns || !rowObj) {
+    return null
+  }
+
+  // Find a pattern that matches this row's data
+  for (let i = 0; i < config.map.patterns.length; i++) {
+    const patternData = config.map.patterns[i]
+    const hasMatchingValues = patternData.dataValue === rowObj[patternData.dataKey]
+
+    if (hasMatchingValues) {
+      return {
+        pattern: patternData.pattern,
+        dataKey: patternData.dataKey,
+        size: patternData.size,
+        patternIndex: i,
+        color: patternData.color
+      }
+    }
+  }
+
+  return null
+}

package/src/helpers/getStatesPicked.ts

@@ -3,9 +3,12 @@ import { supportedStatesFipsCodes } from '../data/supported-geos'
 
 export const getStatesPicked = (config, runtimeData) => {
   const stateNames = getFilterControllingStatesPicked(config, runtimeData)
-
-  return stateNames.map(stateName => ({
-    fipsCode: Object.keys(supportedStatesFipsCodes).find(key => supportedStatesFipsCodes[key] === stateName),
-    stateName
-  }))
+  return stateNames.map(stateName => {
+    const fipsCode = Object.keys(supportedStatesFipsCodes).find(key => supportedStatesFipsCodes[key] === stateName)
+    if (!fipsCode) console.error(`State name "${stateName}" not found.`)
+    return {
+      fipsCode,
+      stateName
+    }
+  })
 }

package/src/helpers/index.ts

@@ -1,9 +1,8 @@
 export { addUIDs } from './addUIDs'
 export { applyColorToLegend } from './applyColorToLegend'
-export { colorDistributions } from './colorDistributions'
 export { displayGeoName } from './displayGeoName'
 export { formatLegendLocation } from './formatLegendLocation'
-export { generateColorsArray } from './generateColorsArray'
+export { generateColorsArray } from '@cdc/core/helpers/generateColorsArray'
 export { generateRuntimeLegendHash } from './generateRuntimeLegendHash'
 export { getGeoStrokeColor, getGeoFillColor } from './colors'
 export { getUniqueValues } from './getUniqueValues'
@@ -11,6 +10,7 @@ export { handleMapAriaLabels } from './handleMapAriaLabels'
 export { handleMapTabbing } from './handleMapTabbing'
 export { hashObj } from './hashObj'
 export { indexOfIgnoreType } from './indexOfIgnoreType'
+export { isLegendItemDisabled } from './isLegendItemDisabled'
 export { navigationHandler } from './navigationHandler'
 export { resetLegendToggles } from './resetLegendToggles'
 export { setBinNumbers } from './setBinNumbers'
@@ -19,4 +19,12 @@ export { titleCase as toTitleCase } from './toTitleCase'
 export { titleCase } from './titleCase'
 export { validateFipsCodeLength } from './validateFipsCodeLength'
 export { getMapContainerClasses } from './getMapContainerClasses'
-export { SVG_HEIGHT, SVG_WIDTH, SVG_PADDING, SVG_VIEWBOX, HEADER_COLORS, MAX_ZOOM_LEVEL } from './constants'
+export {
+  SVG_HEIGHT,
+  SVG_WIDTH,
+  SVG_PADDING,
+  SVG_VIEWBOX,
+  HEADER_COLORS,
+  MAX_ZOOM_LEVEL,
+  DEFAULT_MAP_BACKGROUND
+} from './constants'

package/src/helpers/isLegendItemDisabled.ts

@@ -0,0 +1,16 @@
+import { hashObj } from './hashObj'
+
+export const isLegendItemDisabled = (
+  dataForCheck: any,
+  runtimeLegend: any,
+  legendMemo: React.MutableRefObject<Map<number, number>>,
+  legendSpecialClassLastMemo: React.MutableRefObject<Map<number, number>>,
+  config: any
+): boolean => {
+  if (!dataForCheck || !runtimeLegend?.items) return false
+  const hash = hashObj(dataForCheck)
+  if (!legendMemo.current.has(hash)) return false
+  const idx = legendMemo.current.get(hash)
+  const disabledIdx = config.legend.showSpecialClassesLast ? legendSpecialClassLastMemo.current.get(hash) ?? idx : idx
+  return runtimeLegend.items[disabledIdx]?.disabled || false
+}

package/src/helpers/mapObserverHelpers.ts

@@ -0,0 +1,40 @@
+import { publish } from '@cdc/core/helpers/events'
+import { MapConfig } from '../types/MapConfig'
+import MapActions from '../store/map.actions'
+import { Dispatch } from 'react'
+
+/**
+ * Publishes 'cove_loaded' only after the map SVG is rendered in the DOM.
+ * Checks immediately, then uses a MutationObserver as a fallback for async rendering.
+ * Update the mapSvg ref if the map container changes.
+ */
+export const observeMapSvgLoaded = (
+  mapSvgRef: React.RefObject<HTMLElement>,
+  config: MapConfig,
+  coveLoadedHasRan: boolean,
+  dispatch: Dispatch<MapActions>
+): (() => void) => {
+  // Immediate check in case SVG is already present
+  const svgEl = mapSvgRef.current?.querySelector('svg')
+  if (svgEl && svgEl.childNodes.length > 0) {
+    publish('cove_loaded', { config })
+    dispatch({ type: 'SET_COVE_LOADED_HAS_RAN', payload: true })
+    return () => {}
+  }
+
+  // Fallback to observer for async SVG rendering
+  const observer = new MutationObserver(() => {
+    const svgEl = mapSvgRef.current?.querySelector('svg')
+    if (svgEl && svgEl.childNodes.length > 0) {
+      publish('cove_loaded', { config })
+      dispatch({ type: 'SET_COVE_LOADED_HAS_RAN', payload: true })
+      observer.disconnect()
+    }
+  })
+
+  if (mapSvgRef.current) {
+    observer.observe(mapSvgRef.current, { childList: true, subtree: true })
+  }
+
+  return () => observer.disconnect()
+}

package/src/helpers/resetLegendToggles.ts

@@ -1,5 +1,6 @@
 import _ from 'lodash'
-export const resetLegendToggles = (runtimeLegend, setRuntimeLegend) => {
+
+export const resetLegendToggles = (runtimeLegend, dispatch) => {
   const legendCopy = _.cloneDeep(runtimeLegend)
 
   legendCopy.items.forEach(legendItem => {
@@ -9,5 +10,5 @@ export const resetLegendToggles = (runtimeLegend, setRuntimeLegend) => {
 
   legendCopy.runtimeDataHash = runtimeLegend.runtimeDataHash
 
-  setRuntimeLegend(legendCopy)
+  dispatch({ type: 'SET_RUNTIME_LEGEND', payload: legendCopy })
 }

package/src/helpers/toggleLegendActive.ts

@@ -1,12 +1,6 @@
 import _ from 'lodash'
 
-export const toggleLegendActive = (
-  i: number,
-  legendLabel: string,
-  runtimeLegend,
-  setRuntimeLegend,
-  setAccessibleStatus: (message: string) => void
-) => {
+export const toggleLegendActive = (i: number, legendLabel: string, runtimeLegend, dispatch) => {
   const runtimeLegendCopy = _.cloneDeep(runtimeLegend)
 
   // Create and toggle the new value
@@ -17,9 +11,10 @@ export const toggleLegendActive = (
 
   runtimeLegendCopy['disabledAmt'] = newValue ? disabledAmt + 1 : disabledAmt - 1
 
-  setRuntimeLegend(runtimeLegendCopy)
+  dispatch({ type: 'SET_RUNTIME_LEGEND', payload: runtimeLegendCopy })
 
-  setAccessibleStatus(
-    `Disabled legend item ${legendLabel ?? ''}. Please reference the data table to see updated values.`
-  )
+  dispatch({
+    type: 'SET_ACCESSIBLE_STATUS',
+    payload: `Disabled legend item ${legendLabel ?? ''}. Please reference the data table to see updated values.`
+  })
 }

package/src/helpers/urlDataHelpers.ts

@@ -0,0 +1,70 @@
+import Papa from 'papaparse'
+import _ from 'lodash'
+import { DataTransform } from '@cdc/core/helpers/DataTransform'
+import { isSolrCsv, isSolrJson } from '@cdc/core/helpers/isSolr'
+import { MapConfig } from '../types/MapConfig'
+import { CSV_PARSE_CONFIG } from './constants'
+import { cloneConfig } from '@cdc/core/helpers/cloneConfig'
+
+export const buildQueryString = (params: Record<string, string>): string =>
+  Object.keys(params)
+    .map((param, i) => {
+      let qs = i === 0 ? '?' : '&'
+      qs += param + '='
+      qs += params[param]
+      return qs
+    })
+    .join('')
+
+export const reloadURLData = async (config: MapConfig, setConfig: (config: MapConfig) => void): Promise<void> => {
+  if (!config.dataUrl) return
+
+  const dataUrl = new URL(config.runtimeDataUrl || config.dataUrl, window.location.origin)
+  let qsParams = Object.fromEntries(new URLSearchParams(dataUrl.search))
+
+  let isUpdateNeeded = false
+  config.filters.forEach(filter => {
+    if (filter.type === 'url' && qsParams[filter.queryParameter] !== decodeURIComponent(filter.active)) {
+      qsParams[filter.queryParameter] = filter.active
+      isUpdateNeeded = true
+    }
+  })
+
+  if (!isUpdateNeeded) return
+
+  let dataUrlFinal = `${dataUrl.origin}${dataUrl.pathname}${buildQueryString(qsParams)}`
+  let data
+
+  try {
+    const regex = /(?:\.([^.]+))?$/
+    const ext = regex.exec(dataUrl.pathname)[1]
+
+    if ('csv' === ext || isSolrCsv(dataUrlFinal)) {
+      data = await fetch(dataUrlFinal)
+        .then(response => response.text())
+        .then(responseText => {
+          const parsedCsv = Papa.parse(responseText, CSV_PARSE_CONFIG)
+          return parsedCsv.data
+        })
+    } else if ('json' === ext || isSolrJson(dataUrlFinal)) {
+      data = await fetch(dataUrlFinal).then(response => response.json())
+    } else {
+      data = []
+    }
+  } catch (e) {
+    console.error(`Cannot parse URL: ${dataUrlFinal}`, e)
+    data = []
+  }
+
+  if (config.dataDescription) {
+    const transform = new DataTransform()
+    data = transform.autoStandardize(data)
+    data = transform.developerStandardize(data, config.dataDescription)
+  }
+
+  const newConfig = cloneConfig(config)
+  newConfig.data = data
+  newConfig.runtimeDataUrl = dataUrlFinal
+
+  setConfig(newConfig)
+}