@posiwise/smart-crm 0.0.20 → 0.0.21

package/src/lib/private/components/smart-crm-leads/smart-crm-leads.component.spec.ts

@@ -0,0 +1,98 @@
+import { TestBed } from '@angular/core/testing';
+import { CommonServicesModule, PermissionService, UserService } from '@posiwise/common-services';
+import { SharedModule } from '@posiwise/shared-module';
+import { CrmService } from '@posiwise/smart-crm-shared';
+import { DEFAULT_USER, TestHelper } from '@posiwise/test-helpers';
+import { MockProvider } from 'ng-mocks';
+import { of } from 'rxjs';
+import Swal from 'sweetalert2';
+import { SmartCrmPrivateModule } from '../../smart-crm-private.module';
+import { SmartCrmLeadsComponent } from './smart-crm-leads.component';
+
+class UserServiceMock {
+    getUserState() {
+        return of({ currentUser: DEFAULT_USER });
+    }
+}
+describe('SmartCrmLeadsComponent', () => {
+    const createComponent = TestHelper.createComponentFactory({
+        component: SmartCrmLeadsComponent,
+        imports: [CommonServicesModule, SharedModule, SmartCrmPrivateModule],
+        providers: [
+            ...TestHelper.TEST_PROVIDERS,
+            MockProvider(PermissionService, {
+                evaluatePermissions: () => {
+                    return true;
+                }
+            }),
+            MockProvider(CrmService, {
+                getCrmLeads: () =>
+                    of({
+                        crm_leads: [
+                            {
+                                id: 37,
+                                first_name: 'test1',
+                                last_name: 'test',
+                                email: 'test3@gmail.com',
+                                created_at: '2021-10-05T11:34:17.172+00:00',
+                                labels: ['vip'],
+                                newsletter_subscribed: true,
+                                email_verified: false,
+                                crm_source: {
+                                    id: 6,
+                                    name: 'test',
+                                    is_default: true
+                                }
+                            }
+                        ],
+                        object_count: 1,
+                        unfiltered_count: 1
+                    }),
+                getAllAccountSource: () =>
+                    of({
+                        crm_sources: [
+                            {
+                                id: 6,
+                                name: 'test',
+                                is_default: true,
+                                subscription_id: 31
+                            }
+                        ],
+                        object_count: 2,
+                        unfiltered_count: 2
+                    }),
+                deleteContact: () => of({})
+            }),
+            {
+                provide: UserService,
+                useClass: UserServiceMock
+            }
+        ]
+    });
+
+    beforeEach(() => {
+        TestHelper.setUpPermissionsAndUser();
+    });
+
+    it('should create', async () => {
+        TestHelper.setActivatedRoute({
+            parent: { params: of({ slug: 'posiwise-263' }) }
+        });
+        const spectator = await createComponent();
+        expect(spectator.component).toBeTruthy();
+    });
+
+    it('should delete', async () => {
+        TestHelper.setActivatedRoute({
+            parent: { params: of({ slug: 'posiwise-263' }) }
+        });
+        const spectator = await createComponent();
+        const service = TestBed.inject(CrmService);
+        const spy = spyOn(service, 'deleteContact').and.callThrough();
+        spectator.click('tbody tr:first-child .fa-trash');
+        expect(Swal.isVisible()).toBeTruthy();
+        Swal.clickConfirm();
+        await TestHelper.stabilize(spectator);
+        expect(spy).toHaveBeenCalledTimes(1);
+    });
+});

package/src/lib/private/components/smart-crm-leads/smart-crm-leads.component.ts

