valtech-components 2.0.992 → 2.0.993

package/lib/components/organisms/notifications-view/notifications-view.component.d.ts

@@ -0,0 +1,168 @@
+import { OnDestroy, OnInit } from '@angular/core';
+import { EmptyStateMetadata } from '../../molecules/empty-state/types';
+import { ButtonMetadata } from '../../types';
+import { NotificationDocument } from '../../../services/firebase/notifications.service';
+import { NotificationsViewConfig } from './types';
+import * as i0 from "@angular/core";
+type GroupKey = 'today' | 'thisMonth' | 'earlier';
+interface NotificationGroup {
+    key: GroupKey;
+    label: string;
+    items: NotificationDocument[];
+}
+type ResolvedIcon = {
+    kind: 'ionicon';
+    name: string;
+    color?: string;
+} | {
+    kind: 'image';
+    src: string;
+} | {
+    kind: 'avatar';
+    src: string;
+};
+/**
+ * `val-notifications-view` — inbox de notificaciones full-feature autocontenido
+ * (organism). Promovido desde `showcase` bajo el proceso de ADR-021.
+ *
+ * Separado de `/app/settings/notifications` (que controla permiso FCM + master
+ * toggle). Aquí el user lee/abre/marca-leídas sus mensajes.
+ *
+ * - **Stream real-time** vía `NotificationsService.getAll(maxLoad)` envuelto en
+ *   `createRefreshableStream` (gateado por `firebaseAuthReady`, retry corto,
+ *   `firstEmitTimeoutMs: 15000`). Estados: loading (skeleton), error
+ *   (`val-empty-state` + reintentar), empty (`val-empty-state` + CTA), data
+ *   (lista agrupada Hoy / Este mes / Anteriores).
+ * - **Abrir** una notif → `NotificationActionService.open()` (markRead +
+ *   switch-org + navegar/handoff cross-app). Hook `onNotificationOpen` opcional.
+ * - **Marcar todas como leídas** (gateado por `enableMarkAll`).
+ * - **CTA push-off** cuando el permiso del navegador no está concedido (gateado
+ *   por `showPushOffCta`); navega a `settingsNotificationsPath`.
+ * - **Paginación soft** — slice local (`pageSize`, +`pageSize` por click) sobre el
+ *   cache del stream; el tope de fetch es `maxLoad`.
+ * - **i18n auto-registrado** es/en bajo `i18nNamespace` (default `Notifications`).
+ *
+ * NO renderiza ion-content — vive dentro de val-page-wrapper. `Router` y
+ * `ActivatedRoute` se inyectan `{ optional: true }` → funciona sin router
+ * (embebida / Storybook). El forward-compat icon resolver lee `notif.payload.icon`
+ * si existe (`{ type, value, color? }`), cae a un mapa por `notif.type`, luego a
+ * `notifications-outline`.
+ */
+export declare class NotificationsViewComponent implements OnInit, OnDestroy {
+    private nav;
+    private i18n;
+    private notifs;
+    private action;
+    private toast;
+    private errors;
+    private auth;
+    private pageRefresh;
+    private route;
+    /**
+     * Config vía @Input (object-first). Si no se pasa, se cae al route data
+     * `notificationsConfig` (poblado por `provideValtechNotificationsRoutes`).
+     * `resolvedConfig` mergea con los defaults — `@Input` gana sobre route data.
+     */
+    config?: NotificationsViewConfig;
+    readonly resolvedConfig: import("@angular/core").Signal<Required<Omit<NotificationsViewConfig, "onNotificationOpen">> & Pick<NotificationsViewConfig, "onNotificationOpen">>;
+    /** Namespace i18n resuelto (capturado para llamadas no-reactivas). */
+    private get ns();
+    /** Paso de paginación soft (revela +N por "cargar más"). */
+    private get pageStep();
+    private readonly _expanded;
+    private readonly _pageSize;
+    private readonly _bulkBusy;
+    private readonly _loadingMore;
+    /**
+     * Push activado = permiso del navegador en `granted`. Si NO está activado,
+     * el user puede leer el inbox (Firestore) pero NO recibirá push en su
+     * dispositivo → mostramos una card que lo invita a ir a configuración.
+     * Se evalúa en cada montaje de la vista.
+     */
+    readonly pushEnabled: import("@angular/core").WritableSignal<boolean>;
+    /**
+     * Stream firestore real-time vía el helper estándar `createRefreshableStream`
+     * (modo real-time: factory devuelve un listener vivo `notifs.getAll(maxLoad)`).
+     *
+     * El helper gatea la primera suscripción por `firebaseAuthReady`, aplica un
+     * `retry` corto con backoff y, tras agotar reintentos, emite el fallback (`[]`)
+     * y marca `error` — estado de error en UI, no skeleton infinito. `reload()`
+     * re-suscribe el stream completo (lo usa el pull-to-refresh).
+     */
+    private readonly _stream;
+    /** True si el stream falló tras agotar reintentos → muestra estado de error. */
+    readonly streamError: import("@angular/core").Signal<boolean>;
+    readonly loading: import("@angular/core").Signal<boolean>;
+    /**
+     * Notifs reales mostradas. Filtramos docs sin título Y sin body — son ruido
+     * (típicamente sentinel/system writes pre-schema con title/body opcionales).
+     */
+    readonly allNotifs: import("@angular/core").Signal<NotificationDocument[]>;
+    readonly hasMore: import("@angular/core").Signal<boolean>;
+    readonly showMarkAll: import("@angular/core").Signal<boolean>;
+    /** Sub-conjunto paginado, agrupado por período. */
+    readonly groups: import("@angular/core").Signal<NotificationGroup[]>;
+    readonly pageTitle: import("@angular/core").Signal<string>;
+    readonly pageDescription: import("@angular/core").Signal<string>;
+    readonly ctaTitle: import("@angular/core").Signal<string>;
+    readonly ctaHint: import("@angular/core").Signal<string>;
+    readonly ctaButtonProps: import("@angular/core").Signal<Partial<ButtonMetadata>>;
+    /**
+     * Estado de error de carga: convierte el error del stream en
+     * `EmptyStateMetadata` via el helper canónico `createErrorStateProps`.
+     * El helper decide variante (`offline` vs `error`) por `isNetwork`.
+     * Null cuando el stream no ha fallado.
+     */
+    readonly errorState: import("@angular/core").Signal<EmptyStateMetadata>;
+    /**
+     * Estado vacío (lista real = 0 notificaciones, sin error de carga).
+     * Se construye manualmente con `variant: 'empty'` — sin helper de error.
+     */
+    readonly emptyStateProps: import("@angular/core").Signal<EmptyStateMetadata>;
+    readonly seeMore: import("@angular/core").Signal<string>;
+    readonly seeLess: import("@angular/core").Signal<string>;
+    readonly markAllButtonProps: import("@angular/core").Signal<Partial<ButtonMetadata>>;
+    readonly loadMoreButtonProps: import("@angular/core").Signal<Partial<ButtonMetadata>>;
+    constructor();
+    /**
+     * Registra el pull-to-refresh estándar. Usamos `ngOnInit`/`ngOnDestroy`
+     * (NO `ionViewWillEnter`) porque `val-page-wrapper` usa `<router-outlet>`
+     * plano — los hooks `ionView*` solo disparan dentro de `<ion-router-outlet>`.
+     */
+    ngOnInit(): void;
+    /** Quita el handler al destruir la vista — el refresher desaparece. */
+    ngOnDestroy(): void;
+    /**
+     * Refresh manual: re-suscribe el stream Firestore (listener nuevo) vía el
+     * helper. Resuelve tras un margen breve — el stream es real-time y re-emite
+     * en milisegundos; el delay sólo mantiene el spinner visible lo justo.
+     */
+    private reload;
+    openButtonProps(): Partial<ButtonMetadata>;
+    isExpanded(id: string): boolean;
+    toggleExpand(id: string): void;
+    isLong(body: string | undefined): boolean;
+    /**
+     * Icon resolver con orden de fallback:
+     * 1. notif.payload.icon (forward-compat, sin breaking change en schema)
+     * 2. mapa por notif.type
+     * 3. default notifications-outline
+     */
+    resolveIcon(n: NotificationDocument): ResolvedIcon;
+    ioniconName(n: NotificationDocument): string;
+    ioniconColor(n: NotificationDocument): string | undefined;
+    imageSrc(n: NotificationDocument): string;
+    ionColor(token: string | undefined): string;
+    relativeTime(n: NotificationDocument): string;
+    /** Devuelve label "Desde {appName}" si la notif viene de otra app, sino null. */
+    showCrossAppBadge(n: NotificationDocument): string | null;
+    onOpen(n: NotificationDocument): Promise<void>;
+    onMarkAll(): Promise<void>;
+    onLoadMore(): void;
+    onGoToSettings(): void;
+    private bucketOf;
+    private tt;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NotificationsViewComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NotificationsViewComponent, "val-notifications-view", never, { "config": { "alias": "config"; "required": false; }; }, {}, never, never, true, never>;
+}
+export {};

