@elderbyte/ngx-starter 14.12.0-beta4 → 14.12.0-beta6

package/src/lib/components/connectivity/offline-indicator/elder-offline-indicator.component.ts

@@ -0,0 +1,51 @@
+import {ChangeDetectionStrategy, Component, OnInit} from '@angular/core';
+import {LoggerFactory} from '@elderbyte/ts-logger';
+import {Observable} from 'rxjs';
+import {ElderConnectivityService, OnlineStatus} from '../elder-connectivity.service';
+
+@Component({
+    selector: 'elder-offline-indicator',
+    templateUrl: './elder-offline-indicator.component.html',
+    styleUrls: ['./elder-offline-indicator.component.scss'],
+    changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class ElderOfflineIndicatorComponent implements OnInit {
+
+    /***************************************************************************
+     *                                                                         *
+     * Fields                                                                  *
+     *                                                                         *
+     **************************************************************************/
+
+    private readonly log = LoggerFactory.getLogger(this.constructor.name);
+
+    /***************************************************************************
+     *                                                                         *
+     * Constructor                                                             *
+     *                                                                         *
+     **************************************************************************/
+
+    constructor(
+      private connectivityService: ElderConnectivityService
+    ) {
+    }
+
+    /***************************************************************************
+     *                                                                         *
+     * Life Cycle                                                              *
+     *                                                                         *
+     **************************************************************************/
+
+    public ngOnInit(): void {}
+
+    /***************************************************************************
+     *                                                                         *
+     * Properties                                                              *
+     *                                                                         *
+     **************************************************************************/
+
+    public get status$(): Observable<OnlineStatus> {
+        return this.connectivityService.online$;
+    }
+
+}

package/src/lib/components/connectivity/public_api.ts

@@ -0,0 +1,3 @@
+export * from './elder-connectivity.module';
+export * from './elder-connectivity.service';
+

package/src/lib/components/containers/elder-containers.module.ts

@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ElderScrollContainerComponent } from './elder-scroll-container/elder-scroll-container.component';
+
+export * from './elder-scroll-container/elder-scroll-container.component';
+
+@NgModule({
+  imports: [
+    CommonModule
+  ],
+  declarations: [
+    ElderScrollContainerComponent
+  ],
+  exports: [
+    ElderScrollContainerComponent
+  ]
+})
+export class ElderContainersModule { }

package/src/lib/components/containers/elder-scroll-container/elder-scroll-container.component.html

@@ -0,0 +1,14 @@
+<div class="layout-col full scroll-fix">
+  <div class="layout-col flex scroll-fix">
+    <div
+      [class.layout-col]="isVertical(direction)"
+      [class.layout-row]="!isVertical(direction)"
+      class="gap-sm"
+      [ngStyle]="{'padding': padding}"
+      [class.vertical-scroll-wrapper]="isVertical(direction)"
+      [class.horizontal-scroll-wrapper]="!isVertical(direction)"
+      >
+      <ng-content></ng-content>
+    </div>
+  </div>
+</div>

package/src/lib/components/containers/elder-scroll-container/elder-scroll-container.component.ts

@@ -0,0 +1,30 @@
+import {
+  Component,
+  OnInit,
+  ChangeDetectionStrategy,
+  Input,
+} from '@angular/core';
+
+export type ScrollDirection = 'vertical' | 'horizontal';
+
+@Component({
+  selector: 'elder-scroll-container',
+  templateUrl: './elder-scroll-container.component.html',
+  styleUrls: ['./elder-scroll-container.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class ElderScrollContainerComponent implements OnInit {
+
+  @Input()
+  public direction: ScrollDirection = 'vertical';
+
+  @Input()
+  public padding = '8px';
+
+  constructor() {}
+  ngOnInit(): void {}
+
+  public isVertical(direction: ScrollDirection): boolean {
+    return direction === 'vertical';
+  }
+}

package/src/lib/components/containers/public_api.ts

@@ -0,0 +1,3 @@
+
+export * from './elder-containers.module';
+

package/src/lib/components/csv/elder-csv-export-btn/elder-csv-export-btn.component.html

@@ -0,0 +1,5 @@
+
+<button type="button" mat-icon-button
+        (click)="startExport()">
+    <mat-icon>file_download</mat-icon>
+</button>

package/src/lib/components/csv/elder-csv-export-btn/elder-csv-export-btn.component.ts

@@ -0,0 +1,105 @@
+import {Component, OnInit, ChangeDetectionStrategy, Input} from '@angular/core';
+import {IDataSource} from '../../../common/data/datasource/data-source';
+import {Filter} from '../../../common/data/filters/filter';
+import {Sort} from '../../../common/data/sort';
+import {CsvStreamExporter} from '../elder-csv-stream-exporter';
+import {Logger, LoggerFactory} from '@elderbyte/ts-logger';
+import {CsvSpec} from '../../../common/csv/csv-spec';
+import {CsvStreamExporterBuilderService} from '../elder-csv-stream-exporter-builder.service';
+
+@Component({
+  selector: 'elder-csv-export-btn',
+  templateUrl: './elder-csv-export-btn.component.html',
+  styleUrls: ['./elder-csv-export-btn.component.scss'],
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class ElderCsvExportBtnComponent<T> implements OnInit {
+
+  /***************************************************************************
+   *                                                                         *
+   * Fields                                                                  *
+   *                                                                         *
+   **************************************************************************/
+
+  private readonly log: Logger = LoggerFactory.getLogger(this.constructor.name);
+
+  private _dataSource: IDataSource<T>;
+
+  private _csvSpec: CsvSpec<T>;
+
+  private _csvStreamExporter: CsvStreamExporter<T>;
+
+  @Input()
+  public set dataSource(dataSource: IDataSource<T>) {
+    this._dataSource = dataSource;
+    this.initStreamExporter();
+  }
+
+  @Input()
+  public set csvSpec(csvSpec: CsvSpec<T>) {
+    this._csvSpec = csvSpec;
+    this.initStreamExporter();
+  }
+
+  @Input()
+  public filters: Filter[];
+
+  @Input()
+  public sorts: Sort[];
+
+  @Input()
+  public chunkSize: number;
+
+  /***************************************************************************
+   *                                                                         *
+   * Constructor                                                             *
+   *                                                                         *
+   **************************************************************************/
+
+  constructor(
+    private csvStreamExportBuilder: CsvStreamExporterBuilderService
+  ) {
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Life Cycle                                                              *
+   *                                                                         *
+   **************************************************************************/
+
+  ngOnInit(): void {
+
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Public API                                                              *
+   *                                                                         *
+   **************************************************************************/
+
+  public startExport(): void {
+    this._csvStreamExporter.start(this.filters, this.sorts);
+  }
+
+  public abortExport(): void {
+    this._csvStreamExporter.abort();
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Private Methods                                                         *
+   *                                                                         *
+   **************************************************************************/
+
+  private initStreamExporter() {
+    if (this._dataSource && this._csvSpec) {
+      this._csvStreamExporter = this.csvStreamExportBuilder.start(
+        this._dataSource,
+        this._csvSpec
+      )
+        .chunkSize(this.chunkSize)
+        .build();
+    }
+  }
+
+}

package/src/lib/components/csv/elder-csv-stream-exporter-builder.service.ts

@@ -0,0 +1,56 @@
+import {Logger, LoggerFactory} from '@elderbyte/ts-logger';
+import {Injectable} from '@angular/core';
+import {TranslateService} from '@ngx-translate/core';
+import {CsvStreamExporterBuilder} from './elder-csv-stream-exporter-builder';
+import {IDataSource} from '../../common/data/datasource/data-source';
+import {CsvSpec} from '../../common/csv/csv-spec';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class CsvStreamExporterBuilderService {
+
+  /***************************************************************************
+   *                                                                         *
+   * Fields                                                                  *
+   *                                                                         *
+   **************************************************************************/
+
+  private readonly log: Logger = LoggerFactory.getLogger(this.constructor.name);
+
+  /***************************************************************************
+   *                                                                         *
+   * Constructor                                                             *
+   *                                                                         *
+   **************************************************************************/
+
+  constructor(
+    private translateService: TranslateService
+  ) {
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Public API                                                              *
+   *                                                                         *
+   **************************************************************************/
+
+  public start<T>(
+    dataSource: IDataSource<T>,
+    csvSpec: CsvSpec<T>
+  ): CsvStreamExporterBuilder<T> {
+    return new CsvStreamExporterBuilder(
+      this.translateService,
+      dataSource,
+      csvSpec
+    );
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Private Methods                                                         *
+   *                                                                         *
+   **************************************************************************/
+
+
+}

package/src/lib/components/csv/elder-csv-stream-exporter-builder.ts

@@ -0,0 +1,68 @@
+import {Logger, LoggerFactory} from '@elderbyte/ts-logger';
+import {Injectable} from '@angular/core';
+import {TranslateService} from '@ngx-translate/core';
+import {CsvStreamExporter} from './elder-csv-stream-exporter';
+import {IDataSource} from '../../common/data/datasource/data-source';
+import {CsvSpec} from '../../common/csv/csv-spec';
+
+export class CsvStreamExporterBuilder<T> {
+
+  /***************************************************************************
+   *                                                                         *
+   * Fields                                                                  *
+   *                                                                         *
+   **************************************************************************/
+
+  private readonly log: Logger = LoggerFactory.getLogger(this.constructor.name);
+
+  /** Chunk size to use for data loading */
+  private _chunkSize: number;
+
+  /***************************************************************************
+   *                                                                         *
+   * Constructor                                                             *
+   *                                                                         *
+   **************************************************************************/
+
+  constructor(
+    private translateService: TranslateService,
+    private dataSource: IDataSource<T>,
+    private csvSpec: CsvSpec<T>
+  ) {
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Public API                                                              *
+   *                                                                         *
+   **************************************************************************/
+
+  public build(): CsvStreamExporter<T> {
+    return CsvStreamExporter
+      .start(
+        this.translateService,
+        this.dataSource,
+        this.csvSpec
+      )
+      .chunkSize(this._chunkSize);
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Fluent API                                                              *
+   *                                                                         *
+   **************************************************************************/
+
+  public chunkSize(chunkSize: number) {
+    this._chunkSize = chunkSize;
+    return this;
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Private Methods                                                         *
+   *                                                                         *
+   **************************************************************************/
+
+
+}

package/src/lib/components/csv/elder-csv-stream-exporter.ts

@@ -0,0 +1,192 @@
+import * as StreamSaver from 'streamsaver';
+import {Logger, LoggerFactory} from '@elderbyte/ts-logger';
+import {
+  IDataSource
+} from '../../common/data/datasource/data-source';
+import {Filter} from '../../common/data/filters/filter';
+import {Sort} from '../../common/data/sort';
+import {
+  DataSourceProcessor,
+  ProcessIterationContext
+} from '../../common/data/datasource/data-source-processor';
+import {CsvSpec} from '../../common/csv/csv-spec';
+import {CsvSerializer} from '../../common/csv/csv-serializer';
+import {Observable} from 'rxjs/internal/Observable';
+import {TranslateService} from '@ngx-translate/core';
+import {map, tap} from 'rxjs/operators';
+
+export class CsvStreamExporter<T> {
+
+  /***************************************************************************
+   *                                                                         *
+   * Fields                                                                  *
+   *                                                                         *
+   **************************************************************************/
+
+  private readonly log: Logger = LoggerFactory.getLogger(this.constructor.name);
+
+  /** Instance of TranslateService. Used for translating header texts. */
+  private readonly _translateService: TranslateService;
+
+  /** The data source providing data to export */
+  private readonly _dataSource: IDataSource<T>;
+
+  /** The CSV specification */
+  private readonly _csvSpec: CsvSpec<T>;
+
+  /** Encoder used to encode stream output */
+  private readonly _encoder = new TextEncoder();
+
+  /** Chunk size to use for data loading */
+  private _chunkSize = 100;
+
+  /***************************************************************************
+   *                                                                         *
+   * Static                                                                  *
+   *                                                                         *
+   **************************************************************************/
+
+  public static start<T>(
+    translateService: TranslateService,
+    dataSource: IDataSource<T>,
+    csvSpec: CsvSpec<T>
+  ): CsvStreamExporter<T> {
+    return new CsvStreamExporter<T>(translateService, dataSource, csvSpec);
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Constructor                                                             *
+   *                                                                         *
+   **************************************************************************/
+
+  constructor(
+    translateService: TranslateService,
+    dataSource: IDataSource<T>,
+    csvSpec: CsvSpec<T>
+  ) {
+    if (!translateService) { throw new Error('TranslateService must be provided!'); }
+    if (!dataSource) { throw new Error('A dataSource must be provided!'); }
+    if (!csvSpec) { throw new Error('A csvSpec must be provided!'); }
+
+    this._translateService = translateService;
+    this._dataSource = dataSource;
+    this._csvSpec = csvSpec;
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Public API                                                              *
+   *                                                                         *
+   **************************************************************************/
+
+  public start(filters?: Filter[], sorts?: Sort[]): void {
+
+    // const serializer = this._csvSpec.getSerializer(this._translateService);
+    const serializer = this._csvSpec.getSerializer(this._translateService);
+
+    const fileStream = StreamSaver.createWriteStream(this._csvSpec.filename, {
+      size: undefined, // (optional filesize) Will show progress
+      writableStrategy: undefined, // (optional)
+      readableStrategy: undefined  // (optional)
+    });
+
+    const writer = fileStream.getWriter();
+
+    if (this._csvSpec.includeHeader) {
+      this.writeHeader(writer, serializer)
+        .subscribe(
+          () => {},
+          err => { throw new Error(err.message); },
+          () => {
+            this.log.debug('Successfully processed csv headers');
+          }
+        );
+    }
+
+    this.writeRecords(
+      writer,
+      serializer,
+      filters,
+      sorts
+    ).subscribe(
+      () => {},
+      err => { throw new Error(err.message); },
+      () => {
+        this.log.debug('Successfully processed csv records');
+        writer.close();
+      }
+    );
+
+  }
+
+  public abort(): void {
+    throw new Error('Not yet implemented');
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Fluent API                                                              *
+   *                                                                         *
+   **************************************************************************/
+
+  public chunkSize(chunkSize: number) {
+    if (chunkSize) {
+      this._chunkSize = chunkSize;
+    }
+    return this;
+  }
+
+  /***************************************************************************
+   *                                                                         *
+   * Private Methods                                                         *
+   *                                                                         *
+   **************************************************************************/
+
+  private writeHeader(writer: WritableStreamDefaultWriter, serializer: CsvSerializer<T>): Observable<string> {
+    return serializer.serializeHeaders()
+      .pipe(
+        tap(headerString => {
+          this.writeString(writer, headerString);
+          this.writeNewLine(writer);
+        })
+      );
+  }
+
+  private writeNewLine(writer: WritableStreamDefaultWriter): void {
+    this.writeString(writer, '\n');
+  }
+
+  private writeString(writer: WritableStreamDefaultWriter, value: string): void {
+    writer.write(this._encoder.encode(value));
+  }
+
+  private writeRecords(
+    writer: WritableStreamDefaultWriter,
+    serializer: CsvSerializer<T>,
+    filters?: Filter[],
+    sorts?: Sort[]
+  ): Observable<ProcessIterationContext<T>> {
+    return DataSourceProcessor
+      .start(this._dataSource, this._chunkSize)
+      .process$(
+        this.getProcessFn(writer, serializer),
+        filters,
+        sorts
+      );
+  }
+
+  private getProcessFn(
+    writer: WritableStreamDefaultWriter,
+    serializer: CsvSerializer<T>
+  ): (chunk: T[]) => void {
+    return (chunk: T[]) => {
+      chunk.forEach(record => {
+        this.writeString(writer, serializer.serializeRow(record));
+        this.writeNewLine(writer);
+      });
+    };
+  }
+
+
+}

package/src/lib/components/csv/elder-csv.module.ts

@@ -0,0 +1,27 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ElderCsvExportBtnComponent } from './elder-csv-export-btn/elder-csv-export-btn.component';
+import {MatButtonModule} from '@angular/material/button';
+import {MatIconModule} from '@angular/material/icon';
+
+export * from './elder-csv-export-btn/elder-csv-export-btn.component';
+export * from './elder-csv-stream-exporter-builder.service';
+export * from './elder-csv-stream-exporter-builder';
+export * from './elder-csv-stream-exporter';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    MatButtonModule,
+    MatIconModule
+  ],
+  declarations: [
+    ElderCsvExportBtnComponent
+  ],
+  exports: [
+    ElderCsvExportBtnComponent
+  ],
+  providers: [
+  ]
+})
+export class ElderCsvModule { }

package/src/lib/components/currency/elder-currency.module.ts

@@ -0,0 +1,18 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ElderCurrencyPipe } from './elder-currency.pipe';
+
+
+
+@NgModule({
+  imports: [
+    CommonModule
+  ],
+  declarations: [
+    ElderCurrencyPipe
+  ],
+  exports: [
+    ElderCurrencyPipe
+  ]
+})
+export class ElderCurrencyModule { }

package/src/lib/components/currency/elder-currency.pipe.ts

@@ -0,0 +1,44 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import {CurrencyPipe} from '@angular/common';
+import {Currency} from './model/currency';
+
+@Pipe({
+  name: 'elderCurrency'
+})
+export class ElderCurrencyPipe implements PipeTransform {
+
+  /***************************************************************************
+   *                                                                         *
+   * Constructor                                                             *
+   *                                                                         *
+   **************************************************************************/
+
+  constructor(
+    private readonly currencyPipe: CurrencyPipe
+  ) {
+  }
+  /***************************************************************************
+   *                                                                         *
+   * Public API                                                              *
+   *                                                                         *
+   **************************************************************************/
+
+  public transform(
+    currency: Currency,
+    display?: 'code' | 'symbol' | 'symbol-narrow' | string | boolean,
+    digitsInfo?: string,
+    locale?: string
+  ): string {
+
+    if (!currency) { return '-'; }
+
+    return this.currencyPipe.transform(
+      currency.value,
+      currency.code,
+      display,
+      digitsInfo,
+      locale
+    );
+  }
+
+}