@molgenis/vip-report-template 6.2.0 → 7.0.1

package/src/components/filter/composed/FilterAllelicImbalance.tsx

@@ -0,0 +1,26 @@
+import { Component } from "solid-js";
+import { ConfigFilterAllelicImbalance, FilterValueAllelicImbalance } from "../../../types/configFilterComposed";
+import { FilterProps } from "../Filter.tsx";
+import { ConfigFilterField, FilterValueCategorical } from "../../../types/configFilter";
+import { FilterCategorical } from "../typed/FilterCategorical";
+
+export const FilterAllelicImbalance: Component<
+  FilterProps<ConfigFilterAllelicImbalance, FilterValueAllelicImbalance>
+> = (props) => {
+  const config = (): ConfigFilterField => ({
+    ...props.config,
+    field: {
+      ...props.config.viabField,
+      categories: { true: { label: "True" }, false: { label: "False" } },
+    },
+  });
+
+  return (
+    <FilterCategorical
+      config={config()}
+      value={props.value as FilterValueCategorical}
+      onValueChange={props.onValueChange}
+      onValueClear={props.onValueClear}
+    />
+  );
+};

package/src/components/filter/composed/FilterComposed.tsx

@@ -0,0 +1,92 @@
+import { Component, Match, Switch } from "solid-js";
+import { FilterValue } from "../../../types/configFilter";
+import {
+  ConfigFilterAllelicImbalance,
+  ConfigFilterComposed,
+  ConfigFilterDeNovo,
+  ConfigFilterHpo,
+  ConfigFilterInheritanceMatch,
+  ConfigFilterLocus,
+  ConfigFilterVipC,
+  ConfigFilterVipCS,
+  FilterValueAllelicImbalance,
+  FilterValueDeNovo,
+  FilterValueHpo,
+  FilterValueInheritanceMatch,
+  FilterValueLocus,
+  FilterValueVipC,
+  FilterValueVipCS,
+} from "../../../types/configFilterComposed";
+import { FilterLocus } from "./FilterLocus";
+import { ErrorNotification } from "../../ErrorNotification";
+import { FilterHpo } from "./FilterHpo.tsx";
+import { FilterProps } from "../Filter.tsx";
+import { FilterAllelicImbalance } from "./FilterAllelicImbalance";
+import { FilterInheritance } from "./FilterInheritance.tsx";
+import { FilterDeNovo } from "./FilterDeNovo.tsx";
+import { FilterVipC } from "./FilterVipC.tsx";
+import { FilterVipCS } from "./FilterVipCS.tsx";
+
+export const FilterComposed: Component<FilterProps<ConfigFilterComposed, FilterValue>> = (props) => {
+  const id = () => props.config.id;
+  return (
+    <Switch fallback={<ErrorNotification error={`unexpected field id ${id()}`} />}>
+      <Match when={id() === "composed/hpo"}>
+        <FilterHpo
+          config={props.config as ConfigFilterHpo}
+          value={props.value as FilterValueHpo | undefined}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "composed/locus"}>
+        <FilterLocus
+          config={props.config as ConfigFilterLocus}
+          value={props.value as FilterValueLocus | undefined}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "composed/allelicImbalance"}>
+        <FilterAllelicImbalance
+          config={props.config as ConfigFilterAllelicImbalance}
+          value={props.value as FilterValueAllelicImbalance | undefined}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "composed/inheritanceMatch"}>
+        <FilterInheritance
+          config={props.config as ConfigFilterInheritanceMatch}
+          value={props.value as FilterValueInheritanceMatch | undefined}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "composed/deNovo"}>
+        <FilterDeNovo
+          config={props.config as ConfigFilterDeNovo}
+          value={props.value as FilterValueDeNovo | undefined}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "composed/vipC"}>
+        <FilterVipC
+          config={props.config as ConfigFilterVipC}
+          value={props.value as FilterValueVipC | undefined}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "composed/vipCS"}>
+        <FilterVipCS
+          config={props.config as ConfigFilterVipCS}
+          value={props.value as FilterValueVipCS | undefined}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+    </Switch>
+  );
+};

package/src/components/filter/composed/FilterDeNovo.tsx

