@taon-dev/ui 21.0.12 → 21.0.14

package/ts-source/websql-code/taon-admin-layout/taon-admin-layout.models.ts

@@ -0,0 +1,52 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import type { MatIcon } from '@angular/material/icon';
+import { Route } from '@angular/router';
+export interface TaonAdminRoute extends Route {
+    loadAdminChildren?: () => Promise<TaonAdminRoutes>;
+}
+export type TaonAdminRoutes = TaonAdminRoute[];
+export interface TaonAdminMenuCallbacks<TContext = unknown> {
+    isDisabled?: (params: {
+        context: TContext;
+    }) => boolean;
+    isDisabledTooltip?: (params: {
+        context: TContext;
+    }) => string;
+    isVisible?: (params: {
+        context: TContext;
+    }) => boolean;
+}
+export interface TaonAdminRouteOptions<TContext = unknown> extends TaonAdminMenuCallbacks<TContext> {
+    path: string;
+    color?: string;
+    loader: () => Promise<TaonAdminRoutes>;
+    menuItem?: string;
+    icon?: MatIcon['fontIcon'];
+    expandable?: boolean;
+    hideInNavigation?: boolean;
+}
+export const TaonBaselineBackofficeOutletName = 'admin';
+export function adminLazyRoute<TContext = unknown>(options: TaonAdminRouteOptions<TContext>): TaonAdminRoute {
+    const { path, loader, menuItem, icon, color, expandable, hideInNavigation, isDisabled, isDisabledTooltip, isVisible, } = options;
+    return {
+        path,
+        data: {
+            menuItem,
+            color,
+            icon,
+            expandable,
+            hideInNavigation,
+            isDisabled,
+            isDisabledTooltip,
+            isVisible,
+        },
+        loadChildren: loader,
+        loadAdminChildren: loader,
+    };
+}

package/ts-source/websql-code/taon-admin-layout/taon-admin-menu-context.ts

@@ -0,0 +1,31 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import { Injectable, signal } from '@angular/core';
+import { Route } from '@angular/router';
+import { TaonAdminMenuCallbacks } from './taon-admin-layout.models';
+@Injectable()
+export class TaonAdminMenuContext {
+    readonly context = signal<unknown>(undefined);
+    isVisible(route: Route): boolean {
+        return (!route.data?.['hideInNavigation'] &&
+            this.callbacks(route)?.isVisible?.({ context: this.context() }) !== false);
+    }
+    isDisabled(route: Route): boolean {
+        return (this.callbacks(route)?.isDisabled?.({ context: this.context() }) === true);
+    }
+    disabledTooltip(route: Route): string {
+        return this.isDisabled(route)
+            ? (this.callbacks(route)?.isDisabledTooltip?.({
+                context: this.context(),
+            }) ?? '')
+            : '';
+    }
+    private callbacks(route: Route): TaonAdminMenuCallbacks | undefined {
+        return route.data as TaonAdminMenuCallbacks | undefined;
+    }
+}

package/ts-source/websql-code/taon-admin-layout/taon-admin-page-tabs.component.html

@@ -0,0 +1,34 @@
+<!--
+==============================================================================
+ TAON READONLY SOURCE
+ DO NOT MODIFY THIS FILE.
+ Changes may be overwritten.
+==============================================================================
+-->
+
+@if (levels().length) {
+  <div class="shrink-0 border-b border-gray-200 bg-white">
+    @for (level of levels(); track level.level) {
+      <nav
+        mat-tab-nav-bar
+        [tabPanel]="tabPanel">
+        @for (route of level.routes; track route.path) {
+          @if (menuContext.isVisible(route)) {
+            <a
+              mat-tab-link
+              class="cursor-pointer"
+              [disabled]="menuContext.isDisabled(route)"
+              [class.admin-tab-disabled]="menuContext.isDisabled(route)"
+              [matTooltip]="menuContext.disabledTooltip(route)"
+              [active]="isActive(level, route)"
+              (click)="tabClicked(level, route)">
+              {{ label(route) }}
+            </a>
+          }
+        }
+      </nav>
+    }
+  </div>
+}
+
+<mat-tab-nav-panel #tabPanel> </mat-tab-nav-panel>

package/ts-source/websql-code/taon-admin-layout/taon-admin-page-tabs.component.scss

