Use standalone components for menu
This commit is contained in:
parent
bfdf82c490
commit
62cc9b1752
|
@ -1,5 +1,5 @@
|
|||
import { Component, ViewChild } from '@angular/core'
|
||||
import { UserNotificationsComponent } from '@app/shared/shared-main'
|
||||
import { UserNotificationsComponent } from '@app/shared/standalone-notifications/user-notifications.component'
|
||||
|
||||
type NotificationSortType = 'createdAt' | 'read'
|
||||
|
||||
|
|
|
@ -35,6 +35,7 @@ import {
|
|||
UserImportExportService
|
||||
} from './my-account-import-export'
|
||||
import { UploadProgressComponent } from '@app/shared/standalone-upload'
|
||||
import { UserNotificationsComponent } from '@app/shared/standalone-notifications/user-notifications.component'
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
|
@ -56,7 +57,8 @@ import { UploadProgressComponent } from '@app/shared/standalone-upload'
|
|||
SharedActorImageModule,
|
||||
SharedActorImageEditModule,
|
||||
|
||||
UploadProgressComponent
|
||||
UploadProgressComponent,
|
||||
UserNotificationsComponent
|
||||
],
|
||||
|
||||
declarations: [
|
||||
|
|
|
@ -72,10 +72,10 @@
|
|||
</ng-template>
|
||||
</p-toast>
|
||||
|
||||
<ng-container *ngIf="isUserLoggedIn()">
|
||||
@defer (when isUserLoggedIn()) {
|
||||
<my-account-setup-warning-modal #accountSetupWarningModal></my-account-setup-warning-modal>
|
||||
<my-admin-welcome-modal #adminWelcomeModal></my-admin-welcome-modal>
|
||||
<my-instance-config-warning-modal #instanceConfigWarningModal></my-instance-config-warning-modal>
|
||||
</ng-container>
|
||||
}
|
||||
|
||||
<my-custom-modal #customModal></my-custom-modal>
|
||||
|
|
|
@ -13,13 +13,9 @@ import { EmptyComponent } from './empty.component'
|
|||
import { HeaderComponent, SearchTypeaheadComponent, SuggestionComponent } from './header'
|
||||
import { HighlightPipe } from './header/highlight.pipe'
|
||||
import { polyfillICU } from './helpers'
|
||||
import { LanguageChooserComponent, MenuComponent, NotificationComponent } from './menu'
|
||||
import { AccountSetupWarningModalComponent } from './modal/account-setup-warning-modal.component'
|
||||
import { AdminWelcomeModalComponent } from './modal/admin-welcome-modal.component'
|
||||
import { MenuComponent } from './menu'
|
||||
import { ConfirmComponent } from './modal/confirm.component'
|
||||
import { CustomModalComponent } from './modal/custom-modal.component'
|
||||
import { InstanceConfigWarningModalComponent } from './modal/instance-config-warning-modal.component'
|
||||
import { QuickSettingsModalComponent } from './modal/quick-settings-modal.component'
|
||||
import { SharedActorImageModule } from './shared/shared-actor-image/shared-actor-image.module'
|
||||
import { SharedFormModule } from './shared/shared-forms'
|
||||
import { SharedGlobalIconModule } from './shared/shared-icons'
|
||||
|
@ -27,6 +23,9 @@ import { SharedInstanceModule } from './shared/shared-instance'
|
|||
import { SharedMainModule } from './shared/shared-main'
|
||||
import { SharedUserInterfaceSettingsModule } from './shared/shared-user-settings'
|
||||
import { HotkeysCheatSheetComponent } from './hotkeys'
|
||||
import { InstanceConfigWarningModalComponent } from './modal/instance-config-warning-modal.component'
|
||||
import { AdminWelcomeModalComponent } from './modal/admin-welcome-modal.component'
|
||||
import { AccountSetupWarningModalComponent } from './modal/account-setup-warning-modal.component'
|
||||
|
||||
registerLocaleData(localeOc, 'oc')
|
||||
|
||||
|
@ -51,19 +50,12 @@ export function loadConfigFactory (server: ServerService, pluginService: PluginS
|
|||
AppComponent,
|
||||
EmptyComponent,
|
||||
|
||||
MenuComponent,
|
||||
LanguageChooserComponent,
|
||||
QuickSettingsModalComponent,
|
||||
NotificationComponent,
|
||||
HeaderComponent,
|
||||
SearchTypeaheadComponent,
|
||||
SuggestionComponent,
|
||||
HighlightPipe,
|
||||
|
||||
AccountSetupWarningModalComponent,
|
||||
CustomModalComponent,
|
||||
AdminWelcomeModalComponent,
|
||||
InstanceConfigWarningModalComponent,
|
||||
ConfirmComponent,
|
||||
|
||||
HotkeysCheatSheetComponent
|
||||
|
@ -81,6 +73,12 @@ export function loadConfigFactory (server: ServerService, pluginService: PluginS
|
|||
SharedInstanceModule,
|
||||
SharedActorImageModule,
|
||||
|
||||
MenuComponent,
|
||||
|
||||
InstanceConfigWarningModalComponent,
|
||||
AdminWelcomeModalComponent,
|
||||
AccountSetupWarningModalComponent,
|
||||
|
||||
AppRoutingModule // Put it after all the module because it has the 404 route
|
||||
],
|
||||
|
||||
|
|
|
@ -1,3 +1,2 @@
|
|||
export * from './language-chooser.component'
|
||||
export * from './notification.component'
|
||||
export * from './menu.component'
|
||||
|
|
|
@ -1,12 +1,16 @@
|
|||
import { CommonModule } from '@angular/common'
|
||||
import { Component, ElementRef, Inject, LOCALE_ID, ViewChild } from '@angular/core'
|
||||
import { getDevLocale, isOnDevLocale } from '@app/helpers'
|
||||
import { SharedGlobalIconModule } from '@app/shared/shared-icons'
|
||||
import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
|
||||
import { getCompleteLocale, getShortLocale, I18N_LOCALES, objectKeysTyped, sortBy } from '@peertube/peertube-core-utils'
|
||||
|
||||
@Component({
|
||||
selector: 'my-language-chooser',
|
||||
templateUrl: './language-chooser.component.html',
|
||||
styleUrls: [ './language-chooser.component.scss' ]
|
||||
styleUrls: [ './language-chooser.component.scss' ],
|
||||
standalone: true,
|
||||
imports: [ CommonModule, SharedGlobalIconModule ]
|
||||
})
|
||||
export class LanguageChooserComponent {
|
||||
@ViewChild('modal', { static: true }) modal: ElementRef
|
||||
|
|
|
@ -78,7 +78,9 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<my-notification (navigate)="onActiveLinkScrollToAnchor($event)"></my-notification>
|
||||
@defer (when isLoggedIn) {
|
||||
<my-notification (navigate)="onActiveLinkScrollToAnchor($event)"></my-notification>
|
||||
}
|
||||
</div>
|
||||
|
||||
<ul class="logged-in-menu">
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import * as debug from 'debug'
|
||||
import { forkJoin, Subscription } from 'rxjs'
|
||||
import { first, switchMap } from 'rxjs/operators'
|
||||
import { ViewportScroller } from '@angular/common'
|
||||
import { CommonModule, ViewportScroller } from '@angular/common'
|
||||
import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core'
|
||||
import { Router } from '@angular/router'
|
||||
import {
|
||||
|
@ -18,18 +18,36 @@ import {
|
|||
UserService
|
||||
} from '@app/core'
|
||||
import { scrollToTop } from '@app/helpers'
|
||||
import { LanguageChooserComponent } from '@app/menu/language-chooser.component'
|
||||
import { QuickSettingsModalComponent } from '@app/modal/quick-settings-modal.component'
|
||||
import { PeertubeModalService } from '@app/shared/shared-main/peertube-modal/peertube-modal.service'
|
||||
import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
|
||||
import { HTMLServerConfig, ServerConfig, UserRight, UserRightType, VideoConstant } from '@peertube/peertube-models'
|
||||
import { NotificationComponent } from './notification.component'
|
||||
import { SharedMainModule } from '@app/shared/shared-main'
|
||||
import { SharedGlobalIconModule } from '@app/shared/shared-icons'
|
||||
import { SharedUserInterfaceSettingsModule } from '@app/shared/shared-user-settings'
|
||||
import { SharedFormModule } from '@app/shared/shared-forms'
|
||||
import { SharedActorImageModule } from '@app/shared/shared-actor-image/shared-actor-image.module'
|
||||
import { LanguageChooserComponent } from './language-chooser.component'
|
||||
import { QuickSettingsModalComponent } from './quick-settings-modal.component'
|
||||
|
||||
const debugLogger = debug('peertube:menu:MenuComponent')
|
||||
|
||||
@Component({
|
||||
selector: 'my-menu',
|
||||
templateUrl: './menu.component.html',
|
||||
styleUrls: [ './menu.component.scss' ]
|
||||
styleUrls: [ './menu.component.scss' ],
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule,
|
||||
SharedActorImageModule,
|
||||
NotificationComponent,
|
||||
SharedMainModule,
|
||||
SharedGlobalIconModule,
|
||||
SharedUserInterfaceSettingsModule,
|
||||
SharedFormModule,
|
||||
LanguageChooserComponent,
|
||||
QuickSettingsModalComponent
|
||||
]
|
||||
})
|
||||
export class MenuComponent implements OnInit, OnDestroy {
|
||||
@ViewChild('languageChooserModal', { static: true }) languageChooserModal: LanguageChooserComponent
|
||||
|
|
|
@ -3,13 +3,17 @@ import { filter } from 'rxjs/operators'
|
|||
import { Component, EventEmitter, Output, OnDestroy, OnInit, ViewChild } from '@angular/core'
|
||||
import { NavigationEnd, Router } from '@angular/router'
|
||||
import { Notifier, PeerTubeSocket, ScreenService } from '@app/core'
|
||||
import { UserNotificationService } from '@app/shared/shared-main'
|
||||
import { SharedMainModule, UserNotificationService } from '@app/shared/shared-main'
|
||||
import { NgbPopover } from '@ng-bootstrap/ng-bootstrap'
|
||||
import { UserNotificationsComponent } from '@app/shared/standalone-notifications/user-notifications.component'
|
||||
import { SharedGlobalIconModule } from '@app/shared/shared-icons'
|
||||
|
||||
@Component({
|
||||
selector: 'my-notification',
|
||||
templateUrl: './notification.component.html',
|
||||
styleUrls: [ './notification.component.scss' ]
|
||||
styleUrls: [ './notification.component.scss' ],
|
||||
standalone: true,
|
||||
imports: [ UserNotificationsComponent, SharedMainModule, SharedGlobalIconModule ]
|
||||
})
|
||||
export class NotificationComponent implements OnInit, OnDestroy {
|
||||
@ViewChild('popover', { static: true }) popover: NgbPopover
|
||||
|
|
|
@ -5,10 +5,15 @@ import { ActivatedRoute, Router } from '@angular/router'
|
|||
import { AuthService, AuthStatus, LocalStorageService, User, UserService } from '@app/core'
|
||||
import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
|
||||
import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref'
|
||||
import { SharedUserInterfaceSettingsModule } from '@app/shared/shared-user-settings'
|
||||
import { SharedGlobalIconModule } from '@app/shared/shared-icons'
|
||||
import { CommonModule } from '@angular/common'
|
||||
|
||||
@Component({
|
||||
selector: 'my-quick-settings',
|
||||
templateUrl: './quick-settings-modal.component.html'
|
||||
templateUrl: './quick-settings-modal.component.html',
|
||||
standalone: true,
|
||||
imports: [ CommonModule, SharedGlobalIconModule, SharedUserInterfaceSettingsModule ]
|
||||
})
|
||||
export class QuickSettingsModalComponent implements OnInit, OnDestroy {
|
||||
private static readonly QUERY_MODAL_NAME = 'quick-settings'
|
|
@ -1,5 +1,8 @@
|
|||
import { CommonModule } from '@angular/common'
|
||||
import { Component, ElementRef, ViewChild } from '@angular/core'
|
||||
import { Notifier, ServerService, User, UserService } from '@app/core'
|
||||
import { SharedFormModule } from '@app/shared/shared-forms'
|
||||
import { SharedGlobalIconModule } from '@app/shared/shared-icons'
|
||||
import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap'
|
||||
import { logger } from '@root-helpers/logger'
|
||||
import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage'
|
||||
|
@ -7,7 +10,9 @@ import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage'
|
|||
@Component({
|
||||
selector: 'my-account-setup-warning-modal',
|
||||
templateUrl: './account-setup-warning-modal.component.html',
|
||||
styleUrls: [ './account-setup-warning-modal.component.scss' ]
|
||||
styleUrls: [ './account-setup-warning-modal.component.scss' ],
|
||||
standalone: true,
|
||||
imports: [ CommonModule, SharedGlobalIconModule, SharedFormModule ]
|
||||
})
|
||||
export class AccountSetupWarningModalComponent {
|
||||
@ViewChild('modal', { static: true }) modal: ElementRef
|
||||
|
|
|
@ -11,22 +11,19 @@
|
|||
<div class="block-documentation">
|
||||
<div class="columns">
|
||||
<a class="link-block" href="https://docs.joinpeertube.org/maintain/tools" target="_blank" rel="noopener noreferrer">
|
||||
<a i18n class="link-title" href="https://docs.joinpeertube.org/maintain/tools" target="_blank" rel="noopener noreferrer">CLI
|
||||
documentation</a>
|
||||
<a i18n class="link-title" href="https://docs.joinpeertube.org/maintain/tools" target="_blank" rel="noopener noreferrer">CLI documentation</a>
|
||||
|
||||
<div i18n>Upload or import videos, parse logs, prune storage directories, reset user password...</div>
|
||||
</a>
|
||||
|
||||
<a class="link-block" href="https://docs.joinpeertube.org/admin/following-instances" target="_blank" rel="noopener noreferrer">
|
||||
<a i18n class="link-title" href="https://docs.joinpeertube.org/admin/following-instances" target="_blank" rel="noopener noreferrer">Administer
|
||||
documentation</a>
|
||||
<a i18n class="link-title" href="https://docs.joinpeertube.org/admin/following-instances" target="_blank" rel="noopener noreferrer">Administer documentation</a>
|
||||
|
||||
<div i18n>Managing users, following other instances, dealing with spammers...</div>
|
||||
</a>
|
||||
|
||||
<a class="link-block" href="https://docs.joinpeertube.org/use/setup-account" target="_blank" rel="noopener noreferrer">
|
||||
<a i18n class="link-title" href="https://docs.joinpeertube.org/use/setup-account" target="_blank" rel="noopener noreferrer">Use
|
||||
documentation</a>
|
||||
<a i18n class="link-title" href="https://docs.joinpeertube.org/use/setup-account" target="_blank" rel="noopener noreferrer">Use documentation</a>
|
||||
|
||||
<div i18n>Setup your account, managing video playlists, discover third-party applications...</div>
|
||||
</a>
|
||||
|
@ -41,10 +38,12 @@
|
|||
<div i18n class="subtitle">Useful links</div>
|
||||
|
||||
<ul>
|
||||
<li i18n>Official PeerTube website (news, support, contribute...): <a href="https://joinpeertube.org" target="_blank"
|
||||
rel="noopener noreferrer">https://joinpeertube.org</a></li>
|
||||
<li i18n>
|
||||
Official PeerTube website (news, support, contribute...): <a href="https://joinpeertube.org" target="_blank" rel="noopener noreferrer">https://joinpeertube.org</a>
|
||||
</li>
|
||||
|
||||
<li i18n>Put your instance on the public PeerTube index: <a href="https://instances.joinpeertube.org/instances">https://instances.joinpeertube.org/instances</a>
|
||||
<li i18n>
|
||||
Put your instance on the public PeerTube index: <a href="https://instances.joinpeertube.org/instances">https://instances.joinpeertube.org/instances</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
import { Component, ElementRef, ViewChild } from '@angular/core'
|
||||
import { Notifier, User, UserService } from '@app/core'
|
||||
import { SharedGlobalIconModule } from '@app/shared/shared-icons'
|
||||
import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
|
||||
import { logger } from '@root-helpers/logger'
|
||||
import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage'
|
||||
|
@ -7,7 +8,9 @@ import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage'
|
|||
@Component({
|
||||
selector: 'my-admin-welcome-modal',
|
||||
templateUrl: './admin-welcome-modal.component.html',
|
||||
styleUrls: [ './admin-welcome-modal.component.scss' ]
|
||||
styleUrls: [ './admin-welcome-modal.component.scss' ],
|
||||
standalone: true,
|
||||
imports: [ SharedGlobalIconModule ]
|
||||
})
|
||||
export class AdminWelcomeModalComponent {
|
||||
@ViewChild('modal', { static: true }) modal: ElementRef
|
||||
|
|
|
@ -1,6 +1,8 @@
|
|||
import { Location } from '@angular/common'
|
||||
import { CommonModule, Location } from '@angular/common'
|
||||
import { Component, ElementRef, ViewChild } from '@angular/core'
|
||||
import { Notifier, User, UserService } from '@app/core'
|
||||
import { SharedFormModule } from '@app/shared/shared-forms'
|
||||
import { SharedGlobalIconModule } from '@app/shared/shared-icons'
|
||||
import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
|
||||
import { About, ServerConfig } from '@peertube/peertube-models'
|
||||
import { logger } from '@root-helpers/logger'
|
||||
|
@ -9,7 +11,9 @@ import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage'
|
|||
@Component({
|
||||
selector: 'my-instance-config-warning-modal',
|
||||
templateUrl: './instance-config-warning-modal.component.html',
|
||||
styleUrls: [ './instance-config-warning-modal.component.scss' ]
|
||||
styleUrls: [ './instance-config-warning-modal.component.scss' ],
|
||||
standalone: true,
|
||||
imports: [ CommonModule, SharedGlobalIconModule, SharedFormModule ]
|
||||
})
|
||||
export class InstanceConfigWarningModalComponent {
|
||||
@ViewChild('modal', { static: true }) modal: ElementRef
|
||||
|
|
|
@ -46,7 +46,7 @@ import {
|
|||
} from './misc'
|
||||
import { PluginPlaceholderComponent, PluginSelectorDirective } from './plugins'
|
||||
import { ActorRedirectGuard } from './router'
|
||||
import { UserHistoryService, UserNotificationsComponent, UserNotificationService, UserQuotaComponent } from './users'
|
||||
import { UserHistoryService, UserNotificationService, UserQuotaComponent } from './users'
|
||||
import {
|
||||
EmbedComponent,
|
||||
RedundancyService,
|
||||
|
@ -120,7 +120,6 @@ import { VideoChannelService } from './video-channel'
|
|||
SimpleSearchInputComponent,
|
||||
|
||||
UserQuotaComponent,
|
||||
UserNotificationsComponent,
|
||||
|
||||
SignupLabelComponent,
|
||||
|
||||
|
@ -184,7 +183,6 @@ import { VideoChannelService } from './video-channel'
|
|||
SimpleSearchInputComponent,
|
||||
|
||||
UserQuotaComponent,
|
||||
UserNotificationsComponent,
|
||||
|
||||
SignupLabelComponent,
|
||||
|
||||
|
|
|
@ -1,5 +1,4 @@
|
|||
export * from './user-history.service'
|
||||
export * from './user-notification.model'
|
||||
export * from './user-notification.service'
|
||||
export * from './user-notifications.component'
|
||||
export * from './user-quota.component'
|
||||
|
|
|
@ -2,13 +2,16 @@ import { Subject } from 'rxjs'
|
|||
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
|
||||
import { ComponentPagination, hasMoreItems, Notifier } from '@app/core'
|
||||
import { AbuseState } from '@peertube/peertube-models'
|
||||
import { UserNotification } from './user-notification.model'
|
||||
import { UserNotificationService } from './user-notification.service'
|
||||
import { SharedMainModule, UserNotification, UserNotificationService } from '../shared-main'
|
||||
import { CommonModule } from '@angular/common'
|
||||
import { SharedGlobalIconModule } from '../shared-icons'
|
||||
|
||||
@Component({
|
||||
selector: 'my-user-notifications',
|
||||
templateUrl: 'user-notifications.component.html',
|
||||
styleUrls: [ 'user-notifications.component.scss' ]
|
||||
styleUrls: [ 'user-notifications.component.scss' ],
|
||||
standalone: true,
|
||||
imports: [ CommonModule, SharedMainModule, SharedGlobalIconModule ]
|
||||
})
|
||||
export class UserNotificationsComponent implements OnInit {
|
||||
@Input() ignoreLoadingBar = false
|
Loading…
Reference in New Issue