feat(notifications): UX changes to match API endpoint changes.

xmlking · Mar 19, 2019 · f11bbd9 · f11bbd9
1 parent 55e3e71
commit f11bbd9
Show file tree

Hide file tree

Showing 15 changed files with 61 additions and 27 deletions.
diff --git a/apps/api/src/app/notifications/notification/dto/notification-list.model.ts b/apps/api/src/app/notifications/notification/dto/notification-list.model.ts
@@ -1,7 +1,10 @@
 import { IPagination } from '../../../core';
 import { Notification } from '../notification.entity';
+import { ApiModelProperty } from '@nestjs/swagger';
 
 export class NotificationList implements IPagination<Notification> {
+  @ApiModelProperty({ type: Notification, isArray: true })
   readonly items: Notification[];
+  @ApiModelProperty({ type: Number, readOnly: true })
   readonly total: number;
 }
diff --git a/apps/api/src/app/notifications/subscription/dto/subscription-list.model.ts b/apps/api/src/app/notifications/subscription/dto/subscription-list.model.ts
@@ -1,7 +1,10 @@
 import { IPagination } from '../../../core';
 import { Subscription } from '../subscription.entity';
+import { ApiModelProperty } from '@nestjs/swagger';
 
 export class SubscriptionList implements IPagination<Subscription> {
+  @ApiModelProperty({ type: Subscription, isArray: true })
   readonly items: Subscription[];
+  @ApiModelProperty({ type: Number, readOnly: true })
   readonly total: number;
 }
diff --git a/apps/api/src/app/project/cluster/dto/cluster-list.model.ts b/apps/api/src/app/project/cluster/dto/cluster-list.model.ts
@@ -1,7 +1,10 @@
 import { IPagination } from '../../../core';
 import { Cluster } from '../cluster.entity';
+import { ApiModelProperty } from '@nestjs/swagger';
 
 export class ClusterList implements IPagination<Cluster> {
+  @ApiModelProperty({ type: Cluster, isArray: true })
   readonly items: Cluster[];
+  @ApiModelProperty({ type: Number, readOnly: true })
   readonly total: number;
 }
diff --git a/apps/api/src/app/project/dto/project-list.model.ts b/apps/api/src/app/project/dto/project-list.model.ts
@@ -1,7 +1,10 @@
 import { IPagination } from '../../core';
 import { Project } from '../project.entity';
+import { ApiModelProperty } from '@nestjs/swagger';
 
 export class ProjectList implements IPagination<Project> {
+  @ApiModelProperty({ type: Project, isArray: true })
   readonly items: Project[];
+  @ApiModelProperty({ type: Number, readOnly: true })
   readonly total: number;
 }
diff --git a/apps/api/src/app/user/profile/dto/profile-list.model.ts b/apps/api/src/app/user/profile/dto/profile-list.model.ts
@@ -1,7 +1,10 @@
 import { IPagination } from '../../../core'
 import { Profile } from '../profile.entity';
+import { ApiModelProperty } from '@nestjs/swagger';
 
 export class ProfileList implements IPagination<Profile> {
+  @ApiModelProperty({ type: Profile, isArray: true })
   readonly items: Profile[];
+  @ApiModelProperty({ type: Number, readOnly: true })
   readonly total: number;
 }
