@saasicat/ui-vue 0.24.2 → 0.26.0

package/src/vue/use-async-data.ts

@@ -0,0 +1,83 @@
+// One async read, with the state a page otherwise writes by hand.
+//
+// The counterpart to `useAsyncAction`: that one is for something the operator
+// set off, this one is for something the page needs in order to render. The
+// difference shows in what happens on failure — an action reports and stops,
+// a read has to leave the page in a state it can still draw.
+//
+// On failure `data` goes back to `initial`. That is what `useApiList` already
+// does (it resets `items` to `[]` and `total` to 0), and it is the safer of the
+// two options: stale rows under an error message read as current data, and
+// nothing on the page says which reload they came from.
+
+import { ref, watch, type Ref, type WatchSource } from 'vue';
+
+import { toAdminError, type AdminError } from '../client/admin-error.js';
+
+export interface AsyncData<T> {
+    /** The loaded value, or `initial` before the first load and after a failure. */
+    data: Ref<T>;
+    /** True while a load is in flight. */
+    pending: Ref<boolean>;
+    /** The last failure, or `null`. Cleared at the start of every load. */
+    error: Ref<AdminError | null>;
+    /** Loads again — after a mutation, or from a retry button. */
+    reload: () => Promise<void>;
+}
+
+export interface UseAsyncDataOptions<T> {
+    /** Value before the first load, and the value restored when one fails. */
+    initial: T;
+    /** Load once on creation. Default `true`. */
+    immediate?: boolean;
+    /** Reload whenever any of these changes — a filter, a selected row, a locale. */
+    watch?: WatchSource[];
+}
+
+export function useAsyncData<T>(
+    fn: () => Promise<T>,
+    options: UseAsyncDataOptions<T>,
+): AsyncData<T> {
+    const data = ref(options.initial) as Ref<T>;
+    const pending = ref(false);
+    const error = ref<AdminError | null>(null);
+
+    // Which load is the current one. A watched source that changes twice in
+    // quick succession starts a second request before the first answers, and
+    // without this the loser writes last: the older result overwrites the
+    // newer, its `finally` clears `pending` while the newer request is still
+    // running, and — worst — its `catch` resets `data` to `initial` and raises
+    // an error for a filter the operator has already left.
+    let generation = 0;
+
+    async function reload(): Promise<void> {
+        const mine = ++generation;
+        pending.value = true;
+        error.value = null;
+        try {
+            const result = await fn();
+            if (mine !== generation) return;
+            data.value = result;
+        } catch (err: unknown) {
+            if (mine !== generation) return;
+            error.value = toAdminError(err);
+            data.value = options.initial;
+        } finally {
+            // Only the newest load owns the flag; a superseded one leaving it
+            // false would announce a page that is still loading as settled.
+            if (mine === generation) pending.value = false;
+        }
+    }
+
+    if (options.watch?.length) {
+        watch(options.watch, () => void reload());
+    }
+
+    if (options.immediate !== false) {
+        // One microtask later, so the composable does not block `setup()`
+        // during the initial synchronous phase — same reasoning as useApiList.
+        void Promise.resolve().then(() => reload());
+    }
+
+    return { data, pending, error, reload };
+}

package/src/vue/use-bundles.ts

@@ -7,6 +7,7 @@
 // the catalog paths themselves — the consumer supplies only the admin prefix.
 
 import { ref, type Ref } from 'vue';
