@tinya-code/gas-admin-ui 0.2.0-alpha.15 → 0.2.0-alpha.17

package/src/lib/columns/descriptors.ts

@@ -1,113 +0,0 @@
-import type { RenderDescriptor, RenderExtras } from '../core/registry/render-registry';
-
-/**
- * Manifiesto de descriptores de formato de columna (R4.3 · `kind:
- * 'column-format'`).
- *
- * Es el equivalente a `fields/descriptors.ts` y `widgets/descriptors.ts`:
- * una línea por formato y ningún import de componente — cada `load()` guarda
- * el cierre de un `import()` **con literal**, que es lo que permite al
- * bundler partir el chunk; el registro los recoge al importar este módulo
- * (`core/registry/render-registry.ts`).
- *
- * **Añadir un formato** ⇒ crear `format-<nombre>.ts` + una entrada acá.
- * `list-view` no se toca: ése es el criterio de éxito de R4.3.
- *
- * Todos comparten el cableado: el descriptor sólo expone la celda, que la
- * vista cuelga de `extras.data`.
- */
-const inputs = (_config: unknown, extras: RenderExtras): Record<string, unknown> => ({
-  cell: extras.data,
-});
-
-const text: RenderDescriptor = {
-  kind: 'column-format',
-  type: 'text',
-  since: '1.0',
-  surfaces: ['list'],
-  load: () => import('./format-text').then((module) => module.ColumnFormatText),
-  inputs,
-};
-
-const badge: RenderDescriptor = {
-  kind: 'column-format',
-  type: 'badge',
-  since: '1.0',
-  surfaces: ['list'],
-  load: () => import('./format-badge').then((module) => module.ColumnFormatBadge),
-  inputs,
-};
-
-const thumbnail: RenderDescriptor = {
-  kind: 'column-format',
-  type: 'thumbnail',
-  since: '1.0',
-  surfaces: ['list'],
-  load: () => import('./format-thumbnail').then((module) => module.ColumnFormatThumbnail),
-  inputs,
-};
-
-const boolean: RenderDescriptor = {
-  kind: 'column-format',
-  type: 'boolean',
-  since: '1.0',
-  surfaces: ['list'],
-  load: () => import('./format-boolean').then((module) => module.ColumnFormatBoolean),
-  inputs,
-};
-
-const number: RenderDescriptor = {
-  kind: 'column-format',
-  type: 'number',
-  since: '1.0',
-  surfaces: ['list'],
-  load: () => import('./format-number').then((module) => module.ColumnFormatNumber),
-  inputs,
-};
-
-const currency: RenderDescriptor = {
-  kind: 'column-format',
-  type: 'currency',
-  since: '1.0',
-  surfaces: ['list'],
-  load: () => import('./format-currency').then((module) => module.ColumnFormatCurrency),
-  inputs,
-};
-
-const date: RenderDescriptor = {
-  kind: 'column-format',
-  type: 'date',
-  since: '1.0',
-  surfaces: ['list'],
-  load: () => import('./format-date').then((module) => module.ColumnFormatDate),
-  inputs,
-};
-
-/** Los 7 formatos del `@switch` que este registro reemplaza (R4.3). */
-export const columnFormatDescriptors: readonly RenderDescriptor[] = [
-  text,
-  badge,
-  thumbnail,
-  boolean,
-  number,
-  currency,
-  date,
-];
-
-/**
- * Los 7 nombres, como dato.
- *
- * Va en paralelo a `ListColumnFormat` (unión de `schema.model`) y lo vigila
- * `core/registry/contract.spec.ts`: la unión vive en tipos y el registro en
- * runtime, y sólo un test reconcilia los dos — el mismo tripwire que ya
- * existe para los 20 campos y los 6 widgets.
- */
-export const COLUMN_FORMAT_TYPES = [
-  'text',
-  'badge',
-  'thumbnail',
-  'boolean',
-  'number',
-  'currency',
-  'date',
-] as const;

package/src/lib/columns/format-badge.ts

