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

package/src/lib/core/services/theme.service.spec.ts

@@ -1,106 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { ThemeService } from './theme.service';
-
-/**
- * jsdom no implementa `matchMedia`, así que se instala un doble controlable
- * antes de cualquier construcción del servicio: `matches` decide el estado
- * del sistema y `listeners` permite disparar el cambio en vivo.
- */
-describe('ThemeService — 8.6 selector Sistema / Claro / Oscuro', () => {
-  let matches = false;
-  const listeners: Array<() => void> = [];
-
-  beforeAll(() => {
-    Object.defineProperty(window, 'matchMedia', {
-      writable: true,
-      configurable: true,
-      value: (query: string) => ({
-        matches: query.includes('prefers-color-scheme') && matches,
-        media: query,
-        onchange: null,
-        addEventListener: (_type: string, listener: () => void) => listeners.push(listener),
-        removeEventListener: () => undefined,
-        dispatchEvent: () => false,
-      }),
-    });
-  });
-
-  beforeEach(() => {
-    localStorage.clear();
-    document.documentElement.removeAttribute('data-theme');
-    document.documentElement.removeAttribute('data-theme-mode');
-    matches = false;
-    listeners.length = 0;
-  });
-
-  const fireSystemChange = (): void => {
-    for (const listener of listeners) {
-      listener();
-    }
-  };
-
-  it('arranca en «system» cuando no hay elección guardada', () => {
-    const theme = new ThemeService();
-
-    expect(theme.mode()).toBe('system');
-    expect(theme.resolved()).toBe('light');
-    expect(document.documentElement.dataset['theme']).toBe('light');
-    expect(document.documentElement.dataset['themeMode']).toBe('system');
-  });
-
-  it('una elección corrupta en localStorage vuelve a «system»', () => {
-    localStorage.setItem('admin-theme', 'naranja');
-
-    expect(new ThemeService().mode()).toBe('system');
-  });
-
-  it('aplica y persiste una elección concreta', () => {
-    const theme = new ThemeService();
-
-    theme.set('dark');
-
-    expect(theme.mode()).toBe('dark');
-    expect(theme.resolved()).toBe('dark');
-    expect(document.documentElement.dataset['theme']).toBe('dark');
-    expect(document.documentElement.dataset['themeMode']).toBe('dark');
-    expect(localStorage.getItem('admin-theme')).toBe('dark');
-  });
-
-  it('recupera la elección guardada al arrancar y pinta ese modo', () => {
-    matches = true;
-    localStorage.setItem('admin-theme', 'light');
-
-    const theme = new ThemeService();
-
-    expect(theme.mode()).toBe('light');
-    expect(theme.resolved()).toBe('light');
-    expect(document.documentElement.dataset['theme']).toBe('light');
-  });
-
-  it('«system» reacciona en vivo a un cambio del tema del sistema', () => {
-    const theme = new ThemeService();
-    expect(theme.resolved()).toBe('light');
-
-    matches = true;
-    fireSystemChange();
-
-    expect(theme.resolved()).toBe('dark');
-    expect(document.documentElement.dataset['theme']).toBe('dark');
-  });
-
-  it('ignora el SO cuando la elección es concreta', () => {
-    const theme = new ThemeService();
-    theme.set('light');
-
-    matches = true;
-    fireSystemChange();
-
-    expect(theme.resolved()).toBe('light');
-    expect(document.documentElement.dataset['theme']).toBe('light');
-  });
-
-  it('queda disponible por DI como servicio raíz', () => {
-    expect(TestBed.inject(ThemeService)).toBeTruthy();
-  });
-});

package/src/lib/core/services/theme.service.ts

