Hotfix/cor 1769 other variants on top (#4876)

* fix(COR-1769): Put other_variants at bottom of table

* fix(COR-1769): Add comment

* fix(COR-1769): Clean up code

* fix(COR-1769): Remove unused filter

---------

Co-authored-by: VWSCoronaDashboard29 <[email protected]>

packages/app/src/domain/variants/static-props/get-variant-table-data.ts

@@ -1,11 +1,12 @@
 import { colors, NlNamedDifference, NlVariants, NlVariantsVariant, NamedDifferenceDecimal } from '@corona-dashboard/common';
 import { first } from 'lodash';
-import { isDefined, isPresent } from 'ts-is-present';
+import { isDefined } from 'ts-is-present';
 import { ColorMatch } from './get-variant-order-colors';
 import { VariantCode } from '../static-props';
 
 export type VariantRow = {
   variantCode: VariantCode;
+  order: number;
   percentage: number | null;
   difference?: NamedDifferenceDecimal | null;
   color: string;
@@ -33,18 +34,6 @@ export function getVariantTableData(variants: NlVariants | undefined, namedDiffe
     return emptyValues;
   }
 
-  function findDifference(name: string) {
-    if (isPresent(namedDifference.variants__percentage)) {
-      const difference = namedDifference.variants__percentage.find((x) => x.variant_code === name);
-
-      return difference ?? null;
-    }
-  }
-
-  function mapVariantToNamedDifference(namedDifferenceVariantCode: string) {
-    return variants?.values.find((x) => x.variant_code === namedDifferenceVariantCode) ?? null;
-  }
-
   const firstLastValue = first<NlVariantsVariant>(variants.values);
 
   if (!isDefined(firstLastValue)) {
@@ -56,18 +45,28 @@ export function getVariantTableData(variants: NlVariants | undefined, namedDiffe
     date_of_report_unix: firstLastValue.last_value.date_of_report_unix,
   };
 
+  /**
+   * Reverse order of variants to what is received from the master table
+   * Move 'other variants' all the way to the bottom of the table
+   */
   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;
+      // There is ALWAYS a corresponding variant to a namedDifference entry.
+      const variant = variants.values.find((x) => x.variant_code === namedDifferenceEntry.variant_code)!;
 
       return {
         variantCode: namedDifferenceEntry.variant_code,
-        percentage: mapVariantToNamedDifference(namedDifferenceEntry.variant_code)?.last_value.percentage as unknown as number,
-        difference: findDifference(namedDifferenceEntry.variant_code),
-        color,
+        order: variant.last_value.order,
+        percentage: variant.last_value.percentage,
+        difference: namedDifferenceEntry,
+        color: variantColors.find((variantColor) => variantColor.variant === namedDifferenceEntry.variant_code)?.color || colors.gray5,
       };
+    })
+    .sort((a, b) => {
+      // Other Variants must always take the bottom row in the table
+      if (a.variantCode === 'other_variants') return 1;
+      if (b.variantCode === 'other_variants') return -1;
+      return b.order - a.order;
     });
 
   return { variantTable, dates };