make it json (#1)

* Update main.ts * refactor
The-Poolz · Dec 22, 2024 · 369d851 · 369d851
1 parent cab8b40
commit 369d851
Show file tree

Hide file tree

Showing 7 changed files with 88 additions and 64 deletions.
diff --git a/.gitignore b/.gitignore
@@ -12,4 +12,6 @@ dist
 /typechain-types
 
 temp.zip
-yarn.lock
+yarn.lock
+# to serve the app
+/serve
diff --git a/index.html b/index.html
diff --git a/package.json b/package.json
@@ -3,9 +3,11 @@
   "version": "1.0.0",
   "description": "",
   "main": "index.js",
+  "type": "module",
   "scripts": {
     "build": "tsc",
-    "deploy": "gh-pages -d dist"
+    "deploy": "gh-pages -d dist",
+    "generate": "node src/generate.js"
   },
   "repository": {
     "type": "git",
@@ -26,4 +28,4 @@
     "typescript": "^5.7.2",
     "undici": "^6.21.0"
   }
-}
+}
diff --git a/src/generate.js b/src/generate.js
@@ -0,0 +1,39 @@
+import { AVAILABLE_CHAINS } from "@poolzfinance/reacthelper";
+import fs from "fs";
+import path from "path";
+
+const outputDir = "./dist"; // Directory for generated files
+const indexSource = "./view/index.html"; // Source of index.html
+const indexDestination = path.join(outputDir, "index.html");
+
+// Ensure the output directory exists
+if (!fs.existsSync(outputDir)) {
+    fs.mkdirSync(outputDir, { recursive: true });
+}
+
+// Array to store metadata for the index
+const fileList = [];
+
+// Generate JSON files for each chain and collect metadata
+AVAILABLE_CHAINS.forEach((data, chainId) => {
+    const fileName = `${chainId}.json`;
+    const filePath = path.join(outputDir, fileName);
+    fs.writeFileSync(filePath, JSON.stringify(data, null, 2));
+    console.log(`Generated: ${filePath}`);
+
+    // Add to the list
+    fileList.push({
+        chainId,
+        fileName,
+        url: fileName,
+    });
+});
+
+// Create the list.json file
+const listFilePath = path.join(outputDir, "list.json");
+fs.writeFileSync(listFilePath, JSON.stringify(fileList, null, 2));
+console.log(`Generated: ${listFilePath}`);
+
+// Copy index.html to the output directory
+fs.copyFileSync(indexSource, indexDestination);
+console.log(`Copied index.html to ${indexDestination}`);
diff --git a/src/main.ts b/src/main.ts
diff --git a/tsconfig.json b/tsconfig.json
diff --git a/view/index.html b/view/index.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>JSON Viewer</title>
+    <script src="https://cdn.jsdelivr.net/npm/jsoneditor@9.10.0/dist/jsoneditor.min.js"></script>
+    <link href="https://cdn.jsdelivr.net/npm/jsoneditor@9.10.0/dist/jsoneditor.min.css" rel="stylesheet">
+    <style>
+        #jsoneditor { width: 100%; height: 400px; }
+    </style>
+</head>
+<body>
+    <h1>JSON Viewer</h1>
+    <p>Enter Chain ID to view data:</p>
+    <input type="text" id="chainIdInput" placeholder="Enter Chain ID">
+    <button onclick="fetchJSON()">Load JSON</button>
+    <div id="jsoneditor"></div>
+
+    <script>
+        const container = document.getElementById("jsoneditor");
+        const editor = new JSONEditor(container);
+
+        function fetchJSON() {
+            const chainId = document.getElementById("chainIdInput").value;
+            const url = `static-data/${chainId}.json`;
+
+            fetch(url)
+                .then(response => {
+                    if (!response.ok) {
+                        throw new Error(`Error: ${response.status}`);
+                    }
+                    return response.json();
+                })
+                .then(data => {
+                    editor.set(data);
+                })
+                .catch(error => {
+                    editor.set({ error: error.message });
+                });
+        }
+    </script>
+</body>
+</html>