@@ -0,0 +1,35 @@
+import { Component } from "solid-js";
+import { ConfigFilterDeNovo, FilterValueDeNovo } from "../../../types/configFilterComposed";
+import { FilterProps } from "../Filter.tsx";
+import { ConfigFilterField, FilterValueCategorical } from "../../../types/configFilter";
+import { FilterCategorical } from "../typed/FilterCategorical";
+
+export const FilterDeNovo: Component<FilterProps<ConfigFilterDeNovo, FilterValueDeNovo>> = (props) => {
+  const config = (): ConfigFilterField => ({
+    ...props.config,
+    field: {
+      ...props.config.vidField,
+      categories: {
+        true: {
+          label: "True",
+          description: "At least one allele of the sample genotype is not inherited from a parent.",
+        },
+        potential: {
+          label: "Potential",
+          description:
+            "Denovo status cannot be determined, e.g. due to missing parent(s) or (partially) missing genotypes.",
+        },
+        false: { label: "False", description: "The entire sample genotype is inherited from their parents." },
+      },
+    },
+  });
+
+  return (
+    <FilterCategorical
+      config={config()}
+      value={props.value as FilterValueCategorical}
+      onValueChange={props.onValueChange}
+      onValueClear={props.onValueClear}
+    />
+  );
+};

package/src/components/filter/composed/FilterHpo.tsx

@@ -0,0 +1,16 @@
+import { Component } from "solid-js";
+import { FilterTyped } from "../typed/FilterTyped.tsx";
+import { FilterProps, FilterValueChangeCallback } from "../Filter.tsx";
+import { ConfigFilterHpo, FilterValueHpo } from "../../../types/configFilterComposed";
+import { ConfigFilterField, FilterValueCategorical, FilterValueField } from "../../../types/configFilter";
+
+export const FilterHpo: Component<FilterProps<ConfigFilterHpo, FilterValueHpo>> = (props) => {
+  return (
+    <FilterTyped
+      config={props.config as ConfigFilterField}
+      value={props.value as FilterValueCategorical}
+      onValueChange={props.onValueChange as FilterValueChangeCallback<FilterValueField>}
+      onValueClear={props.onValueClear}
+    />
+  );
+};

package/src/components/filter/composed/FilterInheritance.tsx

@@ -0,0 +1,42 @@
+import { Component } from "solid-js";
+import { ConfigFilterInheritanceMatch, FilterValueInheritanceMatch } from "../../../types/configFilterComposed";
+import { FilterProps } from "../Filter.tsx";
+import { ConfigFilterField, FilterValueCategorical } from "../../../types/configFilter";
+import { FilterCategorical } from "../typed/FilterCategorical";
+
+export const FilterInheritance: Component<FilterProps<ConfigFilterInheritanceMatch, FilterValueInheritanceMatch>> = (
+  props,
+) => {
+  const config = (): ConfigFilterField => ({
+    ...props.config,
+    field: {
+      ...props.config.vimField,
+      categories: {
+        true: {
+          label: "Match",
+          description:
+            "The inheritance pattern of the sample and its family members matches the known patterns of the gene associated with the variant.",
+        },
+        potential: {
+          label: "Potential match",
+          description:
+            "The match between the inheritance patterns of the sample and its family members and the known patterns of the gene associated with the variant cannot be determined with certainty. e.g. due to missing affected status of samples, missing genotypes or lack of known patterns for the gene.",
+        },
+        false: {
+          label: "No Match",
+          description:
+            "The inheritance pattern of the sample and its family members does not match the known patterns of the gene associated with the variant.",
+        },
+      },
+    },
+  });
+
+  return (
+    <FilterCategorical
+      config={config()}
+      value={props.value as FilterValueCategorical}
+      onValueChange={props.onValueChange}
+      onValueClear={props.onValueClear}
+    />
+  );
+};

package/src/components/filter/composed/FilterLocus.tsx