@@ -1,51 +0,0 @@
-import { Component, computed, input } from '@angular/core';
-
-import { Badge, type BadgeKind } from '../shared/components/badge/badge';
-import { resolveBadgeKind } from '../fields/display/display-badge';
-import type { SelectField } from '../core/models/schema.model';
-import { getValue } from '../shared/utils/field-path';
-import type { ColumnCell } from './column-cell';
-
-/**
- * Formato `badge` (R4.3, afinado en R4.4).
- *
- * Un booleano usa `trueLabel`/`falseLabel` del campo (o «Sí»/«No») con
- * `success`/`danger` — el vocabulario de la lista para el control que
- * permite escribir. El vacío sigue siendo «Sin dato»/`danger`.
- *
- * El resto alinea el chip con el display del detalle (D41): un `select`
- * pinta la **etiqueta** de la opción y los estados se clasifican con
- * `resolveBadgeKind`, el mismo criterio que la cabecera de la ficha —
- * antes, toda columna declarada `badge` salía verde sin mirar el valor.
- */
-@Component({
-  selector: 'app-column-format-badge',
-  imports: [Badge],
-  template: `<app-badge [label]="badge().label" [kind]="badge().kind" />`,
-})
-export class ColumnFormatBadge {
-  readonly cell = input.required<ColumnCell>();
-
-  protected readonly badge = computed(() => badgeInfo(this.cell()));
-}
-
-export function badgeInfo(cell: ColumnCell): { label: string; kind: BadgeKind } {
-  const value = getValue(cell.row, cell.column.key);
-  const field = cell.fields.find((candidate) => candidate.key === cell.column.key);
-  if (typeof value === 'boolean') {
-    const label =
-      value === true
-        ? ((field?.type === 'boolean' ? field.trueLabel : undefined) ?? 'Sí')
-        : ((field?.type === 'boolean' ? field.falseLabel : undefined) ?? 'No');
-    return { label, kind: value ? 'success' : 'danger' };
-  }
-  const text = value == null ? '' : String(value);
-  if (text === '') {
-    return { label: 'Sin dato', kind: 'danger' };
-  }
-  const etiqueta =
-    field?.type === 'select'
-      ? ((field as SelectField).options?.find((option) => option.value === text)?.label ?? text)
-      : text;
-  return { label: etiqueta, kind: resolveBadgeKind(text) };
-}

package/src/lib/columns/format-boolean.ts

@@ -1,58 +0,0 @@
-import { Component, computed, input } from '@angular/core';
-
-import { Badge } from '../shared/components/badge/badge';
-import { getValue } from '../shared/utils/field-path';
-import type { ColumnCell } from './column-cell';
-import { badgeInfo } from './format-badge';
-
-/**
- * Formato `boolean` (R4.3): interruptor o badge.
- *
- * Es la rama `@case ('boolean')` de `list-view`, con una sola diferencia de
- * domicilio: hoy sólo monta este componente si el formato efectivo ya es
- * `boolean`, así que la comprobación `column.format === 'boolean'` que hacía
- * `isSwitchColumn` sobra. El criterio restante — `active` booleano y con
- * permiso de edición (base.md §10) — vive acá, que es quien dibuja el control.
- */
-@Component({
-  selector: 'app-column-format-boolean',
-  imports: [Badge],
-  template: `
-    @if (esInterruptor()) {
-      <input
-        type="checkbox"
-        class="size-5 cursor-pointer accent-primary"
-        [checked]="valor()"
-        [disabled]="cell().saving"
-        [attr.aria-label]="cell().column.label + ': ' + cell().title"
-        (click)="$event.stopPropagation()"
-        (change)="alternar($event)"
-      />
-    } @else {
-      <app-badge [label]="badge().label" [kind]="badge().kind" />
-    }
-  `,
-})
-export class ColumnFormatBoolean {
-  readonly cell = input.required<ColumnCell>();
-
-  protected readonly badge = computed(() => badgeInfo(this.cell()));
-
-  protected readonly valor = computed(() => {
-    const value = getValue(this.cell().row, this.cell().column.key);
-    return value === true || value === 'true';
-  });
-
-  /** `active` declarado como boolean en el schema → interruptor (base.md §10). */
-  protected readonly esInterruptor = computed(() => {
-    const cell = this.cell();
-    if (cell.column.key !== 'active' || !cell.canUpdate) {
-      return false;
-    }
-    return cell.fields.some((field) => field.type === 'boolean' && field.key === 'active');
-  });
-
-  protected alternar(event: Event): void {
-    this.cell().toggle?.((event.target as HTMLInputElement).checked);
-  }
-}

package/src/lib/columns/format-currency.ts

@@ -1,30 +0,0 @@
-import { Component, computed, input } from '@angular/core';
-
-import { getValue } from '../shared/utils/field-path';
-import type { ColumnCell } from './column-cell';
-
-/**
- * Formato `currency` (R4.3). Igual que el helper de `list-view`: `es-PE`,
- * moneda tomada del schema (se pasaba desde la vista porque sólo ella la
- * conoce) y texto crudo si el valor no es número.
- */
-@Component({
-  selector: 'app-column-format-currency',
-  template: `{{ precio() }}`,
-})
-export class ColumnFormatCurrency {
-  readonly cell = input.required<ColumnCell>();
-
-  protected readonly precio = computed(() => {
-    const cell = this.cell();
-    const value = getValue(cell.row, cell.column.key);
-    const number = Number(value);
-    if (!Number.isFinite(number)) {
-      return value == null ? '' : String(value);
-    }
-    return new Intl.NumberFormat('es-PE', {
-      style: 'currency',
-      currency: cell.currency,
-    }).format(number);
-  });
-}