package/lib/components/organisms/notifications-view/notifications-view.i18n.d.ts

@@ -0,0 +1,9 @@
+import { LanguagesContent } from '../../../services/i18n/types';
+/**
+ * Defaults i18n (es/en) embebidos en `val-notifications-view`. Auto-registrados
+ * en el constructor del componente si el consumer no proveyó el namespace
+ * (`Notifications` por default). SOLO incluye las keys que la vista usa.
+ *
+ * Portado del override `Notifications` (showcase) bajo el proceso de ADR-021.
+ */
+export declare const NOTIFICATIONS_VIEW_I18N: LanguagesContent;

package/lib/components/organisms/notifications-view/notifications.routes.d.ts

@@ -0,0 +1,27 @@
+import { Routes } from '@angular/router';
+import { NotificationsViewConfig } from './types';
+/**
+ * Helper para montar el inbox de notificaciones (`val-notifications-view`) como
+ * ruta en una app del factory. El `config` se pasa por route `data`
+ * (`notificationsConfig`) y el componente lo lee como fallback de su
+ * `@Input() config`.
+ *
+ * @example
+ * ```ts
+ * // app.routes.ts
+ * export const appRoutes: Routes = [
+ *   ...provideValtechNotificationsRoutes(),                 // → /app/notifications
+ *   { path: 'settings', loadChildren: () => ... },
+ * ];
+ *
+ * // con config acotada:
+ * ...provideValtechNotificationsRoutes({ config: { enableMarkAll: false } }),
+ * ...provideValtechNotificationsRoutes({
+ *   config: { settingsNotificationsPath: '/app/preferences/push' },
+ * }),
+ * ```
+ */
+export declare function provideValtechNotificationsRoutes(opts?: {
+    path?: string;
+    config?: NotificationsViewConfig;
+}): Routes;

