ngx-techlify-core 11.5.0 → 11.5.2

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

@@ -0,0 +1,53 @@
+import { Component, Inject, OnInit } from '@angular/core';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
+import { HttpService } from '../../core/http.service';
+
+
+@UntilDestroy()
+@Component({
+  selector: 'app-audit-log-view',
+  templateUrl: './audit-log-view-model.component.html',
+  styleUrls: ['./audit-log-view-model.component.scss']
+})
+export class AuditLogViewModelComponent implements OnInit {
+
+  logInfo: any;
+  showDeltaChanges: boolean = false;
+  changeList: any[] = [];
+
+  constructor(
+    public dialogRef: MatDialogRef<AuditLogViewModelComponent>,
+    @Inject(MAT_DIALOG_DATA) public data: any,
+    private http: HttpService
+  ) { }
+
+  ngOnInit(): void {
+    if (this.data) {
+      this.http.get(`api/recent-log-for-model`, {
+        params: {
+          model_type: this.data?.modelType,
+          model_id: this.data?.modelId
+        }
+      }).pipe(
+        untilDestroyed(this)
+      ).subscribe((result: any) => {
+        this.logInfo = result?.item;
+        this.getTransformedChanges();
+      });
+    }
+  }
+
+  getTransformedChanges() {
+    const changes = ((this.logInfo?.action === 'deleted') ? Object.keys(this.logInfo?.object) : Object.keys(this.logInfo?.data?.changes)) || [];
+    changes.forEach((key: any) => {
+      const displayAttribute = (key as string).split('_').map(x => x.charAt(0).toUpperCase() + x.slice(1)).join(' ');
+      this.changeList.push({ displayAttribute: displayAttribute, attribute: key, newValue: (this.logInfo?.action === 'deleted') ? '' : (this.logInfo?.object[key] ?? ''), oldValue: this.logInfo?.pre_object[key] ?? '' });
+    });
+  }
+
+  close() {
+    this.dialogRef.close();
+  }
+
+}

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

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

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

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { AuditLogRoutingModule } from './audit-log-routing.module';
+import { AuditLogListModule } from './audit-log-list/audit-log-list.module';
+import { AuditLogViewModule } from './audit-log-view/audit-log-view.module';
+
+
+@NgModule({
+  declarations: [
+  ],
+  imports: [
+    CommonModule,
+    AuditLogRoutingModule,
+    AuditLogListModule,
+    AuditLogViewModule
+  ],
+  exports: []
+})
+export class AuditLogModule { }

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

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

package/src/lib/audit-log/audit-logs-view-model/audit-logs-view-model.component.html

@@ -0,0 +1,4 @@
+<div fxLayout="column" class="m-4" fxLayoutGap="1.5rem">
+    <app-audit-log-list [objectId]="data?.modelId" [objectType]="data?.modelType" [showExportButtons]="false">
+    </app-audit-log-list>
+</div>

package/src/lib/audit-log/audit-logs-view-model/audit-logs-view-model.component.scss

@@ -0,0 +1,4 @@
+::ng-deep app-audit-log-list .scroll-container{
+    height: 350px !important;
+    overflow-y: scroll;
+}

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

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

package/src/lib/audit-log/audit-logs-view-model/audit-logs-view-model.component.ts

@@ -0,0 +1,28 @@
+import { Component, Inject, OnInit } from '@angular/core';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { NavigationEnd, Router } from '@angular/router';
+import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
+import { filter } from 'rxjs/operators';
+import { AuditLogViewModelComponent } from '../audit-log-view-model/audit-log-view-model.component';
+
+@UntilDestroy()
+@Component({
+  selector: 'app-audit-logs-view-model',
+  templateUrl: './audit-logs-view-model.component.html',
+  styleUrls: ['./audit-logs-view-model.component.scss']
+})
+export class AuditLogsViewModelComponent implements OnInit {
+
+  constructor(
+    public dialogRef: MatDialogRef<AuditLogViewModelComponent>,
+    @Inject(MAT_DIALOG_DATA) public data: any,
+    private router: Router
+  ) { }
+
+  ngOnInit(): void {
+    this.router.events
+      .pipe(filter(event => event instanceof NavigationEnd), untilDestroyed(this))
+      .subscribe(_ => this.dialogRef.close());
+  }
+
+}

