From b2a295a0705905b02455c54e0164bb47affd3e2d Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Mon, 25 Nov 2024 11:16:30 +0100 Subject: [PATCH] Fix opening/checking admin/account modal --- client/src/app/app.component.html | 7 ++-- client/src/app/app.component.ts | 42 +++++++++++-------- .../account-setup-warning-modal.component.ts | 11 ++++- .../modal/admin-welcome-modal.component.ts | 11 ++++- ...instance-config-warning-modal.component.ts | 11 ++++- 5 files changed, 56 insertions(+), 26 deletions(-) diff --git a/client/src/app/app.component.html b/client/src/app/app.component.html index 16cc6a90c..a4a0e7841 100644 --- a/client/src/app/app.component.html +++ b/client/src/app/app.component.html @@ -54,9 +54,10 @@ @defer (when isUserLoggedIn()) { - - - + + + + } diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts index 06b5dde07..3d5d68039 100644 --- a/client/src/app/app.component.ts +++ b/client/src/app/app.component.ts @@ -29,7 +29,7 @@ import { logger } from '@root-helpers/logger' import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage' import { SharedModule } from 'primeng/api' import { ToastModule } from 'primeng/toast' -import { delay, forkJoin } from 'rxjs' +import { forkJoin } from 'rxjs' import { filter, first, map } from 'rxjs/operators' import { MenuService } from './core/menu/menu.service' import { HeaderComponent } from './header/header.component' @@ -38,8 +38,8 @@ import { HotkeysCheatSheetComponent } from './hotkeys/hotkeys-cheat-sheet.compon import { MenuComponent } from './menu/menu.component' import { ConfirmComponent } from './modal/confirm.component' import { GlobalIconComponent, GlobalIconName } from './shared/shared-icons/global-icon.component' -import { InstanceService } from './shared/shared-main/instance/instance.service' import { ButtonComponent } from './shared/shared-main/buttons/button.component' +import { InstanceService } from './shared/shared-main/instance/instance.service' @Component({ selector: 'my-app', @@ -144,7 +144,7 @@ export class AppComponent implements OnInit, AfterViewInit { this.location.onPopState(() => this.modalService.dismissAll(POP_STATE_MODAL_DISMISS)) - this.openModalsIfNeeded() + this.listenUserChangeForModals() this.document.documentElement.lang = getShortLocale(this.localeId) this.document.documentElement.dir = getLocaleDirection(this.localeId) @@ -264,29 +264,35 @@ export class AppComponent implements OnInit, AfterViewInit { } } - private openModalsIfNeeded () { - const userSub = this.authService.userInformationLoaded - .pipe( - delay(0), // Wait for modals creations - map(() => this.authService.getUser()) - ) + private listenUserChangeForModals () { + this.authService.userInformationLoaded + .pipe(map(() => this.authService.getUser())) + .subscribe(user => this.openModalsIfNeeded(user)) + } - // Admin modal - userSub.pipe( - filter(user => user.role.id === UserRole.ADMINISTRATOR) - ).subscribe(user => setTimeout(() => this.openAdminModalsIfNeeded(user))) // Wait deferred modal creation in the view + onModalCreated () { + const user = this.authService.getUser() + if (!user) return - // Account modal - userSub.pipe( - filter(user => user.role.id !== UserRole.ADMINISTRATOR) - ).subscribe(user => setTimeout(() => this.openAccountModalsIfNeeded(user))) // Wait deferred modal creation in the view + setTimeout(() => this.openModalsIfNeeded(user)) + } + + private openModalsIfNeeded (user: User) { + if (user.role.id === UserRole.ADMINISTRATOR) { + this.openAdminModalsIfNeeded(user) + } else { + this.openAccountModalsIfNeeded(user) + } } private openAdminModalsIfNeeded (user: User) { + if (!this.adminWelcomeModal) return + if (this.adminWelcomeModal.shouldOpen(user)) { return this.adminWelcomeModal.show() } + if (!this.instanceConfigWarningModal) return if (!this.instanceConfigWarningModal.shouldOpenByUser(user)) return forkJoin([ @@ -300,6 +306,8 @@ export class AppComponent implements OnInit, AfterViewInit { } private openAccountModalsIfNeeded (user: User) { + if (!this.accountSetupWarningModal) return + if (this.accountSetupWarningModal.shouldOpen(user)) { this.accountSetupWarningModal.show(user) } diff --git a/client/src/app/modal/account-setup-warning-modal.component.ts b/client/src/app/modal/account-setup-warning-modal.component.ts index d39f7465a..98a44913a 100644 --- a/client/src/app/modal/account-setup-warning-modal.component.ts +++ b/client/src/app/modal/account-setup-warning-modal.component.ts @@ -1,5 +1,5 @@ import { CommonModule } from '@angular/common' -import { Component, ElementRef, ViewChild } from '@angular/core' +import { Component, ElementRef, EventEmitter, OnInit, Output, ViewChild } from '@angular/core' import { FormsModule } from '@angular/forms' import { RouterLink } from '@angular/router' import { Notifier, ServerService, User, UserService } from '@app/core' @@ -16,9 +16,11 @@ import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage' standalone: true, imports: [ CommonModule, GlobalIconComponent, PeertubeCheckboxComponent, FormsModule, RouterLink ] }) -export class AccountSetupWarningModalComponent { +export class AccountSetupWarningModalComponent implements OnInit { @ViewChild('modal', { static: true }) modal: ElementRef + @Output() created = new EventEmitter() + stopDisplayModal = false ref: NgbModalRef @@ -28,6 +30,10 @@ export class AccountSetupWarningModalComponent { NO_ACCOUNT_SETUP_WARNING_MODAL: 'no_account_setup_warning_modal' } + ngOnInit (): void { + this.created.emit() + } + constructor ( private userService: UserService, private modalService: NgbModal, @@ -48,6 +54,7 @@ export class AccountSetupWarningModalComponent { } shouldOpen (user: User) { + if (this.modalService.hasOpenModals()) return false if (user.noAccountSetupWarningModal === true) return false if (peertubeLocalStorage.getItem(this.LS_KEYS.NO_ACCOUNT_SETUP_WARNING_MODAL) === 'true') return false diff --git a/client/src/app/modal/admin-welcome-modal.component.ts b/client/src/app/modal/admin-welcome-modal.component.ts index dbc4b1bc0..a58d39e11 100644 --- a/client/src/app/modal/admin-welcome-modal.component.ts +++ b/client/src/app/modal/admin-welcome-modal.component.ts @@ -1,4 +1,4 @@ -import { Component, ElementRef, ViewChild } from '@angular/core' +import { Component, ElementRef, EventEmitter, OnInit, Output, ViewChild } from '@angular/core' import { Notifier, User, UserService } from '@app/core' import { GlobalIconComponent } from '@app/shared/shared-icons/global-icon.component' import { NgbModal } from '@ng-bootstrap/ng-bootstrap' @@ -12,9 +12,11 @@ import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage' standalone: true, imports: [ GlobalIconComponent ] }) -export class AdminWelcomeModalComponent { +export class AdminWelcomeModalComponent implements OnInit { @ViewChild('modal', { static: true }) modal: ElementRef + @Output() created = new EventEmitter() + private LS_KEYS = { NO_WELCOME_MODAL: 'no_welcome_modal' } @@ -25,7 +27,12 @@ export class AdminWelcomeModalComponent { private notifier: Notifier ) { } + ngOnInit () { + this.created.emit() + } + shouldOpen (user: User) { + if (this.modalService.hasOpenModals()) return false if (user.noWelcomeModal === true) return false if (peertubeLocalStorage.getItem(this.LS_KEYS.NO_WELCOME_MODAL) === 'true') return false diff --git a/client/src/app/modal/instance-config-warning-modal.component.ts b/client/src/app/modal/instance-config-warning-modal.component.ts index db7d6bea1..6a497c11d 100644 --- a/client/src/app/modal/instance-config-warning-modal.component.ts +++ b/client/src/app/modal/instance-config-warning-modal.component.ts @@ -1,5 +1,5 @@ import { CommonModule, Location } from '@angular/common' -import { Component, ElementRef, ViewChild } from '@angular/core' +import { Component, ElementRef, EventEmitter, OnInit, Output, ViewChild } from '@angular/core' import { FormsModule } from '@angular/forms' import { Notifier, User, UserService } from '@app/core' import { PeertubeCheckboxComponent } from '@app/shared/shared-forms/peertube-checkbox.component' @@ -16,9 +16,11 @@ import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage' standalone: true, imports: [ CommonModule, FormsModule, GlobalIconComponent, PeertubeCheckboxComponent ] }) -export class InstanceConfigWarningModalComponent { +export class InstanceConfigWarningModalComponent implements OnInit { @ViewChild('modal', { static: true }) modal: ElementRef + @Output() created = new EventEmitter() + stopDisplayModal = false about: About @@ -33,7 +35,12 @@ export class InstanceConfigWarningModalComponent { private notifier: Notifier ) { } + ngOnInit (): void { + this.created.emit() + } + shouldOpenByUser (user: User) { + if (this.modalService.hasOpenModals()) return false if (user.noInstanceConfigWarningModal === true) return false if (peertubeLocalStorage.getItem(this.LS_KEYS.NO_INSTANCE_CONFIG_WARNING_MODAL) === 'true') return false