+import { markEmptyResponse, markPlatformError } from '../client/admin-error.js';
 import type {
     BundleRow,
     BundleVersionMutationResult,
@@ -16,6 +17,7 @@ import type {
     UpdateBundleData,
     UpdateBundleVersionDraftData,
 } from '@saasicat/types';
+import { requireServerAnswer } from '../client/http-json.js';
 import { defaultHttpClient, type HttpClient } from '../client/types.js';
 
 export interface UseBundlesOptions {
@@ -41,6 +43,9 @@ export class BundlesApiError extends Error {
     ) {
         super(message);
         this.name = 'BundlesApiError';
+        // Identity, so `toAdminError` can tell this diagnostic from a
+        // consumer error whose message an operator needs to read.
+        markPlatformError(this);
     }
 }
 
@@ -80,11 +85,21 @@ export function useBundles(options: UseBundlesOptions): UseBundlesResult {
     }
 
     async function fetchJson<T>(url: string, init?: Parameters<HttpClient>[1]): Promise<T | null> {
+        const method = init?.method ?? 'GET';
         const res = await http(url, {
-            method: init?.method ?? 'GET',
+            method,
             headers: { 'content-type': 'application/json', ...authHeaders(), ...init?.headers },
             body: init?.body,
         });
+        // Before any body is read: `null` below has to mean "the server
+        // answered without one", which is what the callers' empty-response
+        // sentinels claim.
+        requireServerAnswer(
+            res.status,
+            method,
+            url,
+            (diagnostic) => new BundlesApiError(res.status, null, diagnostic),
+        );
         if (res.status === 204) return null;
         const body = await res.json().catch(() => null);
         if (res.status >= 400) {
@@ -117,7 +132,8 @@ export function useBundles(options: UseBundlesOptions): UseBundlesResult {
             method: 'POST',
             body: JSON.stringify(data),
         });
-        if (!created) throw new BundlesApiError(0, null, 'Create returned no body');
+        if (!created)
+            throw markEmptyResponse(new BundlesApiError(0, null, 'Create returned no body'));
         bundles.value = [...bundles.value, created];
         return created;
     }
@@ -127,7 +143,8 @@ export function useBundles(options: UseBundlesOptions): UseBundlesResult {
             method: 'PATCH',
             body: JSON.stringify(data),
         });
-        if (!updated) throw new BundlesApiError(0, null, 'Update returned no body');
+        if (!updated)
+            throw markEmptyResponse(new BundlesApiError(0, null, 'Update returned no body'));
         bundles.value = bundles.value.map((b) => (b.id === bundleId ? updated : b));
         return updated;
     }
@@ -209,11 +226,18 @@ export function useBundleVersions(options: UseBundleVersionsOptions): UseBundleV
     }
 
     async function fetchJson<T>(url: string, init?: Parameters<HttpClient>[1]): Promise<T | null> {
+        const method = init?.method ?? 'GET';
         const res = await http(url, {
-            method: init?.method ?? 'GET',
+            method,
             headers: { 'content-type': 'application/json', ...authHeaders(), ...init?.headers },
             body: init?.body,
         });
+        requireServerAnswer(
+            res.status,
+            method,
+            url,
+            (diagnostic) => new BundlesApiError(res.status, null, diagnostic),
+        );
         if (res.status === 204) return null;
         const body = await res.json().catch(() => null);
         if (res.status >= 400) {
@@ -246,7 +270,8 @@ export function useBundleVersions(options: UseBundleVersionsOptions): UseBundleV
             method: 'POST',
             body: JSON.stringify(data),
         });
-        if (!result) throw new BundlesApiError(0, null, 'CreateDraft returned no body');
+        if (!result)
+            throw markEmptyResponse(new BundlesApiError(0, null, 'CreateDraft returned no body'));
         versions.value = [...versions.value, result.bundleVersion];
         return result;
     }
@@ -259,7 +284,8 @@ export function useBundleVersions(options: UseBundleVersionsOptions): UseBundleV
             `${versionUrlBase}/${versionId}`,
             { method: 'PATCH', body: JSON.stringify(data) },
         );
-        if (!result) throw new BundlesApiError(0, null, 'UpdateDraft returned no body');
+        if (!result)
+            throw markEmptyResponse(new BundlesApiError(0, null, 'UpdateDraft returned no body'));
         versions.value = versions.value.map((v) => (v.id === versionId ? result.bundleVersion : v));
         return result;
     }
@@ -277,7 +303,8 @@ export function useBundleVersions(options: UseBundleVersionsOptions): UseBundleV
             `${versionUrlBase}/${versionId}/publish`,
             { method: 'POST', body: JSON.stringify(opts) },
         );
-        if (!result) throw new BundlesApiError(0, null, 'Publish returned no body');
+        if (!result)
+            throw markEmptyResponse(new BundlesApiError(0, null, 'Publish returned no body'));
         // Reload versions, because publishing may mark another version as
         // superseded — the local cache would otherwise be inconsistent.
         await load();

package/src/vue/use-catalog-entries.ts