@@ -0,0 +1,160 @@
+import {
+    AfterViewChecked,
+    ChangeDetectorRef,
+    Component,
+    Injector,
+    OnDestroy,
+    OnInit
+} from '@angular/core';
+import { ROUTERS } from '../../../shared/routers/routers';
+import { CrmService } from '@posiwise/smart-crm-shared';
+import { LazyLoadEvent } from 'primeng/api';
+
+import { PAGE_SIZE, Paging, Subscription } from '@posiwise/common-utilities';
+import { CrmLeadResponse } from '../../../shared/interface/crm-lead.interface';
+import { AppBaseComponent } from '@posiwise/app-base-component';
+import { HelperService } from '@posiwise/helper-service';
+
+@Component({
+    selector: 'pw-smart-crm-leads',
+    templateUrl: './smart-crm-leads.component.html'
+})
+export class SmartCrmLeadsComponent
+    extends AppBaseComponent
+    implements OnInit, OnDestroy, AfterViewChecked
+{
+    subscriptionId: number;
+
+    hasAccess: boolean;
+
+    data: CrmLeadResponse = {
+        crm_leads: [],
+        object_count: 0,
+        unfiltered_count: 0
+    };
+
+    searchText = '';
+
+    isLoaded = false;
+
+    loading = true;
+
+    userId: number;
+
+    page = 1;
+
+    subscription: Subscription;
+
+    allSource = [];
+
+    routers = ROUTERS;
+
+    filterBySource: string;
+
+    crmSources = [];
+
+    constructor(
+        private crmService: CrmService,
+        injector: Injector,
+        private cdr: ChangeDetectorRef
+    ) {
+        super(injector);
+    }
+
+    ngOnInit() {
+        this.getUserSubscription().subscribe(response => {
+            this.subscription = response;
+            if (this.subscription?.id) {
+                this.getUserInfo();
+                this.getAllSource(this.subscription?.id);
+            }
+        });
+    }
+
+    ngAfterViewChecked() {
+        this.cdr.detectChanges();
+    }
+
+    private getUserInfo() {
+        this.userStore().subscribe(user => {
+            if (user) {
+                this.userId = user?.id;
+            }
+        });
+    }
+
+    onLazyLoad(event: LazyLoadEvent) {
+        const pageDetails = HelperService.onTableLazyLoad(event);
+        this.page = pageDetails.page;
+        this.getAllCrmLeads({
+            page: this.page,
+            page_size: PAGE_SIZE,
+            order_by: pageDetails.sortField,
+            order_direction: pageDetails.sortOrder,
+            search: this.searchText
+        });
+    }
+
+    private getAllCrmLeads(paging: Paging) {
+        this.getUserSubscription().subscribe(response => {
+            this.subscription = response;
+            if (this.subscription?.id) {
+                this.hasAccess = this.hasAdminAccess(this.subscription?.id);
+                this.crmService
+                    .getCrmLeads(this.subscription?.id, this.filterBySource || '', paging)
+                    .subscribe(res => {
+                        this.data = res;
+                    })
+                    .add(() => {
+                        this.isLoaded = true;
+                        this.loading = false;
+                    });
+            }
+        });
+    }
+
+    /** Function to delete Lead */
+    onDelete(id: number) {
+        HelperService.raiseDeletePopup().then(resp => {
+            if (resp.value) {
+                this.crmService.deleteContact(this.subscription?.id, id).subscribe(() => {
+                    this.toast.success(this.translation.translate('Crm.CrmLeads.DeletedMessage'));
+                    this.getAllCrmLeads({
+                        page: this.page,
+                        page_size: PAGE_SIZE,
+                        search: this.searchText
+                    });
+                });
+            }
+        });
+    }
+
+    /** Function to all account source */
+    private getAllSource(id: number) {
+        this.crmService.getAllAccountSource(id).subscribe(response => {
+            if (response?.crm_sources?.length) {
+                this.crmSources = response?.crm_sources.map(val => {
+                    return {
+                        label: val.name,
+                        value: val.id
+                    };
+                });
+                this.allSource = response?.crm_sources?.map(source => {
+                    return source?.name;
+                });
+            }
+        });
+    }
+
+    onSourceChange(event) {
+        this.filterBySource = event.value.join();
+        this.getAllCrmLeads({
+            page: this.page,
+            page_size: PAGE_SIZE
+        });
+    }
+
+    override ngOnDestroy() {
+        super.ngOnDestroy();
+    }
+}

package/src/lib/private/components/smart-crm-marketing/smart-crm-marketing-list/smart-crm-marketing-contacts/smart-crm-marketing-contacts.component.html

