diff --git a/waltz-ng/client/data-types/components/data-type-decorator-section/DataTypeDecoratorSection.svelte b/waltz-ng/client/data-types/components/data-type-decorator-section/DataTypeDecoratorSection.svelte index 09b7d269f9..b1e3b862bd 100644 --- a/waltz-ng/client/data-types/components/data-type-decorator-section/DataTypeDecoratorSection.svelte +++ b/waltz-ng/client/data-types/components/data-type-decorator-section/DataTypeDecoratorSection.svelte @@ -12,6 +12,8 @@ selectedDataType } from "./data-type-decorator-section-store"; import {prepareData} from "./data-type-decorator-view-grid-utils"; + import {onDestroy, onMount} from "svelte"; + import localWritable from "../../../common/svelte/local-writable"; const Modes = { TREE: "TREE", @@ -20,17 +22,30 @@ export let primaryEntityRef; - let activeMode = Modes.TREE; + let activeMode = localWritable('waltz.DataTypeDecoratorSection.activeMode', Modes.TREE); let viewCall; function toggleView() { - if (activeMode === Modes.TREE) { - activeMode = Modes.TABLE; + if ($activeMode === Modes.TREE) { + $activeMode = Modes.TABLE; } else { - activeMode = Modes.TREE; + $activeMode = Modes.TREE; } } + function clearSelections() { + $selectedDataType = null; + $selectedDecorator = null; + } + + onMount(() => { + clearSelections(); + }); + + onDestroy(() => { + clearSelections(); + }); + $: { if (primaryEntityRef) { viewCall = dataTypeDecoratorStore.getViewForParentRef(primaryEntityRef); @@ -49,20 +64,19 @@