@cccsaurora/clue-ui 1.2.4-patch.275 → 1.2.5-dev.298
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/ActionForm-D6gYuFRR.js +5970 -0
- package/AnnotationDetails-Zx4pjBiN.js +175 -0
- package/AnnotationPreview-Dmz7taAU.js +188 -0
- package/ClueEnrichContext-CJEJxrgs.js +541 -0
- package/FlexOne-BSYAhhtG.js +9 -0
- package/_MapCache-WmuDdwuH.js +222 -0
- package/_Uint8Array-B7JqpgFX.js +128 -0
- package/_baseAssignValue-CGTuELqU.js +25 -0
- package/_baseClone-CkNrTyhm.js +283 -0
- package/_baseExtremum-kob8QXyt.js +18 -0
- package/_baseFlatten-jIR_sN_-.js +92 -0
- package/_baseGet-Bx3A4Qfp.js +108 -0
- package/_baseIsEqual-C5OTWzTk.js +208 -0
- package/_baseIteratee-avi7MX2o.js +126 -0
- package/_baseSlice-GAv_YFTT.js +20 -0
- package/_baseSum-D0WC1dN0.js +13 -0
- package/_baseUniq-BI9GIHMF.js +115 -0
- package/_commonjsHelpers-DWwsNxpa.js +8 -0
- package/_createAggregator-QD8MzKwe.js +63 -0
- package/_getPrototype-CU0j_POw.js +5 -0
- package/_getTag-Ckxxfr88.js +126 -0
- package/_isIterateeCall-Ds3sw2SF.js +17 -0
- package/_setToArray-CaPKQhcz.js +33 -0
- package/cloneDeep-DJrLSw8W.js +8 -0
- package/components/AnnotationBody.js +49 -35
- package/components/AnnotationDetailPopover.js +36 -30
- package/components/AnnotationDetails.js +7 -7
- package/components/AnnotationEntry.js +35 -35
- package/components/AnnotationPreview.js +5 -5
- package/components/ClassificationChip.js +44 -23
- package/components/CountBadge.js +31 -26
- package/components/EnrichedCard.js +110 -97
- package/components/EnrichedChip.js +130 -105
- package/components/EnrichedTypography.js +133 -107
- package/components/ErrorBoundary.js +28 -24
- package/components/RetryFailedEnrichments.js +10 -9
- package/components/SourcePicker.js +57 -49
- package/components/actions/ActionForm.js +4 -4
- package/components/actions/ExecutePopover.js +75 -59
- package/components/actions/ResultModal.js +4 -4
- package/components/actions/form/schemaAdapter.js +39 -23
- package/components/actions/formats/FileResult.js +86 -59
- package/components/actions/formats/index.js +21 -10
- package/components/display/graph/ExpandMoreButton.js +10 -10
- package/components/display/graph/elements/NodeCard.js +111 -91
- package/components/display/graph/elements/NodeTag.js +15 -13
- package/components/display/graph/index.js +261 -202
- package/components/display/graph/visualizations/Leaf.js +88 -69
- package/components/display/graph/visualizations/cloud/index.js +98 -81
- package/components/display/graph/visualizations/icons/BaseIcon.js +26 -21
- package/components/display/graph/visualizations/icons/BugIcon.js +12 -12
- package/components/display/graph/visualizations/icons/HostIcon.js +12 -12
- package/components/display/graph/visualizations/icons/NetworkIcon.js +12 -12
- package/components/display/graph/visualizations/icons/ProcessIcon.js +12 -12
- package/components/display/graph/visualizations/icons/TargetIcon.js +13 -13
- package/components/display/graph/visualizations/icons/index.js +14 -13
- package/components/display/graph/visualizations/panels/NodePanel.js +10 -8
- package/components/display/graph/visualizations/tree/BundleLine.js +108 -81
- package/components/display/graph/visualizations/tree/Triangle.js +13 -13
- package/components/display/graph/visualizations/tree/index.js +408 -306
- package/components/display/icons/Iconified.js +27 -12
- package/components/display/json/index.js +4 -4
- package/components/display/markdown/index.js +8678 -5770
- package/components/enrichment/EnrichPopover.js +54 -46
- package/components/fetchers/Fetcher.js +158 -119
- package/components/fetchers/PreviewModal.js +20 -17
- package/components/fetchers/StatusChip.js +21 -17
- package/components/group/Entry.js +13 -11
- package/components/group/Group.js +13 -10
- package/components/group/GroupControl.js +76 -65
- package/components/stats/QueryStatus.js +43 -33
- package/countBy-c6S3dvSW.js +14 -0
- package/data/event.js +6 -4
- package/database/index.js +2 -2
- package/debounce-bV0h5FC5.js +92 -0
- package/get-DSsNkRQs.js +8 -0
- package/groupBy-xqz-n0Vd.js +14 -0
- package/hooks/ClueActionContext.d.ts +10 -2
- package/hooks/ClueActionContext.js +6 -6
- package/hooks/ClueComponentContext.js +29 -23
- package/hooks/ClueConfigProvider.js +14 -12
- package/hooks/ClueDatabaseContext.js +19 -13
- package/hooks/ClueEnrichContext.js +8 -8
- package/hooks/ClueFetcherContext.js +83 -56
- package/hooks/ClueGroupContext.js +17 -14
- package/hooks/CluePopupContext.js +5 -5
- package/hooks/ClueProvider.js +12 -10
- package/hooks/selectors.js +7 -7
- package/hooks/useActionResult.d.ts +1 -0
- package/hooks/useActionResult.js +3 -3
- package/hooks/useAnnotations.js +47 -31
- package/hooks/useClue.js +6 -4
- package/hooks/useClueActions.js +3 -3
- package/hooks/useClueConfig.js +6 -4
- package/hooks/useClueTypeConfig.js +3 -3
- package/hooks/useComparator.js +722 -435
- package/hooks/useErrors.js +22 -18
- package/hooks/useFetcherResult.d.ts +1 -0
- package/hooks/useFetcherResult.js +33 -24
- package/hooks/useMyHighlights.js +66 -36
- package/hooks/useMyLocalStorage.js +66 -37
- package/iconify-CXMreGTg.js +1782 -0
- package/icons/Action.js +66 -49
- package/icons/Assessment.js +85 -69
- package/icons/Context.js +77 -63
- package/icons/Opinion.js +76 -60
- package/icons/iconMap.js +2 -2
- package/identity-CPGTqrE4.js +6 -0
- package/index-AMfoEg_6.js +696 -0
- package/index-B6C2a_Lg.js +1172 -0
- package/index-C12gPw2W.js +17698 -0
- package/index-DCKkHTvx.js +15750 -0
- package/index-JcKyZeoY.js +465 -0
- package/isNil-CIubwp4T.js +6 -0
- package/isObject-FTY-5JQX.js +7 -0
- package/isObjectLike-OAgjjZye.js +48 -0
- package/isSymbol-Xd2FsJyp.js +8 -0
- package/last-CUCl67Im.js +7 -0
- package/main.js +60 -60
- package/maxBy-IKHzFrCS.js +8 -0
- package/package.json +1 -1
- package/sortBy-DfSj8IoJ.js +96 -0
- package/sumBy-D-hb_NY-.js +8 -0
- package/text/Frequency.js +42 -23
- package/toFinite-Bc55msYj.js +16 -0
- package/toNumber-DPxy1FBy.js +39 -0
- package/types/RunningActionData.d.ts +1 -0
- package/types/WithActionData.d.ts +1 -0
- package/useClueTypeConfig-Z1LFp01b.js +3289 -0
- package/utils/chain.js +92 -65
- package/utils/classificationParser.js +519 -256
- package/utils/constants.js +35 -10
- package/utils/graph.js +72 -45
- package/utils/hashUtil.js +7 -7
- package/utils/line.js +131 -81
- package/utils/loggerUtil.js +5 -3
- package/utils/sessionStorage.js +41 -27
- package/utils/time.js +423 -423
- package/utils/utils.js +9 -9
- package/utils/window.js +21 -10
- package/utils-HmNPuoDB.js +199 -0
- package/ActionForm-CwsfB99X.js +0 -4458
- package/AnnotationDetails-Bw2JdtTL.js +0 -160
- package/AnnotationPreview-BO7rVnOP.js +0 -140
- package/ClueEnrichContext-KqRuuWNS.js +0 -418
- package/FlexOne-BXWFOd1T.js +0 -6
- package/_MapCache-BiTi0iqu.js +0 -180
- package/_Uint8Array-BQNOM9Rr.js +0 -101
- package/_baseAssignValue-CNMLQZco.js +0 -20
- package/_baseClone-BnT-6pyM.js +0 -207
- package/_baseExtremum-Ca2EHgy2.js +0 -16
- package/_baseFlatten-Bfr_Molw.js +0 -72
- package/_baseGet-DSZygzyq.js +0 -79
- package/_baseIsEqual-VgvaAFZG.js +0 -147
- package/_baseIteratee-Dbfsw5z8.js +0 -95
- package/_baseSlice-M5RKzt1A.js +0 -10
- package/_baseSum-wEbgNeUs.js +0 -10
- package/_baseUniq-BJcj69PL.js +0 -79
- package/_commonjsHelpers-DaMA6jEr.js +0 -8
- package/_createAggregator-k3TuAnxT.js +0 -53
- package/_getPrototype-Cr1Mk7BC.js +0 -5
- package/_getTag-CK2Sffaq.js +0 -90
- package/_isIterateeCall-DkJP7Rbx.js +0 -13
- package/_setToArray-C7yMOeww.js +0 -29
- package/cloneDeep-CF8TtLHr.js +0 -8
- package/countBy-CdYegFSu.js +0 -8
- package/debounce-DryYcbJ4.js +0 -56
- package/get-CH7kz5Ix.js +0 -8
- package/groupBy-br8xmD2R.js +0 -8
- package/iconify-BBckr5AQ.js +0 -1263
- package/identity-ByMq8VxU.js +0 -6
- package/index-BHAe_V9n.js +0 -12768
- package/index-BK-zfYhR.js +0 -358
- package/index-CA5CUNZO.js +0 -975
- package/index-Dj5C04IX.js +0 -568
- package/index-p5_wX7q1.js +0 -11729
- package/isNil-CjWwlQS3.js +0 -6
- package/isObject-B53jY8Qg.js +0 -7
- package/isObjectLike-BatpeCIi.js +0 -29
- package/isSymbol-C3_SC0Qp.js +0 -8
- package/last-7CdUxN0r.js +0 -7
- package/maxBy-Bc0dYHcO.js +0 -8
- package/sortBy-DY2JBf9n.js +0 -75
- package/sumBy-DuMASLPd.js +0 -8
- package/toFinite-BMy6GObD.js +0 -14
- package/toNumber-YVhnnJv4.js +0 -31
- package/useClueTypeConfig-Ct9Ygter.js +0 -2292
- package/utils-DmwSUrum.js +0 -129
package/hooks/useErrors.js
CHANGED
|
@@ -1,31 +1,35 @@
|
|
|
1
|
-
import { useContext
|
|
2
|
-
import { ClueDatabaseContext
|
|
3
|
-
import { b as
|
|
4
|
-
const
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import { useContext, useState, useEffect } from "react";
|
|
2
|
+
import { ClueDatabaseContext } from "./ClueDatabaseContext.js";
|
|
3
|
+
import { b as useClueEnrichSelector } from "../ActionForm-D6gYuFRR.js";
|
|
4
|
+
const useErrors = (value) => {
|
|
5
|
+
const database = useContext(ClueDatabaseContext);
|
|
6
|
+
const ready = useClueEnrichSelector((ctx) => ctx.ready);
|
|
7
|
+
const [errors, setErrors] = useState([]);
|
|
8
|
+
useEffect(() => {
|
|
9
|
+
if (!ready || !value || !(database == null ? void 0 : database.selectors) || database.selectors.closed) {
|
|
8
10
|
return;
|
|
9
|
-
|
|
10
|
-
|
|
11
|
+
}
|
|
12
|
+
const observable = database.selectors.find({ selector: { value, error: { $exists: true } } }).$.subscribe(
|
|
13
|
+
(records) => (
|
|
11
14
|
// Transform database records into simplified error objects
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
source:
|
|
15
|
-
message:
|
|
15
|
+
setErrors(
|
|
16
|
+
records.map((record) => ({
|
|
17
|
+
source: record.source,
|
|
18
|
+
message: record.error
|
|
16
19
|
}))
|
|
17
20
|
)
|
|
18
21
|
)
|
|
19
22
|
);
|
|
20
23
|
return () => {
|
|
21
24
|
try {
|
|
22
|
-
|
|
23
|
-
} catch (
|
|
24
|
-
console.warn(
|
|
25
|
+
observable.unsubscribe();
|
|
26
|
+
} catch (e) {
|
|
27
|
+
console.warn(e);
|
|
25
28
|
}
|
|
26
29
|
};
|
|
27
|
-
}, [
|
|
30
|
+
}, [database, ready, value]);
|
|
31
|
+
return errors;
|
|
28
32
|
};
|
|
29
33
|
export {
|
|
30
|
-
|
|
34
|
+
useErrors as default
|
|
31
35
|
};
|
|
@@ -11,5 +11,6 @@ export declare const useActionResult: (resultWithData: WithActionData<ActionResu
|
|
|
11
11
|
task_id?: string;
|
|
12
12
|
actionId: string;
|
|
13
13
|
action: import("../types/action").ActionDefinition;
|
|
14
|
+
onUpdate?: (result: WithActionData<ActionResult>) => void;
|
|
14
15
|
onComplete?: (result: WithActionData<ActionResult>) => void;
|
|
15
16
|
};
|
|
@@ -1,31 +1,40 @@
|
|
|
1
|
-
import { useState
|
|
2
|
-
import { u as
|
|
3
|
-
const
|
|
4
|
-
const [
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
1
|
+
import { useState, useRef, useMemo, useEffect } from "react";
|
|
2
|
+
import { u as useClueActions } from "../ActionForm-D6gYuFRR.js";
|
|
3
|
+
const useActionResult = (resultWithData, interval = 2e3) => {
|
|
4
|
+
const [result, setResult] = useState(resultWithData);
|
|
5
|
+
const timeoutRef = useRef(null);
|
|
6
|
+
const { getActionStatus } = useClueActions();
|
|
7
|
+
const taskId = useMemo(() => resultWithData == null ? void 0 : resultWithData.task_id, [resultWithData == null ? void 0 : resultWithData.task_id]);
|
|
8
|
+
const actionId = useMemo(() => resultWithData == null ? void 0 : resultWithData.actionId, [resultWithData == null ? void 0 : resultWithData.actionId]);
|
|
9
|
+
useEffect(() => {
|
|
10
|
+
if ((resultWithData == null ? void 0 : resultWithData.outcome) !== "pending" || !taskId) return;
|
|
11
|
+
let cancelled = false;
|
|
12
|
+
const poll = async () => {
|
|
13
|
+
const res = await getActionStatus(actionId, taskId);
|
|
14
|
+
if (!res) {
|
|
15
|
+
setResult({ outcome: "failure", done: true });
|
|
16
|
+
} else if (res.outcome === "success" || res.outcome === "failure") {
|
|
17
|
+
setResult({ ...res, done: true });
|
|
18
|
+
} else {
|
|
19
|
+
if (cancelled) return;
|
|
20
|
+
setResult({ ...res });
|
|
21
|
+
timeoutRef.current = setTimeout(poll, interval);
|
|
17
22
|
}
|
|
18
23
|
};
|
|
19
|
-
|
|
20
|
-
|
|
24
|
+
poll();
|
|
25
|
+
return () => {
|
|
26
|
+
cancelled = true;
|
|
27
|
+
if (timeoutRef.current) clearTimeout(timeoutRef.current);
|
|
21
28
|
};
|
|
22
|
-
}, [
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
29
|
+
}, [actionId, getActionStatus, interval, resultWithData == null ? void 0 : resultWithData.outcome, taskId]);
|
|
30
|
+
useEffect(() => {
|
|
31
|
+
setResult(resultWithData);
|
|
32
|
+
}, [resultWithData]);
|
|
33
|
+
return useMemo(
|
|
34
|
+
() => resultWithData || result ? { ...resultWithData, ...result } : void 0,
|
|
35
|
+
[resultWithData, result]
|
|
27
36
|
);
|
|
28
37
|
};
|
|
29
38
|
export {
|
|
30
|
-
|
|
39
|
+
useActionResult
|
|
31
40
|
};
|
package/hooks/useMyHighlights.js
CHANGED
|
@@ -1,44 +1,74 @@
|
|
|
1
|
-
import { getSubGraphNodeSet
|
|
2
|
-
import { safeAddEventListener
|
|
3
|
-
import { useMemo
|
|
4
|
-
const
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
import { getSubGraphNodeSet } from "../utils/graph.js";
|
|
2
|
+
import { safeAddEventListener } from "../utils/window.js";
|
|
3
|
+
import { useMemo, useState, useCallback, useEffect } from "react";
|
|
4
|
+
const useMyHighlights = (graph, onNodeSelectionChanged) => {
|
|
5
|
+
const data = useMemo(() => graph == null ? void 0 : graph.data, [graph]);
|
|
6
|
+
const [hoveredNode, setHoveredNode] = useState();
|
|
7
|
+
const [highlightedNodes, setHighlightedNodes] = useState(/* @__PURE__ */ new Set());
|
|
8
|
+
const [highlightedPath, setHighlightedPath] = useState(/* @__PURE__ */ new Set());
|
|
9
|
+
const [ctrlKeyDown, setCtrlKeyDown] = useState();
|
|
10
|
+
const onKeyPressed = useCallback((ev) => {
|
|
11
|
+
setCtrlKeyDown(ev.ctrlKey);
|
|
9
12
|
}, []);
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
(
|
|
15
|
-
|
|
16
|
-
|
|
13
|
+
const onKeyUnpressed = useCallback((ev) => {
|
|
14
|
+
setCtrlKeyDown(ev.ctrlKey);
|
|
15
|
+
}, []);
|
|
16
|
+
useEffect(() => {
|
|
17
|
+
return safeAddEventListener("keydown", onKeyPressed);
|
|
18
|
+
}, [onKeyPressed]);
|
|
19
|
+
useEffect(() => {
|
|
20
|
+
return safeAddEventListener("keyup", onKeyUnpressed);
|
|
21
|
+
}, [onKeyUnpressed]);
|
|
22
|
+
const onNodeHoveredChanged = useCallback((nodeId, isHovered) => {
|
|
23
|
+
if (isHovered) {
|
|
24
|
+
setHoveredNode(nodeId);
|
|
25
|
+
} else {
|
|
26
|
+
setHoveredNode("");
|
|
27
|
+
}
|
|
28
|
+
}, []);
|
|
29
|
+
const onNodeClicked = useCallback(
|
|
30
|
+
(nodeId, isSelected, event) => {
|
|
31
|
+
let newHighlightedNodes = /* @__PURE__ */ new Set();
|
|
32
|
+
if (isSelected) {
|
|
33
|
+
newHighlightedNodes = new Set(event.ctrlKey ? [...highlightedNodes, nodeId] : [nodeId]);
|
|
34
|
+
} else {
|
|
35
|
+
newHighlightedNodes = event.ctrlKey ? /* @__PURE__ */ new Set([...highlightedNodes]) : /* @__PURE__ */ new Set();
|
|
36
|
+
newHighlightedNodes.delete(nodeId);
|
|
37
|
+
}
|
|
38
|
+
setHighlightedNodes(newHighlightedNodes);
|
|
39
|
+
onNodeSelectionChanged == null ? void 0 : onNodeSelectionChanged([...newHighlightedNodes]);
|
|
17
40
|
},
|
|
18
|
-
[
|
|
19
|
-
), k = i(
|
|
20
|
-
(e) => d.size === 0 || d.has(e) ? 1 : 0.2,
|
|
21
|
-
[d]
|
|
41
|
+
[highlightedNodes, onNodeSelectionChanged]
|
|
22
42
|
);
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
43
|
+
const nodeOpacities = useCallback(
|
|
44
|
+
(nodeId) => {
|
|
45
|
+
return highlightedPath.size === 0 || highlightedPath.has(nodeId) ? 1 : 0.2;
|
|
46
|
+
},
|
|
47
|
+
[highlightedPath]
|
|
48
|
+
);
|
|
49
|
+
useEffect(() => {
|
|
50
|
+
let newHighlightedPath = /* @__PURE__ */ new Set();
|
|
51
|
+
if (hoveredNode) {
|
|
52
|
+
const subGraphNodes = getSubGraphNodeSet(hoveredNode, data);
|
|
53
|
+
newHighlightedPath = /* @__PURE__ */ new Set([...newHighlightedPath, ...subGraphNodes]);
|
|
54
|
+
}
|
|
55
|
+
if (highlightedNodes.size && (ctrlKeyDown || !hoveredNode)) {
|
|
56
|
+
highlightedNodes.forEach((highlightedNode) => {
|
|
57
|
+
const subGraphNodes = getSubGraphNodeSet(highlightedNode, data);
|
|
58
|
+
newHighlightedPath = /* @__PURE__ */ new Set([...newHighlightedPath, ...subGraphNodes]);
|
|
59
|
+
});
|
|
28
60
|
}
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
highlightedNodes: t,
|
|
39
|
-
hoveredNode: o
|
|
61
|
+
setHighlightedPath(newHighlightedPath);
|
|
62
|
+
}, [hoveredNode, highlightedNodes, ctrlKeyDown, data]);
|
|
63
|
+
return {
|
|
64
|
+
onNodeHoveredChanged,
|
|
65
|
+
onNodeClicked,
|
|
66
|
+
nodeOpacities,
|
|
67
|
+
highlightedPath,
|
|
68
|
+
highlightedNodes,
|
|
69
|
+
hoveredNode
|
|
40
70
|
};
|
|
41
71
|
};
|
|
42
72
|
export {
|
|
43
|
-
|
|
73
|
+
useMyHighlights as default
|
|
44
74
|
};
|
|
@@ -1,51 +1,80 @@
|
|
|
1
|
-
import { useCallback
|
|
2
|
-
import { i as
|
|
1
|
+
import { useCallback, useMemo, useState, useEffect, createContext, useContext } from "react";
|
|
2
|
+
import { i as isNil } from "../isNil-CIubwp4T.js";
|
|
3
3
|
import "react/jsx-runtime";
|
|
4
|
-
import { MY_LOCAL_STORAGE_PREFIX
|
|
5
|
-
function
|
|
6
|
-
const
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
() =>
|
|
14
|
-
|
|
4
|
+
import { MY_LOCAL_STORAGE_PREFIX } from "../utils/constants.js";
|
|
5
|
+
function useLocalStorage(prefix) {
|
|
6
|
+
const _buildKey = useCallback((name) => `${prefix}.${name}`, [prefix]);
|
|
7
|
+
const get = useCallback((key) => JSON.parse(localStorage.getItem(_buildKey(key))), [_buildKey]);
|
|
8
|
+
const set = useCallback(
|
|
9
|
+
(key, value) => localStorage.setItem(_buildKey(key), JSON.stringify(value)),
|
|
10
|
+
[_buildKey]
|
|
11
|
+
);
|
|
12
|
+
const remove = useCallback(
|
|
13
|
+
(key, withPrefix = false) => localStorage.removeItem(withPrefix ? key : _buildKey(key)),
|
|
14
|
+
[_buildKey]
|
|
15
|
+
);
|
|
16
|
+
const has = useCallback((key) => get(key) !== null, [get]);
|
|
17
|
+
const keys = useCallback(() => Object.keys(localStorage), []);
|
|
18
|
+
const items = useCallback(() => keys().map((k) => ({ key: k, value: JSON.parse(localStorage.getItem(k)) })), [keys]);
|
|
19
|
+
const clear = useCallback(
|
|
20
|
+
() => keys().forEach((key) => {
|
|
21
|
+
if (key.startsWith(prefix)) {
|
|
22
|
+
remove(key, true);
|
|
23
|
+
}
|
|
15
24
|
}),
|
|
16
|
-
[
|
|
25
|
+
[prefix, remove, keys]
|
|
17
26
|
);
|
|
18
|
-
return
|
|
27
|
+
return useMemo(
|
|
19
28
|
() => ({
|
|
20
|
-
get
|
|
21
|
-
set
|
|
22
|
-
remove
|
|
23
|
-
has
|
|
24
|
-
keys
|
|
25
|
-
items
|
|
26
|
-
clear
|
|
29
|
+
get,
|
|
30
|
+
set,
|
|
31
|
+
remove,
|
|
32
|
+
has,
|
|
33
|
+
keys,
|
|
34
|
+
items,
|
|
35
|
+
clear
|
|
27
36
|
}),
|
|
28
|
-
[
|
|
37
|
+
[get, set, remove, has, keys, items, clear]
|
|
29
38
|
);
|
|
30
39
|
}
|
|
31
|
-
function
|
|
32
|
-
const { get
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
40
|
+
function useLocalStorageItem(key, initialValue, prefix) {
|
|
41
|
+
const { get, set, has, remove } = useLocalStorage(prefix);
|
|
42
|
+
const [value, setValue] = useState(get(key) ?? initialValue);
|
|
43
|
+
useEffect(() => {
|
|
44
|
+
if (initialValue !== null && initialValue !== void 0 && !has(key)) {
|
|
45
|
+
set(key, initialValue);
|
|
46
|
+
}
|
|
47
|
+
}, [key, initialValue, has, set]);
|
|
48
|
+
return useMemo(
|
|
36
49
|
() => [
|
|
37
|
-
|
|
38
|
-
(
|
|
39
|
-
|
|
50
|
+
value,
|
|
51
|
+
(newValue, save = true) => {
|
|
52
|
+
if (save) {
|
|
53
|
+
if (!isNil(newValue)) {
|
|
54
|
+
set(key, newValue);
|
|
55
|
+
} else {
|
|
56
|
+
remove(key);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
setValue(newValue);
|
|
40
60
|
},
|
|
41
|
-
() =>
|
|
61
|
+
() => remove(key)
|
|
42
62
|
],
|
|
43
|
-
[
|
|
63
|
+
[key, value, set, remove]
|
|
44
64
|
);
|
|
45
65
|
}
|
|
46
|
-
const
|
|
66
|
+
const LocalStorageContext = createContext(null);
|
|
67
|
+
const useMyLocalStorage = () => {
|
|
68
|
+
return useLocalStorage(MY_LOCAL_STORAGE_PREFIX);
|
|
69
|
+
};
|
|
70
|
+
const useMyLocalStorageItem = (key, initialValue) => {
|
|
71
|
+
return useLocalStorageItem(key, initialValue, MY_LOCAL_STORAGE_PREFIX);
|
|
72
|
+
};
|
|
73
|
+
const useMyLocalStorageProvider = () => {
|
|
74
|
+
return useContext(LocalStorageContext);
|
|
75
|
+
};
|
|
47
76
|
export {
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
77
|
+
useMyLocalStorage as default,
|
|
78
|
+
useMyLocalStorageItem,
|
|
79
|
+
useMyLocalStorageProvider
|
|
51
80
|
};
|