@@ -0,0 +1,90 @@
+<div class="me-auto col-xs-6">
+  <p>This is a summary of the contacts that received your marketing email.</p>
+</div>
+<div class="w-100 text-center mt-3"
+  *ngIf="!isLoaded">
+  <p-progressSpinner strokeWidth="2"> </p-progressSpinner>
+</div>
+<div class="primeng-datatable-container mt-3 table-responsive"
+  [class.hideTable]="data.unfiltered_count === 0">
+  <p-table #dt
+    [value]="data.newsletter_contacts"
+    [paginator]="data.object_count !== 0"
+    [lazy]="true"
+    [rows]="PAGE_SIZE"
+    [totalRecords]="data.object_count"
+    [loading]="loading"
+    filterDelay="1000"
+    (onLazyLoad)="onLazyLoad($event)"
+    [customSort]="true">
+    <ng-template pTemplate="caption">
+      <div class="text-end">
+        <i class="fa fa-search mt-2 me-2" aria-hidden="true"></i>
+        <input type="text"
+          [(ngModel)]="searchText"
+          pInputText
+          size="50"
+          placeholder="Search contact..."
+          (input)="dt.filterGlobal($event.target.value, 'contains')"
+          class="mw-90" />
+      </div>
+    </ng-template>
+    <ng-template pTemplate="header">
+      <tr>
+        <th scope="true"
+          pSortableColumn="first_name">
+          {{ 'Crm.MarketingInsight.Name' | transloco }}
+          <p-sortIcon field="first_name"></p-sortIcon>
+        </th>
+        <th scope="true"
+          pSortableColumn="email">
+          {{ 'Crm.MarketingInsight.Email' | transloco }}
+          <p-sortIcon field="email"></p-sortIcon>
+        </th>
+        <th scope="true">
+          {{ 'Crm.MarketingInsight.SentAt' | transloco }}
+        </th>
+        <th scope="true">
+          {{ 'Crm.MarketingInsight.LastOpened' | transloco }}
+        </th>
+        <th scope="true">
+          {{ 'Crm.MarketingInsight.OpenCount' | transloco }}
+        </th>
+        <th scope="true">
+          {{ 'Crm.MarketingInsight.ClickedAt' | transloco }}
+        </th>
+        <th scope="true">
+          {{ 'Crm.MarketingInsight.ClickedCount' | transloco }}
+        </th>
+        <th scope="true">{{ 'Label.Actions' | transloco }}</th>
+      </tr>
+    </ng-template>
+    <ng-template pTemplate="body"
+      let-user>
+      <tr>
+        <td data-head="Name">
+          <a [routerLink]="['/' + subscription?.slug + routers.contactInfo, user.id]">{{
+                        user | ifNameNullShowEmail
+                    }}</a>
+        </td>
+        <td data-head="Email">
+          <a href="mailto:{{ user?.email }}">{{ user?.email }}</a>
+        </td>
+        <td data-head="Sent At">{{ user?.message_insight?.sent_at | dateFormat }}</td>
+        <td data-head="Last Opened">{{ user?.message_insight?.opened_at }}</td>
+        <td data-head="Open Count">{{ user?.message_insight?.open_count }}</td>
+        <td data-head="Clicked At">{{ user?.message_insight?.clicked_at }}</td>
+        <td data-head="Clicked Count">{{ user?.message_insight?.click_count }}</td>
+        <td data-head="Actions"></td>
+      </tr>
+    </ng-template>
+  </p-table>
+<div *ngIf="data.object_count === 0 && data.unfiltered_count !== 0">
+    <pw-no-data [withImage]="true" [message]="'Search.NoDataMessage'| transloco" [description]="'Search.NoDataDescription' | transloco" >
+    </pw-no-data>
+</div>
+  <span class="total-records-count"  *ngIf="data.object_count !== 0">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>
+</div>
+<div *ngIf="data.unfiltered_count === 0 && isLoaded">
+  <pw-no-data [withImage]="true" [message]="'Crm.MarketingInsight.NoUserListMessage' | transloco"> </pw-no-data>
+</div>

package/src/lib/private/components/smart-crm-marketing/smart-crm-marketing-list/smart-crm-marketing-contacts/smart-crm-marketing-contacts.component.spec.ts

