95e7cb4bd3
Backend - api/routes.rs models the Babel-style route shape; metric uses an untagged enum to round-trip both numeric hop counts and the literal "infinite" string the daemon emits for poisoned routes - routes_snapshot() runs the three GETs concurrently with try_join so the snapshot is internally consistent - poller spawns a second 5s loop emitting routes://updated; both loops are owned by the Poller and aborted together on stop_daemon Frontend - routes store mirrors the snapshot shape; tabbed view (radix-vue) with selected, fallback and queried lists - RouteTable component shared by selected/fallback; metric column is colour-coded (0 green, low neutral, high yellow, infinite red) - Queried subnets show a live `expires in 12s` countdown driven by a 1Hz tick ref instead of mutating the store
44 lines
1006 B
TypeScript
44 lines
1006 B
TypeScript
import { defineStore } from "pinia";
|
|
import { ref } from "vue";
|
|
import { api, type RoutesSnapshot } from "@/lib/api";
|
|
import { Events, on } from "@/lib/events";
|
|
|
|
export const useRoutesStore = defineStore("routes", () => {
|
|
const snapshot = ref<RoutesSnapshot>({
|
|
selected: [],
|
|
fallback: [],
|
|
queried: [],
|
|
});
|
|
const loading = ref(false);
|
|
const error = ref<string | null>(null);
|
|
|
|
let unlisten: (() => void) | null = null;
|
|
|
|
async function bootstrap() {
|
|
if (!unlisten) {
|
|
unlisten = await on<RoutesSnapshot>(Events.RoutesUpdated, (e) => {
|
|
snapshot.value = e.payload;
|
|
});
|
|
}
|
|
}
|
|
|
|
async function refresh() {
|
|
loading.value = true;
|
|
error.value = null;
|
|
try {
|
|
snapshot.value = await api.routesSnapshot();
|
|
} catch (e) {
|
|
error.value = String(e);
|
|
} finally {
|
|
loading.value = false;
|
|
}
|
|
}
|
|
|
|
function dispose() {
|
|
unlisten?.();
|
|
unlisten = null;
|
|
}
|
|
|
|
return { snapshot, loading, error, bootstrap, refresh, dispose };
|
|
});
|