Skip to content
This repository has been archived by the owner on Nov 4, 2024. It is now read-only.

Bugfix/cor 1769 variants table and graph 2 #4870

Merged
merged 5 commits into from
Sep 19, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 0 additions & 8 deletions packages/app/schema/nl/variants.json
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,6 @@
"order",
"occurrence",
"percentage",
"is_variant_of_concern",
"has_historical_significance",
"sample_size",
"date_start_unix",
"date_end_unix",
Expand All @@ -61,12 +59,6 @@
"percentage": {
"type": "number"
},
"is_variant_of_concern": {
"type": "boolean"
},
"has_historical_significance": {
"type": "boolean"
},
"sample_size": {
"type": "integer"
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,31 +18,32 @@ const EMPTY_VALUES = {
},
} as const;

/**
* Returns values for variant timeseries chart
* @param variants
*/
export function getVariantChartData(variants: NlVariants | undefined) {
if (!isDefined(variants) || !isDefined(variants.values)) {
return EMPTY_VALUES;
}

const variantsOfConcern = variants.values
.filter((variant) => variant.last_value.is_variant_of_concern || variant.last_value.has_historical_significance)
.filter((variant) => variant.variant_code !== 'other_graph' && variant.variant_code !== 'other_table')
.sort((a, b) => b.last_value.order - a.last_value.order);
const sortedVariants = variants.values.sort((a, b) => b.last_value.order - a.last_value.order);

const firstVariant = variantsOfConcern.shift();
const firstVariantInList = sortedVariants.shift();
VWSCoronaDashboard30 marked this conversation as resolved.
Show resolved Hide resolved

if (!isDefined(firstVariant)) {
if (!isDefined(firstVariantInList)) {
return EMPTY_VALUES;
}

const values = firstVariant.values.map<VariantChartValue>((value, index) => {
const values = firstVariantInList.values.map<VariantChartValue>((value, index) => {
const item = {
is_reliable: true,
date_start_unix: value.date_start_unix,
date_end_unix: value.date_end_unix,
[`${firstVariant.variant_code}_percentage`]: value.percentage,
[`${firstVariantInList.variant_code}_percentage`]: value.percentage,
} as VariantChartValue;

variantsOfConcern.forEach((variant) => {
sortedVariants.forEach((variant) => {
(item as unknown as Record<string, number>)[`${variant.variant_code}_percentage`] = variant.values[index].percentage;
});

Expand All @@ -52,9 +53,9 @@ export function getVariantChartData(variants: NlVariants | undefined) {
return {
variantChart: values,
dates: {
date_of_report_unix: firstVariant.last_value.date_of_report_unix,
date_start_unix: firstVariant.last_value.date_start_unix,
date_end_unix: firstVariant.last_value.date_end_unix,
date_of_report_unix: firstVariantInList.last_value.date_of_report_unix,
date_start_unix: firstVariantInList.last_value.date_start_unix,
date_end_unix: firstVariantInList.last_value.date_end_unix,
},
} as const;
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,7 @@ export type ColorMatch = {
};

const getColorForVariant = (variantCode: VariantCode, index: number): string => {
if (variantCode === 'other_table') return colors.gray5;
if (variantCode === 'other_graph') return colors.gray5;
if (variantCode === 'other_variants') return colors.gray5;

return colors.variants.colorList[index];
};
Expand All @@ -20,8 +19,7 @@ export const getVariantOrderColors = (variants: NlVariants | undefined): ColorMa
}

const colorOrder = variants.values
.filter((variant) => variant.last_value.is_variant_of_concern || variant.last_value.has_historical_significance)
.sort((a, b) => (a.variant_code.includes('other') || b.variant_code.includes('other') ? -1 : a.last_value.order - b.last_value.order))
.sort((a, b) => a.last_value.order - b.last_value.order)
.map((variant, index) => {
const variantColor = getColorForVariant(variant.variant_code, index);
return {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,12 @@ export type VariantRow = {

export type VariantTableData = ReturnType<typeof getVariantTableData>;

/**
* Return values to populate the variants table
* @param variants
* @param namedDifference
* @param variantColors
*/
export function getVariantTableData(variants: NlVariants | undefined, namedDifference: NlNamedDifference, variantColors: ColorMatch[]) {
const emptyValues = {
variantTable: null,
Expand All @@ -31,14 +37,14 @@ export function getVariantTableData(variants: NlVariants | undefined, namedDiffe
if (isPresent(namedDifference.variants__percentage)) {
const difference = namedDifference.variants__percentage.find((x) => x.variant_code === name);

if (!difference) {
return null;
}

return difference;
return difference ?? null;
}
}

function mapVariantToNamedDifference(namedDifferenceVariantCode: string) {
return variants?.values.find((x) => x.variant_code === namedDifferenceVariantCode) ?? null;
VWSCoronaDashboard30 marked this conversation as resolved.
Show resolved Hide resolved
}

const firstLastValue = first<NlVariantsVariant>(variants.values);

if (!isDefined(firstLastValue)) {
Expand All @@ -50,16 +56,16 @@ export function getVariantTableData(variants: NlVariants | undefined, namedDiffe
date_of_report_unix: firstLastValue.last_value.date_of_report_unix,
};

const variantTable = variants.values
.filter((variant) => variant.variant_code !== 'other_graph' && !variant.last_value.has_historical_significance)
.sort((a, b) => b.last_value.order - a.last_value.order)
.map<VariantRow>((variant) => {
const color = variantColors.find((variantColor) => variantColor.variant === variant.variant_code)?.color || colors.gray5;
const variantTable = namedDifference.variants__percentage
.filter((namedDifferencePercentage) => mapVariantToNamedDifference(namedDifferencePercentage.variant_code) !== null)
.sort((a, b) => mapVariantToNamedDifference(b.variant_code)!.last_value.order - mapVariantToNamedDifference(a.variant_code)!.last_value.order)
.map<VariantRow>((namedDifferenceEntry) => {
const color = variantColors.find((variantColor) => variantColor.variant === namedDifferenceEntry.variant_code)?.color || colors.gray5;

return {
variantCode: variant.variant_code,
percentage: variant.last_value.percentage,
difference: findDifference(variant.variant_code),
variantCode: namedDifferenceEntry.variant_code,
percentage: mapVariantToNamedDifference(namedDifferenceEntry.variant_code)?.last_value.percentage as unknown as number,
difference: findDifference(namedDifferenceEntry.variant_code),
color,
};
});
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { colors, TimeframeOption, TimeframeOptionsList } from '@corona-dashboard/common';
import { TimeframeOption, TimeframeOptionsList } from '@corona-dashboard/common';
import { useMemo, useState } from 'react';
import { isDefined, isPresent } from 'ts-is-present';
import { Spacer } from '~/components/base';
Expand Down Expand Up @@ -35,9 +35,9 @@ export const VariantsStackedAreaTile = ({ text, values, variantColors, metadata

const { list, toggle, clear } = useList<keyof VariantChartValue>(alwaysEnabled);

const [seriesConfig, otherConfig, selectOptions] = useSeriesConfig(text, values, variantColors);
const [seriesConfig, selectOptions] = useSeriesConfig(text, values, variantColors);
VWSCoronaDashboard30 marked this conversation as resolved.
Show resolved Hide resolved

const filteredConfig = useFilteredSeriesConfig(seriesConfig, otherConfig, list);
const filteredConfig = useFilteredSeriesConfig(seriesConfig, list);

/* Static legend contains only the inaccurate item */
const staticLegendItems: LegendItem[] = [];
Expand Down Expand Up @@ -93,8 +93,8 @@ export const VariantsStackedAreaTile = ({ text, values, variantColors, metadata
const reorderContext = {
...context,
config: [
// Destructuring so as to not interact with the object directly and eliminate the possibility of introducing inconsistencies
...context.config.filter((value) => !hasMetricProperty(value) || filteredValues[value.metricProperty] || hasSelectedMetrics),
context.config.find((value) => hasMetricProperty(value) && value.metricProperty === 'other_graph_percentage'),
].filter(isDefined),
value: !hasSelectedMetrics ? filteredValues : context.value,
};
Expand All @@ -117,24 +117,18 @@ const hasMetricProperty = (config: any): config is { metricProperty: string } =>
return 'metricProperty' in config;
};

const useFilteredSeriesConfig = (
seriesConfig: GappedAreaSeriesDefinition<VariantChartValue>[],
otherConfig: GappedAreaSeriesDefinition<VariantChartValue>,
compareList: (keyof VariantChartValue)[]
) => {
const useFilteredSeriesConfig = (seriesConfig: GappedAreaSeriesDefinition<VariantChartValue>[], compareList: (keyof VariantChartValue)[]) => {
return useMemo(() => {
return [otherConfig, ...seriesConfig].filter(
(item) => item.metricProperty !== 'other_graph_percentage' && (compareList.includes(item.metricProperty) || compareList.length === alwaysEnabled.length)
);
}, [seriesConfig, otherConfig, compareList]);
return seriesConfig.filter((item) => compareList.includes(item.metricProperty) || compareList.length === alwaysEnabled.length);
}, [seriesConfig, compareList]);
};

const useSeriesConfig = (text: VariantsStackedAreaTileText, values: VariantChartValue[], variantColors: ColorMatch[]) => {
return useMemo(() => {
const baseVariantsFiltered = values
.flatMap((x) => Object.keys(x))
.filter((x, index, array) => array.indexOf(x) === index) // de-dupe
.filter((x) => x.endsWith('_percentage') && x !== 'other_graph_percentage')
.filter((x) => x.endsWith('_percentage'))
.reverse(); // Reverse to be in an alphabetical order

/* Enrich config with dynamic data / locale */
Expand All @@ -146,7 +140,7 @@ const useSeriesConfig = (text: VariantsStackedAreaTileText, values: VariantChart

const variantDynamicLabel = text.variantCodes[variantCode];

const color = variantColors.find((variantColors) => variantColors.variant === variantCode)?.color || colors.gray5;
const color = variantColors.find((variantColors) => variantColors.variant === variantCode)?.color;

if (variantDynamicLabel) {
const newConfig = {
Expand All @@ -164,19 +158,8 @@ const useSeriesConfig = (text: VariantsStackedAreaTileText, values: VariantChart
}
});

const otherConfig = {
type: 'gapped-area',
metricProperty: 'other_graph_percentage',
label: text.tooltip_labels.other_percentage,
fillOpacity: 0.2,
shape: 'square',
color: colors.gray5,
strokeWidth: 2,
mixBlendMode: 'multiply',
} as GappedAreaSeriesDefinition<VariantChartValue>;

const selectOptions = [...seriesConfig];

return [seriesConfig, otherConfig, selectOptions] as const;
return [seriesConfig, selectOptions] as const;
}, [values, text.tooltip_labels.other_percentage, text.variantCodes, variantColors]);
};
4 changes: 3 additions & 1 deletion packages/cms/src/studio/data/data-structure.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ export const dataStructure = {
tested_overall_archived_20230331: ['infected', 'infected_moving_average', 'infected_moving_average_rounded', 'infected_per_100k', 'infected_per_100k_moving_average'],
},
archived_gm_collection: {
hospital_nice_choropleth_archived_20230830: ['admissions_on_date_of_admission', 'admissions_on_date_of_admission_per_100000', 'admissions_on_date_of_reporting'],
sewer_archived_20230623: ['average', 'total_installation_count', 'data_is_outdated'],
tested_overall_archived_20230331: ['infected_per_100k', 'infected'],
},
Expand Down Expand Up @@ -226,6 +227,7 @@ export const dataStructure = {
'admissions_on_date_of_admission',
'admissions_on_date_of_admission_moving_average',
'admissions_on_date_of_admission_moving_average_rounded',
'admissions_in_the_last_7_days',
'admissions_on_date_of_reporting',
],
sewer: ['average', 'data_is_outdated'],
Expand All @@ -243,7 +245,7 @@ export const dataStructure = {
],
},
gm_collection: {
hospital_nice_choropleth: ['admissions_on_date_of_admission', 'admissions_on_date_of_admission_per_100000', 'admissions_on_date_of_reporting'],
hospital_nice_choropleth: ['admissions_in_the_last_7_days_per_100000'],
sewer: ['average', 'data_is_outdated'],
vaccine_coverage_per_age_group: [
'vaccination_type',
Expand Down
12 changes: 2 additions & 10 deletions packages/common/src/types/data.ts
Original file line number Diff line number Diff line change
Expand Up @@ -758,14 +758,7 @@ export interface GmStaticValues {
population_count_connected_to_rwzis: number;
}
export interface GmDifference {
hospital_nice__admissions_on_date_of_reporting_moving_average: DifferenceDecimal;
sewer__average?: DifferenceInteger;
}
export interface DifferenceDecimal {
old_value: number;
difference: number;
old_date_unix: number;
new_date_unix: number;
sewer__average: DifferenceInteger;
}
export interface DifferenceInteger {
old_value: number;
Expand Down Expand Up @@ -1209,8 +1202,7 @@ export interface NlVariantsVariantValue {
order: number;
occurrence: number;
percentage: number;
is_variant_of_concern: boolean;
has_historical_significance: boolean;
has_historical_significance?: boolean;
sample_size: number;
date_start_unix: number;
date_end_unix: number;
Expand Down
Loading