panels-origin/web-panel/composables/api-response.ts
Cursor Agent 1f85b44e80
fix(web-panel): unwrap API envelope post-login and improve error screen
- Normalize RPC responses in useApi so legacy pages receive flat shapes
- Harden dashboard index.vue against undefined arrays and load failures
- Redesign Nuxt error boundary with Oops message, error code, and retry

Co-authored-by: alberto.martinez <alberto.martinez@mrdev.mx>
2026-09-04 06:56:25 +00:00

79 lines
2.1 KiB
TypeScript

export type FrontRpcCode = "VALIDATION" | "NETWORK" | "INTERNAL";
export type FrontResponse<T = unknown> = {
ok: boolean;
code: FrontRpcCode | string;
layer: "front";
message: string;
context?: Record<string, unknown>;
data?: T | null;
errors?: Record<string, string> | string[] | null;
};
export function buildFrontError(
message: string,
code: FrontRpcCode = "VALIDATION",
context?: Record<string, unknown>,
errors?: Record<string, string> | string[] | null,
): FrontResponse {
return {
ok: false,
code,
layer: "front",
message,
context,
data: null,
errors: errors ?? null,
};
}
export function buildFrontNetworkError(method: string, path: string): FrontResponse {
return buildFrontError(
`No se pudo conectar con el servidor en ${method} ${path} — verifique su conexión`,
"NETWORK",
{ route: `${method} ${path}` },
);
}
export function isApiEnvelope(value: unknown): value is {
ok: boolean;
code: string;
status?: number;
layer: string;
message: string;
data?: unknown;
} {
return !!value && typeof value === "object"
&& "ok" in value && "message" in value && "layer" in value;
}
/** Normaliza respuestas RPC `{ ok, data, message }` al shape plano que esperan las pantallas. */
export function unwrapApiPayload<T>(body: unknown): T {
if (!isApiEnvelope(body)) return body as T;
const env = body;
const data = env.data;
const spread = data && typeof data === "object" && !Array.isArray(data)
? data as Record<string, unknown>
: {};
return {
...spread,
data,
ok: env.ok,
code: env.code,
message: env.message,
status: env.status,
layer: env.layer,
} as T;
}
/** Muestra el mensaje detallado de la API o front sin reescribirlo. */
export function displayErrorMessage(value: unknown, fallback = "Ocurrió un error"): string {
if (isApiEnvelope(value)) return value.message;
if (value && typeof value === "object" && "message" in value) {
return String((value as { message: unknown }).message);
}
if (value && typeof value === "object" && "error" in value) {
return String((value as { error: unknown }).error);
}
return fallback;
}