package/src/lib/columns/format-date.ts

@@ -1,35 +0,0 @@
-import { Component, computed, input } from '@angular/core';
-
-import { getValue } from '../shared/utils/field-path';
-import type { ColumnCell } from './column-cell';
-
-function formatDate(value: unknown): string {
-  if (typeof value !== 'string' || value === '') {
-    return value == null ? '' : String(value);
-  }
-  const date = new Date(value);
-  if (Number.isNaN(date.getTime())) {
-    return value;
-  }
-  // Fechas `YYYY-MM-DD`: forzar UTC para no desfasar un día.
-  return date.toLocaleDateString('es-PE', { timeZone: 'UTC' });
-}
-
-/**
- * Formato `date` (R4.3). Corto (`toLocaleDateString`), a diferencia del
- * display de la ficha, que va con `dateStyle: 'medium'`: cada superficie
- * con su formato, pero ambos desde su propio componente.
- */
-@Component({
-  selector: 'app-column-format-date',
-  template: `{{ fecha() }}`,
-})
-export class ColumnFormatDate {
-  readonly cell = input.required<ColumnCell>();
-
-  protected readonly fecha = computed(() => formatDate(this.valor()));
-
-  private valor(): unknown {
-    return getValue(this.cell().row, this.cell().column.key);
-  }
-}

package/src/lib/columns/format-number.ts

@@ -1,32 +0,0 @@
-import { Component, computed, input } from '@angular/core';
-
-import { getValue } from '../shared/utils/field-path';
-import type { ColumnCell } from './column-cell';
-
-const NUMBER_FORMAT = new Intl.NumberFormat('es-PE');
-
-function formatNumber(value: unknown): string {
-  const number = Number(value);
-  if (!Number.isFinite(number)) {
-    return value == null ? '' : String(value);
-  }
-  return NUMBER_FORMAT.format(number);
-}
-
-/**
- * Formato `number` (R4.3). Misma fórmula que el helper de `list-view`:
- * miles con separador `es-PE` y texto crudo si el valor no es número.
- */
-@Component({
-  selector: 'app-column-format-number',
-  template: `{{ numero() }}`,
-})
-export class ColumnFormatNumber {
-  readonly cell = input.required<ColumnCell>();
-
-  protected readonly numero = computed(() => formatNumber(this.valor()));
-
-  private valor(): unknown {
-    return getValue(this.cell().row, this.cell().column.key);
-  }
-}

package/src/lib/columns/format-text.ts

@@ -1,23 +0,0 @@
-import { Component, computed, input } from '@angular/core';
-
-import { getValue } from '../shared/utils/field-path';
-import type { ColumnCell } from './column-cell';
-
-/**
- * Formato `text` (R4.3 · el `@default` del `@switch` viejo).
- *
- * `cellText` de `list-view`: `null`/`undefined` se pintan vacíos y el resto
- * pasa por `String()` — un objeto sale `[object Object]`, igual que antes.
- */
-@Component({
-  selector: 'app-column-format-text',
-  template: `{{ texto() }}`,
-})
-export class ColumnFormatText {
-  readonly cell = input.required<ColumnCell>();
-
-  protected readonly texto = computed(() => {
-    const value = getValue(this.cell().row, this.cell().column.key);
-    return value == null ? '' : String(value);
-  });
-}

package/src/lib/columns/format-thumbnail.ts