package/src/lib/audit-log/audit-logs-view-model/audit-logs-view-model.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { AuditLogsViewModelRoutingModule } from './audit-logs-view-model-routing.module';
+import { AuditLogsViewModelComponent } from './audit-logs-view-model.component';
+import { AuditLogListModule } from '../audit-log-list/audit-log-list.module';
+import { FlexLayoutModule } from '@angular/flex-layout';
+
+
+@NgModule({
+  declarations: [AuditLogsViewModelComponent],
+  imports: [
+    CommonModule,
+    AuditLogsViewModelRoutingModule,
+    FlexLayoutModule,
+    AuditLogListModule
+  ],
+  exports: [AuditLogsViewModelComponent]
+})
+export class AuditLogsViewModelModule { }

package/src/lib/base-model/index.ts

@@ -0,0 +1,3 @@
+export * from './techlify-form-component.class'
+export * from './techlify-listing-component.class'
+export * from './techlify-service.class'

package/src/lib/base-model/techlify-form-component.class.ts

@@ -0,0 +1,60 @@
+import { FormGroup } from '@angular/forms';
+import { FormValidatorService } from '../core/form-validator.service';
+
+/**
+ * Interface used to ensure we have a consistent structure across our form components
+ *
+ * It also provides some abstraction of repeated code to reduce our codebase size
+ *
+ * @todo This should be moved to ngx-techlify-core
+ *
+ * Advantages of this abstract class
+ * - Less code, less maintenance, less bugs
+ * - more consistent code
+ * - comments on more code
+ * - save time, save energy
+ */
+export abstract class TechlifyFormComponentInterface {
+
+  form: FormGroup;
+  errorMessages: any;
+
+  constructor(protected formValidatorService: FormValidatorService) {
+
+  }
+
+  /**
+   * Resets the value of a field in the HTML form
+   *
+   * @param event
+   * @param field
+   */
+  resetFieldValue(event: any, field: string) {
+    this.form?.get(field)?.setValue('');
+  }
+
+  /**
+   * Retrieves the value of a field from the HTML form
+   *
+   * @param field
+   * @returns
+   */
+  getFieldValue(field: string) {
+    return this.form?.get(field)?.value;
+  }
+
+  /**
+   * Method to evaluate form fields
+   * */
+  isFieldValid(field: string) {
+    return this.formValidatorService.isFieldValid(field, this.form, true);
+  }
+
+  /**
+   * Method to find error in form fields
+   * */
+  getErrorMessage(field: string) {
+    return this.formValidatorService.getErrorMessage(field, this.form, this.errorMessages);
+  }
+
+}

package/src/lib/base-model/techlify-listing-component.class.ts

@@ -0,0 +1,67 @@
+/**
+ * Interface used to ensure we have a consistent structure across our listing pages
+ *
+ * @todo This should be moved to ngx-techlify-core
+ *
+ * Advantages of this abstract class
+ * - Less code, less maintenance, less bugs
+ * - more consistent code
+ * - comments on more code
+ * - save time, save energy
+ */
+export abstract class TechlifyListingControllerInterface {
+
+  models: any[] = [];
+  page: number = 1;
+  perPage: number = 25;
+  lastPage: number = 500;
+  isWorking: boolean = false;
+
+  /**
+   * Function that listens for any changes in the form group to apply the filters
+   */
+  abstract listenForChanges(): void;
+
+  /**
+   * Function that loads the main models of the application
+   */
+  abstract loadData(): void;
+
+  /**
+   * Reload all data from page 1
+   */
+  reload() {
+    this.models = [];
+    this.page = 1;
+    if (!this.isWorking) {
+      this.loadData();
+    }
+  }
+
+  /**
+   * Can be called when the user is scrolling,
+   * to trigger loading a new page of data
+   */
+  onScroll() {
+    if (!this.isWorking && this.page < this.lastPage) {
+      this.page += 1;
+      this.loadData();
+    }
+  }
+
+
+  /**
+   * Function used to pop up the edit form for the model
+   *
+   * @param model
+   */
+  abstract editForm(model: any): void;
+
+  /**
+   * Function used to pop up the delete form for the model
+   *
+   * @param model
+   */
+  abstract deleteForm(model: any): void;
+
+}

package/src/lib/base-model/techlify-service.class.ts

