From dca9251ca5c14e189ef5967d1ce0f5744eff9042 Mon Sep 17 00:00:00 2001 From: Anton Shubin <2spy4x@gmail.com> Date: Wed, 7 Dec 2022 16:30:11 +0800 Subject: [PATCH] feat(front-admin-users)#131: convert HTML to dumb component --- .../lib/protected/protected.component.html | 6 +- .../detail.component.html} | 0 .../detail.component.spec.ts} | 10 +- .../detail.component.ts} | 5 +- .../lib/list/filters/filters.component.html | 44 +++ .../list/filters/filters.component.spec.ts | 22 ++ .../src/lib/list/filters/filters.component.ts | 58 +++ .../users/src/lib/list/list.component.html | 25 ++ .../list.component.spec.ts} | 12 +- .../users/src/lib/list/list.component.ts | 66 ++++ .../src/lib/list/table/table.component.html | 48 +++ .../lib/list/table/table.component.spec.ts | 22 ++ .../src/lib/list/table/table.component.ts | 22 ++ .../lib/users-list/users-list.component.html | 365 ------------------ .../lib/users-list/users-list.component.ts | 8 - .../front/admin/users/src/lib/users.module.ts | 15 +- libs/front/shared/ui/src/index.ts | 2 + .../ui/src/lib/loading/loading.component.html | 9 + .../src/lib/loading/loading.component.spec.ts | 22 ++ .../ui/src/lib/loading/loading.component.ts | 16 + .../lib/pagination/pagination.component.html | 68 ++++ .../pagination/pagination.component.spec.ts | 22 ++ .../lib/pagination/pagination.component.ts | 48 +++ libs/front/shared/ui/src/lib/ui.module.ts | 21 +- libs/shared/constants/src/index.ts | 1 + libs/shared/constants/src/lib/numbers.ts | 2 + libs/shared/constants/src/lib/time.ts | 3 + libs/shared/mock-data/src/lib/users.mock.ts | 53 +-- package.json | 1 + yarn.lock | 7 + 30 files changed, 570 insertions(+), 433 deletions(-) rename libs/front/admin/users/src/lib/{user-details/user-details.component.html => detail/detail.component.html} (100%) rename libs/front/admin/users/src/lib/{user-details/user-details.component.spec.ts => detail/detail.component.spec.ts} (58%) rename libs/front/admin/users/src/lib/{user-details/user-details.component.ts => detail/detail.component.ts} (70%) create mode 100644 libs/front/admin/users/src/lib/list/filters/filters.component.html create mode 100644 libs/front/admin/users/src/lib/list/filters/filters.component.spec.ts create mode 100644 libs/front/admin/users/src/lib/list/filters/filters.component.ts create mode 100644 libs/front/admin/users/src/lib/list/list.component.html rename libs/front/admin/users/src/lib/{users-list/users-list.component.spec.ts => list/list.component.spec.ts} (54%) create mode 100644 libs/front/admin/users/src/lib/list/list.component.ts create mode 100644 libs/front/admin/users/src/lib/list/table/table.component.html create mode 100644 libs/front/admin/users/src/lib/list/table/table.component.spec.ts create mode 100644 libs/front/admin/users/src/lib/list/table/table.component.ts delete mode 100644 libs/front/admin/users/src/lib/users-list/users-list.component.html delete mode 100644 libs/front/admin/users/src/lib/users-list/users-list.component.ts create mode 100644 libs/front/shared/ui/src/lib/loading/loading.component.html create mode 100644 libs/front/shared/ui/src/lib/loading/loading.component.spec.ts create mode 100644 libs/front/shared/ui/src/lib/loading/loading.component.ts create mode 100644 libs/front/shared/ui/src/lib/pagination/pagination.component.html create mode 100644 libs/front/shared/ui/src/lib/pagination/pagination.component.spec.ts create mode 100644 libs/front/shared/ui/src/lib/pagination/pagination.component.ts create mode 100644 libs/shared/constants/src/lib/time.ts diff --git a/libs/front/admin/core/src/lib/protected/protected.component.html b/libs/front/admin/core/src/lib/protected/protected.component.html index c33d794..b5e312e 100644 --- a/libs/front/admin/core/src/lib/protected/protected.component.html +++ b/libs/front/admin/core/src/lib/protected/protected.component.html @@ -1,4 +1,4 @@ -
+
-
+
-
+
diff --git a/libs/front/admin/users/src/lib/user-details/user-details.component.html b/libs/front/admin/users/src/lib/detail/detail.component.html similarity index 100% rename from libs/front/admin/users/src/lib/user-details/user-details.component.html rename to libs/front/admin/users/src/lib/detail/detail.component.html diff --git a/libs/front/admin/users/src/lib/user-details/user-details.component.spec.ts b/libs/front/admin/users/src/lib/detail/detail.component.spec.ts similarity index 58% rename from libs/front/admin/users/src/lib/user-details/user-details.component.spec.ts rename to libs/front/admin/users/src/lib/detail/detail.component.spec.ts index a33696a..5a33975 100644 --- a/libs/front/admin/users/src/lib/user-details/user-details.component.spec.ts +++ b/libs/front/admin/users/src/lib/detail/detail.component.spec.ts @@ -1,17 +1,17 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { UserDetailsComponent } from './user-details.component'; +import { DetailComponent } from './detail.component'; describe('UserDetailsComponent', () => { - let component: UserDetailsComponent; - let fixture: ComponentFixture; + let component: DetailComponent; + let fixture: ComponentFixture; beforeEach(async () => { await TestBed.configureTestingModule({ - declarations: [UserDetailsComponent], + declarations: [DetailComponent], }).compileComponents(); - fixture = TestBed.createComponent(UserDetailsComponent); + fixture = TestBed.createComponent(DetailComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/libs/front/admin/users/src/lib/user-details/user-details.component.ts b/libs/front/admin/users/src/lib/detail/detail.component.ts similarity index 70% rename from libs/front/admin/users/src/lib/user-details/user-details.component.ts rename to libs/front/admin/users/src/lib/detail/detail.component.ts index b137eb3..ecf28d7 100644 --- a/libs/front/admin/users/src/lib/user-details/user-details.component.ts +++ b/libs/front/admin/users/src/lib/detail/detail.component.ts @@ -2,9 +2,8 @@ import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/ @Component({ selector: 'seed-admin-users-details', - templateUrl: './user-details.component.html', - styles: [], + templateUrl: './detail.component.html', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, }) -export class UserDetailsComponent {} +export class DetailComponent {} diff --git a/libs/front/admin/users/src/lib/list/filters/filters.component.html b/libs/front/admin/users/src/lib/list/filters/filters.component.html new file mode 100644 index 0000000..6d8d15d --- /dev/null +++ b/libs/front/admin/users/src/lib/list/filters/filters.component.html @@ -0,0 +1,44 @@ + +
+ +
+ + +
+ + + +
diff --git a/libs/front/admin/users/src/lib/list/filters/filters.component.spec.ts b/libs/front/admin/users/src/lib/list/filters/filters.component.spec.ts new file mode 100644 index 0000000..435e3b7 --- /dev/null +++ b/libs/front/admin/users/src/lib/list/filters/filters.component.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { FiltersComponent } from './filters.component'; + +describe('FiltersComponent', () => { + let component: FiltersComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [FiltersComponent], + }).compileComponents(); + + fixture = TestBed.createComponent(FiltersComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/libs/front/admin/users/src/lib/list/filters/filters.component.ts b/libs/front/admin/users/src/lib/list/filters/filters.component.ts new file mode 100644 index 0000000..5150489 --- /dev/null +++ b/libs/front/admin/users/src/lib/list/filters/filters.component.ts @@ -0,0 +1,58 @@ +import { + ChangeDetectionStrategy, + Component, + EventEmitter, + Input, + OnChanges, + OnInit, + Output, + SimpleChanges, +} from '@angular/core'; +import { UserRole } from '@prisma/client'; +import { FormControl } from '@angular/forms'; +import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy'; +import { ZERO } from '@seed/shared/constants'; + +@UntilDestroy() +@Component({ + selector: 'seed-admin-users-filters', + templateUrl: './filters.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class FiltersComponent implements OnInit, OnChanges { + UserRole = UserRole; + + roleTitles = [ + { value: UserRole.USER, title: 'Users' }, + { value: UserRole.ADMIN, title: 'Admins' }, + { value: UserRole.MODERATOR, title: 'Moderators' }, + ]; + + @Input() isLoading = true; + + @Input() role: UserRole = UserRole.USER; + + @Input() total = ZERO; + + @Output() roleChange = new EventEmitter(); + + tabControl = new FormControl(this.role); + + ngOnInit(): void { + this.tabControl.valueChanges.pipe(untilDestroyed(this)).subscribe(role => { + this.changeRole(role as UserRole); + }); + } + + ngOnChanges(changes: SimpleChanges): void { + if (changes['role'].currentValue !== changes['role'].previousValue) { + this.tabControl.setValue(this.role); + } + } + + changeRole(role: UserRole): void { + if (role !== this.role) { + this.roleChange.emit(role); + } + } +} diff --git a/libs/front/admin/users/src/lib/list/list.component.html b/libs/front/admin/users/src/lib/list/list.component.html new file mode 100644 index 0000000..33244e6 --- /dev/null +++ b/libs/front/admin/users/src/lib/list/list.component.html @@ -0,0 +1,25 @@ +
+ +
+ +
+
+ + + +
diff --git a/libs/front/admin/users/src/lib/users-list/users-list.component.spec.ts b/libs/front/admin/users/src/lib/list/list.component.spec.ts similarity index 54% rename from libs/front/admin/users/src/lib/users-list/users-list.component.spec.ts rename to libs/front/admin/users/src/lib/list/list.component.spec.ts index 8670ae9..24e41be 100644 --- a/libs/front/admin/users/src/lib/users-list/users-list.component.spec.ts +++ b/libs/front/admin/users/src/lib/list/list.component.spec.ts @@ -1,19 +1,19 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { UsersListComponent } from './users-list.component'; +import { ListComponent } from './list.component'; -describe(UsersListComponent.name, () => { - let component: UsersListComponent; - let fixture: ComponentFixture; +describe(ListComponent.name, () => { + let component: ListComponent; + let fixture: ComponentFixture; beforeEach(async () => { await TestBed.configureTestingModule({ - declarations: [UsersListComponent], + declarations: [ListComponent], }).compileComponents(); }); beforeEach(() => { - fixture = TestBed.createComponent(UsersListComponent); + fixture = TestBed.createComponent(ListComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/libs/front/admin/users/src/lib/list/list.component.ts b/libs/front/admin/users/src/lib/list/list.component.ts new file mode 100644 index 0000000..fde57e3 --- /dev/null +++ b/libs/front/admin/users/src/lib/list/list.component.ts @@ -0,0 +1,66 @@ +import { ChangeDetectionStrategy, Component, OnInit, ViewEncapsulation } from '@angular/core'; +import { User, UserRole } from '@prisma/client'; +import { BehaviorSubject } from 'rxjs'; +import { mockUsers } from '@seed/shared/mock-data'; +import { ONE, PAGINATION_DEFAULTS, THOUSAND, ZERO } from '@seed/shared/constants'; + +@Component({ + selector: 'seed-admin-users-list', + templateUrl: './list.component.html', + encapsulation: ViewEncapsulation.None, + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class ListComponent implements OnInit { + users$ = new BehaviorSubject([]); + + isLoading$ = new BehaviorSubject(true); + + page$ = new BehaviorSubject(ONE); + + total$ = new BehaviorSubject(ZERO); + + limit$ = new BehaviorSubject(PAGINATION_DEFAULTS.limit); + + role$ = new BehaviorSubject(UserRole.USER); + + ngOnInit(): void { + setTimeout(() => { + const allUsersOfThisRole = mockUsers.filter(user => user.role === this.role$.value); + const users = allUsersOfThisRole.slice( + (this.page$.value - ONE) * this.limit$.value, + this.page$.value * this.limit$.value, + ); + this.users$.next(users); + this.isLoading$.next(false); + this.page$.next(ONE); + this.total$.next(allUsersOfThisRole.length); + }, THOUSAND); + } + + onPageChange(page: number): void { + this.isLoading$.next(true); + setTimeout(() => { + const allUsersOfThisRole = mockUsers.filter(user => user.role === this.role$.value); + const users = allUsersOfThisRole.slice((page - ONE) * this.limit$.value, page * this.limit$.value); + this.page$.next(page); + this.users$.next(users); + this.isLoading$.next(false); + }, THOUSAND); + } + + onRoleChange(role: UserRole): void { + this.isLoading$.next(true); + this.role$.next(role); + setTimeout(() => { + this.page$.next(ONE); + const allUsersOfThisRole = mockUsers.filter(user => user.role === this.role$.value); + const users = allUsersOfThisRole.slice( + (this.page$.value - ONE) * this.limit$.value, + this.page$.value * this.limit$.value, + ); + this.users$.next(users); + this.total$.next(allUsersOfThisRole.length); + this.isLoading$.next(false); + }, THOUSAND); + } +} diff --git a/libs/front/admin/users/src/lib/list/table/table.component.html b/libs/front/admin/users/src/lib/list/table/table.component.html new file mode 100644 index 0000000..ec8ebfc --- /dev/null +++ b/libs/front/admin/users/src/lib/list/table/table.component.html @@ -0,0 +1,48 @@ +
+
+ +

No users yet.

+
+
+ + diff --git a/libs/front/admin/users/src/lib/list/table/table.component.spec.ts b/libs/front/admin/users/src/lib/list/table/table.component.spec.ts new file mode 100644 index 0000000..28e2f02 --- /dev/null +++ b/libs/front/admin/users/src/lib/list/table/table.component.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { TableComponent } from './table.component'; + +describe('TableComponent', () => { + let component: TableComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [TableComponent], + }).compileComponents(); + + fixture = TestBed.createComponent(TableComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/libs/front/admin/users/src/lib/list/table/table.component.ts b/libs/front/admin/users/src/lib/list/table/table.component.ts new file mode 100644 index 0000000..b0b5d28 --- /dev/null +++ b/libs/front/admin/users/src/lib/list/table/table.component.ts @@ -0,0 +1,22 @@ +import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; +import { User } from '@prisma/client'; +import { dateFormat, dateTimeFormat } from '@seed/shared/constants'; + +@Component({ + selector: 'seed-admin-users-table', + templateUrl: './table.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class TableComponent { + @Input() users: User[] = []; + + @Input() isLoading = true; + + dateFormat = dateFormat; + + dateTimeFormat = dateTimeFormat; + + trackByFn(_index: number, item: User): string { + return item.id; + } +} diff --git a/libs/front/admin/users/src/lib/users-list/users-list.component.html b/libs/front/admin/users/src/lib/users-list/users-list.component.html deleted file mode 100644 index 1153a28..0000000 --- a/libs/front/admin/users/src/lib/users-list/users-list.component.html +++ /dev/null @@ -1,365 +0,0 @@ -
- -
-
- - - -
- -
- - - - - - -
diff --git a/libs/front/admin/users/src/lib/users-list/users-list.component.ts b/libs/front/admin/users/src/lib/users-list/users-list.component.ts deleted file mode 100644 index 22c1d54..0000000 --- a/libs/front/admin/users/src/lib/users-list/users-list.component.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { ChangeDetectionStrategy, Component } from '@angular/core'; - -@Component({ - selector: 'seed-admin-users-list', - templateUrl: './users-list.component.html', - changeDetection: ChangeDetectionStrategy.OnPush, -}) -export class UsersListComponent {} diff --git a/libs/front/admin/users/src/lib/users.module.ts b/libs/front/admin/users/src/lib/users.module.ts index f1087b3..f5eaa38 100644 --- a/libs/front/admin/users/src/lib/users.module.ts +++ b/libs/front/admin/users/src/lib/users.module.ts @@ -1,17 +1,20 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { Route, RouterModule } from '@angular/router'; -import { UsersListComponent } from './users-list/users-list.component'; -import { UserDetailsComponent } from './user-details/user-details.component'; +import { ListComponent } from './list/list.component'; +import { DetailComponent } from './detail/detail.component'; +import { TableComponent } from './list/table/table.component'; +import { FiltersComponent } from './list/filters/filters.component'; +import { SharedUIModule } from '@seed/front/shared/ui'; export const routes: Route[] = [ { path: '', - component: UsersListComponent, + component: ListComponent, }, { path: ':id', - component: UserDetailsComponent, + component: DetailComponent, }, { path: '**', @@ -19,7 +22,7 @@ export const routes: Route[] = [ }, ]; @NgModule({ - imports: [CommonModule, RouterModule.forChild(routes)], - declarations: [UsersListComponent, UserDetailsComponent], + imports: [CommonModule, RouterModule.forChild(routes), SharedUIModule], + declarations: [ListComponent, DetailComponent, TableComponent, FiltersComponent], }) export class UsersModule {} diff --git a/libs/front/shared/ui/src/index.ts b/libs/front/shared/ui/src/index.ts index f10792c..da071c2 100644 --- a/libs/front/shared/ui/src/index.ts +++ b/libs/front/shared/ui/src/index.ts @@ -2,3 +2,5 @@ export * from './lib/ui.module'; export * from './lib/button/button.component'; export * from './lib/input/input.component'; export * from './lib/separator/separator.component'; + +export * from './lib/loading/loading.component'; diff --git a/libs/front/shared/ui/src/lib/loading/loading.component.html b/libs/front/shared/ui/src/lib/loading/loading.component.html new file mode 100644 index 0000000..bfac0b6 --- /dev/null +++ b/libs/front/shared/ui/src/lib/loading/loading.component.html @@ -0,0 +1,9 @@ + + + + +{{ text }} diff --git a/libs/front/shared/ui/src/lib/loading/loading.component.spec.ts b/libs/front/shared/ui/src/lib/loading/loading.component.spec.ts new file mode 100644 index 0000000..1f6da19 --- /dev/null +++ b/libs/front/shared/ui/src/lib/loading/loading.component.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { LoadingComponent } from './loading.component'; + +describe('LoadingComponent', () => { + let component: LoadingComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [LoadingComponent], + }).compileComponents(); + + fixture = TestBed.createComponent(LoadingComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/libs/front/shared/ui/src/lib/loading/loading.component.ts b/libs/front/shared/ui/src/lib/loading/loading.component.ts new file mode 100644 index 0000000..d844b6f --- /dev/null +++ b/libs/front/shared/ui/src/lib/loading/loading.component.ts @@ -0,0 +1,16 @@ +import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core'; + +@Component({ + /* eslint-disable-next-line @angular-eslint/component-selector */ + selector: 'div[seed-loading]', + templateUrl: './loading.component.html', + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class LoadingComponent { + @Input() text = 'Loading'; + + @HostBinding('class') class = + 'flex h-full w-full items-center justify-center gap-1 bg-gray-100/50 text-lg text-sky-400'; + + @HostBinding('attr.data-e2e') e2e = 'loading'; +} diff --git a/libs/front/shared/ui/src/lib/pagination/pagination.component.html b/libs/front/shared/ui/src/lib/pagination/pagination.component.html new file mode 100644 index 0000000..b3f2551 --- /dev/null +++ b/libs/front/shared/ui/src/lib/pagination/pagination.component.html @@ -0,0 +1,68 @@ + diff --git a/libs/front/shared/ui/src/lib/pagination/pagination.component.spec.ts b/libs/front/shared/ui/src/lib/pagination/pagination.component.spec.ts new file mode 100644 index 0000000..363d9ce --- /dev/null +++ b/libs/front/shared/ui/src/lib/pagination/pagination.component.spec.ts @@ -0,0 +1,22 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { PaginationComponent } from './pagination.component'; + +describe('PaginationComponent', () => { + let component: PaginationComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [PaginationComponent], + }).compileComponents(); + + fixture = TestBed.createComponent(PaginationComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/libs/front/shared/ui/src/lib/pagination/pagination.component.ts b/libs/front/shared/ui/src/lib/pagination/pagination.component.ts new file mode 100644 index 0000000..fb86bf8 --- /dev/null +++ b/libs/front/shared/ui/src/lib/pagination/pagination.component.ts @@ -0,0 +1,48 @@ +import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core'; +import { ONE, TWO, ZERO } from '@seed/shared/constants'; + +@Component({ + selector: 'seed-pagination', + templateUrl: './pagination.component.html', + encapsulation: ViewEncapsulation.None, + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class PaginationComponent { + @Input() total = ZERO; + + @Input() limit = ZERO; + + @Input() page = ZERO; + + @Input() isLoading = true; + + @Output() pageChange = new EventEmitter(); + + getTotalPages(): number { + return Math.ceil(this.total / this.limit); + } + + prevPage(): void { + this.setPage(this.page - ONE); + } + + nextPage(): void { + this.setPage(this.page + ONE); + } + + setPage(page: number): void { + this.pageChange.emit(page); + } + + getPages(): number[] { + // TODO: make it "1 ... 5 _6_ 7 ... 10" + const pages = []; + const totalPages = this.getTotalPages(); + const start = Math.max(this.page - TWO, ONE); + const end = Math.min(this.page + TWO, totalPages); + for (let i = start; i <= end; i++) { + pages.push(i); + } + return pages; + } +} diff --git a/libs/front/shared/ui/src/lib/ui.module.ts b/libs/front/shared/ui/src/lib/ui.module.ts index b404e7c..bb13fd1 100644 --- a/libs/front/shared/ui/src/lib/ui.module.ts +++ b/libs/front/shared/ui/src/lib/ui.module.ts @@ -5,10 +5,27 @@ import { ReactiveFormsModule } from '@angular/forms'; import { ButtonComponent } from './button/button.component'; import { SeparatorComponent } from './separator/separator.component'; import { AlertComponent } from './alert/alert.component'; +import { PaginationComponent } from './pagination/pagination.component'; +import { LoadingComponent } from './loading/loading.component'; @NgModule({ imports: [CommonModule, ReactiveFormsModule], - declarations: [InputComponent, ButtonComponent, SeparatorComponent, AlertComponent], - exports: [InputComponent, ButtonComponent, SeparatorComponent, AlertComponent], + declarations: [ + InputComponent, + ButtonComponent, + SeparatorComponent, + AlertComponent, + PaginationComponent, + LoadingComponent, + ], + exports: [ + ReactiveFormsModule, + InputComponent, + ButtonComponent, + SeparatorComponent, + AlertComponent, + PaginationComponent, + LoadingComponent, + ], }) export class SharedUIModule {} diff --git a/libs/shared/constants/src/index.ts b/libs/shared/constants/src/index.ts index b2a8fa3..ba0070c 100644 --- a/libs/shared/constants/src/index.ts +++ b/libs/shared/constants/src/index.ts @@ -2,3 +2,4 @@ export * from './lib/firebase'; export * from './lib/numbers'; export * from './lib/pagination'; export * from './lib/user'; +export * from './lib/time'; diff --git a/libs/shared/constants/src/lib/numbers.ts b/libs/shared/constants/src/lib/numbers.ts index 6253a97..ec6da33 100644 --- a/libs/shared/constants/src/lib/numbers.ts +++ b/libs/shared/constants/src/lib/numbers.ts @@ -1,5 +1,7 @@ export const ZERO = 0; export const ONE = 1; +export const TWO = 2; +export const THOUSAND = 1000; export const DAYS_IN_WEEK = 7; export const HOURS_IN_DAY = 24; diff --git a/libs/shared/constants/src/lib/time.ts b/libs/shared/constants/src/lib/time.ts new file mode 100644 index 0000000..456a7a3 --- /dev/null +++ b/libs/shared/constants/src/lib/time.ts @@ -0,0 +1,3 @@ +export const dateFormat = 'yyyy.MM.dd'; +export const dateTimeFormat = `${dateFormat} HH:mm`; +export const dateTimeSecondsFormat = `${dateFormat} HH:mm:ss`; diff --git a/libs/shared/mock-data/src/lib/users.mock.ts b/libs/shared/mock-data/src/lib/users.mock.ts index 93a1568..b5d0381 100644 --- a/libs/shared/mock-data/src/lib/users.mock.ts +++ b/libs/shared/mock-data/src/lib/users.mock.ts @@ -1,41 +1,24 @@ -import { User } from '@prisma/client'; +import { User, UserRole } from '@prisma/client'; import { nowMock } from './time.mock'; +import { ONE, TWO, ZERO } from '@seed/shared/constants'; +import * as faker from 'faker'; -export const mockUsers: User[] = [ - { - id: '123456', - userName: 'JohnDoe', - role: 'USER', - firstName: 'John', - lastName: 'Doe', - photoURL: null, - createdAt: nowMock, - updatedAt: nowMock, - isPushNotificationsEnabled: false, - lastTimeSignedIn: nowMock, - }, - { - id: '456123', - userName: 'JaneDoe', - role: 'USER', - firstName: 'Jane', - lastName: 'Doe', - photoURL: null, +const MAX_USERS = 25; +const mockUsers: User[] = []; + +for (let i = ZERO; i < MAX_USERS; i++) { + mockUsers.push({ + id: (i + ONE).toString(), + userName: faker.internet.userName(), + role: i <= TWO ? UserRole.ADMIN : UserRole.USER, + firstName: faker.name.firstName(), + lastName: faker.name.lastName(), + photoURL: `https://i.pravatar.cc/150?img=${i}`, createdAt: nowMock, updatedAt: nowMock, isPushNotificationsEnabled: false, lastTimeSignedIn: nowMock, - }, - { - id: '456123', - userName: 'Jack', - role: 'USER', - firstName: 'Jack', - lastName: 'Smith', - photoURL: null, - createdAt: nowMock, - updatedAt: nowMock, - isPushNotificationsEnabled: true, - lastTimeSignedIn: nowMock, - }, -]; + }); +} + +export { mockUsers }; diff --git a/package.json b/package.json index 6b7293a..883324b 100644 --- a/package.json +++ b/package.json @@ -55,6 +55,7 @@ "@nestjs/cqrs": "^9.0.1", "@nestjs/platform-express": "9.1.6", "@nestjs/swagger": "6.1.3", + "@ngneat/until-destroy": "^9.2.2", "@ngrx/effects": "^15.0.0", "@ngrx/entity": "^15.0.0", "@ngrx/router-store": "^15.0.0", diff --git a/yarn.lock b/yarn.lock index f6eae6e..3d7e154 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2767,6 +2767,13 @@ dependencies: tslib "2.4.1" +"@ngneat/until-destroy@^9.2.2": + version "9.2.2" + resolved "https://registry.yarnpkg.com/@ngneat/until-destroy/-/until-destroy-9.2.2.tgz#ac6f954610fc7ea5d4a094ed4de9db59513b810f" + integrity sha512-pD5idTgUdF0XZMuaV1n0BZTnE2BvxymutoXhwfZbO3uxjh63wS6Pzzzwv+pkXalKhuSwdf6uA1gRx7DOvlj/Kw== + dependencies: + tslib "^2.3.0" + "@ngrx/effects@^15.0.0": version "15.0.0" resolved "https://registry.yarnpkg.com/@ngrx/effects/-/effects-15.0.0.tgz#9d4ab000ca8af8fa9012e4586425541de8b79ec4"