@@ -9,6 +9,7 @@
 // (e.g. `/api/admin` or `/api/v1/admin`).
 
 import { ref, type Ref } from 'vue';
+import { markEmptyResponse, markPlatformError } from '../client/admin-error.js';
 import type {
     CapabilityCatalogEntryRow,
     CatalogEntryI18n,
@@ -19,9 +20,8 @@ import type {
     SyncDiscoveryResult,
     UpdateCatalogEntryBaseData,
 } from '@saasicat/types';
-import { formatMessage } from '../client/i18n/format.js';
+import { requireServerAnswer } from '../client/http-json.js';
 import { defaultHttpClient, type HttpClient } from '../client/types.js';
-import { useSaMessages } from './use-super-admin-i18n.js';
 
 export interface UseCatalogEntriesOptions {
     /** Admin endpoint prefix incl. globalPrefix (`/api/admin`, `/api/v1/admin`). */
@@ -33,6 +33,12 @@ export interface UseCatalogEntriesOptions {
     autoLoad?: boolean;
 }
 
+/**
+ * A catalog-entries call failed. Its `message` is a diagnostic for the log, in
+ * English like every other developer-facing string in the repository — the
+ * sentence a user is shown comes from the `errors` catalog through
+ * `adminErrorMessage`, in whichever language the shell speaks.
+ */
 export class CatalogEntriesApiError extends Error {
     constructor(
         public readonly status: number,
@@ -41,6 +47,9 @@ export class CatalogEntriesApiError extends Error {
     ) {
         super(message);
         this.name = 'CatalogEntriesApiError';
+        // Identity, so `toAdminError` can tell this diagnostic from a
+        // consumer error whose message an operator needs to read.
+        markPlatformError(this);
     }
 }
 
@@ -83,7 +92,6 @@ export function useCatalogEntries(options: UseCatalogEntriesOptions): UseCatalog
         throw new Error('useCatalogEntries: `projectKey` is required.');
     }
 
-    const msg = useSaMessages('discovery');
     const http = options.http ?? defaultHttpClient();
     const capabilities = ref<CapabilityCatalogEntryRow[]>([]);
     const features = ref<FeatureCatalogEntryRow[]>([]);
@@ -100,18 +108,28 @@ export function useCatalogEntries(options: UseCatalogEntriesOptions): UseCatalog
     }
 
     async function fetchJson<T>(url: string, init?: Parameters<HttpClient>[1]): Promise<T | null> {
+        const method = init?.method ?? 'GET';
         const res = await http(url, {
-            method: init?.method ?? 'GET',
+            method,
             headers: { 'content-type': 'application/json', ...authHeaders(), ...init?.headers },
             body: init?.body,
         });
+        // Before any body is read: `null` below has to mean "the server
+        // answered without one", which is what the callers' empty-response
+        // sentinels claim.
+        requireServerAnswer(
+            res.status,
+            method,
+            url,
+            (diagnostic) => new CatalogEntriesApiError(res.status, null, diagnostic),
+        );
         if (res.status === 204) return null;
         const body = await res.json().catch(() => null);
         if (res.status >= 400) {
             throw new CatalogEntriesApiError(
                 res.status,
                 body,
-                formatMessage(msg.value.errorCatalogHttp, { status: res.status }),
+                `Catalog entries API responded with HTTP ${res.status}`,
             );
         }
         return body as T;
@@ -144,7 +162,8 @@ export function useCatalogEntries(options: UseCatalogEntriesOptions): UseCatalog
             `${base}/features/${encodeURIComponent(featureKey)}/review?projectKey=${pk}`,
             { method: 'PATCH', body: JSON.stringify(data) },
         );
-        if (!updated) throw new CatalogEntriesApiError(0, null, 'Review returned no body');
+        if (!updated)
+            throw markEmptyResponse(new CatalogEntriesApiError(0, null, 'Review returned no body'));
         features.value = features.value.map((f) => (f.featureKey === featureKey ? updated : f));
         return updated;
     }
@@ -157,7 +176,8 @@ export function useCatalogEntries(options: UseCatalogEntriesOptions): UseCatalog
             `${base}/quotas/${encodeURIComponent(quotaKey)}/review?projectKey=${pk}`,
             { method: 'PATCH', body: JSON.stringify(data) },
         );
