mirror of
https://github.com/ipnet-mesh/meshcore-hub.git
synced 2026-07-27 20:12:57 +02:00
715659607a
Replace all window.Chart / window.L / window.QRCode globals and the charts.js helper script with bundled React components: - react-chartjs-2: typed config builders in utils/charts.ts (buildLineChart, buildActivityChart, buildStackedBar, buildRoutesTrend, buildRouteDetailStrip + ChartColors, averageRouteTier, routeQualityToTier) and wrappers in components/charts/Charts.tsx (ActivityChart, TrendLineChart, StackedBarChart, RoutesTrendChart, RouteDetailStrip). utils/charts.ts imports chart.js/auto. Wired into Home, Dashboard, Routes. - react-leaflet: MapPage rewritten with MapContainer/TileLayer/Marker/Popup + a useMap MapController for fit-bounds and memoized markers; NodeDetail static hero map with divIcon marker + OffsetCenter. Both import leaflet/dist/leaflet.css. - react-qr-code: replaces window.QRCode in Channels and NodeDetail. Bundling & shell: - Chart.js, Leaflet (+CSS), react-qr-code now bundled by Vite; removed the leaflet/chart.js/qrcodejs vendor <script>/<link> tags from spa.html and their copy steps from build.js (fonts stay vendored). Deleted charts.js. - Moved the Vite CSS bundle (asset_app_css) into <head> before app.css so app.css dark-mode Leaflet overrides win over the bundled leaflet.css. - Dropped the chart globals from the Window type declaration. Tests/docs: - test_caching.py: removed charts.js-specific tests; generic JS-cache tests now target spa/app.js. - Updated charts.js cross-references in collector/routes.py + test_routes.py to point at spa-react/utils/charts.ts. Verified: tsc --noEmit clean, npm run build (153 modules), pytest tests/test_web (255 passed), pre-commit (passed).
121 lines
3.1 KiB
JavaScript
121 lines
3.1 KiB
JavaScript
import { execSync } from "node:child_process";
|
|
import {
|
|
cpSync,
|
|
existsSync,
|
|
mkdirSync,
|
|
readFileSync,
|
|
readdirSync,
|
|
writeFileSync,
|
|
} from "node:fs";
|
|
import { createHash } from "node:crypto";
|
|
import { join } from "node:path";
|
|
|
|
const STATIC = join("src", "meshcore_hub", "web", "static");
|
|
const VENDOR = join(STATIC, "vendor");
|
|
const DIST = join(STATIC, "dist");
|
|
|
|
function vendor(pkg, files, dest) {
|
|
const out = join(VENDOR, dest);
|
|
mkdirSync(out, { recursive: true });
|
|
for (const f of files) {
|
|
const src = join("node_modules", pkg, f);
|
|
if (!existsSync(src)) {
|
|
console.error(` MISSING: ${src}`);
|
|
process.exit(1);
|
|
}
|
|
cpSync(src, join(out, f.split("/").pop()), { recursive: true });
|
|
}
|
|
}
|
|
|
|
console.log("Building Tailwind CSS...");
|
|
execSync(
|
|
`npx @tailwindcss/cli build --input ${join(STATIC, "css", "input.css")} --output ${join(STATIC, "css", "tailwind.css")} --minify`,
|
|
{ stdio: "inherit" },
|
|
);
|
|
|
|
console.log("Copying vendor files...");
|
|
|
|
vendor(
|
|
"@fontsource-variable/ibm-plex-sans",
|
|
[
|
|
"files/ibm-plex-sans-latin-wght-normal.woff2",
|
|
"files/ibm-plex-sans-latin-ext-wght-normal.woff2",
|
|
],
|
|
"fonts",
|
|
);
|
|
vendor(
|
|
"@fontsource/ibm-plex-mono",
|
|
[
|
|
"files/ibm-plex-mono-latin-400-normal.woff2",
|
|
"files/ibm-plex-mono-latin-ext-400-normal.woff2",
|
|
],
|
|
"fonts",
|
|
);
|
|
|
|
console.log("Bundling SPA with Vite...");
|
|
execSync("npx vite build", { stdio: "inherit" });
|
|
|
|
// Vite emits a copy of the input HTML preserving its path relative to the
|
|
// project root (dist/src/…/index.html). The Jinja2 template is the real
|
|
// HTML shell, so remove the artifact.
|
|
import { rmSync } from "node:fs";
|
|
const staleHtmlDir = join(DIST, "src");
|
|
if (existsSync(staleHtmlDir)) {
|
|
rmSync(staleHtmlDir, { recursive: true, force: true });
|
|
}
|
|
|
|
console.log("Generating assets manifest...");
|
|
|
|
const viteManifestPath = join(DIST, ".vite", "manifest.json");
|
|
const assets = {};
|
|
|
|
if (existsSync(viteManifestPath)) {
|
|
const viteManifest = JSON.parse(readFileSync(viteManifestPath, "utf-8"));
|
|
for (const [, info] of Object.entries(viteManifest)) {
|
|
if (!info.isEntry) continue;
|
|
assets["app.js"] = info.file;
|
|
if (info.css && info.css.length > 0) {
|
|
assets["app.css"] = info.css[0];
|
|
}
|
|
}
|
|
}
|
|
|
|
const vendorFiles = {};
|
|
|
|
const vendorHashes = {};
|
|
for (const [name, path] of Object.entries(vendorFiles)) {
|
|
if (existsSync(path)) {
|
|
const hash = createHash("sha256")
|
|
.update(readFileSync(path))
|
|
.digest("hex")
|
|
.slice(0, 8);
|
|
vendorHashes[name] = hash;
|
|
}
|
|
}
|
|
|
|
const localesDir = join(STATIC, "locales");
|
|
let localeContent = "";
|
|
if (existsSync(localesDir)) {
|
|
const localeFiles = readdirSync(localesDir)
|
|
.filter((f) => f.endsWith(".json"))
|
|
.sort();
|
|
for (const f of localeFiles) {
|
|
localeContent += readFileSync(join(localesDir, f), "utf-8");
|
|
}
|
|
}
|
|
const localeVersion =
|
|
localeContent.length > 0
|
|
? createHash("sha256").update(localeContent).digest("hex").slice(0, 8)
|
|
: "";
|
|
|
|
const manifest = {
|
|
...assets,
|
|
vendor: vendorHashes,
|
|
locale_version: localeVersion,
|
|
};
|
|
|
|
writeFileSync(join(DIST, "assets.json"), JSON.stringify(manifest, null, 2));
|
|
console.log(" Manifest:", JSON.stringify(manifest, null, 2));
|
|
|
|
console.log("Done.");
|