@@ -1,63 +0,0 @@
-import { Component, computed, input } from '@angular/core';
-
-import { getValue } from '../shared/utils/field-path';
-import type { ColumnCell } from './column-cell';
-
-/**
- * Formato `thumbnail` (R4.3): miniatura de la fila.
- *
- * Tanto `thumbnailSrc` como `thumbnailAlt` se mudan desde `list-view`: la
- * columna puede apuntar a `image_url`, al primer elemento de `images[]` o a
- * un objeto con `image_url`, y el texto alternativo sale del item o de la
- * fila. Sin URL se pinta el `—` de siempre.
- */
-@Component({
-  selector: 'app-column-format-thumbnail',
-  template: `
-    @if (src(); as url) {
-      <img [src]="url" [alt]="alt()" class="size-9 rounded-md object-cover" loading="lazy" />
-    } @else {
-      <span class="text-neutral" aria-hidden="true">—</span>
-    }
-  `,
-})
-export class ColumnFormatThumbnail {
-  readonly cell = input.required<ColumnCell>();
-
-  protected readonly src = computed(() => {
-    const value = this.valor();
-    if (typeof value === 'string') {
-      return value !== '' ? value : null;
-    }
-    if (Array.isArray(value)) {
-      const first = value[0];
-      const url = typeof first === 'string' ? first : getValue(first, 'image_url');
-      return typeof url === 'string' && url !== '' ? url : null;
-    }
-    if (value && typeof value === 'object') {
-      const url = getValue(value, 'image_url');
-      return typeof url === 'string' && url !== '' ? url : null;
-    }
-    return null;
-  });
-
-  protected readonly alt = computed(() => {
-    const value = this.valor();
-    let item: unknown = this.cell().row;
-    if (Array.isArray(value)) {
-      item = value[0] ?? null;
-    } else if (value && typeof value === 'object') {
-      item = value;
-    }
-    const alt = item == null ? null : getValue(item, 'image_alt');
-    if (typeof alt === 'string' && alt !== '') {
-      return alt;
-    }
-    const rootAlt = this.cell().row['image_alt'];
-    return typeof rootAlt === 'string' ? rootAlt : '';
-  });
-
-  private valor(): unknown {
-    return getValue(this.cell().row, this.cell().column.key);
-  }
-}

package/src/lib/core/adapters/firebase-auth.adapter.ts

@@ -1,6 +0,0 @@
-/**
- * Re-exporta `FirebaseAuthAdapter` desde `tokens.ts` (única fuente de verdad).
- * Mantiene este archivo como punto de importación estable para consumidores
- * que ya referencian esta ruta, sin duplicar la definición de la interfaz.
- */
-export type { FirebaseAuthAdapter } from '../tokens';

package/src/lib/core/guards/auth.guard.spec.ts

@@ -1,88 +0,0 @@
-import { provideHttpClient } from '@angular/common/http';
-import { TestBed } from '@angular/core/testing';
-import { ActivatedRouteSnapshot, Router, UrlTree, provideRouter } from '@angular/router';
-
-import { API_URL } from '../tokens';
-import { SESSION_TOKEN_KEY, SESSION_USER_KEY } from '../services/auth.service';
-import { authGuard, roleGuard } from './auth.guard';
-
-/**
- * R2.10 — guards de sesión (auth.md §5.3).
- *
- * No son una barrera (el back re-verifica desde R2.6): son el filtro de
- * pantalla. Por eso aquí sólo se comprueba HACIA DÓNDE mandan, no qué
- * protegen.
- */
-describe('authGuard / roleGuard — filtro de pantalla (R2.10)', () => {
-  afterEach(() => sessionStorage.clear());
-
-  /** `role === null` ⇒ sin sesión: no se siembra nada en el storage. */
-  function setup(role: string | null = 'admin') {
-    sessionStorage.clear();
-    if (role !== null) {
-      sessionStorage.setItem(SESSION_TOKEN_KEY, 'tok');
-      sessionStorage.setItem(SESSION_USER_KEY, JSON.stringify({ id: 'u_1', role }));
-    }
-
-    TestBed.configureTestingModule({
-      providers: [provideHttpClient(), provideRouter([]), { provide: API_URL, useValue: '/api' }],
-    });
-    return { authGuard, roleGuard, router: TestBed.inject(Router) };
-  }
-
-  /** `route` mínimo con un solo parámetro de ruta. */
-  function routeWithId(id: string | null): ActivatedRouteSnapshot {
-    return {
-      paramMap: {
-        get: (key: string) => (key === 'id' ? id : null),
-      },
-    } as unknown as ActivatedRouteSnapshot;
-  }
-
-  const isUrlTree = (r: unknown): r is UrlTree => r instanceof UrlTree;
-
-  /**
-   * El router invoca un guard DENTRO de un contexto de inyección; una llamada
-   * directa desde el spec no lo tiene, y `inject(AuthService)` revienta.
-   * `runInInjectionContext` reproducía el contexto real del router.
-   */
-  function run(guard: typeof authGuard, route: ActivatedRouteSnapshot): boolean | UrlTree {
-    const result = TestBed.runInInjectionContext(() => guard(route, {} as never));
-    // Los dos guards son síncronos: `MaybeAsync` sólo es ruido de tipos acá.
-    return result as boolean | UrlTree;
-  }
-
-  it('con sesión deja pasar', () => {
-    const { authGuard: guard } = setup();
-    expect(run(guard, {} as ActivatedRouteSnapshot)).toBe(true);
-  });
-
-  it('sin sesión manda a /login', () => {
-    const { authGuard: guard, router } = setup(null);
-    const result = run(guard, {} as ActivatedRouteSnapshot);
-    expect(isUrlTree(result)).toBe(true);
-    expect(router.serializeUrl(result as UrlTree)).toBe('/login');
-  });
-
-  it('sin sesión, un `:id` también manda a /login (redundancia barata)', () => {
-    const { roleGuard: guard, router } = setup(null);
-    const result = run(guard, routeWithId('orders'));
-    expect(isUrlTree(result)).toBe(true);
-    expect(router.serializeUrl(result as UrlTree)).toBe('/login');
-  });
-
-  it('un `:id` desconocido deja que responda el back (no inventamos política)', () => {
-    const { roleGuard: guard } = setup();
-    expect(run(guard, routeWithId('no-existe'))).toBe(true);
-  });
-
-  it('una ruta sin `:id` no decide nada', () => {
-    const { roleGuard: guard } = setup();
-    expect(run(guard, routeWithId(null))).toBe(true);
-  });
-
-  it('un recurso sin `access` declarado se ve con sesión', () => {
-    const { roleGuard: guard } = setup('staff');
-    expect(run(guard, routeWithId('dashboard'))).toBe(true);
-  });
-});

