ngx-techlify-core 11.5.2 → 14.2.1

package/src/lib/audit-log/audit-log-for-model/audit-log-for-model.component.html

@@ -1,9 +0,0 @@
-<button type="button" *ngIf="logView==='recent'" mat-icon-button matTooltip="Recent Audit Log"
-    (click)="$event.stopPropagation();getLogView()">
-    <mat-icon>history</mat-icon>
-</button>
-
-<button type="button" *ngIf="logView==='all'" mat-icon-button matTooltip="All Audit Logs"
-    (click)="$event.stopPropagation();getLogsView()">
-    <mat-icon>history</mat-icon>
-</button>

package/src/lib/audit-log/audit-log-for-model/audit-log-for-model.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { AuditLogForModelComponent } from './audit-log-for-model.component';
-
-describe('AuditLogForModelComponent', () => {
-  let component: AuditLogForModelComponent;
-  let fixture: ComponentFixture<AuditLogForModelComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ AuditLogForModelComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(AuditLogForModelComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/audit-log/audit-log-for-model/audit-log-for-model.component.ts

@@ -1,49 +0,0 @@
-import { Component, Input, OnInit } from '@angular/core';
-import { MatDialog } from '@angular/material/dialog';
-import { AuditLogViewModelComponent } from '../audit-log-view-model/audit-log-view-model.component';
-import { AuditLogsViewModelComponent } from '../audit-logs-view-model/audit-logs-view-model.component';
-
-
-@Component({
-  selector: 'app-audit-log-for-model',
-  templateUrl: './audit-log-for-model.component.html',
-  styleUrls: ['./audit-log-for-model.component.scss']
-})
-export class AuditLogForModelComponent implements OnInit {
-
-  @Input() modelType: string;
-  @Input() modelId: any;
-  @Input() logView: 'recent' | 'all' = 'recent';
-
-  constructor(
-    private dialog: MatDialog,
-  ) { }
-
-  ngOnInit(): void {
-
-  }
-
-  getLogView() {
-    const dialogRef = this.dialog.open(AuditLogViewModelComponent, {
-      width: '800px',
-      autoFocus: false,
-      data: {
-        modelType: this.modelType,
-        modelId: this.modelId
-      } // Any data passed here will be injected into the model
-    });
-  }
-
-  getLogsView() {
-    const dialogRef = this.dialog.open(AuditLogsViewModelComponent, {
-      width: '95%',
-      maxWidth: 'unset',
-      autoFocus: false,
-      data: {
-        modelType: this.modelType,
-        modelId: this.modelId
-      } // Any data passed here will be injected into the model
-    });
-  }
-
-}

package/src/lib/audit-log/audit-log-for-model/audit-log-for-model.module.ts

@@ -1,24 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { AuditLogForModelRoutingModule } from './audit-log-for-model-routing.module';
-import { AuditLogForModelComponent } from './audit-log-for-model.component';
-import { AuditLogViewModelModule } from '../audit-log-view-model/audit-log-view-model.module';
-import { AuditLogsViewModelModule } from '../audit-logs-view-model/audit-logs-view-model.module';
-import { FlexLayoutModule } from '@angular/flex-layout';
-import { MaterialModule } from '../../material.module';
-
-
-@NgModule({
-  declarations: [AuditLogForModelComponent],
-  imports: [
-    AuditLogViewModelModule,
-    AuditLogsViewModelModule,
-    CommonModule,
-    AuditLogForModelRoutingModule,
-    FlexLayoutModule,
-    MaterialModule,
-  ],
-  exports: [AuditLogForModelComponent]
-})
-export class AuditLogForModelModule { }

package/src/lib/audit-log/audit-log-list/audit-log-list-routing.module.ts

@@ -1,10 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-const routes: Routes = [];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class AuditLogListRoutingModule { }

package/src/lib/audit-log/audit-log-list/audit-log-list.component.html

@@ -1,92 +0,0 @@
-<div fxLayout="column" fxLayoutAlign="start" class="mat-typography">
-
-    <div fxLayout="column" fxLayoutAlign="start" fxLayoutGap="1.5rem" class="p-3">
-        <h2 class="font-weight-bold">
-            Audit Logs
-        </h2>
-
-        <div fxLayout="row wrap" fxLayoutAlign="start center">
-            <app-audit-log-list-filter *ngIf="showFilter" (valueChange)="filterChange($event)" [objectType]="objectType"
-                [objectId]="objectId"></app-audit-log-list-filter>
-            <span fxFlex></span>
-
-            <ng-container *ngIf="showExportButtons">
-                <div class="ml-4">
-                    <app-export-excel-button elementId="audit-logs-table" name="AuditLogs" [data]="excelData">
-                    </app-export-excel-button>
-                </div>
-            </ng-container>
-        </div>
-    </div>
-
-    <section class="scroll-container" infiniteScroll [infiniteScrollDistance]="2" [infiniteScrollThrottle]="50"
-        (scrolled)="onScroll()" [scrollWindow]="false">
-        <table mat-table [dataSource]="auditLogList" matSort class="w-100" multiTemplateDataRows id="audit-logs-table">
-
-            <!-- Index Column -->
-            <ng-container matColumnDef="index">
-                <th mat-header-cell *matHeaderCellDef> # </th>
-                <td mat-cell *matCellDef="let auditLog; let i = dataIndex"> {{ i+1 }} </td>
-            </ng-container>
-
-            <ng-container matColumnDef="id">
-                <th mat-header-cell *matHeaderCellDef> Log # </th>
-                <td mat-cell *matCellDef="let auditLog">
-                    {{auditLog?.id}}
-                </td>
-            </ng-container>
-
-            <ng-container matColumnDef="object_type">
-                <th mat-header-cell *matHeaderCellDef mat-sort-header> Model </th>
-                <td mat-cell *matCellDef="let auditLog;"> {{ auditLog.object_type }} </td>
-            </ng-container>
-
-            <ng-container matColumnDef="object_id">
-                <th mat-header-cell *matHeaderCellDef> Model # </th>
-                <td mat-cell *matCellDef="let auditLog">
-                    {{auditLog?.object_id}}
-                </td>
-            </ng-container>
-
-            <ng-container matColumnDef="action">
-                <th mat-header-cell *matHeaderCellDef mat-sort-header> Action </th>
-                <td mat-cell *matCellDef="let auditLog;"> {{ auditLog?.action }} </td>
-            </ng-container>
-
-            <ng-container matColumnDef="created_at">
-                <th mat-header-cell *matHeaderCellDef mat-sort-header> Created At </th>
-                <td mat-cell *matCellDef="let auditLog">
-                    {{auditLog?.created_at | date:'medium'}}
-                </td>
-            </ng-container>
-
-            <ng-container matColumnDef="user.email">
-                <th mat-header-cell *matHeaderCellDef mat-sort-header> Created By </th>
-                <td mat-cell *matCellDef="let auditLog">
-                    {{auditLog?.user?.email}}
-                </td>
-            </ng-container>
-
-            <ng-container matColumnDef="changes">
-                <th mat-header-cell *matHeaderCellDef> Changes</th>
-                <td mat-cell *matCellDef="let auditLog">
-                    <div class="px-3" [innerHtml]="sanitizer.bypassSecurityTrustHtml(getTransformedChanges(auditLog))">
-
-                    </div>
-                </td>
-            </ng-container>
-
-            <!-- Actions Column -->
-            <ng-container matColumnDef="actions">
-                <th mat-header-cell *matHeaderCellDef> Actions </th>
-                <td mat-cell *matCellDef="let auditLog">
-                </td>
-            </ng-container>
-            <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky:true"></tr>
-            <tr mat-row *matRowDef="let row; columns: displayedColumns;"
-                (click)="logClicked(row);$event.stopPropagation();" class="hoverable row-hover"></tr>
-        </table>
-    </section>
-
-
-</div>

package/src/lib/audit-log/audit-log-list/audit-log-list.component.scss

@@ -1,21 +0,0 @@
-
-
-tr.row-hover:hover{
-    background-color: gainsboro;
-}
-
-.scroll-container{
-    height: 800px;
-    overflow-y: auto;
-}
-
-:host ::ng-deep{
-    #old-value{
-        margin-right: 5px;
-        background-color: lightcoral;
-    }
-
-    #new-value{
-        background-color: palegreen;
-    }
-}

package/src/lib/audit-log/audit-log-list/audit-log-list.component.spec.ts

@@ -1,25 +0,0 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { AuditLogListComponent } from './audit-log-list.component';
-
-describe('AuditLogListComponent', () => {
-  let component: AuditLogListComponent;
-  let fixture: ComponentFixture<AuditLogListComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [AuditLogListComponent]
-    })
-      .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(AuditLogListComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/audit-log/audit-log-list/audit-log-list.component.ts

@@ -1,138 +0,0 @@
-import { Component, OnInit, OnDestroy, Input, ViewChild } from '@angular/core';
-
-
-import { Router } from '@angular/router';
-import { MatSort } from '@angular/material/sort';
-import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
-import { PageEvent } from '../../data-table/data-table.model';
-import { DataManager } from '../../core/dataManager.service';
-import { DomSanitizer } from '@angular/platform-browser';
-
-@UntilDestroy()
-@Component({
-  selector: 'app-audit-log-list',
-  templateUrl: './audit-log-list.component.html',
-  styleUrls: ['./audit-log-list.component.scss'],
-})
-export class AuditLogListComponent implements OnInit, OnDestroy {
-
-  auditLogList: any[] = [];
-  @Input() objectId: any;
-  @Input() objectType: any;
-  @Input() showFilter: boolean = true;
-  @Input() showExportButtons: boolean = true;
-  @Input() userId: any;
-
-  pageEvent: PageEvent = { page: 1, perPage: 25, lastPage: 1 };
-  filters: any = { sort_by: 'created_at|desc' };
-  displayedColumns: any[] = ['index', 'id', 'object_type', 'object_id', 'action', 'changes', 'created_at', 'user.email'];
-
-  @ViewChild(MatSort, { static: true }) sort: MatSort;
-
-  constructor(
-    private dataManager: DataManager,
-    private router: Router,
-    public sanitizer: DomSanitizer
-  ) { }
-
-  ngOnInit() {
-
-    this.initializeData();
-
-    if (this.sort) {
-      this.sort.sortChange.pipe(untilDestroyed(this))
-        .subscribe((value: any) => {
-          this.changeSort(value);
-        })
-    }
-
-  }
-
-  get excelData(): any[] {
-    if (this.auditLogList.length > 0) {
-      return this.auditLogList.map(item => {
-        return {
-          'Type': item?.object_type,
-          'Action': item?.action,
-          'Data': JSON.stringify(item?.data || {}),
-          'Object': JSON.stringify(item?.object || {}),
-          'Pre-Object': JSON.stringify(item?.pre_object || {}),
-          'Created At': new Date(item?.created_at).toDateString(),
-          'Created By': item?.user?.email
-        };
-      });
-    }
-    return [];
-  }
-
-  changeSort(event: any) {
-    if (event.direction) {
-      this.filters.sort_by = `${event.active}|${event.direction}`;
-      this.reload();
-    }
-  }
-
-  logClicked(log: any) {
-    this.router.navigate(['/system/audit-logs/log-view', log.id]);
-  }
-
-
-  async initializeData() {
-    if (this.objectType) {
-      this.filters = { ...this.filters, object_type: this.objectType }
-    }
-    if (this.objectId) {
-      this.filters = { ...this.filters, object_id: this.objectId }
-    }
-    if (this.userId) {
-      this.filters = { ...this.filters, user_id: this.userId }
-    }
-    const result = await this.dataManager.GET(`api/audit-logs`, { ...this.filters, ...this.pageEvent });
-    this.auditLogList = this.auditLogList.concat(result.data);
-    this.pageEvent.page = result.current_page;
-    this.pageEvent.lastPage = result.last_page;
-  }
-
-  filterChange(event: any) {
-    if (this.showFilter) {
-      this.filters = {
-        ...this.filters,
-        ...event,
-        object_type: this.objectType || event?.object_type || '',
-        object_id: this.objectId || '',
-      };
-      this.reload();
-    }
-  }
-
-  onScroll() {
-    if (this.pageEvent.lastPage > this.pageEvent.page) {
-      this.pageEvent.page += 1;
-      this.initializeData();
-    }
-  }
-
-  reload() {
-    this.auditLogList = [];
-    this.pageEvent = { page: 1, perPage: 25, lastPage: 1 };
-    this.initializeData();
-  }
-
-  getTransformedChanges(log: any) {
-    if (log?.data?.changes) {
-      const changes = Object.keys(log?.data?.changes) || [];
-      let value = '<div>';
-      changes.forEach((key: any) => {
-        const displayAttribute = (key as string).split('_').map(x => x.charAt(0).toUpperCase() + x.slice(1)).join(' ');
-        value = `${value} <div><b>${displayAttribute}:</b> <span id="old-value">${log?.pre_object[key] ?? ''}</span><span id="new-value">${log?.object[key] ?? ''}</span></div>`;
-      });
-      value = `${value} </div>`;
-      return value;
-    }
-    return '';
-  }
-
-  ngOnDestroy() {
-    // Needed for automatic unsubscribe with untilDestroyed
-  }
-}

package/src/lib/audit-log/audit-log-list/audit-log-list.module.ts

@@ -1,28 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { AuditLogListRoutingModule } from './audit-log-list-routing.module';
-import { InfiniteScrollModule } from 'ngx-infinite-scroll';
-import { AuditLogListComponent } from './audit-log-list.component';
-import { AuditLogListFilterModule } from '../audit-log-list-filter/audit-log-list-filter.module';
-import { FlexLayoutModule } from '@angular/flex-layout';
-import { ReactiveFormsModule } from '@angular/forms';
-import { ExportExcelModule } from '../../export-excel/export-excel.module';
-import { MaterialModule } from '../../material.module';
-
-
-@NgModule({
-  declarations: [AuditLogListComponent],
-  imports: [
-    CommonModule,
-    AuditLogListRoutingModule,
-    ExportExcelModule,
-    FlexLayoutModule,
-    ReactiveFormsModule,
-    MaterialModule,
-    InfiniteScrollModule,
-    AuditLogListFilterModule
-  ],
-  exports: [AuditLogListComponent]
-})
-export class AuditLogListModule { }

package/src/lib/audit-log/audit-log-list-filter/audit-log-list-filter-routing.module.ts

@@ -1,10 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-const routes: Routes = [];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class AuditLogListFilterRoutingModule { }

package/src/lib/audit-log/audit-log-list-filter/audit-log-list-filter.component.html

@@ -1,49 +0,0 @@
-<form [formGroup]="auditLogFilterForm" fxLayout="row wrap" fxLayoutGap="1rem" fxLayoutAlign="start center">
-    <mat-form-field *ngIf="showObjectFilter">
-        <mat-label>Model</mat-label>
-        <app-searchable-selector formControlName="object_type" apiUrl="api/audit-log-types" titleField="object_type"
-            valueField="object_type" [sort]="false" [enableSearch]="false">
-        </app-searchable-selector>
-        <button mat-button *ngIf="getFieldValue('object_type')" matSuffix mat-icon-button
-            (click)="resetFieldValue('object_type')">
-            <mat-icon>close</mat-icon>
-        </button>
-    </mat-form-field>
-
-    <mat-form-field>
-        <mat-label>Action</mat-label>
-        <mat-select formControlName="action">
-            <mat-option value="created">Created</mat-option>
-            <mat-option value="updated">Updated</mat-option>
-            <mat-option value="deleted">Deleted</mat-option>
-        </mat-select>
-        <button mat-button *ngIf="getFieldValue('action')" matSuffix mat-icon-button
-            (click)="resetFieldValue('action')">
-            <mat-icon>close</mat-icon>
-        </button>
-    </mat-form-field>
-
-    <mat-form-field>
-        <input matInput formControlName="date_from" [matDatepicker]="fromPicker" (click)="fromPicker.open()"
-            placeholder="From Date (MM/DD/YYYY)" />
-        <mat-datepicker-toggle matSuffix [for]="fromPicker"></mat-datepicker-toggle>
-        <mat-datepicker #fromPicker></mat-datepicker>
-        <button mat-button *ngIf="getFieldValue('date_from')" matSuffix mat-icon-button
-            (click)="resetFieldValue('date_from')">
-            <mat-icon>close</mat-icon>
-        </button>
-        <mat-error *ngIf="isFieldValid('date_from')">Invalid Date</mat-error>
-    </mat-form-field>
-
-    <mat-form-field>
-        <input matInput formControlName="date_to" [matDatepicker]="toPicker" (click)="toPicker.open()"
-            placeholder="To Date (MM/DD/YYYY)" />
-        <mat-datepicker-toggle matSuffix [for]=""></mat-datepicker-toggle>
-        <mat-datepicker #toPicker></mat-datepicker>
-        <button mat-button *ngIf="getFieldValue('date_to')" matSuffix mat-icon-button
-            (click)="resetFieldValue('date_to')">
-            <mat-icon>close</mat-icon>
-        </button>
-        <mat-error *ngIf="isFieldValid('date_to')">Invalid Date</mat-error>
-    </mat-form-field>
-</form>

package/src/lib/audit-log/audit-log-list-filter/audit-log-list-filter.component.spec.ts

@@ -1,26 +0,0 @@
-
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { AuditLogListFilterComponent } from './audit-log-list-filter.component';
-
-
-describe('AuditLogListFilterComponent', () => {
-  let component: AuditLogListFilterComponent;
-  let fixture: ComponentFixture<AuditLogListFilterComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [AuditLogListFilterComponent]
-    })
-      .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(AuditLogListFilterComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/audit-log/audit-log-list-filter/audit-log-list-filter.component.ts

@@ -1,74 +0,0 @@
-import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
-import { FormGroup, FormBuilder } from '@angular/forms';
-import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
-import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
-import { FormValidatorService } from '../../core/form-validator.service';
-import { DateValidator } from '../../date-validator';
-
-@UntilDestroy()
-@Component({
-  selector: 'app-audit-log-list-filter',
-  templateUrl: './audit-log-list-filter.component.html',
-  styleUrls: ['./audit-log-list-filter.component.scss']
-})
-export class AuditLogListFilterComponent implements OnInit {
-
-  auditLogFilterForm: FormGroup;
-
-  @Input() objectId: any;
-  @Input() objectType: any;
-
-  @Output() valueChange = new EventEmitter();
-
-  constructor(private fb: FormBuilder, private formValidatorService: FormValidatorService) {
-    this.createForm();
-  }
-
-  get showObjectFilter() {
-    return !(this.objectId || this.objectType);
-  }
-
-  private createForm() {
-
-    //TODO: Finialize and add more validations.
-    this.auditLogFilterForm = this.fb.group({
-      object_type: [''],
-      action: [''],
-      data: [''],
-      date_to: ['', DateValidator()],
-      date_from: ['', DateValidator()]
-    });
-  }
-
-  ngOnInit(): void {
-
-    this.auditLogFilterForm.valueChanges.pipe(
-      debounceTime(500),
-      distinctUntilChanged(),
-      untilDestroyed(this)
-    ).subscribe((value: any) => {
-      value.date_from = value.date_from ? (value.date_from as Date).toISOString() : '';
-      value.date_to = value.date_to ? (value.date_to as Date).toISOString() : '';
-      this.valueChange.emit(value);
-    })
-  }
-
-
-  resetFieldValue(field: string) {
-    this.auditLogFilterForm.get(field).setValue('');
-  }
-
-  getFieldValue(field: string) {
-    return this.auditLogFilterForm.get(field).value;
-  }
-
-  isFieldValid(field: string) {
-    return this.formValidatorService.isFieldValid(field, this.auditLogFilterForm, true);
-  }
-
-
-  ngOnDestroy() {
-
-  }
-
-}

package/src/lib/audit-log/audit-log-list-filter/audit-log-list-filter.module.ts

@@ -1,24 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-
-import { AuditLogListFilterRoutingModule } from './audit-log-list-filter-routing.module';
-import { AuditLogListFilterComponent } from './audit-log-list-filter.component';
-import { FlexLayoutModule } from '@angular/flex-layout';
-import { ReactiveFormsModule } from '@angular/forms';
-import { MaterialModule } from '../../material.module';
-import { SearchableSelectorModule } from '../../searchable-selector/searchable-selector.module';
-
-
-@NgModule({
-  declarations: [AuditLogListFilterComponent],
-  imports: [
-    CommonModule,
-    AuditLogListFilterRoutingModule,
-    FlexLayoutModule,
-    ReactiveFormsModule,
-    MaterialModule,
-    SearchableSelectorModule,
-  ],
-  exports: [AuditLogListFilterComponent]
-})
-export class AuditLogListFilterModule { }

package/src/lib/audit-log/audit-log-routing.module.ts

@@ -1,18 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-import { AuthenticationGuard } from '../core/authentication.guard';
-import { AuditLogListComponent } from './audit-log-list/audit-log-list.component';
-import { AuditLogViewComponent } from './audit-log-view/audit-log-view.component';
-
-
-const routes: Routes = [
-  { path: 'log-list', component: AuditLogListComponent, canActivate: [AuthenticationGuard] },
-  { path: 'log-view/:id', component: AuditLogViewComponent, canActivate: [AuthenticationGuard] },
-  { path: '**', redirectTo: 'log-list', pathMatch: 'full' }
-];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class AuditLogRoutingModule { }

package/src/lib/audit-log/audit-log-view/audit-log-view-routing.module.ts

@@ -1,10 +0,0 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-
-const routes: Routes = [];
-
-@NgModule({
-  imports: [RouterModule.forChild(routes)],
-  exports: [RouterModule]
-})
-export class AuditLogViewRoutingModule { }