diff --git a/app/components/InfoPanel.tsx b/app/components/InfoPanel.tsx
index bcdf5ee..f616829 100644
--- a/app/components/InfoPanel.tsx
+++ b/app/components/InfoPanel.tsx
@@ -4,24 +4,16 @@ import { PropertiesValue } from "./Properties/PropertiesValue";
import { InfoHeader } from "./InfoHeader";
import { ContainerInfo } from "./ContainerInfo";
import { useSelectedInfo } from "~/hooks/useSelectedInfo";
-import { useMemo } from "react";
-import { useJson } from "~/hooks/useJson";
-import { getRelatedPathsAtPath } from "~/utilities/relatedValues";
-import { useJsonColumnViewState } from "~/hooks/useJsonColumnView";
import { useRelatedPaths } from "~/hooks/useRelatedPaths";
export function InfoPanel() {
const selectedInfo = useSelectedInfo();
- const { selectedNodeId } = useJsonColumnViewState();
const relatedPaths = useRelatedPaths();
if (!selectedInfo) {
return <>>;
}
- const isSelectedLeafNode =
- selectedInfo.name !== "object" && selectedInfo.name !== "array";
-
return (
<>
@@ -34,7 +26,7 @@ export function InfoPanel() {
- {isSelectedLeafNode && }
+
>
);
diff --git a/app/utilities/relatedValues.ts b/app/utilities/relatedValues.ts
index f3abd7f..0b4371c 100644
--- a/app/utilities/relatedValues.ts
+++ b/app/utilities/relatedValues.ts
@@ -28,6 +28,10 @@ export function groupRelatedValues(
return "undefined";
} else if (value == null) {
return "null";
+ } else if (Array.isArray(value)) {
+ return "[...]";
+ } else if (typeof value === "object") {
+ return "{...}";
} else {
return value.toString();
}
@@ -71,6 +75,8 @@ export function getRelatedPathsAtPath(
if (inferredType.name !== "array") continue;
+ if (index + 1 === pathDepth) continue;
+
for (
let childIndex = 0;
childIndex < inferredType.value.length;
diff --git a/tests/relatedValues.test.ts b/tests/relatedValues.test.ts
index 1e1834c..b0eef6a 100644
--- a/tests/relatedValues.test.ts
+++ b/tests/relatedValues.test.ts
@@ -46,6 +46,9 @@ const json = {
},
id: "B65hEUWW01ErVKDDGImKcBquYhwEAkjW6Ic3lPY0299Cc",
created_at: "1607587513",
+ another_field: {
+ nested: "value",
+ },
modifiedAt: null,
},
{
@@ -75,11 +78,62 @@ const json = {
},
id: "B65hEUWW01ErVKDDGImKcBquYhwEAkjW6Ic3lPY0299Cc",
created_at: "1607587513",
+ another_field: {
+ nested: "value",
+ },
},
],
};
describe("calculateRelatedValuesGroups", () => {
+ test("it should return the correct values when path is an object", () => {
+ const path = "$.data.1.another_field";
+
+ const result = calculateRelatedValuesGroups(path, json);
+
+ expect(result).toMatchInlineSnapshot(`
+Array [
+ Object {
+ "paths": Array [
+ "$.data.1.another_field",
+ "$.data.2.another_field",
+ ],
+ "value": "{...}",
+ },
+ Object {
+ "paths": Array [
+ "$.data.0.another_field",
+ ],
+ "value": "undefined",
+ },
+]
+`);
+ });
+
+ test("it should return the correct values when path is an array", () => {
+ const path = "$.data.1.recent_asset_ids";
+
+ const result = calculateRelatedValuesGroups(path, json);
+
+ expect(result).toMatchInlineSnapshot(`
+Array [
+ Object {
+ "paths": Array [
+ "$.data.1.recent_asset_ids",
+ "$.data.2.recent_asset_ids",
+ ],
+ "value": "[...]",
+ },
+ Object {
+ "paths": Array [
+ "$.data.0.recent_asset_ids",
+ ],
+ "value": "undefined",
+ },
+]
+`);
+ });
+
test("it should return the correct related values grouped by value", () => {
const path = "$.data.1.playback_ids.0.policy";
@@ -106,7 +160,7 @@ describe("calculateRelatedValuesGroups", () => {
paths: ["$.data.2.playback_ids.1.policy"],
},
{
- value: "[object Object]",
+ value: "{...}",
paths: ["$.data.2.playback_ids.2.policy"],
},
]);