@@ -0,0 +1,75 @@
+import { Component, createEffect, createSignal } from "solid-js";
+import { FilterWrapper } from "../FilterWrapper";
+import { ButtonApply } from "../../form/ButtonApply";
+import { ButtonReset } from "../../form/ButtonReset";
+import { ConfigFilterLocus, FilterValueLocus } from "../../../types/configFilterComposed";
+import { Select } from "../../form/Select";
+import { Input } from "../../form/Input";
+import { FilterProps } from "../Filter.tsx";
+
+import { validateIntervalInput } from "../../../utils/utils.ts";
+
+export const FilterLocus: Component<FilterProps<ConfigFilterLocus, FilterValueLocus>> = (props) => {
+  const [chromosome, setChromosome] = createSignal<string>();
+  const [startPosition, setStartPosition] = createSignal<string>();
+  const [endPosition, setEndPosition] = createSignal<string>();
+  const [error, setError] = createSignal<string>();
+
+  createEffect(() => {
+    if (props.value) {
+      setChromosome(props.value.chromosome);
+      setStartPosition(props.value.start?.toString());
+      setEndPosition(props.value.end?.toString());
+    }
+  });
+
+  const onApply = () => {
+    const chr = chromosome();
+    if (chr === undefined) return;
+    const startStr = startPosition();
+    const endStr = endPosition();
+    const validationResult = validateIntervalInput(props.config.id, startStr, endStr);
+    if (validationResult !== undefined) {
+      setError(validationResult);
+    } else {
+      setError(undefined);
+      const start = startStr !== undefined ? parseInt(startStr) : undefined;
+      const end = endStr !== undefined ? parseInt(endStr) : undefined;
+      props.onValueChange({ value: { chromosome: chr, start, end } });
+    }
+  };
+
+  const onReset = () => {
+    // filter might not have been applied, so clear local values in addition to generating event
+    setChromosome();
+    setStartPosition();
+    setEndPosition();
+
+    props.onValueClear();
+  };
+
+  return (
+    <FilterWrapper config={props.config} error={error()}>
+      <div class="field is-grouped">
+        <div class="control">
+          <Select
+            placeholder={"Contig"}
+            value={chromosome()}
+            options={props.config.chromosomes.map((chromosome) => ({ id: chromosome, label: chromosome }))}
+            onValueChange={(e) => setChromosome(e.value)}
+          />
+        </div>
+        <div class="control is-expanded">
+          <Input placeholder="Start" value={startPosition()} onValueChange={(e) => setStartPosition(e.value)} />
+        </div>
+        <div class="control is-expanded">
+          <Input placeholder="End" value={endPosition()} onValueChange={(e) => setEndPosition(e.value)} />
+        </div>
+        <div class="control">
+          <ButtonApply onClick={onApply} />
+        </div>
+      </div>
+      <ButtonReset onClick={() => onReset()} />
+    </FilterWrapper>
+  );
+};

package/src/components/filter/composed/FilterVipC.tsx

@@ -0,0 +1,16 @@
+import { Component } from "solid-js";
+import { FilterTyped } from "../typed/FilterTyped.tsx";
+import { FilterProps, FilterValueChangeCallback } from "../Filter.tsx";
+import { ConfigFilterVipC, FilterValueVipC } from "../../../types/configFilterComposed";
+import { ConfigFilterField, FilterValueCategorical, FilterValueField } from "../../../types/configFilter";
+
+export const FilterVipC: Component<FilterProps<ConfigFilterVipC, FilterValueVipC>> = (props) => {
+  return (
+    <FilterTyped
+      config={props.config as ConfigFilterField}
+      value={props.value as FilterValueCategorical}
+      onValueChange={props.onValueChange as FilterValueChangeCallback<FilterValueField>}
+      onValueClear={props.onValueClear}
+    />
+  );
+};

package/src/components/filter/composed/FilterVipCS.tsx

@@ -0,0 +1,16 @@
+import { Component } from "solid-js";
+import { FilterTyped } from "../typed/FilterTyped.tsx";
+import { FilterProps, FilterValueChangeCallback } from "../Filter.tsx";
+import { ConfigFilterVipCS, FilterValueVipCS } from "../../../types/configFilterComposed";
+import { ConfigFilterField, FilterValueCategorical, FilterValueField } from "../../../types/configFilter";
+
+export const FilterVipCS: Component<FilterProps<ConfigFilterVipCS, FilterValueVipCS>> = (props) => {
+  return (
+    <FilterTyped
+      config={props.config as ConfigFilterField}
+      value={props.value as FilterValueCategorical}
+      onValueChange={props.onValueChange as FilterValueChangeCallback<FilterValueField>}
+      onValueClear={props.onValueClear}
+    />
+  );
+};

package/src/components/filter/fixed/FilterAlt.tsx

