@sjvair/monitor-map 4.2.0 → 4.3.0

package/dist/lib/monitors/subscriptions.js

@@ -0,0 +1,9 @@
+import { getSubscriptions } from "@sjvair/sdk/account";
+export function getApiToken() {
+    const token = globalThis["USER"]?.api_token;
+    return typeof token === "string" && token !== "" ? token : undefined;
+}
+export async function loadSubscriptionLevel(monitorId, options) {
+    const subscriptions = await getSubscriptions(getApiToken(), { signal: options?.signal });
+    return subscriptions.find((s) => s.monitor === monitorId)?.level ?? null;
+}

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@sjvair/monitor-map",
 	"description": "SJVAir's interactive monitor map",
-	"version": "4.2.0",
+	"version": "4.3.0",
 	"repository": {
 		"type": "git",
 		"url": "https://github.com/SJVAir/monitor-map"
@@ -84,7 +84,7 @@
 		"@lucide/svelte": "^1.46.0",
 		"@maptiler/sdk": "^4.1.0",
 		"@maptiler/weather": "^4.0.1",
-		"@sjvair/sdk": "npm:@jsr/sjvair__sdk@^4.5.0",
+		"@sjvair/sdk": "npm:@jsr/sjvair__sdk@^4.7.0",
 		"@tstk/builtin-extensions": "npm:@jsr/tstk__builtin-extensions@^1.0.8",
 		"@tstk/utils": "npm:@jsr/tstk__utils@^1.1.2",
 		"@turf/area": "^7.4.0",

package/src/lib/abort.ts

@@ -0,0 +1,59 @@
+export type SignalOptions = { signal?: AbortSignal };
+
+/**
+ * A signal that aborts as soon as any input does, with that input's reason. Already aborted if
+ * any input is. Undefined inputs are ignored. Call `dispose()` to drop the listeners.
+ */
+export function anySignal(...signals: Array<AbortSignal | undefined>): {
+	signal: AbortSignal;
+	dispose(): void;
+} {
+	const controller = new AbortController();
+	const cleanups: Array<() => void> = [];
+	const dispose = () => {
+		for (const cleanup of cleanups.splice(0)) cleanup();
+	};
+
+	for (const input of signals) {
+		if (!input) continue;
+		if (input.aborted) {
+			controller.abort(input.reason);
+			dispose();
+			break;
+		}
+		const onAbort = () => {
+			controller.abort(input.reason);
+			dispose();
+		};
+		input.addEventListener("abort", onAbort, { once: true });
+		cleanups.push(() => input.removeEventListener("abort", onAbort));
+	}
+
+	return { signal: controller.signal, dispose };
+}
+
+/**
+ * Settles like `promise`, unless `signal` aborts first, in which case it rejects with
+ * `signal.reason`. The inner promise's later outcome is swallowed.
+ */
+export function untilAborted<T>(promise: Promise<T>, signal: AbortSignal | undefined): Promise<T> {
+	if (!signal) return promise;
+	if (signal.aborted) {
+		promise.catch(() => {});
+		return Promise.reject(signal.reason);
+	}
+	return new Promise<T>((resolve, reject) => {
+		const onAbort = () => reject(signal.reason);
+		signal.addEventListener("abort", onAbort, { once: true });
+		promise.then(
+			(value) => {
+				signal.removeEventListener("abort", onAbort);
+				resolve(value);
+			},
+			(error) => {
+				signal.removeEventListener("abort", onAbort);
+				reject(error);
+			}
+		);
+	});
+}

package/src/lib/collocation-sites/collocations.svelte.ts

@@ -1,22 +1,25 @@
 import { getCollocationSites, type CollocationSite } from "@sjvair/sdk";
+import type { SignalOptions } from "$lib/abort";
 
 class CollocationSitesManager {
 	initialized: boolean = $state(false);
 
 	collocationSites: Array<CollocationSite> | null = $state(null);
 
-	async init(): Promise<void> {
+	async init({ signal }: SignalOptions = {}): Promise<void> {
 		if (this.initialized) return;
+		if (signal?.aborted) throw signal.reason;
 
-		this.collocationSites = await getCollocationSites();
+		this.collocationSites = await getCollocationSites({ signal });
 
 		this.initialized = true;
 	}
 
-	async update(): Promise<void> {
+	async update({ signal }: SignalOptions = {}): Promise<void> {
 		if (!this.initialized) return;
+		if (signal?.aborted) throw signal.reason;
 
-		this.collocationSites = await getCollocationSites();
+		this.collocationSites = await getCollocationSites({ signal });
 	}
 }
 

package/src/lib/data-chart/DataChart.svelte

@@ -143,12 +143,27 @@
 	};
 
 	let chartRequest = 0;
+	let chartController: AbortController | undefined;
+
+	// A closed panel cancels its in-flight fetch.
+	$effect(() => () => chartController?.abort());
 
 	// `silent` keeps the current chart on screen while a timed refresh loads.
 	async function loadChartData({ silent = false } = {}) {
 		const request = ++chartRequest;
+		chartController?.abort();
+		const controller = (chartController = new AbortController());
 		if (!silent) chartManager.loading = true;
-		const data = await fetchChartData(monitor, chartManager.dateRange, pollutant);
+		let data: Awaited<ReturnType<typeof fetchChartData>>;
+		try {
+			data = await fetchChartData(monitor, chartManager.dateRange, pollutant, {
+				signal: controller.signal
+			});
+		} catch (err) {
+			// Superseded or closed: the newer call owns `loading` and the chart, so leave both.
+			if (controller.signal.aborted) return;
+			throw err;
+		}
 		// A newer request (another range, monitor, pollutant or refresh) owns the chart now.
 		if (request !== chartRequest) return;
 		// A failed request resolves to [] (an empty range is [[], []]); a background refresh

package/src/lib/data-chart/requests.ts

@@ -2,6 +2,7 @@ import { getMonitorEntries, type MonitorDetails, type MonitorEntry } from "@sjva
 import { getUnixTime, parseISO, differenceInMinutes, addMinutes } from "date-fns";
 import type { PanelPollutant } from "../monitors/panel-pollutant";
 import type { DateRange } from "./DateRange";
+import type { SignalOptions } from "$lib/abort";
 
 /** The monitor fields the chart reads. */
 export type ChartMonitor = Pick<MonitorDetails, "id" | "name" | "type" | "data_source">;
@@ -9,14 +10,18 @@ export type ChartMonitor = Pick<MonitorDetails, "id" | "name" | "type" | "data_s
 export async function fetchChartData(
 	m: ChartMonitor,
 	d: DateRange,
-	entryType: PanelPollutant
+	entryType: PanelPollutant,
+	options: SignalOptions = {}
 ): Promise<uPlot.AlignedData> {
-	return await getMonitorEntries({
-		entryType,
-		monitorId: m.id,
-		timestampGte: d.start,
-		timestampLte: d.end
-	})
+	return await getMonitorEntries(
+		{
+			entryType,
+			monitorId: m.id,
+			timestampGte: d.start,
+			timestampLte: d.end
+		},
+		{ signal: options.signal }
+	)
 		.then((entries) => {
 			const xAxisData: Array<Date> = [];
 			const updateDuration = m.data_source.name === "PurpleAir" ? 2 : 60;
@@ -41,6 +46,8 @@ export async function fetchChartData(
 			return [xAxisData.map((d) => getUnixTime(d)), yAxisRecord] as uPlot.AlignedData;
 		})
 		.catch((err) => {
+			// A cancelled request is not a failure: let the caller see the reason, log nothing.
+			if (options.signal?.aborted) throw options.signal.reason;
 			console.error("Failed to load chart data: ", err);
 			return [] as uPlot.AlignedData;
 		});

package/src/lib/ev-stations/ev-stations.svelte.ts

@@ -5,6 +5,7 @@ import {
 	evNetworkTypes,
 	facilityTypes
 } from "./data-maps";
+import type { SignalOptions } from "$lib/abort";
 import type { EvStation } from "./types";
 import * as ZipCodes from "./zip-codes";
 
@@ -12,12 +13,12 @@ class EvStationsManager {
 	lvl2Stations: Array<EvStation> | undefined = $state();
 	lvl3Stations: Array<EvStation> | undefined = $state();
 
-	async loadLvl3Stations(): Promise<void> {
-		this.lvl3Stations = await fetchEvStations("dc_fast");
+	async loadLvl3Stations({ signal }: SignalOptions = {}): Promise<void> {
+		this.lvl3Stations = await fetchEvStations("dc_fast", signal);
 	}
 
-	async loadLvl2Stations(): Promise<void> {
-		this.lvl2Stations = await fetchEvStations("2");
+	async loadLvl2Stations({ signal }: SignalOptions = {}): Promise<void> {
+		this.lvl2Stations = await fetchEvStations("2", signal);
 	}
 }
 
@@ -25,7 +26,11 @@ const zipCodes = Object.values(ZipCodes)
 	.reduce((prev, curr) => prev.concat(curr))
 	.join(",");
 
-async function fetchEvStations(chargingLevel: "2" | "dc_fast"): Promise<Array<EvStation>> {
+async function fetchEvStations(
+	chargingLevel: "2" | "dc_fast",
+	signal?: AbortSignal
+): Promise<Array<EvStation>> {
+	if (signal?.aborted) throw signal.reason;
 	const url = new URL(`https://developer.nlr.gov/api/alt-fuel-stations/v1.json`);
 	url.searchParams.set("fuel_type", "ELEC");
 	url.searchParams.set("state", "CA");
@@ -35,7 +40,7 @@ async function fetchEvStations(chargingLevel: "2" | "dc_fast"): Promise<Array<Ev
 	url.searchParams.set("zip", zipCodes);
 	url.searchParams.set("api_key", import.meta.env.VITE_NREL_KEY);
 
-	return await fetch(url)
+	return await fetch(url, { signal })
 		.then(async (res) => await res.json())
 		.then((data) => {
 			const fuelStations: Array<EvStation> = data.fuel_stations!;

package/src/lib/hms/hms.svelte.ts

@@ -4,6 +4,7 @@ import {
 	type HMSFireGeoJSON,
 	type HMSSmokeGeoJSON
 } from "@sjvair/sdk/hms";
+import type { SignalOptions } from "$lib/abort";
 import clustersDbscan from "@turf/clusters-dbscan";
 import { featureCollection, point } from "@turf/helpers";
 
@@ -22,22 +23,27 @@ class HmsManager {
 	fire: Array<HMSFireGeoJSON & { frp: number }> | undefined = $state();
 	fireGroups: Array<HMSFireGroup> | undefined = $state();
 
-	async init() {
-		await Promise.allSettled([this.loadSmoke(), this.loadFire()]);
+	async init({ signal }: SignalOptions = {}) {
+		if (signal?.aborted) throw signal.reason;
+		await Promise.allSettled([this.loadSmoke({ signal }), this.loadFire({ signal })]);
+		if (signal?.aborted) throw signal.reason;
 	}
 
-	async loadSmoke() {
-		this.smoke = await getHMSSmoke();
+	async loadSmoke({ signal }: SignalOptions = {}) {
+		if (signal?.aborted) throw signal.reason;
+		this.smoke = await getHMSSmoke({ signal });
 	}
 
-	async loadFire() {
+	async loadFire({ signal }: SignalOptions = {}) {
 		try {
-			const raw = await getHMSFire();
+			if (signal?.aborted) throw signal.reason;
+			const raw = await getHMSFire({ signal });
 			const filtered = raw.filter((d): d is HMSFireGeoJSON & { frp: number } => d.frp !== null);
 			const deduped = deduplicateByCoordinates(filtered);
 			this.fire = deduped;
 			this.fireGroups = computeFireGroups(deduped);
 		} catch (err) {
+			if (signal?.aborted) throw err;
 			console.error("HMS fire load failed:", err);
 		}
 	}

package/src/lib/monitors/components/MonitorSubscriptionManager.svelte

@@ -1,7 +1,8 @@
 <script lang="ts">
 	import { BellCheckIcon, BellOffIcon, ChevronDownIcon } from "@lucide/svelte";
-	import { getSubscriptions, subscribe, unsubscribe } from "@sjvair/sdk/account";
+	import { subscribe, unsubscribe } from "@sjvair/sdk/account";
 	import { monitorsManager } from "$lib";
+	import { getApiToken, loadSubscriptionLevel } from "$lib/monitors/subscriptions";
 
 	interface MonitorSubscriptionManagerProps {
 		monitorId: string;
@@ -35,24 +36,24 @@
 	});
 
 	$effect(() => {
-		void monitorId;
+		const id = monitorId;
 		open = false;
 		subscribedLevel = null;
-		loadSubscription();
-	});
-
-	async function loadSubscription() {
-		const id = monitorId;
+		const controller = new AbortController();
+		const { signal } = controller;
 		loading = true;
-		try {
-			const subscriptions = await getSubscriptions(getApiToken());
-			if (id !== monitorId) return;
-			const match = subscriptions.find((s) => s.monitor === id);
-			subscribedLevel = match?.level ?? null;
-		} finally {
-			if (id === monitorId) loading = false;
-		}
-	}
+		loadSubscriptionLevel(id, { signal })
+			.then((level) => {
+				if (!signal.aborted) subscribedLevel = level;
+			})
+			.catch((error) => {
+				if (!signal.aborted) throw error;
+			})
+			.finally(() => {
+				if (!signal.aborted) loading = false;
+			});
+		return () => controller.abort();
+	});
 
 	async function handleLevelClick(level: string | null) {
 		if (saving || !level) return;
@@ -75,12 +76,6 @@
 		}
 		open = false;
 	}
-
-	function getApiToken(): string {
-		return (
-			(globalThis as unknown as Record<string, Record<string, string>>)["USER"]?.api_token ?? ""
-		);
-	}
 </script>
 
 <div class="relative select-none">

package/src/lib/monitors/monitor-details.svelte.ts

@@ -13,15 +13,17 @@ export class MonitorDetailsState {
 	#id: string | null = null;
 	// Bumped per request; a response for anything but the latest request is dropped.
 	#request = 0;
+	#controller: AbortController | null = null;
 
 	async load(id: string): Promise<void> {
 		this.#id = id;
 		const request = ++this.#request;
+		const { signal } = this.#restart();
 		this.monitor = null;
 		this.status = "loading";
 
 		try {
-			const monitor = await getMonitorDetails(id);
+			const monitor = await getMonitorDetails(id, { signal });
 			if (request !== this.#request) return;
 			this.monitor = monitor;
 			this.status = "ready";
@@ -40,16 +42,23 @@ export class MonitorDetailsState {
 	async refresh(): Promise<void> {
 		if (this.status !== "ready" || this.#id === null) return;
 		const request = ++this.#request;
+		const { signal } = this.#restart();
 
 		try {
-			const monitor = await getMonitorDetails(this.#id);
+			const monitor = await getMonitorDetails(this.#id, { signal });
 			if (request !== this.#request) return;
 			this.monitor = monitor;
 		} catch (error) {
-			if (request === this.#request) console.error(error);
+			if (!signal.aborted && request === this.#request) console.error(error);
 		}
 	}
 
+	/** Aborts whatever request is in flight and starts a new controller for the next one. */
+	#restart(): AbortController {
+		this.#controller?.abort();
+		return (this.#controller = new AbortController());
+	}
+
 	retry(): Promise<void> {
 		return this.#id === null ? Promise.resolve() : this.load(this.#id);
 	}

package/src/lib/monitors/monitors.svelte.ts

@@ -10,6 +10,7 @@ import {
 import { XMap } from "@tstk/builtin-extensions";
 import { Interval } from "@tstk/utils";
 import { untrack } from "svelte";
+import { anySignal, untilAborted, type SignalOptions } from "$lib/abort";
 import type { MonitorsDataSource, MonitorsPollutant } from "./types";
 
 export interface MonitorsInitOptions {
@@ -18,6 +19,24 @@ export interface MonitorsInitOptions {
 	 * load the data without showing a map (`resumeAutoUpdate()` starts polling later).
 	 */
 	autoUpdate?: boolean;
+	/**
+	 * Stops waiting: the returned promise rejects with the signal's reason. The shared run keeps
+	 * going for the other calls waiting on it, and is cancelled only when every call waiting on it
+	 * passed a signal and all of those aborted. An aborted call's pollutant and `autoUpdate` stay
+	 * recorded. Ignored once initialized.
+	 */
+	signal?: AbortSignal;
+}
+
+/** One shared init run and the calls waiting on it. */
+interface InitRun {
+	promise: Promise<void>;
+	controller: AbortController;
+	/** Calls waiting with a signal, and how many of those aborted. */
+	signalled: number;
+	aborted: number;
+	/** Whether any call waits without a signal, which keeps the run going. */
+	unsignalled: boolean;
 }
 
 class MonitorsManager implements MonitorsDataSource {
@@ -35,9 +54,10 @@ class MonitorsManager implements MonitorsDataSource {
 		this.meta?.entryType(this.pollutant ?? this.meta.default_pollutant).asIter.levels || null
 	);
 
-	#initPromise: Promise<void> | null = null;
+	#initRun: InitRun | null = null;
 	#requestedPollutant: MonitorsPollutant | null = null;
 	#requestedAutoUpdate = false;
+	#updateController: AbortController | null = null;
 
 	constructor() {
 		// Refetch monitors when the pollutant changes after the initial load, wherever the change
@@ -70,39 +90,86 @@ class MonitorsManager implements MonitorsDataSource {
 	init(urlPollutant?: string | number | boolean, options: MonitorsInitOptions = {}): Promise<void> {
 		if (this.initialized) return Promise.resolve();
 
+		const { signal } = options;
+		// Nothing is recorded or started for a call that is already cancelled.
+		if (signal?.aborted) return Promise.reject(signal.reason);
+
 		if (options.autoUpdate !== false) this.#requestedAutoUpdate = true;
 
 		if (urlPollutant === "pm25" || urlPollutant === "o3") {
 			this.#requestedPollutant = urlPollutant;
 		}
 
-		this.#initPromise ??= this.#runInit().finally(() => {
-			this.#initPromise = null;
-			this.#requestedPollutant = null;
-			this.#requestedAutoUpdate = false;
-		});
+		const run = (this.#initRun ??= this.#startInitRun());
+
+		if (!signal) {
+			run.unsignalled = true;
+			return run.promise;
+		}
+
+		run.signalled++;
+		const onAbort = () => {
+			run.aborted++;
+			if (!run.unsignalled && run.aborted === run.signalled) this.#abortInitRun(run);
+		};
+		signal.addEventListener("abort", onAbort, { once: true });
+		const cleanup = () => signal.removeEventListener("abort", onAbort);
+		run.promise.then(cleanup, cleanup);
+
+		return untilAborted(run.promise, signal);
+	}
+
+	#startInitRun(): InitRun {
+		const controller = new AbortController();
+		const run: InitRun = {
+			promise: this.#runInit(controller.signal).finally(() => {
+				if (this.#initRun === run) this.#clearInitRun();
+			}),
+			controller,
+			signalled: 0,
+			aborted: 0,
+			unsignalled: false
+		};
+		return run;
+	}
+
+	/**
+	 * Cancels a run nobody is waiting on. It is detached at once, so a call arriving before its
+	 * rejection settles starts a fresh run instead of joining the cancelled one.
+	 */
+	#abortInitRun(run: InitRun): void {
+		if (this.#initRun !== run) return;
+		this.#clearInitRun();
+		run.controller.abort();
+	}
 
-		return this.#initPromise;
+	#clearInitRun(): void {
+		this.#initRun = null;
+		this.#requestedPollutant = null;
+		this.#requestedAutoUpdate = false;
 	}
 
-	async #runInit(): Promise<void> {
+	async #runInit(signal: AbortSignal): Promise<void> {
 		// The pollutant the latest readings were requested for.
 		let fetchedPollutant = this.#requestedPollutant;
 
-		const metaRequest = getMonitorsMeta();
-		const listAndMeta = Promise.all([getMonitorsList(), metaRequest]).then(([list, meta]) => {
-			this.list = list;
-			this.meta = meta;
-			return meta;
-		});
+		const metaRequest = getMonitorsMeta({ signal });
+		const listAndMeta = Promise.all([getMonitorsList({ signal }), metaRequest]).then(
+			([list, meta]) => {
+				if (signal.aborted) throw signal.reason;
+				this.list = list;
+				this.meta = meta;
+				return meta;
+			}
+		);
 		// The latest readings only need the pollutant, so they never wait for the list. An explicit
 		// pollutant may still arrive before meta does, in which case the default is never fetched.
 		const latestRequest = fetchedPollutant
-			? getMonitorsLatestMap(fetchedPollutant)
+			? getMonitorsLatestMap(fetchedPollutant, signal)
 			: metaRequest.then((meta) => {
 					const pollutant = this.#requestedPollutant ?? meta.default_pollutant;
 					fetchedPollutant = pollutant;
-					return getMonitorsLatestMap(pollutant);
+					return getMonitorsLatestMap(pollutant, signal);
 				});
 
 		// One Promise.all so a failure in either never leaves the other unhandled.
@@ -112,11 +179,14 @@ class MonitorsManager implements MonitorsDataSource {
 		// An explicit pollutant may have arrived while the requests above were in flight.
 		let wanted = this.#requestedPollutant ?? meta.default_pollutant;
 		while (wanted !== fetchedPollutant) {
-			latest = await getMonitorsLatestMap(wanted);
+			latest = await getMonitorsLatestMap(wanted, signal);
 			fetchedPollutant = wanted;
 			wanted = this.#requestedPollutant ?? meta.default_pollutant;
 		}
 
+		// Cancelled while a request that ignores the signal was settling: leave state to the next run.
+		if (signal.aborted) throw signal.reason;
+
 		this.pollutant = fetchedPollutant;
 		this.latest = latest;
 		if (this.#requestedAutoUpdate) this.autoUpdate.start();
@@ -135,28 +205,70 @@ class MonitorsManager implements MonitorsDataSource {
 		this.autoUpdate.start();
 	}
 
-	async update(): Promise<void> {
+	/**
+	 * Refreshes the list and the latest readings. Starting an update aborts the previous
+	 * in-flight one, which then resolves without touching state. Pass `signal` to cancel from the
+	 * outside: that rejects with the signal's reason.
+	 */
+	async update(options: SignalOptions = {}): Promise<void> {
 		if (!this.initialized) return;
 
-		const pollutant = this.pollutant;
-		const [list, latest] = await Promise.all([
-			getMonitorsList(),
-			getMonitorsLatestMap(pollutant || this.meta?.default_pollutant || "pm25")
-		]);
+		// Nothing has started yet, so an in-flight update is left alone.
+		if (options.signal?.aborted) throw options.signal.reason;
 
-		// The pollutant changed while this was in flight: these readings belong to the previous
-		// one, and the change has already started its own update.
-		if (this.pollutant !== pollutant) return;
+		const supersededInFlight = this.#updateController !== null;
+		this.#updateController?.abort();
+		const controller = new AbortController();
+		this.#updateController = controller;
+		const combined = anySignal(controller.signal, options.signal);
 
-		this.list = list;
-		this.latest = latest;
+		// The caller cancelled this update. If it is still the latest and it cut off an update that
+		// was in flight, that update's data is lost too, so refresh again without a signal.
+		const callerAborted = (signal: AbortSignal) => {
+			if (supersededInFlight && this.#updateController === controller) {
+				this.update().catch(console.error);
+			}
+			return signal.reason;
+		};
+
+		// Set once callerAborted has run, so the catch below does not run it a second time.
+		let abortedError: unknown;
+
+		try {
+			const pollutant = this.pollutant;
+			const [list, latest] = await Promise.all([
+				getMonitorsList({ signal: combined.signal }),
+				getMonitorsLatestMap(pollutant || this.meta?.default_pollutant || "pm25", combined.signal)
+			]);
+
+			// Superseded or cancelled while the requests were settling.
+			if (options.signal?.aborted) throw (abortedError = callerAborted(options.signal));
+			if (controller.signal.aborted) return;
+
+			// The pollutant changed while this was in flight: these readings belong to the previous
+			// one, and the change has already started its own update.
+			if (this.pollutant !== pollutant) return;
+
+			this.list = list;
+			this.latest = latest;
+		} catch (error) {
+			// The caller's own abort rejects with its reason. A superseded update resolves quietly.
+			if (options.signal?.aborted)
+				throw error === abortedError ? error : callerAborted(options.signal);
+			if (controller.signal.aborted) return;
+			throw error;
+		} finally {
+			combined.dispose();
+			if (this.#updateController === controller) this.#updateController = null;
+		}
 	}
 }
 
 async function getMonitorsLatestMap(
-	pollutant: "pm25" | "o3"
+	pollutant: "pm25" | "o3",
+	signal?: AbortSignal
 ): Promise<XMap<string, MonitorLatestType<"pm25" | "o3">>> {
-	const monitors = await getMonitors(pollutant);
+	const monitors = await getMonitors(pollutant, undefined, { signal });
 	const latest = new XMap<string, MonitorLatestType<"pm25" | "o3">>();
 
 	for (const monitor of monitors) {

package/src/lib/monitors/subscriptions.ts

@@ -0,0 +1,17 @@
+import { getSubscriptions } from "@sjvair/sdk/account";
+import type { SignalOptions } from "$lib/abort";
+
+export function getApiToken(): string | undefined {
+	const token = (globalThis as unknown as Record<string, Record<string, unknown> | undefined>)[
+		"USER"
+	]?.api_token;
+	return typeof token === "string" && token !== "" ? token : undefined;
+}
+
+export async function loadSubscriptionLevel(
+	monitorId: string,
+	options?: SignalOptions
+): Promise<string | null> {
+	const subscriptions = await getSubscriptions(getApiToken(), { signal: options?.signal });
+	return subscriptions.find((s) => s.monitor === monitorId)?.level ?? null;
+}