@@ -0,0 +1,18 @@
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+
+
+
+
+
+
+.mat-mdc-tab-link.admin-tab-disabled {
+
+  pointer-events: auto;
+  cursor: not-allowed;
+  opacity: 0.5;
+}

package/ts-source/websql-code/taon-admin-layout/taon-admin-page-tabs.component.ts

@@ -0,0 +1,180 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import { ChangeDetectionStrategy, Component, inject, Input, OnInit, signal, } from '@angular/core';
+import { MatTabsModule } from '@angular/material/tabs';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { NavigationEnd, Route, Router, Routes } from '@angular/router';
+import { filter } from 'rxjs';
+import { TaonAdminRoute } from './taon-admin-layout.models';
+import { TaonAdminMenuContext } from './taon-admin-menu-context';
+export interface TaonAdminTabLevel {
+    level: number;
+    routes: Routes;
+    baseSegments: string[];
+}
+@Component({
+    selector: 'taon-admin-page-tabs',
+    standalone: true,
+    imports: [MatTabsModule, MatTooltipModule],
+    templateUrl: './taon-admin-page-tabs.component.html',
+    styleUrl: './taon-admin-page-tabs.component.scss',
+    changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class TaonAdminPageTabsComponent implements OnInit {
+    protected readonly menuContext = inject(TaonAdminMenuContext, { optional: true }) ??
+        new TaonAdminMenuContext();
+    @Input({ required: true })
+    routes!: Routes;
+    @Input()
+    basePath = '';
+    @Input()
+    outlet?: string;
+    protected readonly levels = signal<TaonAdminTabLevel[]>([]);
+    constructor(private readonly router: Router) { }
+    async ngOnInit(): Promise<void> {
+        await this.refresh();
+        this.router.events
+            .pipe(filter(event => event instanceof NavigationEnd))
+            .subscribe(async () => {
+            await this.refresh();
+        });
+    }
+    protected label(route: Route): string {
+        return route.data?.['menuItem'] ?? this.startCase(route.path ?? '');
+    }
+    protected isActive(level: TaonAdminTabLevel, route: Route): boolean {
+        if (!route.path) {
+            return false;
+        }
+        const expected = [...level.baseSegments, route.path];
+        const current = this.currentOutletSegments();
+        if (current.length < expected.length) {
+            return false;
+        }
+        return expected.every((segment, index) => current[index] === segment);
+    }
+    protected async tabClicked(level: TaonAdminTabLevel, route: Route): Promise<void> {
+        if (!route.path ||
+            !this.menuContext.isVisible(route) ||
+            this.menuContext.isDisabled(route)) {
+            return;
+        }
+        await this.navigateTo([
+            ...level.baseSegments.slice(this.basePathSegments.length),
+            route.path,
+        ]);
+    }
+    private outletBaseMatrixParams(): Record<string, string> {
+        if (!this.outlet) {
+            return {};
+        }
+        const tree = this.router.parseUrl(this.router.url);
+        const outletGroup = tree.root.children[this.outlet];
+        return {
+            ...outletGroup?.segments[0]?.parameters,
+        };
+    }
+    private async navigateTo(routeSegments: string[]): Promise<boolean> {
+        const segments = [...this.basePathSegments, ...routeSegments];
+        if (this.outlet) {
+            const [firstSegment, ...remainingSegments] = segments;
+            if (!firstSegment) {
+                return false;
+            }
+            const matrixParams = this.outletBaseMatrixParams();
+            return this.router.navigate([
+                {
+                    outlets: {
+                        [this.outlet]: [
+                            firstSegment,
+                            matrixParams,
+                            ...remainingSegments,
+                        ],
+                    },
+                },
+            ]);
+        }
+        return this.router.navigate(['/', ...segments]);
+    }
+    private async refresh(): Promise<void> {
+        const current = this.currentOutletSegments();
+        const base = this.basePathSegments;
+        const relative = current.slice(base.length);
+        const levels: TaonAdminTabLevel[] = [];
+        await this.walk(this.routes, relative, base, 1, levels);
+        this.levels.set(levels.filter(level => level.level >= 3));
+    }
+    private async walk(routes: Routes, remainingUrl: string[], baseSegments: string[], level: number, result: TaonAdminTabLevel[]): Promise<void> {
+        routes = this.unwrapEmptyPathRoutes(routes);
+        const visibleRoutes = this.navigationRoutes(routes);
+        if (level >= 3 && visibleRoutes.length > 0) {
+            result.push({
+                level,
+                routes: visibleRoutes,
+                baseSegments,
+            });
+        }
+        const currentSegment = remainingUrl[0];
+        if (!currentSegment) {
+            return;
+        }
+        const activeRoute = routes.find(route => route.path === currentSegment);
+        if (!activeRoute) {
+            return;
+        }
+        let children = await this.loadChildren(activeRoute);
+        children = this.unwrapEmptyPathRoutes(children);
+        if (!children.length) {
+            return;
+        }
+        await this.walk(children, remainingUrl.slice(1), [...baseSegments, currentSegment], level + 1, result);
+    }
+    private async loadChildren(route: Route): Promise<Routes> {
+        if (route.children) {
+            return route.children;
+        }
+        const adminRoute = route as TaonAdminRoute;
+        if (adminRoute.loadAdminChildren) {
+            return await adminRoute.loadAdminChildren();
+        }
+        return [];
+    }
+    private unwrapEmptyPathRoutes(routes: Routes): Routes {
+        const result: Routes = [];
+        for (const route of routes) {
+            if (route.path === '' && route.children) {
+                result.push(...this.unwrapEmptyPathRoutes(route.children));
+                continue;
+            }
+            result.push(route);
+        }
+        return result;
+    }
+    private navigationRoutes(routes: Routes): Routes {
+        return routes.filter(route => !!route.path &&
+            route.redirectTo === undefined &&
+            !route.data?.['hideInNavigation']);
+    }
+    private currentOutletSegments(): string[] {
+        const tree = this.router.parseUrl(this.router.url);
+        const outletName = this.outlet || 'primary';
+        const group = tree.root.children[outletName];
+        if (!group) {
+            return [];
+        }
+        return group.segments.map(segment => segment.path);
+    }
+    private get basePathSegments(): string[] {
+        return this.basePath.split('/').filter(Boolean);
+    }
+    private startCase(value: string): string {
+        return value
+            .replace(/[-_]+/g, ' ')
+            .replace(/\b\w/g, char => char.toUpperCase());
+    }
+}

package/ts-source/websql-code/taon-admin-layout/taon-base-admin-page.component.ts

@@ -0,0 +1,19 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import { Component, ViewChild } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
+@Component({
+    template: '',
+})
+export abstract class TaonBaseAdminLayoutPage {
+    @ViewChild(RouterOutlet)
+    routerOutlet!: RouterOutlet;
+    get hasActiveChildRoute(): boolean {
+        return this.routerOutlet?.isActivated ?? false;
+    }
+}

package/ts-source/websql-code/taon-backoffice-notifications/i18n/taon-backoffice-notifications.component.ts.en-US.i18n.data.ts

@@ -0,0 +1,23 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+export interface EnUsTraslationOverrideSrcLibTaonBackofficeNotificationsTaonBackofficeNotificationsComponentTs {
+    "en-US": {
+        "": {
+            "Unknown error"?: string;
+        };
+    };
+}
+export default {
+    "fileRelativePath": "src/lib/taon-backoffice-notifications/taon-backoffice-notifications.component.ts",
+    "tags": [
+        {
+            "gettextString": "Unknown error",
+            "lineNumber": 64
+        }
+    ]
+};

package/ts-source/websql-code/taon-backoffice-notifications/i18n/taon-backoffice-notifications.component.ts.en-US.po

@@ -0,0 +1,9 @@
+msgid ""
+msgstr ""
+"Language: en-US\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+
+#: src/lib/taon-backoffice-notifications/taon-backoffice-notifications.component.ts:64
+msgid "Unknown error"
+msgstr ""

package/ts-source/websql-code/taon-backoffice-notifications/i18n/taon-backoffice-notifications.component.ts.pl-PL.i18n.data.ts

@@ -0,0 +1,23 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+export interface PlPlTraslationOverrideSrcLibTaonBackofficeNotificationsTaonBackofficeNotificationsComponentTs {
+    "pl-PL": {
+        "": {
+            "Unknown error"?: string;
+        };
+    };
+}
+export default {
+    "fileRelativePath": "src/lib/taon-backoffice-notifications/taon-backoffice-notifications.component.ts",
+    "tags": [
+        {
+            "gettextString": "Unknown error",
+            "lineNumber": 64
+        }
+    ]
+};

package/ts-source/websql-code/taon-backoffice-notifications/i18n/taon-backoffice-notifications.component.ts.pl-PL.po

@@ -0,0 +1,9 @@
+msgid ""
+msgstr ""
+"Language: pl-PL\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+
+#: src/lib/taon-backoffice-notifications/taon-backoffice-notifications.component.ts:64
+msgid "Unknown error"
+msgstr ""

package/ts-source/websql-code/taon-backoffice-notifications/i18n/taon-backoffice-notifications.translation.ts

@@ -0,0 +1,12 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import { CoreModels } from 'tnp-core/websql';
+import { EnUsTraslationOverrideSrcLibTaonBackofficeNotificationsTaonBackofficeNotificationsComponentTs } from './taon-backoffice-notifications.component.ts.en-US.i18n.data';
+import { PlPlTraslationOverrideSrcLibTaonBackofficeNotificationsTaonBackofficeNotificationsComponentTs } from './taon-backoffice-notifications.component.ts.pl-PL.i18n.data';
+;
+export type TaonBackofficeNotificationsOverride = CoreModels.DeepPartial<EnUsTraslationOverrideSrcLibTaonBackofficeNotificationsTaonBackofficeNotificationsComponentTs | PlPlTraslationOverrideSrcLibTaonBackofficeNotificationsTaonBackofficeNotificationsComponentTs>;

package/ts-source/websql-code/taon-backoffice-notifications/index.ts

@@ -0,0 +1,11 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+export * from './taon-backoffice-notifications.component';
+export * from './taon-backoffice-notifications.models';
+export * from './taon-backoffice-notifications.module';
+export * from './taon-backoffice-notifications.service';

package/ts-source/websql-code/taon-backoffice-notifications/taon-backoffice-notifications.component.html

@@ -0,0 +1,8 @@
+<!--
+==============================================================================
+ TAON READONLY SOURCE
+ DO NOT MODIFY THIS FILE.
+ Changes may be overwritten.
+==============================================================================
+-->
+

package/ts-source/websql-code/taon-backoffice-notifications/taon-backoffice-notifications.component.scss

@@ -0,0 +1,9 @@
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+:host {
+  display: none;
+}

package/ts-source/websql-code/taon-backoffice-notifications/taon-backoffice-notifications.component.ts

@@ -0,0 +1,53 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import { Component, DestroyRef, inject, Input } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { Translation } from '@taon-dev/i18n/websql';
+import { HttpResponseError, Resource, RestErrorResponseWrapper, } from 'ng2-rest/websql';
+import { getHttpStatus, Taon, TaonAdminService } from 'taon/websql';
+import { _ } from 'tnp-core/websql';
+import { TaonBackofficeNotificationsService } from './taon-backoffice-notifications.service';
+const t = Translation.for('src/lib/taon-backoffice-notifications/taon-backoffice-notifications.component.ts', { "src/lib/taon-backoffice-notifications/taon-backoffice-notifications.component.ts": { "en-US": async () => (await import('./i18n/taon-backoffice-notifications.component.ts.en-US.i18n.data')).default, "pl-PL": async () => (await import('./i18n/taon-backoffice-notifications.component.ts.pl-PL.i18n.data')).default } } as any);
+@Component({
+    selector: 'taon-backoffice-notifications',
+    standalone: true,
+    templateUrl: './taon-backoffice-notifications.component.html',
+    styleUrls: ['./taon-backoffice-notifications.component.scss'],
+})
+export class TaonBackofficeNotificationsComponent {
+    t = t.for(this);
+    private readonly notification = inject(TaonBackofficeNotificationsService);
+    private readonly destroyRef = inject(DestroyRef);
+    private readonly taonAdminService = inject(TaonAdminService);
+    @Input()
+    filter: (err: HttpResponseError<RestErrorResponseWrapper>) => HttpResponseError<RestErrorResponseWrapper>;
+    constructor() {
+        Resource.listenErrors
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe((error: HttpResponseError<RestErrorResponseWrapper>) => {
+            if (_.isFunction(this.filter)) {
+                error = this.filter(error);
+            }
+            const jsonMsg = error?.body?.json;
+            if (!jsonMsg?.message) {
+                console.log({ error });
+            }
+            const statusCode = jsonMsg.status ?? error.statusCode;
+            const code = jsonMsg?.code || getHttpStatus(statusCode);
+            if (this.taonAdminService.shouldSkipShowingError(code as any)) {
+                console.log(`[@taon-dev/sudo] Skipping notificaiton for message "${jsonMsg.message}" (code=${statusCode})`);
+            }
+            else {
+                this.notification.error({
+                    title: t.translate(jsonMsg.message) || t.gettext('Unknown error'),
+                    details: jsonMsg?.details,
+                });
+            }
+        });
+    }
+}

package/ts-source/websql-code/taon-backoffice-notifications/taon-backoffice-notifications.models.ts

@@ -0,0 +1,14 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+export interface TaonNotificationOptions {
+    title: string;
+    subtitle?: string;
+    details?: string;
+}
+export type TaonNotificationType = 'success' | 'error' | 'warning' | 'info';
+export type TaonNotificationInput = TaonNotificationOptions | string;

package/ts-source/websql-code/taon-backoffice-notifications/taon-backoffice-notifications.service.ts

@@ -0,0 +1,44 @@
+// @ts-nocheck
+/* ============================================================================
+ * TAON READONLY SOURCE
+ * DO NOT MODIFY THIS FILE.
+ * Changes may be overwritten.
+ * ========================================================================== */
+
+import { inject, Injectable } from '@angular/core';
+import { HotToastService } from '@ngneat/hot-toast';
+import { TaonNotificationInput, TaonNotificationOptions, } from './taon-backoffice-notifications.models';
+import { TaonErrorToastComponent, TaonErrorToastData, } from './taon-error-toast.component';
+@Injectable({
+    providedIn: 'root',
+})
+export class TaonBackofficeNotificationsService {
+    private readonly toast = inject(HotToastService);
+    private normalize(input: TaonNotificationInput): TaonNotificationOptions {
+        return typeof input === 'string' ? { title: input } : input;
+    }
+    success(input: TaonNotificationInput) {
+        const { title } = this.normalize(input);
+        return this.toast.success(title);
+    }
+    error(input: TaonNotificationInput) {
+        const { title, details } = this.normalize(input);
+        if (!details) {
+            return this.toast.error(title);
+        }
+        return this.toast.error<TaonErrorToastData>(TaonErrorToastComponent, {
+            data: {
+                title,
+                details,
+            },
+        });
+    }
+    warn(input: TaonNotificationInput) {
+        const { title } = this.normalize(input);
+        return this.toast.warning(title);
+    }
+    info(input: TaonNotificationInput) {
+        const { title } = this.normalize(input);
+        return this.toast.info(title);
+    }
+}

package/ts-source/websql-code/taon-backoffice-notifications/taon-error-details-dialog.component.html

@@ -0,0 +1,44 @@
+<!--
+==============================================================================
+ TAON READONLY SOURCE
+ DO NOT MODIFY THIS FILE.
+ Changes may be overwritten.
+==============================================================================
+-->
+
+<h2 mat-dialog-title>Error details</h2>
+
+<mat-dialog-content>
+  <div class="error-message">
+    {{ data.message }}
+  </div>
+
+  <div class="editor-selector">
+    <span class="editor-selector-label"> I am using editor: </span>
+
+    <mat-button-toggle-group
+      [value]="editor"
+      (change)="setEditor($event.value)"
+      aria-label="Code editor">
+      <mat-button-toggle value="vscode"> VS Code </mat-button-toggle>
+
+      <mat-button-toggle value="vscodium"> VSCodium </mat-button-toggle>
+    </mat-button-toggle-group>
+  </div>
+
+  <pre
+    class="error-details"><code>@for (stackLine of stackLines; track $index) {
+@if (stackLine.file) {<a
+  class="stack-link"
+  title="Open {{ stackLine.file }}:{{ stackLine.line }}:{{ stackLine.column }}"
+  (click)="openStackLine(stackLine)">{{ stackLine.text }}</a>} @else {{{ stackLine.text }}}{{ '\n' }}
+}</code></pre>
+</mat-dialog-content>
+
+<mat-dialog-actions align="end">
+  <button
+    mat-button
+    mat-dialog-close>
+    Close
+  </button>
+</mat-dialog-actions>