diff --git a/src/components/Panel/PanelGraphicWrapper.tsx b/src/components/Panel/PanelGraphicWrapper.tsx index d0ba3e6f..8dab8a35 100644 --- a/src/components/Panel/PanelGraphicWrapper.tsx +++ b/src/components/Panel/PanelGraphicWrapper.tsx @@ -1,7 +1,7 @@ /* eslint-disable react/jsx-no-useless-fragment */ import React, { useState, useEffect } from 'react'; import PanelGraphic from './PanelGraphic'; -import { getLabelFromFactor, panelSrcGetter, snakeCase } from '../../utils'; +import { panelSrcGetter, replaceDatumFactorsWithLabels, snakeCase } from '../../utils'; import { useDisplayInfo } from '../../slices/displayInfoAPI'; interface PanelGraphicProps { @@ -28,15 +28,7 @@ const PanelGraphicWrapper: React.FC = ({ const { data: displayInfo } = useDisplayInfo(); const [panelSrc, setPanelSrc] = useState(''); const sourceFunc = async (func: PanelFunction) => { - const dataWithFactorLabels = Object.keys(data).reduce((acc, key) => { - const foundFactor = displayInfo?.metas?.find((curMeta) => curMeta.varname === key && curMeta.type === 'factor'); - if (foundFactor) { - const factorLabel = getLabelFromFactor(data[key] as number, foundFactor.levels as string[]); - return { ...acc, [key]: factorLabel }; - } - return { ...acc, [key]: data[key] }; - }, {}); - + const dataWithFactorLabels = replaceDatumFactorsWithLabels(data, displayInfo?.metas as IMeta[]); const res = await func(dataWithFactorLabels); setPanelSrc(res); return res; diff --git a/src/utils.ts b/src/utils.ts index 73396e80..3c1f630e 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -41,3 +41,13 @@ export const getFactorFromLabel = (values: string[], levels: string[]) => export const panelSrcGetter = (basePath: string, fileName: string, displayName: string) => `${basePath}/displays/${displayName}/${fileName}`; + +export const replaceDatumFactorsWithLabels = (data: Datum, displayMetas: IMeta[]) => + Object.keys(data).reduce((acc, key) => { + const foundFactor = displayMetas?.find((curMeta) => curMeta.varname === key && curMeta.type === 'factor'); + if (foundFactor) { + const factorLabel = getLabelFromFactor(data[key] as number, foundFactor.levels as string[]); + return { ...acc, [key]: factorLabel }; + } + return { ...acc, [key]: data[key] }; + }, {});