@@ -0,0 +1,20 @@
+import { Component } from "solid-js";
+import { FilterProps } from "../Filter.tsx";
+import { ConfigFilterAlt, ConfigFilterField, FilterValueAlt } from "../../../types/configFilter";
+import { FilterString } from "../typed/FilterString.tsx";
+import { FieldMetadataWrapper } from "../../../utils/vcf.ts";
+
+export const FilterAlt: Component<FilterProps<ConfigFilterAlt, FilterValueAlt>> = (props) => {
+  const field: FieldMetadataWrapper = {
+    id: "alt",
+    number: {
+      type: "OTHER",
+    },
+    type: "STRING",
+    index: 0,
+  };
+
+  const config = (): ConfigFilterField => ({ ...props.config, field });
+
+  return <FilterString {...props} config={config()} />;
+};

package/src/components/filter/fixed/FilterChrom.tsx

@@ -0,0 +1,22 @@
+import { Component } from "solid-js";
+import { FilterProps } from "../Filter.tsx";
+import { ConfigFilterChrom, ConfigFilterField, FilterValueChrom } from "../../../types/configFilter";
+import { FilterString } from "../typed/FilterString.tsx";
+import { FieldMetadataWrapper } from "../../../utils/vcf.ts";
+
+export const FilterChrom: Component<FilterProps<ConfigFilterChrom, FilterValueChrom>> = (props) => {
+  const field: FieldMetadataWrapper = {
+    id: "chrom",
+    number: {
+      type: "NUMBER",
+      count: 1,
+    },
+    type: "STRING",
+    required: true,
+    index: 0,
+  };
+
+  const config = (): ConfigFilterField => ({ ...props.config, field });
+
+  return <FilterString {...props} config={config()} />;
+};

package/src/components/filter/fixed/FilterFilter.tsx

@@ -0,0 +1,20 @@
+import { Component } from "solid-js";
+import { FilterProps } from "../Filter.tsx";
+import { ConfigFilterField, ConfigFilterFilter, FilterValueFilter } from "../../../types/configFilter";
+import { FilterString } from "../typed/FilterString.tsx";
+import { FieldMetadataWrapper } from "../../../utils/vcf.ts";
+
+export const FilterFilter: Component<FilterProps<ConfigFilterFilter, FilterValueFilter>> = (props) => {
+  const field: FieldMetadataWrapper = {
+    id: "filter",
+    number: {
+      type: "OTHER",
+    },
+    type: "STRING",
+    index: 0,
+  };
+
+  const config = (): ConfigFilterField => ({ ...props.config, field });
+
+  return <FilterString {...props} config={config()} />;
+};

package/src/components/filter/fixed/FilterFixed.tsx

@@ -0,0 +1,96 @@
+import { Component, Match, Switch } from "solid-js";
+import {
+  ConfigFilterAlt,
+  ConfigFilterChrom,
+  ConfigFilterFilter,
+  ConfigFilterFixed,
+  ConfigFilterId,
+  ConfigFilterPos,
+  ConfigFilterQual,
+  ConfigFilterRef,
+  FilterValue,
+  FilterValueAlt,
+  FilterValueChrom,
+  FilterValueFilter,
+  FilterValueId,
+  FilterValuePos,
+  FilterValueQual,
+  FilterValueRef,
+} from "../../../types/configFilter";
+import { ErrorNotification } from "../../ErrorNotification";
+import { FilterProps } from "../Filter.tsx";
+import { FilterChrom } from "./FilterChrom.tsx";
+import { FilterPos } from "./FilterPos.tsx";
+import { FilterId } from "./FilterId.tsx";
+import { FilterRef } from "./FilterRef.tsx";
+import { FilterAlt } from "./FilterAlt.tsx";
+import { FilterQual } from "./FilterQual.tsx";
+import { FilterFilter } from "./FilterFilter.tsx";
+
+/**
+ * Filter for a fixed VCF field (CHROM, POS, ID, REF, ALT, QUAL, FILTER) other than INFO
+ */
+export const FilterFixed: Component<FilterProps<ConfigFilterFixed, FilterValue>> = (props) => {
+  const id = () => props.config.id;
+
+  return (
+    <Switch fallback={<ErrorNotification error={`unexpected field id ${id()}`} />}>
+      <Match when={id() === "fixed/chrom"}>
+        <FilterChrom
+          config={props.config as ConfigFilterChrom}
+          value={props.value as FilterValueChrom}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "fixed/pos"}>
+        <FilterPos
+          config={props.config as ConfigFilterPos}
+          value={props.value as FilterValuePos}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "fixed/id"}>
+        <FilterId
+          config={props.config as ConfigFilterId}
+          value={props.value as FilterValueId}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "fixed/ref"}>
+        <FilterRef
+          config={props.config as ConfigFilterRef}
+          value={props.value as FilterValueRef}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "fixed/alt"}>
+        <FilterAlt
+          config={props.config as ConfigFilterAlt}
+          value={props.value as FilterValueAlt}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "fixed/qual"}>
+        <FilterQual
+          config={props.config as ConfigFilterQual}
+          value={props.value as FilterValueQual}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+      <Match when={id() === "fixed/filter"}>
+        <FilterFilter
+          config={props.config as ConfigFilterFilter}
+          value={props.value as FilterValueFilter}
+          onValueChange={props.onValueChange}
+          onValueClear={props.onValueClear}
+        />
+      </Match>
+    </Switch>
+  );
+};

