feat(ui/lineage): Make show ghost entities toggle local storage sticky (#13424)

datahub-web-react/src/app/lineageV2/LineageExplorer.tsx

@@ -13,9 +13,10 @@ import {
     NodeContext,
     useIgnoreSchemaFieldStatus,
 } from '@app/lineageV2/common';
+import useShouldHideTransformations from '@app/lineageV2/settings/useShouldHideTransformations';
+import useShouldShowDataProcessInstances from '@app/lineageV2/settings/useShouldShowDataProcessInstances';
+import useShouldShowGhostEntities from '@app/lineageV2/settings/useShouldShowGhostEntities';
 import useSearchAcrossLineage from '@app/lineageV2/useSearchAcrossLineage';
-import useShouldHideTransformations from '@app/lineageV2/useShouldHideTransformations';
-import useShouldShowDataProcessInstances from '@app/lineageV2/useShouldShowDataProcessInstances';
 import TabFullsizedContext from '@app/shared/TabFullsizedContext';
 
 import { EntityType, LineageDirection } from '@types';
@@ -41,7 +42,7 @@ export default function LineageExplorer(props: Props) {
     const [hideTransformations, setHideTransformations] = useShouldHideTransformations();
     const [showDataProcessInstances, setShowDataProcessInstances] = useShouldShowDataProcessInstances();
 
-    const [showGhostEntities, setShowGhostEntities] = useState(false);
+    const [showGhostEntities, setShowGhostEntities] = useShouldShowGhostEntities();
 
     const context: NodeContext = {
         rootUrn: urn,

datahub-web-react/src/app/lineageV2/settings/useShouldShowGhostEntities.ts

@@ -0,0 +1,26 @@
+import { useCallback, useState } from 'react';
+
+export default function useShouldShowGhostEntities(): [boolean, (value: boolean) => void] {
+    const defaultValue = inLocalStorage() ? loadFromLocalStorage() : false;
+    const [showGhostEntities, setShowGhostEntities] = useState(defaultValue);
+    const setter = useCallback((value: boolean) => {
+        setShowGhostEntities(value);
+        saveToLocalStorage(value);
+    }, []);
+
+    return [showGhostEntities, setter];
+}
+
+const SHOW_GHOST_ENTITIES_KEY = 'lineageV2__showGhostEntities';
+
+function inLocalStorage(): boolean {
+    return localStorage.getItem(SHOW_GHOST_ENTITIES_KEY) !== null;
+}
+
+function loadFromLocalStorage(): boolean {
+    return localStorage.getItem(SHOW_GHOST_ENTITIES_KEY) === 'true';
+}
+
+function saveToLocalStorage(showGhostEntities: boolean) {
+    localStorage.setItem(SHOW_GHOST_ENTITIES_KEY, String(showGhostEntities));
+}