-        if (!updated) throw new CatalogEntriesApiError(0, null, 'Review returned no body');
+        if (!updated)
+            throw markEmptyResponse(new CatalogEntriesApiError(0, null, 'Review returned no body'));
         quotas.value = quotas.value.map((q) => (q.quotaKey === quotaKey ? updated : q));
         return updated;
     }
@@ -170,7 +190,8 @@ export function useCatalogEntries(options: UseCatalogEntriesOptions): UseCatalog
             `${base}/features/${encodeURIComponent(featureKey)}/i18n?projectKey=${pk}`,
             { method: 'PATCH', body: JSON.stringify({ i18n }) },
         );
-        if (!updated) throw new CatalogEntriesApiError(0, null, 'i18n returned no body');
+        if (!updated)
+            throw markEmptyResponse(new CatalogEntriesApiError(0, null, 'i18n returned no body'));
         features.value = features.value.map((f) => (f.featureKey === featureKey ? updated : f));
         return updated;
     }
@@ -183,7 +204,8 @@ export function useCatalogEntries(options: UseCatalogEntriesOptions): UseCatalog
             `${base}/quotas/${encodeURIComponent(quotaKey)}/i18n?projectKey=${pk}`,
             { method: 'PATCH', body: JSON.stringify({ i18n }) },
         );
-        if (!updated) throw new CatalogEntriesApiError(0, null, 'i18n returned no body');
+        if (!updated)
+            throw markEmptyResponse(new CatalogEntriesApiError(0, null, 'i18n returned no body'));
         quotas.value = quotas.value.map((q) => (q.quotaKey === quotaKey ? updated : q));
         return updated;
     }
@@ -196,7 +218,8 @@ export function useCatalogEntries(options: UseCatalogEntriesOptions): UseCatalog
             `${base}/features/${encodeURIComponent(featureKey)}?projectKey=${pk}`,
             { method: 'PATCH', body: JSON.stringify(data) },
         );
-        if (!updated) throw new CatalogEntriesApiError(0, null, 'Base returned no body');
+        if (!updated)
+            throw markEmptyResponse(new CatalogEntriesApiError(0, null, 'Base returned no body'));
         features.value = features.value.map((f) => (f.featureKey === featureKey ? updated : f));
         return updated;
     }
@@ -209,7 +232,8 @@ export function useCatalogEntries(options: UseCatalogEntriesOptions): UseCatalog
             `${base}/quotas/${encodeURIComponent(quotaKey)}?projectKey=${pk}`,
             { method: 'PATCH', body: JSON.stringify(data) },
         );
-        if (!updated) throw new CatalogEntriesApiError(0, null, 'Base returned no body');
+        if (!updated)
+            throw markEmptyResponse(new CatalogEntriesApiError(0, null, 'Base returned no body'));
         quotas.value = quotas.value.map((q) => (q.quotaKey === quotaKey ? updated : q));
         return updated;
     }
@@ -219,7 +243,8 @@ export function useCatalogEntries(options: UseCatalogEntriesOptions): UseCatalog
             method: 'POST',
             body: JSON.stringify({ snapshot }),
         });
-        if (!result) throw new CatalogEntriesApiError(0, null, 'Sync returned no body');
+        if (!result)
+            throw markEmptyResponse(new CatalogEntriesApiError(0, null, 'Sync returned no body'));
         await load();
         return result;
     }

package/src/vue/use-discovery.ts

@@ -11,10 +11,10 @@
 // (e.g. `/api/admin/discovery` or `/api/v1/admin/discovery`).
 
 import { ref, type Ref } from 'vue';
+import { markPlatformError } from '../client/admin-error.js';
 import type { DiscoverySnapshot } from '@saasicat/types';
+import { requireServerAnswer } from '../client/http-json.js';
 import { defaultHttpClient, type HttpClient } from '../client/types.js';
