From 8347c9beb4e573995d861d07cebf54946ac07381 Mon Sep 17 00:00:00 2001 From: 4gray Date: Wed, 2 Feb 2022 23:09:41 +0100 Subject: [PATCH] refactor: add about dialog for pwa --- src/app/app.module.ts | 31 +++++++-------- .../about-dialog/about-dialog.component.html | 38 +++++++++++++++++++ .../about-dialog/about-dialog.component.scss | 11 ++++++ .../about-dialog.component.spec.ts | 34 +++++++++++++++++ .../about-dialog/about-dialog.component.ts | 15 ++++++++ src/app/shared/shared.module.ts | 21 +++++++--- 6 files changed, 126 insertions(+), 24 deletions(-) create mode 100644 src/app/shared/components/about-dialog/about-dialog.component.html create mode 100644 src/app/shared/components/about-dialog/about-dialog.component.scss create mode 100644 src/app/shared/components/about-dialog/about-dialog.component.spec.ts create mode 100644 src/app/shared/components/about-dialog/about-dialog.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index ee2fea756..769a2f530 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,26 +1,22 @@ -import 'reflect-metadata'; -import '../polyfills'; - -import { AppRoutingModule } from './app-routing.module'; -import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; -import { BrowserModule } from '@angular/platform-browser'; -import { HttpClientModule, HttpClient } from '@angular/common/http'; +import { HttpClient, HttpClientModule } from '@angular/common/http'; import { NgModule } from '@angular/core'; -import { NgxWhatsNewModule } from 'ngx-whats-new'; -import { SharedModule } from './shared/shared.module'; - +import { BrowserModule } from '@angular/platform-browser'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { ServiceWorkerModule } from '@angular/service-worker'; // NG Translate -import { TranslateModule, TranslateLoader } from '@ngx-translate/core'; +import { TranslateLoader, TranslateModule } from '@ngx-translate/core'; import { TranslateHttpLoader } from '@ngx-translate/http-loader'; - +import { NgxIndexedDBModule, NgxIndexedDBService } from 'ngx-indexed-db'; +import 'reflect-metadata'; +import { AppConfig } from '../environments/environment'; +import '../polyfills'; +import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; +import { dbConfig } from './indexed-db.config'; +import { DataService } from './services/data.service'; import { ElectronService } from './services/electron.service'; import { PwaService } from './services/pwa.service'; -import { DataService } from './services/data.service'; -import { NgxIndexedDBModule, NgxIndexedDBService } from 'ngx-indexed-db'; -import { AppConfig } from '../environments/environment'; -import { dbConfig } from './indexed-db.config'; -import { ServiceWorkerModule } from '@angular/service-worker'; +import { SharedModule } from './shared/shared.module'; // AoT requires an exported function for factories export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader { @@ -53,7 +49,6 @@ export function DataFactory(dbService: NgxIndexedDBService, http: HttpClient) { BrowserAnimationsModule, BrowserModule, HttpClientModule, - NgxWhatsNewModule, SharedModule, AppConfig.environment === 'WEB' ? NgxIndexedDBModule.forRoot(dbConfig) diff --git a/src/app/shared/components/about-dialog/about-dialog.component.html b/src/app/shared/components/about-dialog/about-dialog.component.html new file mode 100644 index 000000000..4740e9e61 --- /dev/null +++ b/src/app/shared/components/about-dialog/about-dialog.component.html @@ -0,0 +1,38 @@ +
+
+

About IPTVnator

+

+ Cross-platform IPTV player application with multiple features, such as + support of m3u and m3u8 playlists, favorites, TV guide, TV + archive/catchup and more. +

+

Version: {{ appVersion }}

+

+   + + + + local_cafe +

+
diff --git a/src/app/shared/components/about-dialog/about-dialog.component.scss b/src/app/shared/components/about-dialog/about-dialog.component.scss new file mode 100644 index 000000000..1a37e0913 --- /dev/null +++ b/src/app/shared/components/about-dialog/about-dialog.component.scss @@ -0,0 +1,11 @@ +button { + text-transform: uppercase; +} + +a { + color: #fff; +} + +.mat-icon { + font-size: 32px; +} diff --git a/src/app/shared/components/about-dialog/about-dialog.component.spec.ts b/src/app/shared/components/about-dialog/about-dialog.component.spec.ts new file mode 100644 index 000000000..b7bd5fcbb --- /dev/null +++ b/src/app/shared/components/about-dialog/about-dialog.component.spec.ts @@ -0,0 +1,34 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { MatIconModule } from '@angular/material/icon'; +import { MockModule } from 'ng-mocks'; +import { DataService } from '../../../services/data.service'; +import { ElectronServiceStub } from '../../../services/electron.service.stub'; +import { AboutDialogComponent } from './about-dialog.component'; + +describe('AboutDialogComponent', () => { + let component: AboutDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [AboutDialogComponent], + providers: [ + { + provide: DataService, + useClass: ElectronServiceStub, + }, + ], + imports: [MockModule(MatIconModule)], + }).compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(AboutDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/shared/components/about-dialog/about-dialog.component.ts b/src/app/shared/components/about-dialog/about-dialog.component.ts new file mode 100644 index 000000000..0d3056315 --- /dev/null +++ b/src/app/shared/components/about-dialog/about-dialog.component.ts @@ -0,0 +1,15 @@ +import { Component } from '@angular/core'; +import { DataService } from '../../../services/data.service'; + +@Component({ + selector: 'app-about-dialog', + templateUrl: './about-dialog.component.html', + styleUrls: ['./about-dialog.component.scss'], +}) +export class AboutDialogComponent { + /** Version of the application */ + appVersion = this.dataService.getAppVersion(); + + /** Default constructor */ + constructor(private dataService: DataService) {} +} diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts index b46469701..f9387a82b 100644 --- a/src/app/shared/shared.module.ts +++ b/src/app/shared/shared.module.ts @@ -1,22 +1,30 @@ -import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; -import { TranslateModule } from '@ngx-translate/core'; +import { NgModule } from '@angular/core'; import { FlexLayoutModule } from '@angular/flex-layout'; -import { HeaderComponent } from './components/'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { MaterialModule } from '../material.module'; +import { TranslateModule } from '@ngx-translate/core'; import { FilterPipeModule } from 'ngx-filter-pipe'; -import { MomentDatePipe } from './pipes/moment-date.pipe'; +import { NgxWhatsNewModule } from 'ngx-whats-new'; +import { MaterialModule } from '../material.module'; +import { HeaderComponent } from './components/'; +import { AboutDialogComponent } from './components/about-dialog/about-dialog.component'; import { ConfirmDialogComponent } from './components/confirm-dialog/confirm-dialog.component'; +import { MomentDatePipe } from './pipes/moment-date.pipe'; @NgModule({ - declarations: [ConfirmDialogComponent, HeaderComponent, MomentDatePipe], + declarations: [ + ConfirmDialogComponent, + HeaderComponent, + MomentDatePipe, + AboutDialogComponent, + ], imports: [ CommonModule, FilterPipeModule, FlexLayoutModule, FormsModule, MaterialModule, + NgxWhatsNewModule, ReactiveFormsModule, TranslateModule, ], @@ -27,6 +35,7 @@ import { ConfirmDialogComponent } from './components/confirm-dialog/confirm-dial FormsModule, HeaderComponent, MaterialModule, + NgxWhatsNewModule, MomentDatePipe, ReactiveFormsModule, TranslateModule,