diff --git a/src/app/header/progress-bar/progress-bar.component.html b/src/app/header/progress-bar/progress-bar.component.html index ae115b11aa..de6a7d0b6e 100644 --- a/src/app/header/progress-bar/progress-bar.component.html +++ b/src/app/header/progress-bar/progress-bar.component.html @@ -1,5 +1,13 @@
diff --git a/src/app/header/progress-bar/progress-bar.component.ts b/src/app/header/progress-bar/progress-bar.component.ts index a7e19ca4cf..9cfa6dc1cc 100644 --- a/src/app/header/progress-bar/progress-bar.component.ts +++ b/src/app/header/progress-bar/progress-bar.component.ts @@ -1,3 +1,5 @@ +import { RegistrationState } from 'src/app/shared/store/registration.state'; +import { ProviderState } from './../../shared/store/provider.state'; import { MainPageState } from 'src/app/shared/store/main-page.state'; import { Component, OnInit, OnDestroy } from '@angular/core'; import { Select } from '@ngxs/store'; @@ -24,6 +26,10 @@ export class ProgressBarComponent implements OnInit, OnDestroy { isLoadingAdminData$: Observable; @Select(MainPageState.isLoadingData) isLoadingMainPage$: Observable; + @Select(ProviderState.isLoading) + isLoadingProvider$: Observable; + @Select(RegistrationState.isAutorizationLoading) + isAutorizationLoading$: Observable; isLoadingResultPage: boolean; isLoadingCabinet: boolean; @@ -31,6 +37,8 @@ export class ProgressBarComponent implements OnInit, OnDestroy { isLoadingAdminData: boolean; isLoadingNotifications: boolean; isLoadingMainPage: boolean; + isAutorizationLoading: boolean; + isLoadingProvider: boolean; private destroy$: Subject = new Subject(); @@ -42,16 +50,30 @@ export class ProgressBarComponent implements OnInit, OnDestroy { this.isLoadingMetaData$, this.isLoadingCabinet$, this.isLoadingAdminData$, - this.isLoadingMainPage$ + this.isLoadingMainPage$, + this.isAutorizationLoading$, + this.isLoadingProvider$, ]) .pipe(takeUntil(this.destroy$), delay(0)) - .subscribe(([isLoadingResult, isLoadingMeta, isLoadingCabinet, isLoadingAdminData, isLoadingMainPage]) => { - this.isLoadingResultPage = isLoadingResult; - this.isLoadingMetaData = isLoadingMeta; - this.isLoadingCabinet = isLoadingCabinet; - this.isLoadingAdminData = isLoadingAdminData; - this.isLoadingMainPage = isLoadingMainPage; - }); + .subscribe( + ([ + isLoadingResult, + isLoadingMeta, + isLoadingCabinet, + isLoadingAdminData, + isLoadingMainPage, + isAutorizationLoading, + isLoadingProvider, + ]) => { + this.isLoadingResultPage = isLoadingResult; + this.isLoadingMetaData = isLoadingMeta; + this.isLoadingCabinet = isLoadingCabinet; + this.isLoadingAdminData = isLoadingAdminData; + this.isLoadingMainPage = isLoadingMainPage; + this.isAutorizationLoading = isAutorizationLoading; + this.isLoadingProvider = isLoadingProvider; + } + ); } ngOnDestroy(): void { diff --git a/src/app/shared/components/workshop-card/workshop-card.component.html b/src/app/shared/components/workshop-card/workshop-card.component.html index 1f0b8a2ee4..34749d7f81 100644 --- a/src/app/shared/components/workshop-card/workshop-card.component.html +++ b/src/app/shared/components/workshop-card/workshop-card.component.html @@ -86,7 +86,7 @@
+ (click)="role === Role.parent && onDisLike()"> favorite
diff --git a/src/app/shared/components/workshop-card/workshop-card.component.ts b/src/app/shared/components/workshop-card/workshop-card.component.ts index 5acc9351d7..3c49bb1a4c 100644 --- a/src/app/shared/components/workshop-card/workshop-card.component.ts +++ b/src/app/shared/components/workshop-card/workshop-card.component.ts @@ -38,10 +38,12 @@ export class WorkshopCardComponent implements OnInit, OnDestroy { readonly recruitmentStatusUkr = RecruitmentStatusUkr; readonly modalConfirmationType = ModalConfirmationType; - isFavorite: boolean; + isFavorite = false; canChangeWorkshopStatus: boolean; workshopData: ProviderWorkshopCard | WorkshopCard; + private favoriteWorkshopId: string; + @Input() set workshop(workshop: WorkshopCard) { this.workshopData = workshop; this.imagesService.setWorkshopCoverImage(workshop); @@ -95,9 +97,9 @@ export class WorkshopCardComponent implements OnInit, OnDestroy { this.isFavorite = !this.isFavorite; } - onDisLike(id: string): void { + onDisLike(): void { this.store.dispatch([ - new DeleteFavoriteWorkshop(id), + new DeleteFavoriteWorkshop(this.favoriteWorkshopId), new ShowMessageBar({ message: `Гурток ${this.workshopData.title} видалено з Улюблених`, type: 'success' }), ]); this.isFavorite = !this.isFavorite; @@ -139,7 +141,11 @@ export class WorkshopCardComponent implements OnInit, OnDestroy { filter((favorites: Favorite[]) => !!favorites) ) .subscribe((favorites: Favorite[]) => { - this.isFavorite = !!favorites.find((item: Favorite) => item.workshopId === this.workshopData.workshopId); + const favorite = favorites.find((item: Favorite) => item.workshopId === this.workshopData.workshopId); + if (!!favorite) { + this.favoriteWorkshopId = favorite.id; + this.isFavorite = true; + } }); } } diff --git a/src/app/shared/store/user.state.ts b/src/app/shared/store/user.state.ts index 720ce05516..6af96966ce 100644 --- a/src/app/shared/store/user.state.ts +++ b/src/app/shared/store/user.state.ts @@ -6,7 +6,7 @@ import { Injectable } from '@angular/core'; import { Router } from '@angular/router'; import { State, Action, StateContext, Selector } from '@ngxs/store'; import { Observable, of, throwError } from 'rxjs'; -import { catchError, tap } from 'rxjs/operators'; +import { catchError, tap, debounceTime } from 'rxjs/operators'; import { ApplicationCards } from '../models/application.model'; import { ChildCards } from '../models/child.model'; import { Provider } from '../models/provider.model'; @@ -160,7 +160,6 @@ export class UserState { return state.isReviewed; } - constructor( private userWorkshopService: UserWorkshopService, private applicationService: ApplicationService, @@ -269,10 +268,7 @@ export class UserState { } @Action(GetUsersChildren) - getUsersChildren( - { patchState }: StateContext, - {}: GetUsersChildren - ): Observable { + getUsersChildren({ patchState }: StateContext, {}: GetUsersChildren): Observable { patchState({ isLoading: true }); return this.childrenService .getUsersChildren() @@ -288,13 +284,10 @@ export class UserState { } @Action(GetUsersChildById) - getUsersChildById( - { patchState }: StateContext, - { payload }: GetUsersChildById - ): Observable { - patchState({ isLoading: true }); - return this.childrenService - .getUsersChildById( payload ) + getUsersChildById({ patchState }: StateContext, { payload }: GetUsersChildById): Observable { + patchState({ isLoading: true }); + return this.childrenService + .getUsersChildById(payload) .pipe(tap((selectedChild: Child) => patchState({ selectedChild: selectedChild, isLoading: false }))); } @@ -455,13 +448,11 @@ export class UserState { { parentId, workshopId }: GetStatusAllowedToReview ): Observable { patchState({ isLoading: true }); - return this.applicationService - .getApplicationsAllowedToReview(parentId, workshopId) - .pipe( - tap((status: boolean) => { - return patchState({ isAllowedToReview: status, isLoading: false }); - }) - ); + return this.applicationService.getApplicationsAllowedToReview(parentId, workshopId).pipe( + tap((status: boolean) => { + return patchState({ isAllowedToReview: status, isLoading: false }); + }) + ); } @Action(GetReviewedApplications) @@ -470,13 +461,11 @@ export class UserState { { parentId, workshopId }: GetReviewedApplications ): Observable { patchState({ isLoading: true }); - return this.applicationService - .getReviewedApplications(parentId, workshopId) - .pipe( - tap((status: boolean) => { - return patchState({ isReviewed: status, isLoading: false }); - }) - ); + return this.applicationService.getReviewedApplications(parentId, workshopId).pipe( + tap((status: boolean) => { + return patchState({ isReviewed: status, isLoading: false }); + }) + ); } @Action(CreateRating) @@ -531,9 +520,10 @@ export class UserState { { dispatch }: StateContext, { payload }: CreateFavoriteWorkshop ): Observable { - return this.favoriteWorkshopsService - .createFavoriteWorkshop(payload) - .pipe(tap(() => dispatch([new GetFavoriteWorkshops(), new GetFavoriteWorkshopsByUserId()]))); + return this.favoriteWorkshopsService.createFavoriteWorkshop(payload).pipe( + debounceTime(2000), + tap(() => dispatch(new GetFavoriteWorkshops())) + ); } @Action(DeleteFavoriteWorkshop) @@ -541,9 +531,10 @@ export class UserState { { dispatch }: StateContext, { payload }: DeleteFavoriteWorkshop ): Observable { - return this.favoriteWorkshopsService - .deleteFavoriteWorkshop(payload) - .pipe(tap(() => dispatch([new GetFavoriteWorkshops(), new GetFavoriteWorkshopsByUserId()]))); + return this.favoriteWorkshopsService.deleteFavoriteWorkshop(payload).pipe( + debounceTime(2000), + tap(() => dispatch(new GetFavoriteWorkshops())) + ); } @Action(ResetProviderWorkshopDetails) diff --git a/src/app/shell/main/main.component.ts b/src/app/shell/main/main.component.ts index 6669991a34..6933a9b35e 100644 --- a/src/app/shell/main/main.component.ts +++ b/src/app/shell/main/main.component.ts @@ -5,7 +5,7 @@ import { FilterState } from 'src/app/shared/store/filter.state'; import { RegistrationState } from '../../shared/store/registration.state'; import { DirectionsStatistic } from 'src/app/shared/models/category.model'; import { WorkshopCard } from '../../shared/models/workshop.model'; -import { filter, takeUntil } from 'rxjs/operators'; +import { filter, take, takeUntil } from 'rxjs/operators'; import { UserState } from 'src/app/shared/store/user.state'; import { Favorite } from 'src/app/shared/models/favorite.model'; import { Role } from 'src/app/shared/enum/role'; @@ -74,8 +74,8 @@ export class MainComponent implements OnInit, OnDestroy { if (role === Role.parent) { this.favoriteWorkshops$ .pipe( + take(1), filter((favorite: Favorite[]) => !!favorite?.length || favorite === null), - takeUntil(this.destroy$) ) .subscribe((favorite: Favorite[]) => this.getMainPageData()); } else { diff --git a/src/app/shell/personal-cabinet/parent/favorite-workshops/favorite-workshops.component.html b/src/app/shell/personal-cabinet/parent/favorite-workshops/favorite-workshops.component.html index 577633afb5..fc78885941 100644 --- a/src/app/shell/personal-cabinet/parent/favorite-workshops/favorite-workshops.component.html +++ b/src/app/shell/personal-cabinet/parent/favorite-workshops/favorite-workshops.component.html @@ -1,15 +1,15 @@ - +
- +
-
- - diff --git a/src/app/shell/personal-cabinet/parent/favorite-workshops/favorite-workshops.component.ts b/src/app/shell/personal-cabinet/parent/favorite-workshops/favorite-workshops.component.ts index 917166c8a1..83d11dc85e 100644 --- a/src/app/shell/personal-cabinet/parent/favorite-workshops/favorite-workshops.component.ts +++ b/src/app/shell/personal-cabinet/parent/favorite-workshops/favorite-workshops.component.ts @@ -1,6 +1,6 @@ import { UserState } from 'src/app/shared/store/user.state'; import { Component, OnDestroy, OnInit } from '@angular/core'; -import { Select, Store } from '@ngxs/store'; +import { Actions, ofAction, Select, Store } from '@ngxs/store'; import { WorkshopCard } from 'src/app/shared/models/workshop.model'; import { Observable } from 'rxjs'; import { PaginationElement } from 'src/app/shared/models/paginationElement.model'; @@ -12,37 +12,45 @@ import { NavBarName } from 'src/app/shared/enum/navigation-bar'; import { ParentComponent } from '../parent.component'; import { MatDialog } from '@angular/material/dialog'; import { PaginationConstants } from 'src/app/shared/constants/constants'; +import { DeleteFavoriteWorkshop, GetFavoriteWorkshopsByUserId } from 'src/app/shared/store/user.actions'; +import { takeUntil } from 'rxjs/operators'; @Component({ selector: 'app-favorite-workshops', templateUrl: './favorite-workshops.component.html', - styleUrls: ['./favorite-workshops.component.scss'] + styleUrls: ['./favorite-workshops.component.scss'], }) export class FavoriteWorkshopsComponent extends ParentComponent implements OnInit, OnDestroy { - readonly Role = Role; + readonly Role = Role; readonly noFavoriteWorkshops = NoResultsTitle.noFavoriteWorkshops; @Select(UserState.favoriteWorkshopsCard) favoriteWorkshopsCard$: Observable; + currentPage: PaginationElement = PaginationConstants.firstPage; - constructor(protected store: Store, protected matDialog: MatDialog) { + constructor(protected store: Store, protected matDialog: MatDialog, private actions$: Actions) { super(store, matDialog); } protected addNavPath(): void { this.store.dispatch( - new PushNavPath( - { - name: NavBarName.Favorite, - isActive: false, - disable: true, - } - ) - ); + new PushNavPath({ + name: NavBarName.Favorite, + isActive: false, + disable: true, + }) + ); } - initParentData(): void { } + initParentData(): void { + this.store.dispatch(new GetFavoriteWorkshopsByUserId()); + + this.actions$ + .pipe(ofAction(DeleteFavoriteWorkshop)) + .pipe(takeUntil(this.destroy$)) + .subscribe(() => this.store.dispatch(new GetFavoriteWorkshopsByUserId())); + } onPageChange(page: PaginationElement): void { this.currentPage = page;