-import { formatMessage } from '../client/i18n/format.js';
-import { useSaMessages } from './use-super-admin-i18n.js';
 
 export interface UseDiscoveryOptions {
     /**
@@ -36,6 +36,12 @@ export interface UseDiscoveryOptions {
     autoLoad?: boolean;
 }
 
+/**
+ * The discovery endpoint could not be read. Its `message` is a diagnostic for
+ * the log, in English like every other developer-facing string in the
+ * repository — the sentence a user is shown comes from the `errors` catalog
+ * through `adminErrorMessage`, in whichever language the shell speaks.
+ */
 export class DiscoveryLoadError extends Error {
     constructor(
         public readonly status: number,
@@ -43,6 +49,9 @@ export class DiscoveryLoadError extends Error {
     ) {
         super(message);
         this.name = 'DiscoveryLoadError';
+        // Identity, so `toAdminError` can tell this diagnostic from a
+        // consumer error whose message an operator needs to read.
+        markPlatformError(this);
     }
 }
 
@@ -70,7 +79,6 @@ export interface UseDiscoveryResult {
 }
 
 export function useDiscovery(options: UseDiscoveryOptions): UseDiscoveryResult {
-    const msg = useSaMessages('discovery');
     if (!options?.endpoint) {
         throw new Error(
             'useDiscovery: `endpoint` is required (e.g. "/api/admin/discovery" ' +
@@ -97,6 +105,12 @@ export function useDiscovery(options: UseDiscoveryOptions): UseDiscoveryResult {
             }
 
             const res = await http(options.endpoint, { method: 'GET', headers });
+            requireServerAnswer(
+                res.status,
+                'GET',
+                options.endpoint,
+                (diagnostic) => new DiscoveryLoadError(res.status, diagnostic),
+            );
 
             if (res.status === 304) {
                 // Cache hit: snapshot stays unchanged, no re-parse.
@@ -105,7 +119,7 @@ export function useDiscovery(options: UseDiscoveryOptions): UseDiscoveryResult {
             if (res.status !== 200) {
                 throw new DiscoveryLoadError(
                     res.status,
-                    formatMessage(msg.value.errorDiscoveryHttp, { status: res.status }),
+                    `Discovery endpoint responded with HTTP ${res.status}`,
                 );
             }
 
@@ -136,11 +150,18 @@ export function useDiscovery(options: UseDiscoveryOptions): UseDiscoveryResult {
             const token = options.getAuthToken?.();
             if (token) headers.Authorization = `Bearer ${token}`;
 
-            const res = await http(`${options.endpoint}/rescan`, { method: 'POST', headers });
+            const rescanUrl = `${options.endpoint}/rescan`;
+            const res = await http(rescanUrl, { method: 'POST', headers });
+            requireServerAnswer(
+                res.status,
+                'POST',
+                rescanUrl,
+                (diagnostic) => new DiscoveryLoadError(res.status, diagnostic),
+            );
             if (res.status !== 200 && res.status !== 201) {
                 throw new DiscoveryLoadError(
                     res.status,
-                    formatMessage(msg.value.errorRescanHttp, { status: res.status }),
+                    `Discovery rescan responded with HTTP ${res.status}`,
                 );
             }
             const body = (await res.json()) as DiscoverySnapshot;

package/src/vue/use-marketing-projections.ts

@@ -7,15 +7,15 @@
 // low-frequency and consistency matters more than performance.
 
 import { ref, type Ref } from 'vue';
+import { markEmptyResponse, markPlatformError } from '../client/admin-error.js';
 import type {
     CreateMarketingProjectionData,
     MarketingProjectionFilter,
     MarketingProjectionRow,
     UpdateMarketingProjectionData,
 } from '@saasicat/types';
+import { requireServerAnswer } from '../client/http-json.js';
 import { defaultHttpClient, type HttpClient } from '../client/types.js';
-import { formatMessage } from '../client/i18n/format.js';
-import { useSaMessages } from './use-super-admin-i18n.js';
 
 export interface UseMarketingProjectionsOptions {
     adminEndpoint: string;
@@ -26,6 +26,12 @@ export interface UseMarketingProjectionsOptions {
     autoLoad?: boolean;
 }
 
+/**
+ * A marketing-projections call failed. Its `message` is a diagnostic for the
+ * log, in English like every other developer-facing string in the repository —
+ * the sentence a user is shown comes from the `errors` catalog through
+ * `adminErrorMessage`, in whichever language the shell speaks.
+ */
 export class MarketingProjectionsApiError extends Error {
     constructor(
         public readonly status: number,
@@ -34,6 +40,9 @@ export class MarketingProjectionsApiError extends Error {
     ) {
         super(message);
         this.name = 'MarketingProjectionsApiError';
+        // Identity, so `toAdminError` can tell this diagnostic from a
+        // consumer error whose message an operator needs to read.
+        markPlatformError(this);
     }
 }
 
@@ -61,7 +70,6 @@ export function useMarketingProjections(
         throw new Error('useMarketingProjections: `filter.projectKey` is required.');
     }
 
-    const msg = useSaMessages('marketing');
     const http = options.http ?? defaultHttpClient();
     const projections = ref<MarketingProjectionRow[]>([]);
     const filter = ref<MarketingProjectionFilter>({ ...options.filter });
@@ -86,18 +94,28 @@ export function useMarketingProjections(
     }
 
     async function fetchJson<T>(url: string, init?: Parameters<HttpClient>[1]): Promise<T | null> {
+        const method = init?.method ?? 'GET';
         const res = await http(url, {
-            method: init?.method ?? 'GET',
+            method,
             headers: { 'content-type': 'application/json', ...authHeaders(), ...init?.headers },
             body: init?.body,
         });
+        // Before any body is read: `null` below has to mean "the server
+        // answered without one", which is what the callers' empty-response
+        // sentinels claim.
+        requireServerAnswer(
+            res.status,
+            method,
+            url,
+            (diagnostic) => new MarketingProjectionsApiError(res.status, null, diagnostic),
+        );
         if (res.status === 204) return null;
         const body = await res.json().catch(() => null);
         if (res.status >= 400) {
             throw new MarketingProjectionsApiError(
                 res.status,
                 body,
-                formatMessage(msg.value.errors.projectionsApi, { status: res.status }),
+                `Marketing projections API responded with HTTP ${res.status}`,
             );
         }
         return body as T;
@@ -127,7 +145,9 @@ export function useMarketingProjections(
             body: JSON.stringify(data),
         });
         if (!created) {
-            throw new MarketingProjectionsApiError(0, null, 'Create returned no body');
+            throw markEmptyResponse(
+                new MarketingProjectionsApiError(0, null, 'Create returned no body'),
+            );
         }
         // After create: reload the list (a unique tuple insert can
         // affect the filter).
@@ -144,7 +164,9 @@ export function useMarketingProjections(
             body: JSON.stringify(data),
         });
         if (!updated) {
-            throw new MarketingProjectionsApiError(0, null, 'Update returned no body');
+            throw markEmptyResponse(
+                new MarketingProjectionsApiError(0, null, 'Update returned no body'),
+            );
         }
         projections.value = projections.value.map((p) => (p.id === id ? updated : p));
         return updated;

package/src/vue/use-plans.ts

@@ -4,6 +4,7 @@
 //   Pack 2a → usePlanVersions (draft/publish lifecycle)
 
 import { ref, type Ref } from 'vue';
+import { markEmptyResponse, markPlatformError } from '../client/admin-error.js';
 import type {
     CreatePlanData,
     CreatePlanVersionDraftData,
@@ -13,6 +14,7 @@ import type {
     UpdatePlanData,
     UpdatePlanVersionDraftData,
 } from '@saasicat/types';
+import { requireServerAnswer } from '../client/http-json.js';
 import { defaultHttpClient, type HttpClient } from '../client/types.js';
 
 export interface UsePlansOptions {
@@ -37,6 +39,9 @@ export class PlansApiError extends Error {
     ) {
         super(message);
         this.name = 'PlansApiError';
+        // Identity, so `toAdminError` can tell this diagnostic from a
+        // consumer error whose message an operator needs to read.
+        markPlatformError(this);
     }
 }
 
@@ -94,8 +99,9 @@ export function usePlans(options: UsePlansOptions): UsePlansResult {
     }
 
     async function fetchJson<T>(url: string, init?: Parameters<HttpClient>[1]): Promise<T | null> {
+        const method = init?.method ?? 'GET';
         const res = await http(url, {
-            method: init?.method ?? 'GET',
+            method,
             headers: {
                 'content-type': 'application/json',
                 ...authHeaders(),
@@ -103,6 +109,15 @@ export function usePlans(options: UsePlansOptions): UsePlansResult {
             },
             body: init?.body,
         });
+        // Before any body is read: `null` below has to mean "the server
+        // answered without one", which is what the callers' empty-response
+        // sentinels claim.
+        requireServerAnswer(
+            res.status,
+            method,
+            url,
+            (diagnostic) => new PlansApiError(res.status, null, diagnostic),
+        );
         if (res.status === 204) return null;
         const body = await res.json().catch(() => null);
         if (res.status >= 400) {
@@ -147,7 +162,8 @@ export function usePlans(options: UsePlansOptions): UsePlansResult {
             method: 'POST',
             body: JSON.stringify(data),
         });
-        if (!created) throw new PlansApiError(0, null, 'Create returned no body');
+        if (!created)
+            throw markEmptyResponse(new PlansApiError(0, null, 'Create returned no body'));
         plans.value = [...plans.value, created];
         return created;
     }
@@ -157,7 +173,8 @@ export function usePlans(options: UsePlansOptions): UsePlansResult {
             method: 'PATCH',
             body: JSON.stringify(data),
         });
-        if (!updated) throw new PlansApiError(0, null, 'Update returned no body');
+        if (!updated)
+            throw markEmptyResponse(new PlansApiError(0, null, 'Update returned no body'));
         plans.value = plans.value.map((p) => (p.id === planId ? updated : p));
         return updated;
     }
@@ -264,8 +281,9 @@ export function usePlanVersions(options: UsePlanVersionsOptions): UsePlanVersion
     }
 
     async function fetchJson<T>(url: string, init?: Parameters<HttpClient>[1]): Promise<T | null> {
+        const method = init?.method ?? 'GET';
         const res = await http(url, {
-            method: init?.method ?? 'GET',
+            method,
             headers: {
                 'content-type': 'application/json',
                 ...authHeaders(),
@@ -273,6 +291,12 @@ export function usePlanVersions(options: UsePlanVersionsOptions): UsePlanVersion
             },
             body: init?.body,
         });
+        requireServerAnswer(
+            res.status,
+            method,
+            url,
+            (diagnostic) => new PlansApiError(res.status, null, diagnostic),
+        );
         if (res.status === 204) return null;
         const body = await res.json().catch(() => null);
         if (res.status >= 400) {
@@ -305,7 +329,8 @@ export function usePlanVersions(options: UsePlanVersionsOptions): UsePlanVersion
             method: 'POST',
             body: JSON.stringify(data),
         });
-        if (!result) throw new PlansApiError(0, null, 'CreateDraft returned no body');
+        if (!result)
+            throw markEmptyResponse(new PlansApiError(0, null, 'CreateDraft returned no body'));
         versions.value = [...versions.value, result.planVersion];
         return result;
     }
@@ -318,7 +343,8 @@ export function usePlanVersions(options: UsePlanVersionsOptions): UsePlanVersion
             `${versionUrlBase}/${versionId}`,
             { method: 'PATCH', body: JSON.stringify(data) },
         );
-        if (!result) throw new PlansApiError(0, null, 'UpdateDraft returned no body');
+        if (!result)
+            throw markEmptyResponse(new PlansApiError(0, null, 'UpdateDraft returned no body'));
         versions.value = versions.value.map((v) => (v.id === versionId ? result.planVersion : v));
         return result;
     }
@@ -336,7 +362,8 @@ export function usePlanVersions(options: UsePlanVersionsOptions): UsePlanVersion
             `${versionUrlBase}/${versionId}/publish`,
             { method: 'POST', body: JSON.stringify(opts) },
         );
-        if (!result) throw new PlansApiError(0, null, 'Publish returned no body');
+        if (!result)
+            throw markEmptyResponse(new PlansApiError(0, null, 'Publish returned no body'));
         versions.value = versions.value.map((v) => (v.id === versionId ? result.planVersion : v));
         return result;
     }
@@ -351,7 +378,8 @@ export function usePlanVersions(options: UsePlanVersionsOptions): UsePlanVersion
             `${versionUrlBase}/${versionId}/terminate`,
             { method: 'POST', body: JSON.stringify({ endsAt }) },
         );
-        if (!updated) throw new PlansApiError(0, null, 'Terminate returned no body');
+        if (!updated)
+            throw markEmptyResponse(new PlansApiError(0, null, 'Terminate returned no body'));
         versions.value = versions.value.map((v) => (v.id === versionId ? updated : v));
         return updated;
     }