@@ -1,86 +0,0 @@
-import { Service, signal } from '@angular/core';
-
-/** Los tres estados del selector (§8.6). */
-export type ThemeMode = 'system' | 'light' | 'dark';
-
-/** Lo que acaba pintado en `<html data-theme>`. */
-export type ResolvedTheme = 'light' | 'dark';
-
-const STORAGE_KEY = 'admin-theme';
-const QUERY = '(prefers-color-scheme: dark)';
-const MODES: string[] = ['system', 'light', 'dark'];
-
-/** Lee la elección guardada; cualquier basura vuelve a `system`. */
-function storedMode(): ThemeMode {
-  try {
-    const raw = localStorage.getItem(STORAGE_KEY);
-    return raw !== null && MODES.includes(raw) ? (raw as ThemeMode) : 'system';
-  } catch {
-    // localStorage puede tirar en modo privado o con cuota agotada.
-    return 'system';
-  }
-}
-
-/**
- * `system` → lo que diga el sistema operativo.
- * jsdom no implementa `matchMedia`: sin él se asume claro, que es además
- * el estado por defecto antes de que corra el script de `index.html`.
- */
-function prefersDark(): boolean {
-  return typeof window.matchMedia === 'function' && window.matchMedia(QUERY).matches;
-}
-
-function resolve(mode: ThemeMode): ResolvedTheme {
-  return mode === 'system' ? (prefersDark() ? 'dark' : 'light') : mode;
-}
-
-/**
- * Selector de tema con tres estados: `system`, `light`, `dark` (Fase 8.6).
- *
- * `system` NO se traduce en CSS con una media query sino que se resuelve a
- * un valor concreto, porque con tres estados un único `prefers-color-scheme`
- * no alcanza para distinguir "oscuro elegido a mano" de "oscuro heredado".
- *
- * El arranque sin flash vive en `index.html`: un script síncrono en el
- * `<head>` escribe `data-theme` y `data-theme-mode` antes del primer
- * pintado. Este servicio toma el relevo después y además escucha cambios
- * en vivo del sistema, para que cambiar el tema del SO con la app abierta
- * la recoloree — pero sólo mientras la elección siga siendo `system`: si el
- * usuario eligió un modo concreto, el SO deja de mandar.
- */
-@Service()
-export class ThemeService {
-  /** Elección persistida. */
-  readonly mode = signal<ThemeMode>(storedMode());
-  /** Lo que está pintado ahora mismo. */
-  readonly resolved = signal<ResolvedTheme>(resolve(this.mode()));
-
-  constructor() {
-    this.apply();
-
-    const media = typeof window.matchMedia === 'function' ? window.matchMedia(QUERY) : null;
-    media?.addEventListener('change', () => {
-      if (this.mode() === 'system') {
-        this.apply();
-      }
-    });
-  }
-
-  set(mode: ThemeMode): void {
-    this.mode.set(mode);
-    try {
-      localStorage.setItem(STORAGE_KEY, mode);
-    } catch {
-      // Sin persistencia el tema sigue funcionando durante la sesión.
-    }
-    this.apply();
-  }
-
-  /** Escribe el resultado en `<html>`; es lo que lee `theme.css`. */
-  private apply(): void {
-    const resolved = resolve(this.mode());
-    this.resolved.set(resolved);
-    document.documentElement.dataset['theme'] = resolved;
-    document.documentElement.dataset['themeMode'] = this.mode();
-  }
-}

package/src/lib/core/services/transport.spec.ts