package/src/lib/core/guards/auth.guard.ts

@@ -1,48 +0,0 @@
-import { inject } from '@angular/core';
-import type { CanActivateFn } from '@angular/router';
-import { Router } from '@angular/router';
-
-import { getSchema } from '../registry/schema-catalog';
-import { AuthService, LOGIN_PATH } from '../services/auth.service';
-
-/**
- * Guards de sesión (auth.md §5.3).
- *
- * Dos puertas y ninguna es una barrera de seguridad: el back re-verifica
- * `accessLevel` en **cada** petición desde R2.6. Éstas sólo evitan pintar
- * una pantalla que no le toca al usuario — enseñarle un formulario que va
- * a recibir 403 es mala UX, no un agujero.
- *
- * `authGuard` va en la ruta madre (todo el shell); `roleGuard` en cada
- * `:id`, que es donde aparece el recurso que puede tener `access`.
- */
-
-/** Sin sesión → login. Corre ANTES que cualquier ruta del shell. */
-export const authGuard: CanActivateFn = () => {
-  const auth = inject(AuthService);
-  if (auth.isAuthenticated()) return true;
-  return inject(Router).createUrlTree([LOGIN_PATH]);
-};
-
-/**
- * El recurso declara `access` y esta sesión no lo cumple → se cancela la
- * navegación. No hay pantalla de 403 (tampoco la pide §5.3) y el menú ya
- * oculta la entrada, así que queda sólo el caso de alguien tecleando la URL.
- */
-export const roleGuard: CanActivateFn = (route) => {
-  const auth = inject(AuthService);
-  const router = inject(Router);
-
-  // Redundante con `authGuard` (la madre ya filtra) pero barato: un hijo
-  // nunca debe dejar una sesión muerta navegando sola.
-  if (!auth.isAuthenticated()) return router.createUrlTree([LOGIN_PATH]);
-
-  const id = route.data?.['resourceId'] ?? route.paramMap.get('id');
-  // Ruta sin recurso declarado, o id que no existe en el registry → que
-  // responda el back (404). No inventar una política sobre datos ajenos.
-  if (id === null) return true;
-  const schema = getSchema(String(id));
-  if (schema === undefined) return true;
-
-  return auth.canAccess(schema.access);
-};

package/src/lib/core/guards/unsaved-changes.guard.ts

@@ -1,16 +0,0 @@
-import { CanDeactivateFn } from '@angular/router';
-
-/** Componente que expone si se puede salir (base.md §13.9: cambios sin guardar). */
-export interface CanLeaveWhenDirty {
-  canDeactivate(): boolean | Promise<boolean>;
-}
-
-/**
- * Avisa antes de salir con cambios sin guardar. El componente decide:
- * `canDeactivate()` devuelve `true` para salir limpio o una `Promise` que
- * resuelve según la respuesta del usuario (vía `NotificationService.confirm`).
- */
-export const unsavedChangesGuard: CanDeactivateFn<unknown> = (component) => {
-  const candidate = component as Partial<CanLeaveWhenDirty> | null | undefined;
-  return candidate?.canDeactivate?.() ?? true;
-};