From 2246d4d78e7ee97641bd9899450622521ddbb441 Mon Sep 17 00:00:00 2001 From: Arnaud Date: Fri, 11 Oct 2024 17:58:13 +0200 Subject: [PATCH] Fix lint --- e2e/upload.spec.ts | 1 - package-lock.json | 46 +++------ package.json | 4 +- src/routes/dashboard/peers.tsx | 174 +++++++++++++++++---------------- 4 files changed, 106 insertions(+), 119 deletions(-) diff --git a/e2e/upload.spec.ts b/e2e/upload.spec.ts index f5cde81..ebbf05e 100644 --- a/e2e/upload.spec.ts +++ b/e2e/upload.spec.ts @@ -1,5 +1,4 @@ import { test, expect } from '@playwright/test'; -import { Buffer } from 'buffer'; import { readFileSync } from 'fs'; import path, { dirname } from 'path'; import { fileURLToPath } from 'url'; diff --git a/package-lock.json b/package-lock.json index 6b671cb..4a92f3a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,13 +10,13 @@ "license": "MIT", "dependencies": { "@codex-storage/marketplace-ui-components": "^0.0.18", - "@codex-storage/sdk-js": "^0.0.7", + "@codex-storage/sdk-js": "^0.0.8", "@sentry/browser": "^8.32.0", "@sentry/react": "^8.31.0", "@tanstack/react-query": "^5.51.15", "@tanstack/react-router": "^1.58.7", - "echarts": "^5.5.1", "dotted-map": "^2.2.3", + "echarts": "^5.5.1", "idb-keyval": "^6.2.1", "lucide-react": "^0.445.0", "react": "^18.3.1", @@ -378,9 +378,9 @@ } }, "node_modules/@codex-storage/sdk-js": { - "version": "0.0.7", - "resolved": "https://registry.npmjs.org/@codex-storage/sdk-js/-/sdk-js-0.0.7.tgz", - "integrity": "sha512-Ffp0hDxGxDv+PwcWZheDGnP1l9CagKQZgYgXNznF9TtQGFPWr3LAyN6xrfzv+XwDSlL2SQrJuLM2z8DLcRt2PA==", + "version": "0.0.8", + "resolved": "https://registry.npmjs.org/@codex-storage/sdk-js/-/sdk-js-0.0.8.tgz", + "integrity": "sha512-NSHwDpWmRVHlCJHUDVr7FZ0HBxpyoFNXHTjPqOPeQDaGlN+5Yzf/9aBU+lmYVdvIk68BQIzlScMIisRf8IYw9A==", "dependencies": { "valibot": "^0.32.0" }, @@ -567,11 +567,6 @@ "@jridgewell/sourcemap-codec": "^1.4.14" } }, - "node_modules/@kurkle/color": { - "version": "0.3.2", - "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.2.tgz", - "integrity": "sha512-fuscdXJ9G1qb7W8VdHi+IwRqij3lBkosAm4ydQtEmbY58OzHXqQhvlxqEkoz0yssNVn38bcpRWgA9PP+OGoisw==" - }, "node_modules/@nodelib/fs.scandir": { "version": "2.1.5", "dev": true, @@ -2129,17 +2124,6 @@ "node": ">=4" } }, - "node_modules/chart.js": { - "version": "4.4.4", - "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.4.4.tgz", - "integrity": "sha512-emICKGBABnxhMjUjlYRR12PmOXhJ2eJjEHL2/dZlWjxRAZT1D8xplLFq5M0tMQK8ja+wBS/tuVEJB5C6r7VxJA==", - "dependencies": { - "@kurkle/color": "^0.3.0" - }, - "engines": { - "pnpm": ">=8" - } - }, "node_modules/chokidar": { "version": "3.6.0", "dev": true, @@ -2276,6 +2260,15 @@ "url": "https://dotenvx.com" } }, + "node_modules/dotted-map": { + "version": "2.2.3", + "resolved": "https://registry.npmjs.org/dotted-map/-/dotted-map-2.2.3.tgz", + "integrity": "sha512-8hyOOHHLLVCcCisM3yb9hqp+3bJ7TSMcr1SfrUw8Wxp5UMqih35jIvUyagweCooJbz/EH1nC9GGuPysh7+YlAg==", + "dependencies": { + "@turf/boolean-point-in-polygon": "^6.0.1", + "proj4": "^2.6.1" + } + }, "node_modules/echarts": { "version": "5.5.1", "resolved": "https://registry.npmjs.org/echarts/-/echarts-5.5.1.tgz", @@ -2290,15 +2283,6 @@ "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz", "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==" }, - "node_modules/dotted-map": { - "version": "2.2.3", - "resolved": "https://registry.npmjs.org/dotted-map/-/dotted-map-2.2.3.tgz", - "integrity": "sha512-8hyOOHHLLVCcCisM3yb9hqp+3bJ7TSMcr1SfrUw8Wxp5UMqih35jIvUyagweCooJbz/EH1nC9GGuPysh7+YlAg==", - "dependencies": { - "@turf/boolean-point-in-polygon": "^6.0.1", - "proj4": "^2.6.1" - } - }, "node_modules/escalade": { "version": "3.2.0", "dev": true, @@ -4662,4 +4646,4 @@ "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==" } } -} \ No newline at end of file +} diff --git a/package.json b/package.json index 8586625..71db88d 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,7 @@ "compile": "tsc --noEmit", "build": "tsc -b && vite build", "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0", - "preview": "vite preview", + "preview": "vite preview --host 127.0.0.1 --port 5173", "format": "prettier --write ./src", "test": "npx playwright test" }, @@ -25,7 +25,7 @@ ], "dependencies": { "@codex-storage/marketplace-ui-components": "^0.0.18", - "@codex-storage/sdk-js": "^0.0.7", + "@codex-storage/sdk-js": "^0.0.8", "@sentry/browser": "^8.32.0", "@sentry/react": "^8.31.0", "@tanstack/react-query": "^5.51.15", diff --git a/src/routes/dashboard/peers.tsx b/src/routes/dashboard/peers.tsx index 6682e60..de64e21 100644 --- a/src/routes/dashboard/peers.tsx +++ b/src/routes/dashboard/peers.tsx @@ -13,90 +13,94 @@ import { CodexSdk } from "../../sdk/codex"; // This function accepts the same arguments as DottedMap in the example above. const mapJsonString = getMapJSON({ height: 60, grid: "diagonal" }); +const Peers = () => { + const [pins, setPins] = useState<[PeerPin, number][]>([]); + const { data } = useQuery({ + queryFn: () => + CodexSdk.debug() + .info() + .then((s) => Promises.rejectOnError(s)), + queryKey: ["debug"], + + // No need to retry because if the connection to the node + // is back again, all the queries will be invalidated. + retry: false, + + // The client node should be local, so display the cache value while + // making a background request looks good. + staleTime: 0, + + // Refreshing when focus returns can be useful if a user comes back + // to the UI after performing an operation in the terminal. + refetchOnWindowFocus: true, + + // Throw the error to the error boundary + throwOnError: true, + }); + + const onPinAdd = useCallback((pin: PeerPin) => { + setPins((val) => { + const [, quantity = 0] = + val.find(([p]) => p.lat === pin.lat && p.lng == pin.lng) || []; + return [...val, [pin, quantity + 1]]; + }); + }, []); + + // It’s safe to re-create the map at each render, because of the + // pre-computation it’s super fast ⚡️ + const map = new DottedMap({ map: JSON.parse(mapJsonString) }); + + pins.map(([pin, quantity]) => + map.addPin({ + lat: pin.lat, + lng: pin.lng, + svgOptions: { color: "#d6ff79", radius: 0.8 * quantity }, + }) + ); + + const svgMap = map.getSVG({ + radius: 0.42, + color: "#423B38", + shape: "circle", + backgroundColor: "#020300", + }); + + const headers = ["Country", "PeerId", "Active"]; + + const rows = + (data?.table?.nodes || []).map((node) => ( + , + {node.peerId}, + + {node.seen ? ( +
+ ) : ( +
+ )} + , + ]}> + )) || []; + + return ( +
+ {/* */} + +
+ + + + ); +}; + export const Route = createFileRoute("/dashboard/peers")({ - component: () => { - const [pins, setPins] = useState<[PeerPin, number][]>([]); - const { data } = useQuery({ - queryFn: () => - CodexSdk.debug.info().then((s) => Promises.rejectOnError(s)), - queryKey: ["debug"], - - // No need to retry because if the connection to the node - // is back again, all the queries will be invalidated. - retry: false, - - // The client node should be local, so display the cache value while - // making a background request looks good. - staleTime: 0, - - // Refreshing when focus returns can be useful if a user comes back - // to the UI after performing an operation in the terminal. - refetchOnWindowFocus: true, - - // Throw the error to the error boundary - throwOnError: true, - }); - - const onPinAdd = useCallback((pin: PeerPin) => { - setPins((val) => { - const [, quantity = 0] = - val.find(([p]) => p.lat === pin.lat && p.lng == pin.lng) || []; - return [...val, [pin, quantity + 1]]; - }); - }, []); - - // It’s safe to re-create the map at each render, because of the - // pre-computation it’s super fast ⚡️ - const map = new DottedMap({ map: JSON.parse(mapJsonString) }); - - pins.map(([pin, quantity]) => - map.addPin({ - lat: pin.lat, - lng: pin.lng, - svgOptions: { color: "#d6ff79", radius: 0.8 * quantity }, - }) - ); - - const svgMap = map.getSVG({ - radius: 0.42, - color: "#423B38", - shape: "circle", - backgroundColor: "#020300", - }); - - const headers = ["Country", "PeerId", "Active"]; - - const rows = - ((data as any)?.table?.nodes || []).map((node: any) => ( - , - {node.peerId}, - - {node.seen ? ( -
- ) : ( -
- )} - , - ]}> - )) || []; - - return ( -
- {/* */} - -
- -
- - ); - }, + component: Peers, });