Services

src/app/app-routing.module.ts

@@ -16,7 +16,7 @@ import { PasswordResetComponent } from './pages/password-reset/password-reset.co
 import { AccountComponent } from './pages/account/account.component';
 import { RegisterComponent } from './pages/register/register.component';
 import { TokensComponent } from './pages/tokens/tokens.component';
-import { AppsComponent } from './pages/apps/apps.component';
+import { ServicesComponent } from './pages/services/services.component';
 import { InfoComponent } from './pages/account/info/info.component';
 import { ProfileComponent } from './pages/account/profile/profile.component';
 import { VoucherComponent } from './pages/account/voucher/voucher.component';
@@ -43,7 +43,7 @@ const routes: Routes = [
   { path: 'external-login/totp', component: FormLoginTotpComponent, canActivate: [AnonymousGuard] },
   { path: 'password', component: PasswordComponent, canActivate: [AnonymousGuard] },
   { path: 'password-reset', component: PasswordResetComponent, canActivate: [AnonymousGuard] },
-  { path: 'apps', component: AppsComponent, canActivate: [AuthenticatedGuard] },
+  { path: 'services', component: ServicesComponent, canActivate: [AuthenticatedGuard] },
   {
     path: 'account', component: AccountComponent, canActivate: [AuthenticatedGuard], children: [
 

src/app/app.component.html

@@ -30,8 +30,8 @@
       <a *ngIf="auth && auth.authenticated" routerLink="/account/info" routerLinkActive="active" mat-list-item>
         <mat-icon>account_circle</mat-icon> {{'account' | i18n}}
       </a>
-      <a *ngIf="auth && auth.authenticated" routerLink="/apps" routerLinkActive="active" mat-list-item>
-        <mat-icon>widgets</mat-icon> {{'apps' | i18n}}
+      <a *ngIf="auth && auth.authenticated" routerLink="/services" routerLinkActive="active" mat-list-item>
+        <mat-icon>widgets</mat-icon> {{'services' | i18n}}
       </a>
       <a routerLink="/tokens" mat-list-item>
         <mat-icon>card_giftcard</mat-icon> {{'tokens.redeem' | i18n}}

src/app/app.module.ts

@@ -15,7 +15,7 @@ import {HomeGeneralComponent} from './pages/home/general/home-general.component'
 import {HomePrivacyComponent} from './pages/home/privacy/home-privacy.component';
 import {HomeServicesComponent} from './pages/home/services/home-services.component';
 import {AccountComponent} from './pages/account/account.component';
-import {AppsComponent} from './pages/apps/apps.component';
+import {ServicesComponent} from './pages/services/services.component';
 import {AppComponent} from './app.component';
 import {LoginComponent} from './pages/login/login.component';
 import {LoginTotpComponent} from './pages/login-totp/login-totp.component';
@@ -72,7 +72,7 @@ export class XhrInterceptor implements HttpInterceptor {
     FormLoginComponent,
     FormLoginTotpComponent,
     TokensComponent,
-    AppsComponent,
+    ServicesComponent,
     PermissionsComponent,
     ProfileFieldsComponent, ProfileFieldDialog, ProfileFieldBlob,
     QuotasComponent,

src/app/pages/apps/apps.component.html

@@ -1,17 +0,0 @@
-<h3>{{'apps' | i18n}}</h3>
-
-<mat-card *ngFor="let app of apps">
-    <mat-card-header>
-        <mat-icon>{{'apps.' + app.name + '.icon' | i18n}}</mat-icon>
-        <mat-card-title>{{'apps.' + app.name + '.title'  | i18n}}</mat-card-title>
-        <mat-card-subtitle>{{'apps.' + app.name + '.subtitle' | i18n}}</mat-card-subtitle>
-    </mat-card-header>
-    <mat-card-content>
-        <p>
-            {{ 'apps.' + app.name + '.text'  | i18n}}
-        </p>
-    </mat-card-content>
-    <mat-card-actions>
-        <a href="{{app.url}}" target="_blank" mat-raised-button color="primary">{{'apps.goto'  | i18n}}</a>
-    </mat-card-actions>
-</mat-card>

src/app/pages/apps/apps.component.ts

@@ -1,21 +0,0 @@
-import { Component, OnInit, Input } from '@angular/core';
-import { AppService } from './../../services/app.service';
-
-@Component({
-  selector: 'app-apps',
-  templateUrl: './apps.component.html',
-  styleUrls: ['./apps.component.scss']
-})
-export class AppsComponent implements OnInit {
-
-  apps = [];
-
-  constructor(private appService: AppService) { }
-
-  ngOnInit(): void {
-    this.appService.apps().subscribe((data: any) => {
-      this.apps = data;
-    })
-  }
-
-}

src/app/pages/login/login.component.ts

@@ -15,7 +15,7 @@ export class LoginComponent implements OnInit {
   form: FormGroup;
   public loginInvalid: boolean;
   public apiUrl = environment.apiUrl;
-  targetRoute = '/apps';
+  targetRoute = '/services';
   loginModel = {};
 
   constructor(private formBuilder: FormBuilder, private authService: AuthService, private router: Router, private route: ActivatedRoute) { }

src/app/pages/services/services.component.html

@@ -0,0 +1,17 @@
+<h3>{{'services' | i18n}}</h3>
+
+<mat-card *ngFor="let service of services">
+    <mat-card-header>
+        <mat-icon>{{'services.' + service.name + '.icon' | i18n}}</mat-icon>
+        <mat-card-title>{{'services.' + service.name + '.title'  | i18n}}</mat-card-title>
+        <mat-card-subtitle>{{'services.' + service.name + '.subtitle' | i18n}}</mat-card-subtitle>
+    </mat-card-header>
+    <mat-card-content>
+        <p>
+            {{ 'services.' + service.name + '.text'  | i18n}}
+        </p>
+    </mat-card-content>
+    <mat-card-actions>
+        <a href="{{service.url}}" target="_blank" mat-raised-button color="primary">{{'services.goto'  | i18n}}</a>
+    </mat-card-actions>
+</mat-card>

src/app/pages/services/services.component.spec.ts

@@ -1,20 +1,20 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
 
-import { AppsComponent } from './apps.component';
+import { ServicesComponent } from './services.component';
 
-describe('AppsComponent', () => {
-  let component: AppsComponent;
-  let fixture: ComponentFixture<AppsComponent>;
+describe('ServicesComponent', () => {
+  let component: ServicesComponent;
+  let fixture: ComponentFixture<ServicesComponent>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [ AppsComponent ]
+      declarations: [ ServicesComponent ]
     })
     .compileComponents();
   });
 
   beforeEach(() => {
-    fixture = TestBed.createComponent(AppsComponent);
+    fixture = TestBed.createComponent(ServicesComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
   });

src/app/pages/services/services.component.ts

@@ -0,0 +1,21 @@
+import { Component, OnInit, Input } from '@angular/core';
+import { ServiceService } from '../../services/service.service';
+
+@Component({
+  selector: 'app-services',
+  templateUrl: './services.component.html',
+  styleUrls: ['./services.component.scss']
+})
+export class ServicesComponent implements OnInit {
+
+  services = [];
+
+  constructor(private serviceService: ServiceService) { }
+
+  ngOnInit(): void {
+    this.serviceService.services().subscribe((data: any) => {
+      this.services = data;
+    })
+  }
+
+}

src/app/services/service.service.ts

@@ -6,13 +6,13 @@ import { environment } from '../../environments/environment';
 @Injectable({
     providedIn: 'root',
 })
-export class AppService {
+export class ServiceService {
 
     constructor(private http: HttpClient) {
     }
 
-    apps() {
-        return this.http.get(environment.apiUrl + "/apps");
+    services() {
+        return this.http.get(environment.apiUrl + "/services");
     }
 
 }

src/app/ui/permissions/permissions.component.html

@@ -2,11 +2,11 @@
     <ng-container matColumnDef="name">
         <th mat-header-cell *matHeaderCellDef mat-sort-header="name"> {{'permissions.name' | i18n}} </th>
         <td mat-cell *matCellDef="let permission">
-            <mat-icon inline=true>{{'apps.' + permission.name + '.icon' | i18n}}</mat-icon>
-            {{'apps.' + permission.name + '.title' | i18n}}
+            <mat-icon inline=true>{{'services.' + permission.name + '.icon' | i18n}}</mat-icon>
+            {{'services.' + permission.name + '.title' | i18n}}
             <mat-icon *ngIf="permission.addon">add_circle</mat-icon>
             <br>
-            <small>{{'apps.' + permission.name + '.subtitle' | i18n}}</small>
+            <small>{{'services.' + permission.name + '.subtitle' | i18n}}</small>
         </td>
     </ng-container>
 

src/app/ui/permissions/permissions.component.ts

@@ -29,7 +29,7 @@ export class PermissionsComponent implements OnInit {
     this.permissions = data.sort((a, b) => {
       const isAsc = sort.direction === 'asc';
       switch(sort.active) {
-        case 'name': return this.compare(this.i18n.get('apps.' + a.name + '.title', []), this.i18n.get('apps.' + b.name + '.title', []), isAsc);
+        case 'name': return this.compare(this.i18n.get('services.' + a.name + '.title', []), this.i18n.get('services.' + b.name + '.title', []), isAsc);
         case 'starts': return this.compare(a.starts, b.starts, isAsc);
         case 'expires': return this.compare(a.expires, b.expires, isAsc);
         default: return 0;

src/app/ui/quotas/quotas.component.html

@@ -3,8 +3,8 @@
     <ng-container matColumnDef="name">
         <th mat-header-cell *matHeaderCellDef mat-sort-header="name"> {{'quotas.name' | i18n}} </th>
         <td mat-cell *matCellDef="let quota">
-            <mat-icon inline=true>{{'apps.' + quota.name + '.icon' | i18n}}</mat-icon>
-            {{'apps.' + quota.name + '.title' | i18n}}
+            <mat-icon inline=true>{{'services.' + quota.name + '.icon' | i18n}}</mat-icon>
+            {{'services.' + quota.name + '.title' | i18n}}
         </td>
     </ng-container>
 

src/app/ui/quotas/quotas.component.ts

@@ -28,7 +28,7 @@ export class QuotasComponent implements OnInit {
     this.quotas = data.sort((a, b) => {
       const isAsc = sort.direction === 'asc';
       switch(sort.active) {
-        case 'name': return this.compare(this.i18n.get('apps.' + a.name + '.title', []), this.i18n.get('apps.' + b.name + '.title', []), isAsc);
+        case 'name': return this.compare(this.i18n.get('services.' + a.name + '.title', []), this.i18n.get('services.' + b.name + '.title', []), isAsc);
         case 'value': return this.compare(a.value, b.value, isAsc);
         default: return 0;
       }