@@ -1,198 +0,0 @@
-import { HttpClient, HttpParams, provideHttpClient } from '@angular/common/http';
-import { HttpTestingController, provideHttpClientTesting } from '@angular/common/http/testing';
-import { TestBed } from '@angular/core/testing';
-import { firstValueFrom } from 'rxjs';
-
-import {
-  buildUrl,
-  doRestRequest,
-  sendGas,
-  sendRest,
-  toHttpParams,
-  type TransportDeps,
-} from './transport';
-
-// Transporte desacoplado (plan doc/engine-refactor-plan.md · Fase 4).
-// Funciones puras con dependencias por parámetro; sin DI, sin ciclo (R6).
-describe('transport — funciones puras (Fase 4)', () => {
-  let http: HttpClient;
-  let httpMock: HttpTestingController;
-
-  const deps = (overrides: Partial<TransportDeps> = {}): TransportDeps => ({
-    http,
-    apiUrl: '/api',
-    sessionToken: () => 'tok',
-    ...overrides,
-  });
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      providers: [provideHttpClient(), provideHttpClientTesting()],
-    });
-    http = TestBed.inject(HttpClient);
-    httpMock = TestBed.inject(HttpTestingController);
-  });
-
-  afterEach(() => {
-    httpMock.verify();
-  });
-
-  // ── buildUrl ────────────────────────────────────────────────────────────
-  describe('buildUrl', () => {
-    it('concatena apiUrl + path con slash inicial', () => {
-      expect(buildUrl('/api', '/admin/items')).toBe('/api/admin/items');
-    });
-
-    it('tolera path sin slash inicial', () => {
-      expect(buildUrl('/api', 'admin/items')).toBe('/api/admin/items');
-    });
-
-    it('recorta slashes finales de la base', () => {
-      expect(buildUrl('https://x.example/', '/admin')).toBe('https://x.example/admin');
-    });
-
-    it('apiUrl vacía ⇒ path con slash inicial', () => {
-      expect(buildUrl('', '/admin')).toBe('/admin');
-    });
-  });
-
-  // ── toHttpParams ────────────────────────────────────────────────────────
-  describe('toHttpParams', () => {
-    it('plana objetos anidados un nivel (contrato histórico)', () => {
-      const params = toHttpParams({ view: 'calendar', params: { orden: 'es' } });
-      expect(params.get('view')).toBe('calendar');
-      expect(params.get('orden')).toBe('es');
-    });
-
-    it('omite null y undefined', () => {
-      const params = toHttpParams({ a: null, b: undefined, c: 'x' });
-      expect(params.has('a')).toBe(false);
-      expect(params.has('b')).toBe(false);
-      expect(params.get('c')).toBe('x');
-    });
-
-    it('arrays viajan como repetición de la clave', () => {
-      const params = toHttpParams({ tag: ['a', 'b'] });
-      expect(params.getAll('tag')).toEqual(['a', 'b']);
-    });
-
-    it('payload vacío ⇒ HttpParams vacío', () => {
-      expect(toHttpParams(undefined) instanceof HttpParams).toBe(true);
-      expect(toHttpParams({}).keys().length).toBe(0);
-    });
-  });
-
-  // ── sendGas ─────────────────────────────────────────────────────────────
-  describe('sendGas', () => {
-    it('POST text/plain a apiUrl con envelope { token, method, path, payload }', async () => {
-      const pending = firstValueFrom(sendGas(deps(), '/admin/items', 'GET', { view: 'v' }));
-      const req = httpMock.expectOne('/api');
-      expect(req.request.method).toBe('POST');
-      expect(req.request.headers.get('Content-Type')).toBe('text/plain');
-      expect(req.request.body).toEqual({
-        token: 'tok',
-        method: 'GET',
-        path: '/admin/items',
-        payload: { view: 'v' },
-      });
-      req.flush({ items: [] });
-      await pending;
-    });
-
-    it('payload ausente ⇒ {} en el envelope', async () => {
-      const pending = firstValueFrom(sendGas(deps(), '/admin/x', 'POST'));
-      const req = httpMock.expectOne('/api');
-      expect((req.request.body as { payload: unknown }).payload).toEqual({});
-      req.flush({});
-      await pending;
-    });
-
-    it('lanza si se pide multipart en el driver gas', () => {
-      expect(() => sendGas(deps(), '/admin/x', 'POST', undefined, true)).toThrow(
-        /only supported with the REST driver/i,
-      );
-    });
-
-    it('lee el token de sesión en cada petición (getter), no al construir', async () => {
-      let token = 't1';
-      const pending = firstValueFrom(sendGas(deps({ sessionToken: () => token }), '/x', 'GET'));
-      const req = httpMock.expectOne('/api');
-      expect((req.request.body as { token: string }).token).toBe('t1');
-      token = 't2'; // cambio de sesión antes del flush no afecta lo ya enviado
-      req.flush({});
-      await pending;
-    });
-  });
-
-  // ── sendRest ────────────────────────────────────────────────────────────
-  describe('sendRest', () => {
-    it('GET con Authorization bearer del getter de sesión y params en query', async () => {
-      const pending = firstValueFrom(sendRest(deps(), '/admin/items', 'GET', { page: 2 }));
-      const req = httpMock.expectOne('/api/admin/items?page=2');
-      expect(req.request.method).toBe('GET');
-      expect(req.request.headers.get('Authorization')).toBe('Bearer tok');
-      req.flush([]);
-      await pending;
-    });
-
-    it('POST JSON: Content-Type application/json y body = payload', async () => {
-      const pending = firstValueFrom(sendRest(deps(), '/admin/items', 'POST', { slug: 'a' }));
-      const req = httpMock.expectOne('/api/admin/items');
-      expect(req.request.headers.get('Content-Type')).toBe('application/json');
-      expect(req.request.body).toEqual({ slug: 'a' });
-      req.flush({});
-      await pending;
-    });
-
-    it('multipart: FormData sin Content-Type application/json (boundary del navegador)', async () => {
-      const fd = new FormData();
-      fd.append('file', new Blob(['x']), 'x.txt');
-      const pending = firstValueFrom(sendRest(deps(), '/admin/upload', 'POST', fd, true));
-      const req = httpMock.expectOne('/api/admin/upload');
-      expect(req.request.body instanceof FormData).toBe(true);
-      expect(req.request.headers.get('Content-Type')).not.toBe('application/json');
-      req.flush({});
-      await pending;
-    });
-
-    it('sin getIdToken usa el token de sesión almacenado', async () => {
-      const pending = firstValueFrom(sendRest(deps(), '/admin/x', 'GET'));
-      const req = httpMock.expectOne('/api/admin/x');
-      expect(req.request.headers.get('Authorization')).toBe('Bearer tok');
-      req.flush({});
-      await pending;
-    });
-
-    it('con getIdToken fresco se usa el token devuelto por el adaptador', async () => {
-      const d = deps({ getIdToken: () => Promise.resolve('fresh-123') });
-      const pending = firstValueFrom(sendRest(d, '/admin/x', 'GET'));
-      // La promesa resuelve en un microtask: esperar antes de buscar la petición.
-      await new Promise((resolve) => setTimeout(resolve, 0));
-      const req = httpMock.expectOne('/api/admin/x');
-      expect(req.request.headers.get('Authorization')).toBe('Bearer fresh-123');
-      req.flush({});
-      await pending;
-    });
-
-    it('un rechazo de getIdToken viaja por el canal de errores (sin petición)', async () => {
-      const d = deps({ getIdToken: () => Promise.reject(new Error('token expirado')) });
-      const pending = firstValueFrom(sendRest(d, '/admin/x', 'GET'));
-      await expect(pending).rejects.toThrow('token expirado');
-      httpMock.expectNone('/api/admin/x');
-    });
-  });
-
-  // ── doRestRequest ───────────────────────────────────────────────────────
-  describe('doRestRequest', () => {
-    it('DELETE va con params, no con body', async () => {
-      const pending = firstValueFrom(
-        doRestRequest(deps(), '/api/admin/x/1', 'DELETE', { reason: 'r' }, undefined),
-      );
-      const req = httpMock.expectOne('/api/admin/x/1?reason=r');
-      expect(req.request.method).toBe('DELETE');
-      expect(req.request.body).toBeNull();
-      req.flush(null);
-      await pending;
-    });
-  });
-});