@@ -0,0 +1,73 @@
+import { HttpService } from '../core/http.service';
+
+/**
+ * Interface used to ensure we have a consistent structure across our listing pages
+ *
+ * @todo This should be moved to ngx-techlify-core
+ *
+ * Advantages of this abstract class
+ * - Less code, less maintenance, less bugs
+ * - more consistent code
+ * - comments on more code
+ * - save time, save energy
+ */
+export class TechlifyServiceBaseClass {
+
+  protected baseUrl = "you-forgot-to-set-a-base-url";
+
+  constructor(protected http: HttpService, baseUrl: string) {
+    this.baseUrl = baseUrl;
+  }
+
+  /**
+   * Loads a set of the model this service is for
+   *
+   * @param filters Restrictors to filter the set of models
+   * @returns
+   */
+  index(filters: any) {
+    return this.http.get(`api/${this.baseUrl}`, { params: { ...filters } }).toPromise();
+  }
+
+  /**
+   * Add a new record to the database
+   *
+   * @param model The data of the model to add
+   * @returns
+   */
+  store(model: any) {
+    return this.http.post(`api/${this.baseUrl}`, model).toPromise();
+  }
+
+  /**
+   * Load a single model record, often with all relations and related data
+   *
+   * @param modelId ID of the model to load
+   * @returns
+   */
+  show(modelId: any) {
+    return this.http.get(`api/${this.baseUrl}/${modelId}`).toPromise();
+  }
+
+  /**
+   * Update fields of a single existing model
+   *
+   * @param model Model to update
+   * @returns
+   */
+  update(model: any) {
+    return this.http.put(`api/${this.baseUrl}/${model.id}`, model).toPromise();
+  }
+
+  /**
+   * Delete a single model
+   *
+   * @param model Model to delete
+   * @returns
+   */
+  delete(model: any) {
+    return this.http.delete(`api/${this.baseUrl}/${model.id}`).toPromise();
+  }
+
+
+}

package/src/lib/core/alert.service.ts

@@ -0,0 +1,32 @@
+import { Injectable } from '@angular/core';
+import { MatSnackBar } from '@angular/material/snack-bar';
+import { ErrorSnackComponent, SuccessSnackComponent } from './snack/snack.component';
+
+/**
+ * Service used to manage alerts in the entire system frontend
+ * 
+ * @author Gokula Prasanna
+ * @since 20210131
+ */
+@Injectable({
+    providedIn: 'root'
+})
+export class AlertService {
+
+    constructor(public snackBar: MatSnackBar) { }
+
+    addAlert(message: string, alertType: string, duration = 3) {
+        if (alertType == "success") {
+            this.snackBar.openFromComponent(SuccessSnackComponent, {
+                duration: 1000 * duration,
+                data: message
+            });
+        }
+        else {
+            this.snackBar.openFromComponent(ErrorSnackComponent, {
+                duration: 1000 * duration,
+                data: message
+            });
+        }
+    }
+}

package/src/lib/core/api-prefix.interceptor.ts

@@ -0,0 +1,22 @@
+import { Injectable } from '@angular/core';
+import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest } from '@angular/common/http';
+import { Observable } from 'rxjs';
+import { ConfigService } from './config.service';
+
+/**
+ * Prefixes all requests not starting with `http[s]` with `environment.serverUrl`.
+ */
+@Injectable({
+  providedIn: 'root'
+})
+export class ApiPrefixInterceptor implements HttpInterceptor {
+
+  constructor(private configService: ConfigService) { }
+
+  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+    if (!/^(http|https):/i.test(request.url)) {
+      request = request.clone({ url: this.configService.getApiUrl() + request.url });
+    }
+    return next.handle(request);
+  }
+}

package/src/lib/core/authentication.guard.ts

@@ -0,0 +1,34 @@
+import { Injectable } from '@angular/core';
+import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
+import { CredentialsService } from './credentials.service';
+import { Logger } from './logger.service';
+
+const log = new Logger('AuthenticationGuard');
+
+@Injectable({
+  providedIn: 'root'
+})
+export class AuthenticationGuard implements CanActivate {
+
+  constructor(private router: Router,
+    private credentialsService: CredentialsService) { }
+
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
+    return this.isUserAuthenticated(route, state);
+  }
+
+  canLoad(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
+    return this.isUserAuthenticated(route, state);
+  }
+
+  isUserAuthenticated(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
+    if (this.credentialsService.isAuthenticated) {
+      return true;
+    }
+
+    log.debug('Not authenticated, redirecting and adding redirect url...');
+    this.router.navigate(['/login'], { queryParams: { redirect: state.url }, replaceUrl: true });
+    return false;
+  }
+
+}

package/src/lib/core/authentication.service.ts