package/lib/components/organisms/notifications-view/types.d.ts

@@ -0,0 +1,52 @@
+import { NotificationOpenResult } from '../../../services/auth/notification-action.service';
+import { NotificationDocument } from '../../../services/firebase/notifications.service';
+/**
+ * Configuración acotada de `val-notifications-view` (object-first). Tres ejes de
+ * variación permitidos — **NADA de slots arbitrarios** (ADR-021: una vista
+ * full-feature no abre slots; si falta algo, se promueve un nuevo punto de
+ * extensión):
+ *
+ *  - **secciones / flags** — gatean el render de bloques opcionales (CTA de push
+ *    desactivado, botón "Marcar todas como leídas") y la ruta de configuración de
+ *    notificaciones a la que apuntan los CTA.
+ *  - **branding** — `i18nNamespace` para resolver los textos (default
+ *    `'Notifications'`).
+ *  - **comportamiento / callbacks** — `onNotificationOpen` (telemetría tras abrir
+ *    una notif), tamaño de página y tope de fetch.
+ */
+export interface NotificationsViewConfig {
+    /**
+     * Muestra la card "Activa las notificaciones push" cuando el permiso del
+     * navegador no está concedido. Default `true`.
+     */
+    showPushOffCta?: boolean;
+    /**
+     * Habilita el botón "Marcar todas como leídas" (visible solo si hay notifs sin
+     * leer). Default `true`.
+     */
+    enableMarkAll?: boolean;
+    /**
+     * Ruta de configuración de notificaciones a la que navegan los CTA ("Activar
+     * notificaciones" / "Ir a configuración"). Default `'/app/settings/notifications'`.
+     */
+    settingsNotificationsPath?: string;
+    /**
+     * Namespace i18n con el que la vista resuelve sus textos.
+     * Default `'Notifications'`.
+     */
+    i18nNamespace?: string;
+    /**
+     * Hook de telemetría tras abrir una notificación (markRead + switch-org +
+     * navegar/handoff cross-app). `result` es lo que devuelve
+     * `NotificationActionService.open(notif)`.
+     */
+    onNotificationOpen?: (notif: NotificationDocument, result: NotificationOpenResult) => void;
+    /**
+     * Cuántas notifs se revelan al inicio y por cada "cargar más". Default `10`.
+     */
+    pageSize?: number;
+    /**
+     * Tope de docs que carga el stream real-time (`getAll(maxLoad)`). Default `50`.
+     */
+    maxLoad?: number;
+}

package/lib/version.d.ts

@@ -2,4 +2,4 @@
  * Current version of valtech-components.
  * This is automatically updated during the publish process.
  */
-export declare const VERSION = "2.0.992";
+export declare const VERSION = "2.0.993";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "valtech-components",
-  "version": "2.0.992",
+  "version": "2.0.993",
   "private": false,
   "bin": {
     "valtech-firebase-config": "./src/lib/services/firebase/scripts/generate-sw-config.js"

package/public-api.d.ts

@@ -284,6 +284,9 @@ export * from './lib/components/organisms/account-view/account.routes';
 export * from './lib/components/organisms/organization-view/organization-view.component';
 export * from './lib/components/organisms/organization-view/types';
 export * from './lib/components/organisms/organization-view/organization.routes';
+export * from './lib/components/organisms/notifications-view/notifications-view.component';
+export * from './lib/components/organisms/notifications-view/types';
+export * from './lib/components/organisms/notifications-view/notifications.routes';
 export * from './lib/components/organisms/delete-account-modal/delete-account-modal.component';
 export * from './lib/components/organisms/switch-org-modal/switch-org-modal.component';
 export * from './lib/components/organisms/create-org-modal/create-org-modal.component';