package/src/lib/core/services/transport.ts

@@ -1,164 +0,0 @@
-/**
- * Transporte HTTP puro del motor (plan doc/engine-refactor-plan.md · Fase 4).
- *
- * Funciones sin estado ni DI: todas las dependencias (HttpClient, apiUrl,
- * getter de token de sesión, adaptador opcional de Firebase) entran por
- * parámetro en `TransportDeps`. `ApiService` queda como fachada que arma los
- * deps y delega acá — mismo comportamiento observable, cero ciclos de DI (R6).
- *
- * Los contratos de transporte (R7) viven en este módulo y no cambian:
- *
- * - **gas**: `POST text/plain` a `apiUrl` con envelope
- *   `{ token, method, path, payload }` (contrato Google Apps Script).
- * - **rest**: verbos reales con `Authorization: Bearer`, params en query
- *   (GET/DELETE) o body JSON (POST/PUT/PATCH), multipart sin Content-Type.
- */
-import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
-import { from, Observable, switchMap } from 'rxjs';
-
-/** Métodos que entiende el envelope del backend (baseapi §2.3). */
-export type EnvelopeMethod = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';
-
-/** Dependencias del transporte, aportadas por la fachada (no hay singleton acá). */
-export interface TransportDeps {
-  http: HttpClient;
-  /** URL base (`API_URL`): el Web App de Apps Script o el origen REST. */
-  apiUrl: string;
-  /** Getter del token de SESIÓN, leído en CADA petición (R2.8). */
-  sessionToken: () => string | null;
-  /**
-   * Refresco opcional de ID token (Fase Firebase): si existe, se llama antes
-   * de armar la cabecera Authorization. Un rechazo viaja por el canal de
-   * errores — nunca se manda una petición con token inválido.
-   */
-  getIdToken?: () => Promise<string>;
-}
-
-/** `POST text/plain` a `apiUrl` con el envelope GAS. */
-export function sendGas<T>(
-  deps: TransportDeps,
-  path: string,
-  method: EnvelopeMethod,
-  payload?: Record<string, unknown> | FormData,
-  multipart = false,
-): Observable<T> {
-  if (multipart) {
-    throw new Error('Multipart payload mode is only supported with the REST driver');
-  }
-  // Token de la SESIÓN, leído en cada petición (R2.8): no hay credencial
-  // fija que inyectar en el arranque.
-  const body = {
-    token: deps.sessionToken(),
-    method,
-    path,
-    payload: payload ?? {},
-  };
-  return deps.http.post<T>(deps.apiUrl, body, {
-    headers: { 'Content-Type': 'text/plain' },
-  });
-}
-
-/**
- * Verbo HTTP real con `Authorization: Bearer`. Si el adaptador provee
- * `getIdToken()`, se resuelve el token fresco ANTES de la cabecera; si no,
- * se usa el de sesión almacenado (fallback). Cualquier error de `getIdToken()`
- * se propaga por el canal de errores.
- */
-export function sendRest<T>(
-  deps: TransportDeps,
-  path: string,
-  method: EnvelopeMethod,
-  payload?: Record<string, unknown> | FormData,
-  multipart = false,
-): Observable<T> {
-  const url = buildUrl(deps.apiUrl, path);
-  const headers = new HttpHeaders();
-
-  if (deps.getIdToken) {
-    return from(deps.getIdToken()).pipe(
-      switchMap((freshToken) =>
-        doRestRequest<T>(
-          deps,
-          url,
-          method,
-          payload,
-          headers.set('Authorization', `Bearer ${freshToken}`),
-          multipart,
-        ),
-      ),
-    );
-  }
-
-  const token = deps.sessionToken();
-  const finalHeaders = token ? headers.set('Authorization', `Bearer ${token}`) : headers;
-  return doRestRequest<T>(deps, url, method, payload, finalHeaders, multipart);
-}
-
-/** Despacho REST concreto sobre una URL ya construida. */
-export function doRestRequest<T>(
-  deps: TransportDeps,
-  url: string,
-  method: EnvelopeMethod,
-  payload: Record<string, unknown> | FormData | undefined,
-  headers: HttpHeaders = new HttpHeaders(),
-  multipart = false,
-): Observable<T> {
-  if (method === 'GET' || method === 'DELETE') {
-    const params = toHttpParams(
-      payload instanceof FormData ? undefined : (payload as Record<string, unknown> | undefined),
-    );
-    return deps.http.request<T>(method, url, { headers, params });
-  }
-
-  if (multipart || payload instanceof FormData) {
-    // Sin Content-Type: application/json para que el navegador ponga el boundary.
-    return deps.http.request<T>(method, url, { headers, body: payload ?? {} });
-  }
-
-  return deps.http.request<T>(method, url, {
-    headers: headers.set('Content-Type', 'application/json'),
-    body: payload ?? {},
-  });
-}
-
-/** `${apiUrl}${path}` normalizada: sin dobles slashes ni path sin slash inicial. */
-export function buildUrl(apiUrl: string, path: string): string {
-  const base = apiUrl ? apiUrl.replace(/\/+$/, '') : '';
-  const cleanPath = path.startsWith('/') ? path : `/${path}`;
-  return `${base}${cleanPath}`;
-}
-
-/**
- * Convierte un payload en HttpParams para peticiones GET y DELETE en modo REST.
- * Si un valor es un objeto plano (ej: `{ view: 'calendar', params: { orden: 'es' } }`),
- * lo aplana un nivel para que sus claves viajen como query params reales
- * en lugar de serializarse como `params=[object Object]`.
- */
-export function toHttpParams(payload?: Record<string, unknown>): HttpParams {
-  let params = new HttpParams();
-  if (!payload) {
-    return params;
-  }
-
-  for (const [key, value] of Object.entries(payload)) {
-    if (value === undefined || value === null) {
-      continue;
-    }
-    if (typeof value === 'object' && !Array.isArray(value)) {
-      for (const [nestedKey, nestedValue] of Object.entries(value as Record<string, unknown>)) {
-        if (nestedValue !== undefined && nestedValue !== null) {
-          params = params.set(nestedKey, String(nestedValue));
-        }
-      }
-    } else if (Array.isArray(value)) {
-      for (const item of value) {
-        if (item !== undefined && item !== null) {
-          params = params.append(key, String(item));
-        }
-      }
-    } else {
-      params = params.set(key, String(value));
-    }
-  }
-  return params;
-}

