@taon-dev/marketing 21.0.10 → 21.0.12

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-backoffice/taon-marketing-popup-backoffice.component.html

@@ -0,0 +1,24 @@
+<!--
+==============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+==============================================================================
+-->
+
+<h1>Popups</h1>
+@if (error()) {
+  <p role="alert">{{ error() }}</p>
+}
+<taon-datatable
+  [entityCrudController]="crud"
+  [columns]="columns"
+  [allowedColumns]="['id', 'name', 'type', 'enabled']"
+  searchMode="advanced"
+  (addingItem)="edit()">
+</taon-datatable>

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-backoffice/taon-marketing-popup-backoffice.component.scss

@@ -0,0 +1,14 @@
+/* ============================================================================
+ 
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+:host {
+  display: block;
+}

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-backoffice/taon-marketing-popup-backoffice.component.ts

@@ -0,0 +1,116 @@
+// @ts-nocheck
+/* ============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+import { ChangeDetectionStrategy, Component, DestroyRef, ViewChild, inject, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { MatDialog } from '@angular/material/dialog';
+import { MtxGridColumn } from '@ng-matero/extensions/grid';
+import { TaonConfirmDialogComponent, TaonDatatableComponent } from '@taon-dev/ui/browser';
+import { finalize } from 'rxjs';
+import { TaonMarketingPopupApiService } from '../taon-marketing-popup.api.service';
+import type { TaonMarketingPopupEntity } from '../taon-marketing-popup.entity';
+import { TaonMarketingPopupEditorComponent } from './taon-marketing-popup-editor.component';
+@Component({
+    selector: 'app-taon-marketing-popup-backoffice',
+    templateUrl: './taon-marketing-popup-backoffice.component.html',
+    styleUrls: ['./taon-marketing-popup-backoffice.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush,
+    imports: [TaonDatatableComponent],
+    providers: [TaonMarketingPopupApiService],
+})
+export class TaonMarketingPopupBackofficeComponent {
+    @ViewChild(TaonDatatableComponent)
+    readonly datatable!: TaonDatatableComponent;
+    private readonly api = inject(TaonMarketingPopupApiService);
+    private readonly dialog = inject(MatDialog);
+    private readonly destroyRef = inject(DestroyRef);
+    readonly error = signal('');
+    readonly busy = signal(false);
+    readonly crud = this.api.taonMarketingPopupController;
+    readonly columns: MtxGridColumn[] = [
+        { header: 'ID', field: 'id', sortable: true },
+        { header: 'Name', field: 'name', sortable: true },
+        { header: 'Type', field: 'type', sortable: true },
+        { header: 'Enabled', field: 'enabled', sortable: true },
+        {
+            header: 'Actions',
+            field: 'actions',
+            type: 'button',
+            buttons: [
+                {
+                    type: 'icon', icon: 'edit', tooltip: 'Edit popup',
+                    disabled: () => this.busy(),
+                    click: (popup: TaonMarketingPopupEntity) => this.edit(popup),
+                },
+                {
+                    type: 'icon', icon: 'power_settings_new', tooltip: 'Enable / disable popup',
+                    disabled: () => this.busy(),
+                    click: (popup: TaonMarketingPopupEntity) => this.toggle(popup),
+                },
+                {
+                    type: 'icon', icon: 'delete', tooltip: 'Delete popup',
+                    disabled: () => this.busy(),
+                    click: (popup: TaonMarketingPopupEntity) => this.delete(popup),
+                },
+            ],
+        },
+    ];
+    ngAfterViewInit(): void {
+        this.datatable.reload();
+    }
+    edit(popup?: TaonMarketingPopupEntity): void {
+        const ref = this.dialog.open(TaonMarketingPopupEditorComponent, {
+            data: popup ?? null,
+            width: '640px',
+            maxWidth: '95vw',
+            disableClose: true,
+        });
+        ref.afterClosed().pipe(takeUntilDestroyed(this.destroyRef)).subscribe(saved => {
+            if (saved) {
+                this.datatable.reload();
+            }
+        });
+    }
+    toggle(popup: TaonMarketingPopupEntity): void {
+        this.busy.set(true);
+        this.error.set('');
+        this.api.setEnabled(popup.id, !popup.enabled).pipe(takeUntilDestroyed(this.destroyRef), finalize(() => this.busy.set(false))).subscribe({
+            next: () => this.datatable.reload(),
+            error: (error: unknown) => this.reportError('The popup could not be updated.', error),
+        });
+    }
+    delete(popup: TaonMarketingPopupEntity): void {
+        this.busy.set(true);
+        const ref = this.dialog.open(TaonConfirmDialogComponent, {
+            data: {
+                title: 'Delete popup?',
+                message: `Permanently delete "${popup.name}"?`,
+                confirmText: 'Delete',
+            },
+        });
+        ref.afterClosed().pipe(takeUntilDestroyed(this.destroyRef)).subscribe(confirmed => {
+            if (!confirmed) {
+                this.busy.set(false);
+                return;
+            }
+            this.error.set('');
+            this.api.deletePopup(popup.id).pipe(takeUntilDestroyed(this.destroyRef), finalize(() => this.busy.set(false))).subscribe({
+                next: () => this.datatable.reload(),
+                error: (error: unknown) => this.reportError('The popup could not be deleted.', error),
+            });
+        });
+    }
+    private reportError(message: string, error: unknown): void {
+        console.error('[taon-marketing-popup-backoffice]', message, error);
+        this.error.set(message);
+    }
+}

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-backoffice/taon-marketing-popup-backoffice.models.ts

@@ -0,0 +1,13 @@
+// @ts-nocheck
+/* ============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+export namespace TaonMarketingPopupBackofficeModels { }

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-backoffice/taon-marketing-popup-backoffice.routes.ts

@@ -0,0 +1,21 @@
+// @ts-nocheck
+/* ============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+import { Routes } from '@angular/router';
+import { adminLazyRoute } from '@taon-dev/ui/browser';
+export const TaonMarketingPopupBackofficeRoutes: Routes = [
+    {
+        path: '',
+        loadComponent: () => import('./taon-marketing-popup-backoffice.component').then(m => m.TaonMarketingPopupBackofficeComponent),
+        children: [],
+    },
+];

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-backoffice/taon-marketing-popup-editor.component.html

@@ -0,0 +1,55 @@
+<!--
+==============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+==============================================================================
+-->
+
+<h2 mat-dialog-title>{{ popup ? 'Edit popup' : 'Add popup' }}</h2>
+<form [formGroup]="form" (ngSubmit)="save()">
+  <mat-dialog-content>
+    @if (error()) {
+      <p role="alert">{{ error() }}</p>
+    }
+    <fieldset [disabled]="busy()">
+      <label>Name <input formControlName="name" maxlength="200" required></label>
+      <label class="checkbox"><input type="checkbox" formControlName="enabled"> Enabled</label>
+      <label>Type
+        <select formControlName="type">
+          @for (type of types; track type) {
+            <option [value]="type">{{ type }}</option>
+          }
+        </select>
+      </label>
+      <label>Title <input formControlName="title"></label>
+      <label>Content <textarea formControlName="content" rows="4"></textarea></label>
+      <label>Image key / URL (dialog only) <input formControlName="imageKey"></label>
+      <label>Button text <input formControlName="buttonText"></label>
+      <label>Button URL <input formControlName="buttonUrl" placeholder="/shop or https://example.com"></label>
+      <label>Delay (seconds) <input type="number" formControlName="delaySeconds" min="0" max="2147483" step="any" required></label>
+      <label>Display on paths
+        <textarea formControlName="displayOnPaths" rows="3" placeholder="/shop/*"></textarea>
+      </label>
+      <label>Exclude paths
+        <textarea formControlName="excludePaths" rows="3" placeholder="/checkout"></textarea>
+      </label>
+      <p>One path per line. Exact paths or a trailing * prefix. Empty display paths means all pages.</p>
+      <label>Start (local time) <input type="datetime-local" formControlName="startAt"></label>
+      <label>End (local time) <input type="datetime-local" formControlName="endAt"></label>
+      <label>Maximum displays per visitor (empty = unlimited)
+        <input type="number" formControlName="maxDisplaysPerVisitor" min="1" step="1">
+      </label>
+      <label class="checkbox"><input type="checkbox" formControlName="oncePerSession"> Once per session</label>
+    </fieldset>
+  </mat-dialog-content>
+  <mat-dialog-actions align="end">
+    <button mat-button type="button" [disabled]="busy()" (click)="close()">Cancel</button>
+    <button mat-flat-button type="submit" [disabled]="busy()">{{ busy() ? 'Saving...' : 'Save' }}</button>
+  </mat-dialog-actions>
+</form>

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-backoffice/taon-marketing-popup-editor.component.scss

@@ -0,0 +1,34 @@
+/* ============================================================================
+ 
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+fieldset {
+  border: 0;
+  padding: 0;
+  display: grid;
+  gap: 12px;
+}
+
+label {
+  display: grid;
+  gap: 4px;
+}
+
+input:not([type='checkbox']), textarea, select {
+  box-sizing: border-box;
+  width: 100%;
+  padding: 8px;
+  font: inherit;
+}
+
+.checkbox {
+  display: flex;
+  align-items: center;
+}

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-backoffice/taon-marketing-popup-editor.component.ts

@@ -0,0 +1,111 @@
+// @ts-nocheck
+/* ============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+import { ChangeDetectionStrategy, Component, DestroyRef, inject, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { FormBuilder, FormControl, ReactiveFormsModule, Validators } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
+import { finalize } from 'rxjs';
+import { TaonMarketingPopupApiService } from '../taon-marketing-popup.api.service';
+import type { TaonMarketingPopupEntity } from '../taon-marketing-popup.entity';
+import { TaonMarketingPopupType } from '../taon-marketing-popup.models';
+import type { TaonMarketingPopupFields } from '../taon-marketing-popup.models';
+import { TaonMarketingPopupValidators } from '../taon-marketing-popup.validators';
+@Component({
+    selector: 'taon-marketing-popup-editor',
+    templateUrl: './taon-marketing-popup-editor.component.html',
+    styleUrls: ['./taon-marketing-popup-editor.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush,
+    imports: [ReactiveFormsModule, MatButtonModule, MatDialogModule],
+    providers: [TaonMarketingPopupApiService],
+})
+export class TaonMarketingPopupEditorComponent {
+    readonly popup = inject<TaonMarketingPopupEntity | null>(MAT_DIALOG_DATA);
+    readonly types = Object.values(TaonMarketingPopupType);
+    readonly busy = signal(false);
+    readonly error = signal('');
+    private readonly api = inject(TaonMarketingPopupApiService);
+    private readonly ref = inject(MatDialogRef<TaonMarketingPopupEditorComponent>);
+    private readonly destroyRef = inject(DestroyRef);
+    private readonly fb = inject(FormBuilder).nonNullable;
+    readonly form = this.fb.group({
+        name: [this.popup?.name ?? '', [Validators.required, Validators.pattern(/\S/), Validators.maxLength(200)]],
+        enabled: [this.popup?.enabled ?? false],
+        type: [this.popup?.type ?? TaonMarketingPopupType.Dialog],
+        title: [this.popup?.title ?? ''],
+        content: [this.popup?.content ?? ''],
+        imageKey: [this.popup?.imageKey ?? ''],
+        buttonText: [this.popup?.buttonText ?? ''],
+        buttonUrl: [this.popup?.buttonUrl ?? '', TaonMarketingPopupValidators.url],
+        delaySeconds: [this.popup?.delaySeconds ?? 0, [Validators.required, Validators.min(0), Validators.max(2147483)]],
+        displayOnPaths: [this.popup?.displayOnPaths?.join('\n') ?? '', TaonMarketingPopupValidators.paths],
+        excludePaths: [this.popup?.excludePaths?.join('\n') ?? '', TaonMarketingPopupValidators.paths],
+        startAt: [this.localDate(this.popup?.startAt), TaonMarketingPopupValidators.optionalDate],
+        endAt: [this.localDate(this.popup?.endAt), TaonMarketingPopupValidators.optionalDate],
+        maxDisplaysPerVisitor: new FormControl<number | null>(this.popup?.maxDisplaysPerVisitor ?? null, TaonMarketingPopupValidators.optionalPositiveInteger),
+        oncePerSession: [this.popup?.oncePerSession ?? true],
+    });
+    save(): void {
+        this.form.markAllAsTouched();
+        if (this.form.invalid || this.busy()) {
+            this.error.set('Please correct the invalid fields before saving.');
+            return;
+        }
+        const value = this.form.getRawValue();
+        const startAt = value.startAt ? new Date(value.startAt).toISOString() : null;
+        const endAt = value.endAt ? new Date(value.endAt).toISOString() : null;
+        if (startAt && endAt && startAt > endAt) {
+            this.error.set('End date must not precede start date.');
+            return;
+        }
+        const input: TaonMarketingPopupFields = {
+            ...value,
+            name: value.name.trim(),
+            title: value.title.trim() || null,
+            content: value.content || null,
+            imageKey: value.imageKey.trim() || null,
+            buttonText: value.buttonText.trim() || null,
+            buttonUrl: value.buttonUrl.trim() || null,
+            displayOnPaths: this.paths(value.displayOnPaths),
+            excludePaths: this.paths(value.excludePaths),
+            startAt,
+            endAt,
+        };
+        this.busy.set(true);
+        this.error.set('');
+        this.api.savePopup(input, this.popup?.id).pipe(takeUntilDestroyed(this.destroyRef), finalize(() => this.busy.set(false))).subscribe({
+            next: saved => this.ref.close(saved),
+            error: (error: unknown) => {
+                console.error('[taon-marketing-popup-editor] Unable to save popup', error);
+                this.error.set('The popup could not be saved. Check the fields and try again.');
+            },
+        });
+    }
+    close(): void {
+        if (!this.busy()) {
+            this.ref.close();
+        }
+    }
+    private paths(value: string): string[] | null {
+        const paths = value.split('\n').map(path => path.trim()).filter(Boolean);
+        return paths.length ? paths : null;
+    }
+    private localDate(value: Date | string | null | undefined): string {
+        if (!value) {
+            return '';
+        }
+        const date = new Date(value);
+        const local = new Date(date.getTime() - date.getTimezoneOffset() * 60000);
+        return local.toISOString().slice(0, 16);
+    }
+}

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-content.component.html

@@ -0,0 +1,30 @@
+<!--
+==============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+==============================================================================
+-->
+
+@if (currentPopup(); as popup) {
+  <section class="popup">
+    <button class="close" type="button" aria-label="Close popup" (click)="close()">&#215;</button>
+    @if (popup.title) {
+      <h2>{{ popup.title }}</h2>
+    }
+    @if (popup.content) {
+      <p>{{ popup.content }}</p>
+    }
+    @if (currentImage(); as image) {
+      <img [src]="image" alt="">
+    }
+    @if (popup.buttonText && popup.buttonUrl) {
+      <a class="cta" [href]="popup.buttonUrl" (click)="click()">{{ popup.buttonText }}</a>
+    }
+  </section>
+}

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-content.component.scss

@@ -0,0 +1,56 @@
+/* ============================================================================
+ 
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+:host {
+  display: block;
+}
+
+.popup {
+  position: relative;
+  padding: 24px 48px 24px 24px;
+}
+
+h2 {
+  margin-top: 0;
+}
+
+p {
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+
+img {
+  display: block;
+  max-width: 100%;
+  max-height: 45vh;
+  margin: 12px 0;
+  object-fit: contain;
+}
+
+.close {
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  border: 0;
+  background: transparent;
+  color: inherit;
+  cursor: pointer;
+  font-size: 24px;
+  width: 36px;
+  height: 36px;
+}
+
+.cta {
+  display: inline-block;
+  padding: 8px 16px;
+  border: 1px solid currentColor;
+  border-radius: 4px;
+}

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup-content.component.ts

@@ -0,0 +1,47 @@
+// @ts-nocheck
+/* ============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+import { ChangeDetectionStrategy, Component, computed, inject, input, output } from '@angular/core';
+import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
+import type { TaonMarketingPopupEntity } from './taon-marketing-popup.entity';
+export interface TaonMarketingPopupDialogData {
+    popup: TaonMarketingPopupEntity;
+    imageUrl: string | null;
+}
+@Component({
+    selector: 'taon-marketing-popup-content',
+    templateUrl: './taon-marketing-popup-content.component.html',
+    styleUrls: ['./taon-marketing-popup-content.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class TaonMarketingPopupContentComponent {
+    readonly popup = input<TaonMarketingPopupEntity>();
+    readonly imageUrl = input<string | null>(null);
+    readonly clicked = output<void>();
+    readonly closed = output<void>();
+    private readonly data = inject<TaonMarketingPopupDialogData | null>(MAT_DIALOG_DATA, { optional: true });
+    private readonly ref = inject(MatDialogRef<TaonMarketingPopupContentComponent>, { optional: true });
+    readonly currentPopup = computed(() => this.popup() ?? this.data?.popup);
+    readonly currentImage = computed(() => this.imageUrl() ?? this.data?.imageUrl);
+    close(): void {
+        if (this.ref) {
+            this.ref.close();
+        }
+        else {
+            this.closed.emit();
+        }
+    }
+    click(): void {
+        this.clicked.emit();
+        this.close();
+    }
+}

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup.abstract.context.ts

@@ -0,0 +1,28 @@
+// @ts-nocheck
+/* ============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+import { createContext, TaonBaseContext } from 'taon/browser';
+import { TaonMarketingPopupEntity } from './taon-marketing-popup.entity';
+import { TaonMarketingPopupController } from './taon-marketing-popup.controller';
+import { TaonMarketingPopupRepository } from './taon-marketing-popup.repository';
+import { TaonMarketingPopupProvider } from './taon-marketing-popup.provider';
+export const TaonMarketingPopupAbstractContext = createContext(() => ({
+    contextName: 'TaonMarketingPopupAbstractContext',
+    abstract: true,
+    contexts: { TaonBaseContext },
+    entities: { TaonMarketingPopupEntity },
+    controllers: { TaonMarketingPopupController },
+    repositories: {
+        TaonMarketingPopupRepository,
+    },
+    providers: { TaonMarketingPopupProvider },
+}));

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup.api.service.ts

@@ -0,0 +1,38 @@
+// @ts-nocheck
+/* ============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { TaonBaseAngularService } from 'taon/browser';
+import type { TaonMarketingPopupEntity } from './taon-marketing-popup.entity';
+import { TaonMarketingPopupController } from './taon-marketing-popup.controller';
+import type { TaonMarketingPopupFields } from './taon-marketing-popup.models';
+@Injectable()
+export class TaonMarketingPopupApiService extends TaonBaseAngularService {
+    public readonly taonMarketingPopupController = this.injectController(TaonMarketingPopupController);
+    public get allMyEntities$(): Observable<TaonMarketingPopupEntity[]> {
+        return this.taonMarketingPopupController.getAll().request!().observable.pipe(map(res => res.body?.json));
+    }
+    public getActivePopups(): Observable<TaonMarketingPopupEntity[]> {
+        return this.taonMarketingPopupController.getActivePopups().request!().observable.pipe(map(res => res.body.json));
+    }
+    public savePopup(input: TaonMarketingPopupFields, id?: number): Observable<TaonMarketingPopupEntity> {
+        return this.taonMarketingPopupController.savePopup(input, id).request!().observable.pipe(map(res => res.body.json));
+    }
+    public setEnabled(id: number, enabled: boolean): Observable<TaonMarketingPopupEntity> {
+        return this.taonMarketingPopupController.setEnabled(id, enabled).request!().observable.pipe(map(res => res.body.json));
+    }
+    public deletePopup(id: number): Observable<void> {
+        return this.taonMarketingPopupController.deletePopup(id).request!().observable.pipe(map(() => undefined));
+    }
+}

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup.config.service.ts

@@ -0,0 +1,28 @@
+// @ts-nocheck
+/* ============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+import { map } from 'rxjs/operators';
+import { Taon, TaonBaseAngularService } from 'taon/browser';
+import { TaonMarketingPopupProvider } from './taon-marketing-popup.provider';
+@Injectable()
+export class TaonMarketingPopupConfigService extends TaonBaseAngularService {
+    private taonMarketingPopupProvider = this.injectProvider(TaonMarketingPopupProvider);
+    get isEnableOption() {
+        return this.taonMarketingPopupProvider.enabledTaonMarketingPopupOption;
+    }
+    clone(): Partial<TaonMarketingPopupProvider> {
+        const cloned = this.taonMarketingPopupProvider.clone();
+        return cloned;
+    }
+}

package/ts-source/browser-code/taon-marketing-popup/taon-marketing-popup.constants.ts

@@ -0,0 +1,33 @@
+// @ts-nocheck
+/* ============================================================================
+
+- TAON READONLY SOURCE
+- DO NOT MODIFY THIS FILE.
+- Changes may be overwritten.
+- Use command: taon build:lib:watch
+  inside @taon-dev/marketing project repository
+  for watch development of third party modules like this.
+  
+ * ========================================================================== */
+
+import type { TaonMarketingPopupEntity } from './taon-marketing-popup.entity';
+import { TaonMarketingPopupType } from './taon-marketing-popup.models';
+export const TaonMarketingPopupDefaultsValues = {
+    name: '',
+    enabled: false,
+    type: TaonMarketingPopupType.Dialog,
+    title: null,
+    content: null,
+    imageKey: null,
+    buttonText: null,
+    buttonUrl: null,
+    delaySeconds: 0,
+    displayOnPaths: null,
+    excludePaths: null,
+    startAt: null,
+    endAt: null,
+    maxDisplaysPerVisitor: null,
+    oncePerSession: true,
+    version: 0,
+    id: void 0,
+} satisfies Partial<TaonMarketingPopupEntity>;