package/src/components/filter/fixed/FilterId.tsx

@@ -0,0 +1,20 @@
+import { Component } from "solid-js";
+import { FilterProps } from "../Filter.tsx";
+import { ConfigFilterField, ConfigFilterId, FilterValueId } from "../../../types/configFilter";
+import { FilterString } from "../typed/FilterString.tsx";
+import { FieldMetadataWrapper } from "../../../utils/vcf.ts";
+
+export const FilterId: Component<FilterProps<ConfigFilterId, FilterValueId>> = (props) => {
+  const field: FieldMetadataWrapper = {
+    id: "id",
+    number: {
+      type: "OTHER",
+    },
+    type: "STRING",
+    index: 0,
+  };
+
+  const config = (): ConfigFilterField => ({ ...props.config, field });
+
+  return <FilterString {...props} config={config()} />;
+};

package/src/components/filter/fixed/FilterPos.tsx

@@ -0,0 +1,22 @@
+import { Component } from "solid-js";
+import { FilterProps } from "../Filter.tsx";
+import { ConfigFilterField, ConfigFilterPos, FilterValuePos } from "../../../types/configFilter";
+import { FilterInterval } from "../typed/FilterInterval.tsx";
+import { FieldMetadataWrapper } from "../../../utils/vcf.ts";
+
+export const FilterPos: Component<FilterProps<ConfigFilterPos, FilterValuePos>> = (props) => {
+  const field: FieldMetadataWrapper = {
+    id: "pos",
+    number: {
+      type: "NUMBER",
+      count: 1,
+    },
+    type: "INTEGER",
+    required: true,
+    index: 0,
+  };
+
+  const config = (): ConfigFilterField => ({ ...props.config, field });
+
+  return <FilterInterval {...props} config={config()} />;
+};

package/src/components/filter/fixed/FilterQual.tsx

@@ -0,0 +1,21 @@
+import { Component } from "solid-js";
+import { FilterProps } from "../Filter.tsx";
+import { ConfigFilterField, ConfigFilterQual, FilterValueQual } from "../../../types/configFilter";
+import { FilterInterval } from "../typed/FilterInterval.tsx";
+import { FieldMetadataWrapper } from "../../../utils/vcf.ts";
+
+export const FilterQual: Component<FilterProps<ConfigFilterQual, FilterValueQual>> = (props) => {
+  const field: FieldMetadataWrapper = {
+    id: "qual",
+    number: {
+      type: "NUMBER",
+      count: 1,
+    },
+    type: "FLOAT",
+    index: 0,
+  };
+
+  const config = (): ConfigFilterField => ({ ...props.config, field });
+
+  return <FilterInterval {...props} config={config()} />;
+};

package/src/components/filter/fixed/FilterRef.tsx

@@ -0,0 +1,22 @@
+import { Component } from "solid-js";
+import { FilterProps } from "../Filter.tsx";
+import { ConfigFilterField, ConfigFilterRef, FilterValueRef } from "../../../types/configFilter";
+import { FilterString } from "../typed/FilterString.tsx";
+import { FieldMetadataWrapper } from "../../../utils/vcf.ts";
+
+export const FilterRef: Component<FilterProps<ConfigFilterRef, FilterValueRef>> = (props) => {
+  const field: FieldMetadataWrapper = {
+    id: "ref",
+    number: {
+      type: "NUMBER",
+      count: 1,
+    },
+    type: "STRING",
+    required: true,
+    index: 0,
+  };
+
+  const config = (): ConfigFilterField => ({ ...props.config, field });
+
+  return <FilterString {...props} config={config()} />;
+};