fix ts error

th2-net · Nov 27, 2024 · dda7e05 · dda7e05
1 parent 45911a9
commit dda7e05
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 28 deletions.
diff --git a/src/components/JSONViewer/FileChoosing.tsx b/src/components/JSONViewer/FileChoosing.tsx
@@ -108,7 +108,6 @@ const FileChoosing = ({
 								id: nanoid(),
 								parentIds: [],
 								key: filePath,
-								height: 22,
 								failed: false,
 								viewInstruction: '',
 								simpleFields: [],

diff --git a/src/components/JSONViewer/TreeLeaf.tsx b/src/components/JSONViewer/TreeLeaf.tsx
@@ -74,15 +74,14 @@ const TreeLeaf = ({ treeNode, type }: { treeNode: TreeNode; type: PanelType }) =
 
 	useEffect(() => {
 		const observer = new ResizeObserver(entries => {
-			if (chunk)
-				JSONViewerStore.setChunkElement(
-					chunk,
-					treeNode.id,
-					entries[0].borderBoxSize?.length > 0
-						? entries[0].borderBoxSize[0].blockSize
-						: entries[0].contentRect.height,
-					type,
-				);
+			JSONViewerStore.setChunkElement(
+				chunk,
+				treeNode.id,
+				entries[0].borderBoxSize?.length > 0
+					? entries[0].borderBoxSize[0].blockSize
+					: entries[0].contentRect.height,
+				type,
+			);
 		});
 		if (leafRef.current) {
 			observer.observe(leafRef.current);
@@ -92,6 +91,11 @@ const TreeLeaf = ({ treeNode, type }: { treeNode: TreeNode; type: PanelType }) =
 		};
 	}, []);
 
+	useEffect(() => {
+		if (leafRef.current)
+			JSONViewerStore.setChunkElement(chunk, treeNode.id, leafRef.current.offsetHeight, type);
+	}, [leafRef.current]);
+
 	const toggleNode = () => {
 		if (open) {
 			setOpen(false);

diff --git a/src/components/JSONViewer/TreeList.tsx b/src/components/JSONViewer/TreeList.tsx
@@ -22,7 +22,7 @@ const TreeList = ({ type }: { type: PanelType }) => {
 							dataNode.id,
 					  )}`
 					: 'lastElement' in dataNode
-					? `${dataNode.chunk}-${dataNode.firstElement}-${dataNode.lastElement}`
+					? `${dataNode.chunk}-${dataNode.firstElement}-${dataNode.lastElement}-${dataNode.height}`
 					: dataNode.name
 			}`,
 		[],

diff --git a/src/stores/JSONViewer/JSONViewerStore.ts b/src/stores/JSONViewer/JSONViewerStore.ts
@@ -61,14 +61,14 @@ export class JSONViewerStore {
 			() => this.openTreeNodes.default.values(),
 			() => {
 				this.initChunksData('default');
-				this.initChunksData('compare');
+				this.initChunksData('compare', false);
 			},
 		);
 
 		reaction(
 			() => this.openTreeNodes.compare.values(),
 			() => {
-				this.initChunksData('default');
+				this.initChunksData('default', false);
 				this.initChunksData('compare');
 			},
 		);
@@ -341,8 +341,8 @@ export class JSONViewerStore {
 		}
 	}
 
-	@action initChunksData(type: PanelType) {
-		this.clearChunksData(type);
+	@action initChunksData(type: PanelType, clear = true) {
+		if (clear) this.clearChunksData(type);
 		this.treeNodes[type]
 			.filter(node => node.parentIds.every(parentId => this.openTreeNodes[type].has(parentId)))
 			.forEach(node => {
@@ -497,10 +497,15 @@ export class JSONViewerStore {
 					)
 					.flatMap(node => [
 						...this.chunksHeights.default.filter(
-							chunkData => chunkData.lastElement === '' && chunkData.firstElement === node.id,
+							chunkData =>
+								chunkData.height > 0 &&
+								chunkData.lastElement === '' &&
+								chunkData.firstElement === node.id,
 						),
 						node,
-						...this.chunksHeights.default.filter(chunkData => chunkData.lastElement === node.id),
+						...this.chunksHeights.default.filter(
+							chunkData => chunkData.height > 0 && chunkData.lastElement === node.id,
+						),
 					]),
 			],
 			compare: [
@@ -511,10 +516,15 @@ export class JSONViewerStore {
 					)
 					.flatMap(node => [
 						...this.chunksHeights.compare.filter(
-							chunkData => chunkData.lastElement === '' && chunkData.firstElement === node.id,
+							chunkData =>
+								chunkData.height > 0 &&
+								chunkData.lastElement === '' &&
+								chunkData.firstElement === node.id,
 						),
 						node,
-						...this.chunksHeights.compare.filter(chunkData => chunkData.lastElement === node.id),
+						...this.chunksHeights.compare.filter(
+							chunkData => chunkData.height > 0 && chunkData.lastElement === node.id,
+						),
 					]),
 			],
 		};
@@ -569,15 +579,8 @@ export class JSONViewerStore {
 		);
 		for (let i = 0; i < newKeys.length; i++) {
 			const lastExisting =
-				sameKeys
-					.concat(exclusiveKeys)
-					.sort()
-					.findLast(key => key <= newKeys[i]) || '';
-			const firstExisting =
-				sameKeys
-					.concat(exclusiveKeys)
-					.sort()
-					.find(key => key >= newKeys[i]) || '';
+				[...keys1].reverse().find(key => Number(key) <= Number(newKeys[i])) || '';
+			const firstExisting = keys1.find(key => Number(key) >= Number(newKeys[i])) || '';
 			chunkFixed.push({
 				chunk: Number(newKeys[i]),
 				firstElement: chunks1[firstExisting]?.firstElement || '',