@@ -0,0 +1,68 @@
+import { CommonServicesModule, PermissionService, UserService } from '@posiwise/common-services';
+import { SharedModule } from '@posiwise/shared-module';
+import { CrmService } from '@posiwise/smart-crm-shared';
+import { DEFAULT_USER, TestHelper } from '@posiwise/test-helpers';
+import { MockProvider } from 'ng-mocks';
+import { of } from 'rxjs';
+import { SmartCrmPrivateModule } from '../../../../smart-crm-private.module';
+import { SmartCrmMarketingUsersListComponent } from './smart-crm-marketing-contacts.component';
+
+class UserServiceMock {
+    getUserState() {
+        return of({ currentUser: DEFAULT_USER });
+    }
+}
+describe('SmartCrmMarketingUsersListComponent', () => {
+    const createComponent = TestHelper.createComponentFactory({
+        component: SmartCrmMarketingUsersListComponent,
+        imports: [CommonServicesModule, SharedModule, SmartCrmPrivateModule],
+        providers: [
+            ...TestHelper.TEST_PROVIDERS,
+            MockProvider(PermissionService, {
+                evaluatePermissions: () => {
+                    return true;
+                },
+                isGranted: () => {
+                    return true;
+                }
+            }),
+            MockProvider(CrmService, {
+                getCrmNewsletterInsight: () =>
+                    of({
+                        newsletter_contacts: [
+                            {
+                                id: 1,
+                                first_name: 'test',
+                                last_name: 'test',
+                                email: 'test@gmail.com',
+                                joined_at: '2021-11-19',
+                                last_opened: '2021-11-19',
+                                open_count: 2,
+                                clicked_at: 20,
+                                clicked_count: 1
+                            }
+                        ],
+                        object_count: 1,
+                        unfiltered_total_count: 1
+                    })
+            }),
+            {
+                provide: UserService,
+                useClass: UserServiceMock
+            }
+        ]
+    });
+
+    beforeEach(() => {
+        TestHelper.setUpPermissionsAndUser();
+    });
+
+    it('should create', async () => {
+        TestHelper.setActivatedRoute({
+            params: { Id: 1 },
+            parent: { params: of({ slug: 'posiwise-263' }) }
+        });
+        const spectator = await createComponent();
+        expect(spectator.component).toBeTruthy();
+    });
+});

package/src/lib/private/components/smart-crm-marketing/smart-crm-marketing-list/smart-crm-marketing-contacts/smart-crm-marketing-contacts.component.ts

@@ -0,0 +1,98 @@
+import {
+    AfterViewChecked,
+    ChangeDetectorRef,
+    Component,
+    Injector,
+    OnDestroy,
+    OnInit
+} from '@angular/core';
+import { ROUTERS } from '../../../../../shared/routers/routers';
+import { CrmService } from '@posiwise/smart-crm-shared';
+import { LazyLoadEvent } from 'primeng/api';
+
+import { PAGE_SIZE, Paging, Subscription } from '@posiwise/common-utilities';
+import { NewsLetterContactResponse } from '../../../../../shared/interface/crm-newsletter.interface';
+import { AppBaseComponent } from '@posiwise/app-base-component';
+import { HelperService } from '@posiwise/helper-service';
+
+@Component({
+    selector: 'pw-smart-crm-marketing-users-list',
+    templateUrl: './smart-crm-marketing-contacts.component.html'
+})
+export class SmartCrmMarketingUsersListComponent
+    extends AppBaseComponent
+    implements OnInit, OnDestroy, AfterViewChecked
+{
+    subscriptionId: number;
+
+    searchText = '';
+
+    data: NewsLetterContactResponse = {
+        newsletter_contacts: [],
+        object_count: 0,
+        unfiltered_count: 0
+    };
+
+    isLoaded = false;
+
+    loading = true;
+
+    id: number;
+
+    private page = 1;
+
+    subscription: Subscription;
+
+    routers = ROUTERS;
+
+    constructor(
+        injector: Injector,
+        private crmService: CrmService,
+        private cdr: ChangeDetectorRef
+    ) {
+        super(injector);
+    }
+
+    ngOnInit() {
+        this.route.params.subscribe(data => {
+            this.id = Number(data['Id']);
+        });
+
+        this.getUserSubscription().subscribe(response => {
+            this.subscription = response;
+        });
+    }
+
+    ngAfterViewChecked() {
+        this.cdr.detectChanges();
+    }
+
+    onLazyLoad(event: LazyLoadEvent) {
+        const pageDetails = HelperService.onTableLazyLoad(event);
+        this.page = pageDetails.page;
+        this.getNewsletterInsight(this.id, {
+            page: this.page,
+            page_size: PAGE_SIZE,
+            order_by: pageDetails.sortField,
+            order_direction: pageDetails.sortOrder,
+            search: this.searchText
+        });
+    }
+
+    /** Function to call users list for newsletter */
+    private getNewsletterInsight(id: number, paging: Paging) {
+        this.crmService
+            .getCrmNewsletterInsight(this.subscription?.id, id, paging)
+            .subscribe(res => {
+                this.data = res;
+            })
+            .add(() => {
+                this.isLoaded = true;
+                this.loading = false;
+            });
+    }
+
+    override ngOnDestroy() {
+        super.ngOnDestroy();
+    }
+}