Fix #37 DOWNLOAD DATASET button file size

Author: Hari Kiran

src/pages/DatasetDetailPage.tsx

@@ -88,41 +88,43 @@ const DatasetDetailPage: React.FC = () => {
 	const [expandedPaths, setExpandedPaths] = useState<string[]>([]);
 	const [originalTextMap, setOriginalTextMap] = useState<Map<HTMLElement, string>>(new Map());
 	const [jsonViewerKey, setJsonViewerKey] = useState(0);
-
+	const [jsonSize, setJsonSize] = useState<number>(0);
+	const [transformedDataset, setTransformedDataset] = useState<any>(null);
 
 
 	// Recursive function to find `_DataLink_`
 	const extractDataLinks = (obj: any, path: string): ExternalDataLink[] => {
 		const links: ExternalDataLink[] = [];
-
-		if (typeof obj === "object" && obj !== null) {
-			for (const key in obj) {
-				if (obj.hasOwnProperty(key)) {
-					if (key === "_DataLink_" && typeof obj[key] === "string") {
-						let correctedUrl = obj[key].replace(/:\$.*$/, "");
-
-						const sizeMatch = obj[key].match(/size=(\d+)/);
+	
+		const traverse = (node: any, currentPath: string) => {
+			if (typeof node === "object" && node !== null) {
+				for (const key in node) {
+					if (key === "_DataLink_" && typeof node[key] === "string") {
+						let correctedUrl = node[key].replace(/:\$.*$/, "");
+	
+						const sizeMatch = node[key].match(/size=(\d+)/);
 						const size = sizeMatch
 							? `${(parseInt(sizeMatch[1], 10) / 1024 / 1024).toFixed(2)} MB`
 							: "Unknown Size";
-
-						const subMatch = path.match(/sub-\d+/);
+	
+						const subMatch = currentPath.match(/sub-\d+/);
 						const subPath = subMatch ? subMatch[0] : "Unknown Sub";
-
+	
 						links.push({
-							name: `${path.split("/").pop() || "ExternalData"} (${size}) [/${subPath}]`,
+							name: `${currentPath.split("/").pop() || "ExternalData"} (${size}) [/${subPath}]`,
 							size,
-							path: subPath,
+							path: currentPath,  // keep full JSON path for file placement
 							url: correctedUrl,
 							index: links.length,
 						});
-					} else if (typeof obj[key] === "object") {
-						links.push(...extractDataLinks(obj[key], `${path}/${key}`));
+					} else if (typeof node[key] === "object") {
+						traverse(node[key], `${currentPath}/${key}`);
 					}
 				}
 			}
-		}
-
+		};
+	
+		traverse(obj, path);
 		return links;
 	};
 
@@ -210,9 +212,24 @@ const DatasetDetailPage: React.FC = () => {
 
 			setExternalLinks(links);
 			setInternalLinks(internalData);
+			const transformed = transformJsonForDisplay(datasetDocument);
+			setTransformedDataset(transformed);
+
+			const blob = new Blob([JSON.stringify(datasetDocument, null, 2)], { type: "application/json" });
+			setJsonSize(blob.size);
+
+			// // ✅ Construct download script dynamically
+			let script = `curl -L --create-dirs "https://neurojson.io:7777/${dbName}/${docId}" -o "${docId}.json"\n`;
+
+
+			externalLinks.forEach((link) => {
+				const url = link.url;
+				const match = url.match(/file=([^&]+)/);
+				const filename = match ? decodeURIComponent(match[1]) : `file-${link.index}`;
+				const outputPath = `$HOME/.neurojson/io/${dbName}/${docId}/${filename}`;
 
-			// ✅ Construct download script dynamically
-			const script = `curl -L --create-dirs "https://neurojson.io:7777/${dbName}/${docId}" -o "${docId}.json"`;
+				script += `curl -L --create-dirs "${url}" -o "${outputPath}"\n`;
+			});
 			setDownloadScript(script);
 		}
 	}, [datasetDocument]);	
@@ -582,7 +599,7 @@ const DatasetDetailPage: React.FC = () => {
 								"&:hover": { backgroundColor: "#ff9100" },
 							}}
 						>
-							Script to Download All Files (138 Bytes) (links: 0)
+							Script to Download All Files ({downloadScript.length} Bytes) (links: {externalLinks.length})
 						</Button>
 
 						<Box display="flex" alignItems="center" gap={1} sx={{ ml: "auto" }}>