@@ -0,0 +1,53 @@
+
+import { Injectable } from '@angular/core';
+import { Observable, of } from 'rxjs';
+import { concatMap, map } from 'rxjs/operators';
+import { Credentials, CredentialsService } from './credentials.service';
+import { HttpService } from './http.service';
+
+/**
+ * Provides a base for authentication workflow.
+ * The login/logout methods should be replaced with proper implementation.
+ */
+@Injectable({
+  providedIn: 'root'
+})
+export class AuthenticationService {
+
+  constructor(private credentialsService: CredentialsService, private http: HttpService) { }
+
+  /**
+   * Authenticates the user.
+   * @param context The login parameters.
+   * @return The user credentials.
+   */
+  login(context: any): Observable<Credentials> {
+    const data = <Credentials>{};
+    return this.http
+      .skipToken()
+      .post('oauth/token', context)
+      .pipe(
+        concatMap(async (tokenInfo: any) => {
+          tokenInfo.expires_in = Date.now() + (tokenInfo.expires_in * 1000);
+          data.token = tokenInfo;
+          data.user = {};
+          this.credentialsService.setCredentials(data, context.remember);
+          const userInfo: any = await this.http.get('api/user/current').toPromise();
+          data.user = userInfo?.user;
+          this.credentialsService.setCredentials(data, context.remember);
+          return data;
+        })
+      )
+  }
+
+  /**
+   * Logs out the user and clear credentials.
+   * @return True if the user was logged out successfully.
+   */
+  logout(): Observable<boolean> {
+
+    this.credentialsService.setCredentials();
+    return of(true);
+  }
+
+}

package/src/lib/core/cache.interceptor.ts

@@ -0,0 +1,59 @@
+import { Injectable } from '@angular/core';
+import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HttpResponse } from '@angular/common/http';
+import { HttpCacheService } from './http-cache.service';
+import { Observable, Subscriber } from 'rxjs';
+
+/**
+ * Caches HTTP requests.
+ * Use ExtendedHttpClient fluent API to configure caching for each request.
+ */
+@Injectable({
+  providedIn: 'root'
+})
+export class CacheInterceptor implements HttpInterceptor {
+
+  private forceUpdate = false;
+
+  constructor(private httpCacheService: HttpCacheService) { }
+
+  /**
+   * Configures interceptor options
+   * @param {{update: boolean}} options If update option is enabled, forces request to be made and updates cache entry.
+   * @return {CacheInterceptor} The configured instance.
+   */
+  configure(options?: { update?: boolean } | null): CacheInterceptor {
+    const instance = new CacheInterceptor(this.httpCacheService);
+    if (options && options.update) {
+      instance.forceUpdate = true;
+    }
+    return instance;
+  }
+
+  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+    if (request.method !== 'GET') {
+      return next.handle(request);
+    }
+
+    return new Observable((subscriber: Subscriber<HttpEvent<any>>) => {
+      const cachedData = this.forceUpdate ? null : this.httpCacheService.getCacheData(request.urlWithParams);
+      if (cachedData !== null) {
+        // Create new response to avoid side-effects
+        subscriber.next(new HttpResponse(cachedData as Object));
+        subscriber.complete();
+      } else {
+        next.handle(request)
+          .subscribe(
+            event => {
+              if (event instanceof HttpResponse) {
+                this.httpCacheService.setCacheData(request.urlWithParams, event);
+              }
+              subscriber.next(event);
+            },
+            error => subscriber.error(error),
+            () => subscriber.complete()
+          );
+      }
+    });
+  }
+
+}

package/src/lib/core/config.service.ts

@@ -0,0 +1,52 @@
+import { Injectable } from '@angular/core';
+
+import { TechlifyConfig } from "./techlify-config.model";
+
+/**
+ * Service that provides settings for all other services
+ *
+ * @author Joshua Kissoon
+ * @since 20170709
+ */
+@Injectable({
+  providedIn: 'root'
+})
+export class ConfigService {
+
+  public static BASE_CREDENTIALS = "credentials";
+
+  private config: TechlifyConfig;
+
+  constructor(config: TechlifyConfig) {
+    this.config = config;
+  }
+
+  getConfigsRaw() {
+    return this.config.rawConfigs;
+  }
+
+  getProjectKey() {
+    return this.config.projectKey;
+  }
+
+  getApiUrl() {
+    return this.config.apiUrl;
+  }
+
+  getAuthClientSecret() {
+    return this.config.authClientSecret;
+  }
+
+  getStorage() {
+    return this.config.storage ? this.config.storage : localStorage;
+  }
+
+  getAuthGrantType() {
+    return this.config.authGrantType;
+  }
+
+  getCredentialsKey() {
+    return this.config.projectKey + "_" + ConfigService.BASE_CREDENTIALS;
+  }
+
+}