diff --git a/apps/webapp/src/assets/data/notifications.json b/apps/webapp/src/assets/data/notifications.json
@@ -1,5 +1,5 @@
-[
-  [
+{
+  "items": [
     {
       "id": 9,
       "title": "title for sumo3 2",
@@ -127,5 +127,5 @@
       "updatedAt": "2018-12-09T06:00:41.401Z"
     }
   ],
-  9
-]
+  "total": 9
+}
diff --git a/apps/webapp/src/assets/data/notifications.user.json b/apps/webapp/src/assets/data/notifications.user.json
@@ -1,5 +1,5 @@
-[
-  [
+{
+  "items": [
     {
       "id": 9,
       "title": "title for sumo3 2",
@@ -71,5 +71,5 @@
       "updatedAt": "2018-12-09T06:00:41.401Z"
     }
   ],
-  5
-]
+  "total": 9
+}
diff --git a/apps/webapp/src/assets/data/subscription.json b/apps/webapp/src/assets/data/subscription.json
@@ -1,5 +1,5 @@
-[
-  [
+{
+  "items": [
     {
       "id": 13,
       "endpoint": "https://fcm.googleapis.com/fcm/send/c8eq7G-b2mc:APA91bFp2Gof...",
@@ -11,5 +11,5 @@
       "updatedAt": "2018-11-21T18:50:45.325Z"
     }
   ],
-  1
-]
+  "total": 1
+}
diff --git a/libs/admin/src/lib/services/notification.service.ts b/libs/admin/src/lib/services/notification.service.ts
@@ -1,8 +1,8 @@
 import { Injectable } from '@angular/core';
-import { HttpClient } from '@angular/common/http';
+import { HttpClient, HttpParams } from '@angular/common/http';
 import { Observable } from 'rxjs';
 import { catchError, finalize, map, retry } from 'rxjs/operators';
-import { EntityService } from '@ngx-starter-kit/shared';
+import { EntityService, IPagination } from '@ngx-starter-kit/shared';
 import { environment } from '@env/environment';
 import { AppNotification } from '@ngx-starter-kit/notifications';
 
@@ -19,13 +19,14 @@ export class NotificationService extends EntityService<AppNotification> {
   }
 
   getAll(): Observable<AppNotification[]> {
+    const params = new HttpParams().set('order', 'ASC').set('read', 'false');
     this.loadingSubject.next(true);
-    return this.httpClient.get<[AppNotification[], number]>(`${this.baseUrl}/${this.entityPath}`).pipe(
+    return this.httpClient.get<IPagination<AppNotification>>(`${this.baseUrl}/${this.entityPath}`, { params }).pipe(
       retry(3), // retry a failed request up to 3 times
       catchError(this.handleError),
       finalize(() => this.loadingSubject.next(false)),
       // return without count
-      map(data => data[0]),
+      map(data => data.items),
     );
   }
 

diff --git a/libs/admin/src/lib/services/subscription.service.ts b/libs/admin/src/lib/services/subscription.service.ts
@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
 import { catchError, finalize, map, retry } from 'rxjs/operators';
-import { EntityService } from '@ngx-starter-kit/shared';
+import { EntityService, IPagination } from '@ngx-starter-kit/shared';
 import { environment } from '@env/environment';
 import { Subscription } from '../models/subscription.model';
 
@@ -20,12 +20,12 @@ export class SubscriptionService extends EntityService<Subscription> {
 
   getAll(): Observable<Subscription[]> {
     this.loadingSubject.next(true);
-    return this.httpClient.get<[Subscription[], number]>(`${this.baseUrl}/${this.entityPath}`).pipe(
+    return this.httpClient.get<IPagination<Subscription>>(`${this.baseUrl}/${this.entityPath}`).pipe(
       retry(3), // retry a failed request up to 3 times
       catchError(this.handleError),
       finalize(() => this.loadingSubject.next(false)),
       // return without count
-      map(data => data[0]),
+      map(data => data.items),
     );
   }
 }
diff --git a/libs/core/src/lib/services/in-memory-data.service.ts b/libs/core/src/lib/services/in-memory-data.service.ts
@@ -48,7 +48,7 @@ export class InMemoryDataService implements InMemoryDbService {
 
   parseRequestUrl(url: string, utils: RequestInfoUtilities): ParsedRequestUrl {
     const newUrl = url
-      .replace(/\/notifications\/user/, '/notifications')
+      .replace(/\/notifications\/own/, '/notifications')
       .replace(/\/datapower\/serviceproxy/, '/serviceproxy')
       .replace(/\/nas\/cluster/, '/cluster')
       .replace(/\/layer7\/my.cnf/, '/mycnf');

diff --git a/libs/notifications/src/lib/notifications.service.ts b/libs/notifications/src/lib/notifications.service.ts
@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { environment } from '@env/environment';
 import { AppNotification } from './app-notification.model';
-import { EntityService } from '@ngx-starter-kit/shared';
+import { EntityService, IPagination } from '@ngx-starter-kit/shared';
 import { Observable } from 'rxjs';
 import { catchError, finalize, map, retry } from 'rxjs/operators';
 import { BrowserFeatureKey, FeatureService } from '@ngx-starter-kit/core';
@@ -20,12 +20,12 @@ export class NotificationsService extends EntityService<AppNotification> {
 
   getAll(): Observable<AppNotification[]> {
     this.loadingSubject.next(true);
-    return this.httpClient.get<[AppNotification[], number]>(`${this.baseUrl}/${this.entityPath}/user`).pipe(
+    return this.httpClient.get<IPagination<AppNotification>>(`${this.baseUrl}/${this.entityPath}/own`).pipe(
       retry(3), // retry a failed request up to 3 times
       catchError(this.handleError),
       finalize(() => this.loadingSubject.next(false)),
       // return without count
-      map(data => data[0]),
+      map(data => data.items),
     );
   }
 

diff --git a/libs/shared/src/index.ts b/libs/shared/src/index.ts
@@ -7,3 +7,4 @@ export * from './lib/containers/entity/entity-form.component';
 export * from './lib/containers/entity/entity.component';
 export * from './lib/containers/entity/entity.service';
 export * from './lib/containers/entity/entity.model';
+export * from './lib/containers/entity/pagination';
diff --git a/libs/shared/src/lib/containers/entity/entity.service.ts b/libs/shared/src/lib/containers/entity/entity.service.ts
@@ -4,6 +4,7 @@ import { environment } from '@env/environment';
 import { Entity } from './entity.model';
 import { catchError, finalize, retry } from 'rxjs/operators';
 import { format } from 'date-fns/esm';
+import { IPagination } from './pagination';
 
 export interface Filter {
   [name: string]: string | string[];
@@ -26,15 +27,16 @@ export abstract class EntityService<T extends Entity> {
     );
   }
 
-  findAll(filter: Filter, sortOrder = 'asc', pageNumber = 0, pageSize = 100): Observable<T[]> | Observable<never> {
+    // findAll(filter: Filter, order = 'DESC', skip = 0, take = 100): Observable<IPagination<T>> | Observable<never> {
+    findAll(filter: Filter, order = 'DESC', skip = 0, take = 100): Observable<T[]> | Observable<never> {
     this.loadingSubject.next(true);
     return this.httpClient
       .get<T[]>(`${this.baseUrl}/${this.entityPath}`, {
         params: new HttpParams()
           .set('filter', 'filter TODO')
-          .set('sortOrder', sortOrder)
-          .set('pageNumber', pageNumber.toString())
-          .set('pageSize', pageSize.toString()),
+          .set('order', order)
+          .set('skip', skip.toString())
+          .set('take', take.toString()),
       })
       .pipe(
         retry(3), // retry a failed request up to 3 times
@@ -43,6 +45,7 @@ export abstract class EntityService<T extends Entity> {
       );
   }
 
+  // getAll(): Observable<IPagination<T>> {
   getAll(): Observable<T[]> {
     this.loadingSubject.next(true);
     return this.httpClient.get<T[]>(`${this.baseUrl}/${this.entityPath}`).pipe(

diff --git a/libs/shared/src/lib/containers/entity/pagination.ts b/libs/shared/src/lib/containers/entity/pagination.ts
@@ -0,0 +1,14 @@
+/**
+ * Generic pagination interface
+ */
+export interface IPagination<T> {
+  /**
+   * Items included in the current listing
+   */
+  readonly items: T[];
+
+  /**
+   * Total number of available items
+   */
+  readonly total: number;
+}