package/src/lib/core/services/upload.service.ts

@@ -1,81 +0,0 @@
-import { HttpClient, HttpEvent, HttpEventType, HttpResponse } from '@angular/common/http';
-import { inject, Service } from '@angular/core';
-import { map, Observable, switchMap } from 'rxjs';
-
-import { ApiService } from './api.service';
-
-/** Firma que emite `/admin/upload-signature` (baseapi §11.3). NUNCA `api_secret`. */
-interface UploadSignature {
-  cloud_name: string;
-  api_key: string;
-  timestamp: number;
-  signature: string;
-  folder: string;
-  allowed_formats: string;
-  upload_url: string;
-}
-
-/** Respuesta de Cloudinary en un upload normal (sólo interesa `secure_url`). */
-interface CloudinaryResponse {
-  secure_url?: unknown;
-}
-
-/**
- * Subida de imágenes en DOS PASOS (baseapi §11.2, opción B):
- *  1. Firma firmada por el backend → `POST /admin/upload-signature`
- *     con `{ resource }` (mismo envelope text/plain que todo `/admin/*`).
- *  2. El navegador sube directo a Cloudinary (FormData a `upload_url`) con
- *     los parámetros que fijó y firmó el backend; el API secret jamás sale
- *     de acá (§11.1–§11.3).
- *
- * Se guarda SOLO `secure_url` (base.md §7: la URL pública es el valor del
- * campo; la imagen anterior no se borra al reemplazar — §11.6).
- *
- * Los errores (firma caducada, rate-limit 429, red) llegan por el canal de
- * error; el componente conserva la imagen anterior (§11.2 paso 6).
- */
-@Service()
-export class UploadService {
-  private readonly http = inject(HttpClient);
-  private readonly api = inject(ApiService);
-
-  /**
-   * Misma subida con eventos de progreso (base.md §7, estado «Subiendo»):
-   * emite `UploadProgress` durante la subida a Cloudinary y termina con
-   * `Response` llevando la URL en el body. El campo sólo cambia cuando
-   * llega la respuesta.
-   */
-  uploadWithProgress(file: File, resource: string, field?: string): Observable<HttpEvent<string>> {
-    // `field` es opcional (R9.5.3): si el campo declara `formats`, esos son
-    // los formatos que el backend firma. Sin campo firma la lista global.
-    const payload: { resource: string; field?: string } = field
-      ? { resource, field }
-      : { resource };
-    return this.api.request<UploadSignature>('POST', '/admin/upload-signature', payload).pipe(
-      switchMap((signature) => {
-        const form = new FormData();
-        form.append('file', file, file.name);
-        form.append('api_key', signature.api_key);
-        form.append('timestamp', String(signature.timestamp));
-        form.append('signature', signature.signature);
-        form.append('folder', signature.folder);
-        form.append('allowed_formats', signature.allowed_formats);
-        return this.http.post<CloudinaryResponse>(signature.upload_url, form, {
-          reportProgress: true,
-          observe: 'events',
-        });
-      }),
-      map((event) => {
-        if (event.type !== HttpEventType.Response) {
-          return event;
-        }
-        const url = typeof event.body?.secure_url === 'string' ? event.body.secure_url : '';
-        return new HttpResponse({
-          body: url,
-          status: event.status,
-          statusText: event.statusText,
-        });
-      }),
-    );
-  }
-}