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,