diff --git a/src/app/app.component.ts b/src/app/app.component.ts index a9be27183..90da93795 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,9 +1,5 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslateService } from '@ngx-translate/core'; - -import { DialogService } from 'primeng/dynamicdialog'; - import { filter } from 'rxjs'; import { ChangeDetectionStrategy, Component, DestroyRef, effect, inject, OnInit } from '@angular/core'; @@ -14,6 +10,7 @@ import { ENVIRONMENT } from '@core/provider/environment.provider'; import { GetCurrentUser } from '@core/store/user'; import { GetEmails, UserEmailsSelectors } from '@core/store/user-emails'; import { ConfirmEmailComponent } from '@shared/components'; +import { CustomDialogService } from '@shared/services'; import { FullScreenLoaderComponent, ToastComponent } from './shared/components'; @@ -25,14 +22,12 @@ import { GoogleTagManagerService } from 'angular-google-tag-manager'; templateUrl: './app.component.html', styleUrl: './app.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class AppComponent implements OnInit { private readonly googleTagManagerService = inject(GoogleTagManagerService); private readonly destroyRef = inject(DestroyRef); - private readonly dialogService = inject(DialogService); + private readonly customDialogService = inject(CustomDialogService); private readonly router = inject(Router); - private readonly translateService = inject(TranslateService); private readonly environment = inject(ENVIRONMENT); private readonly actions = createDispatchMap({ getCurrentUser: GetCurrentUser, getEmails: GetEmails }); @@ -67,12 +62,9 @@ export class AppComponent implements OnInit { } private showEmailDialog() { - this.dialogService.open(ConfirmEmailComponent, { + this.customDialogService.open(ConfirmEmailComponent, { + header: 'home.confirmEmail.title', width: '448px', - focusOnShow: false, - header: this.translateService.instant('home.confirmEmail.title'), - modal: true, - closable: false, data: this.unverifiedEmails(), }); } diff --git a/src/app/app.config.ts b/src/app/app.config.ts index b456a9341..d1fdb3c61 100644 --- a/src/app/app.config.ts +++ b/src/app/app.config.ts @@ -5,6 +5,7 @@ import { TranslateModule } from '@ngx-translate/core'; import { ConfirmationService, MessageService } from 'primeng/api'; import { providePrimeNG } from 'primeng/config'; +import { DialogService } from 'primeng/dynamicdialog'; import { provideHttpClient, withInterceptors } from '@angular/common/http'; import { ApplicationConfig, ErrorHandler, importProvidersFrom, provideZoneChangeDetection } from '@angular/core'; @@ -26,12 +27,13 @@ export const appConfig: ApplicationConfig = { providers: [ APPLICATION_INITIALIZATION_PROVIDER, ConfirmationService, + DialogService, + MessageService, { provide: ErrorHandler, useFactory: () => Sentry.createErrorHandler({ showDialog: false }), }, importProvidersFrom(TranslateModule.forRoot(provideTranslation())), - MessageService, provideAnimations(), providePrimeNG({ theme: { diff --git a/src/app/features/admin-institutions/components/admin-table/admin-table.component.html b/src/app/features/admin-institutions/components/admin-table/admin-table.component.html index ea0db013c..b5fcdc54d 100644 --- a/src/app/features/admin-institutions/components/admin-table/admin-table.component.html +++ b/src/app/features/admin-institutions/components/admin-table/admin-table.component.html @@ -110,60 +110,63 @@ @for (col of columns; track col.field) { @let currentColumnField = rowData[col.field]; - @if (col.isLink && isLink(currentColumnField)) { - - @if (col.dateFormat) { - {{ getCellValue(currentColumnField) | date: col.dateFormat }} + +
+ @if (col.isLink && isLink(currentColumnField)) { + + @if (col.dateFormat) { + {{ getCellValue(currentColumnField) | date: col.dateFormat }} + } @else { + {{ getCellValue(currentColumnField) }} + } + + } @else if (col.isLink && col.isArray && isLinkArray(currentColumnField)) { +
+ @for (link of currentColumnField; track $index) { +
+ + {{ link.text }}{{ $last ? '' : ',' }} + + @if (col.showIcon) { + + } +
+ } +
+ } @else { + @if (col.dateFormat && currentColumnField) { +

+ {{ getCellValue(currentColumnField) | date: col.dateFormat }} +

+ } @else if (!col.dateFormat && currentColumnField) { +

+ {{ getCellValue(currentColumnField) }} +

} @else { - {{ getCellValue(currentColumnField) }} +

{{ currentColumnField ?? '-' }}

} - - } @else if (col.isLink && col.isArray && isLinkArray(currentColumnField)) { -
- @for (link of currentColumnField; track $index) { -
- - {{ link.text }}{{ $last ? '' : ',' }} - - @if (col.showIcon) { - - } -
- } -
- } @else { - @if (col.dateFormat && currentColumnField) { -

- {{ getCellValue(currentColumnField) | date: col.dateFormat }} -

- } @else if (!col.dateFormat && currentColumnField) { -

- {{ getCellValue(currentColumnField) }} -

- } @else { -

{{ currentColumnField ?? '-' }}

} - } - @if (col.showIcon && !col.isArray) { - - } + @if (col.showIcon && !col.isArray) { + + } +
} diff --git a/src/app/features/admin-institutions/pages/institutions-projects/institutions-projects.component.ts b/src/app/features/admin-institutions/pages/institutions-projects/institutions-projects.component.ts index 9b2fb2901..d9f9b6fd4 100644 --- a/src/app/features/admin-institutions/pages/institutions-projects/institutions-projects.component.ts +++ b/src/app/features/admin-institutions/pages/institutions-projects/institutions-projects.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { filter } from 'rxjs'; @@ -22,7 +21,7 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; import { UserSelectors } from '@core/store/user'; import { ResourceType, SortOrder } from '@osf/shared/enums'; import { PaginationLinksModel, ResourceModel, SearchFilters } from '@osf/shared/models'; -import { ToastService } from '@osf/shared/services'; +import { CustomDialogService, ToastService } from '@osf/shared/services'; import { FetchResources, FetchResourcesByLink, @@ -49,13 +48,11 @@ import { InstitutionsAdminSelectors, RequestProjectAccess, SendUserMessage } fro templateUrl: './institutions-projects.component.html', styleUrl: './institutions-projects.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class InstitutionsProjectsComponent implements OnInit, OnDestroy { - private dialogService = inject(DialogService); + private customDialogService = inject(CustomDialogService); private destroyRef = inject(DestroyRef); private toastService = inject(ToastService); - private translate = inject(TranslateService); private actions = createDispatchMap({ sendUserMessage: SendUserMessage, @@ -137,14 +134,10 @@ export class InstitutionsProjectsComponent implements OnInit, OnDestroy { return; } - this.dialogService + this.customDialogService .open(ContactDialogComponent, { + header: 'adminInstitutions.institutionUsers.sendEmail', width: '448px', - focusOnShow: false, - header: this.translate.instant('adminInstitutions.institutionUsers.sendEmail'), - closeOnEscape: true, - modal: true, - closable: true, data: this.currentUser()?.fullName, }) .onClose.pipe( diff --git a/src/app/features/admin-institutions/pages/institutions-users/institutions-users.component.ts b/src/app/features/admin-institutions/pages/institutions-users/institutions-users.component.ts index 52c8e53a7..9510d4d63 100644 --- a/src/app/features/admin-institutions/pages/institutions-users/institutions-users.component.ts +++ b/src/app/features/admin-institutions/pages/institutions-users/institutions-users.component.ts @@ -3,7 +3,6 @@ import { createDispatchMap, select } from '@ngxs/store'; import { TranslatePipe, TranslateService } from '@ngx-translate/core'; import { CheckboxModule } from 'primeng/checkbox'; -import { DialogService } from 'primeng/dynamicdialog'; import { PaginatorState } from 'primeng/paginator'; import { filter } from 'rxjs'; @@ -18,7 +17,7 @@ import { SelectComponent } from '@osf/shared/components'; import { DEFAULT_TABLE_PARAMS } from '@osf/shared/constants'; import { Primitive } from '@osf/shared/helpers'; import { SearchFilters } from '@osf/shared/models'; -import { ToastService } from '@osf/shared/services'; +import { CustomDialogService, ToastService } from '@osf/shared/services'; import { SortOrder } from '@shared/enums'; import { AdminTableComponent } from '../../components'; @@ -36,11 +35,10 @@ import { FetchInstitutionUsers, InstitutionsAdminSelectors, SendUserMessage } fr templateUrl: './institutions-users.component.html', styleUrl: './institutions-users.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class InstitutionsUsersComponent { - private readonly translate = inject(TranslateService); - private readonly dialogService = inject(DialogService); + private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly destroyRef = inject(DestroyRef); private readonly toastService = inject(ToastService); private readonly environment = inject(ENVIRONMENT); @@ -76,7 +74,7 @@ export class InstitutionsUsersComponent { amountText = computed(() => { const count = this.totalCount(); - return count + ' ' + this.translate.instant('adminInstitutions.summary.totalUsers').toLowerCase(); + return count + ' ' + this.translateService.instant('adminInstitutions.summary.totalUsers').toLowerCase(); }); constructor() { @@ -109,14 +107,10 @@ export class InstitutionsUsersComponent { onIconClick(event: TableIconClickEvent): void { switch (event.action) { case 'sendMessage': { - this.dialogService + this.customDialogService .open(SendEmailDialogComponent, { + header: 'adminInstitutions.institutionUsers.sendEmail', width: '448px', - focusOnShow: false, - header: this.translate.instant('adminInstitutions.institutionUsers.sendEmail'), - closeOnEscape: true, - modal: true, - closable: true, data: this.currentUser()?.fullName, }) .onClose.pipe( diff --git a/src/app/features/analytics/components/view-duplicates/view-duplicates.component.ts b/src/app/features/analytics/components/view-duplicates/view-duplicates.component.ts index 0641302f2..54c04300c 100644 --- a/src/app/features/analytics/components/view-duplicates/view-duplicates.component.ts +++ b/src/app/features/analytics/components/view-duplicates/view-duplicates.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Menu } from 'primeng/menu'; import { PaginatorState } from 'primeng/paginator'; @@ -42,6 +41,7 @@ import { ResourceType, UserPermissions } from '@osf/shared/enums'; import { IS_SMALL } from '@osf/shared/helpers'; import { ToolbarResource } from '@osf/shared/models'; import { Duplicate } from '@osf/shared/models/duplicates'; +import { CustomDialogService } from '@osf/shared/services'; import { ClearDuplicates, DuplicatesSelectors, GetAllDuplicates } from '@osf/shared/stores'; @Component({ @@ -62,11 +62,9 @@ import { ClearDuplicates, DuplicatesSelectors, GetAllDuplicates } from '@osf/sha templateUrl: './view-duplicates.component.html', styleUrl: './view-duplicates.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class ViewDuplicatesComponent { - private dialogService = inject(DialogService); - private translateService = inject(TranslateService); + private customDialogService = inject(CustomDialogService); private route = inject(ActivatedRoute); private router = inject(Router); private destroyRef = inject(DestroyRef); @@ -180,21 +178,17 @@ export class ViewDuplicatesComponent { const dialogWidth = !this.isSmall() ? '95vw' : '450px'; if (toolbarResource) { - this.dialogService + this.customDialogService .open(ForkDialogComponent, { + header: 'project.overview.dialog.fork.headerProject', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('project.overview.dialog.fork.headerProject'), - closeOnEscape: true, - modal: true, - closable: true, data: { resource: toolbarResource, resourceType: this.resourceType(), }, }) .onClose.subscribe((result) => { - if (result.success) { + if (result?.success) { const resource = this.currentResource(); if (resource) { this.actions.getDuplicates(resource.id, resource.type, parseInt(this.currentPage()), this.pageSize); @@ -222,14 +216,10 @@ export class ViewDuplicatesComponent { private handleDeleteFork(id: string): void { const dialogWidth = !this.isSmall() ? '95vw' : '650px'; - this.dialogService + this.customDialogService .open(DeleteComponentDialogComponent, { + header: 'project.overview.dialog.deleteComponent.header', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('project.overview.dialog.deleteComponent.header'), - closeOnEscape: true, - modal: true, - closable: true, data: { componentId: id, resourceType: this.resourceType(), @@ -239,7 +229,7 @@ export class ViewDuplicatesComponent { }, }) .onClose.subscribe((result) => { - if (result && result.success) { + if (result?.success) { const resource = this.currentResource(); if (resource) { this.actions.getDuplicates(resource.id, resource.type, parseInt(this.currentPage()), this.pageSize); diff --git a/src/app/features/collections/components/add-to-collection/add-to-collection.component.ts b/src/app/features/collections/components/add-to-collection/add-to-collection.component.ts index cd508271e..ff3512069 100644 --- a/src/app/features/collections/components/add-to-collection/add-to-collection.component.ts +++ b/src/app/features/collections/components/add-to-collection/add-to-collection.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Stepper } from 'primeng/stepper'; import { Observable } from 'rxjs'; @@ -30,7 +29,7 @@ import { import { LoadingSpinnerComponent } from '@shared/components'; import { HeaderStyleHelper } from '@shared/helpers'; import { CanDeactivateComponent } from '@shared/models'; -import { BrandService } from '@shared/services'; +import { BrandService, CustomDialogService } from '@shared/services'; import { CollectionsSelectors, GetCollectionProvider } from '@shared/stores'; import { ProjectsSelectors } from '@shared/stores/projects/projects.selectors'; @@ -57,15 +56,13 @@ import { ], templateUrl: './add-to-collection.component.html', styleUrl: './add-to-collection.component.scss', - providers: [DialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class AddToCollectionComponent implements CanDeactivateComponent { private readonly router = inject(Router); private readonly route = inject(ActivatedRoute); private readonly destroyRef = inject(DestroyRef); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); readonly AddToCollectionSteps = AddToCollectionSteps; @@ -131,22 +128,18 @@ export class AddToCollectionComponent implements CanDeactivateComponent { userId: this.currentUser()?.id || '', }; - const dialogRef = this.dialogService.open(AddToCollectionConfirmationDialogComponent, { - width: '500px', - focusOnShow: false, - header: this.translateService.instant('collections.addToCollection.confirmationDialogHeader'), - closeOnEscape: true, - modal: true, - closable: true, - data: { payload, project: this.selectedProject() }, - }); - - dialogRef.onClose.subscribe((result) => { - if (result) { - this.allowNavigation.set(true); - this.router.navigate([this.selectedProject()?.id, 'overview']); - } - }); + this.customDialogService + .open(AddToCollectionConfirmationDialogComponent, { + header: 'collections.addToCollection.confirmationDialogHeader', + width: '500px', + data: { payload, project: this.selectedProject() }, + }) + .onClose.subscribe((result) => { + if (result) { + this.allowNavigation.set(true); + this.router.navigate([this.selectedProject()?.id, 'overview']); + } + }); } private initializeProvider(): void { diff --git a/src/app/features/collections/components/add-to-collection/project-contributors-step/project-contributors-step.component.ts b/src/app/features/collections/components/add-to-collection/project-contributors-step/project-contributors-step.component.ts index bee98ce2d..56c28c377 100644 --- a/src/app/features/collections/components/add-to-collection/project-contributors-step/project-contributors-step.component.ts +++ b/src/app/features/collections/components/add-to-collection/project-contributors-step/project-contributors-step.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Step, StepItem, StepPanel } from 'primeng/stepper'; import { Tooltip } from 'primeng/tooltip'; @@ -22,7 +21,7 @@ import { import { AddContributorType, ResourceType } from '@osf/shared/enums'; import { findChangedItems } from '@osf/shared/helpers'; import { ContributorDialogAddModel, ContributorModel } from '@osf/shared/models'; -import { CustomConfirmationService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, ToastService } from '@osf/shared/services'; import { AddContributor, ContributorsSelectors, @@ -36,13 +35,11 @@ import { imports: [Button, Step, StepItem, StepPanel, Tooltip, TranslatePipe, ContributorsTableComponent, InfoIconComponent], templateUrl: './project-contributors-step.component.html', styleUrl: './project-contributors-step.component.scss', - providers: [DialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class ProjectContributorsStepComponent { private readonly destroyRef = inject(DestroyRef); - private readonly translateService = inject(TranslateService); - private readonly dialogService = inject(DialogService); + private readonly customDialogService = inject(CustomDialogService); private readonly toastService = inject(ToastService); private readonly customConfirmationService = inject(CustomConfirmationService); @@ -127,15 +124,11 @@ export class ProjectContributorsStepComponent { private openAddContributorDialog() { const addedContributorIds = this.projectContributors().map((x) => x.userId); - this.dialogService + this.customDialogService .open(AddContributorDialogComponent, { + header: 'project.contributors.addDialog.addRegisteredContributor', width: '448px', data: addedContributorIds, - focusOnShow: false, - header: this.translateService.instant('project.contributors.addDialog.addRegisteredContributor'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ContributorDialogAddModel) => !!res), @@ -157,14 +150,10 @@ export class ProjectContributorsStepComponent { } private openAddUnregisteredContributorDialog() { - this.dialogService + this.customDialogService .open(AddUnregisteredContributorDialogComponent, { + header: 'project.contributors.addDialog.addUnregisteredContributor', width: '448px', - focusOnShow: false, - header: this.translateService.instant('project.contributors.addDialog.addUnregisteredContributor'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ContributorDialogAddModel) => !!res), diff --git a/src/app/features/collections/components/collections-discover/collections-discover.component.html b/src/app/features/collections/components/collections-discover/collections-discover.component.html index 3adf33906..9e1e0de8e 100644 --- a/src/app/features/collections/components/collections-discover/collections-discover.component.html +++ b/src/app/features/collections/components/collections-discover/collections-discover.component.html @@ -12,11 +12,7 @@

{{ collectionProvider()?.name }}

- +
diff --git a/src/app/features/collections/components/collections-discover/collections-discover.component.ts b/src/app/features/collections/components/collections-discover/collections-discover.component.ts index 1f02a6d42..3a6c72cf1 100644 --- a/src/app/features/collections/components/collections-discover/collections-discover.component.ts +++ b/src/app/features/collections/components/collections-discover/collections-discover.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { debounceTime } from 'rxjs'; @@ -16,7 +15,7 @@ import { ClearCurrentProvider } from '@core/store/provider'; import { LoadingSpinnerComponent, SearchInputComponent } from '@osf/shared/components'; import { HeaderStyleHelper } from '@osf/shared/helpers'; import { CollectionsFilters } from '@osf/shared/models'; -import { BrandService } from '@osf/shared/services'; +import { BrandService, CustomDialogService } from '@osf/shared/services'; import { ClearCollections, ClearCollectionSubmissions, @@ -44,14 +43,13 @@ import { CollectionsMainContentComponent } from '../collections-main-content'; ], templateUrl: './collections-discover.component.html', styleUrl: './collections-discover.component.scss', - providers: [DialogService, CollectionsQuerySyncService], + providers: [CollectionsQuerySyncService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class CollectionsDiscoverComponent { private router = inject(Router); private route = inject(ActivatedRoute); - private dialogService = inject(DialogService); - private translateService = inject(TranslateService); + private customDialogService = inject(CustomDialogService); private querySyncService = inject(CollectionsQuerySyncService); private destroyRef = inject(DestroyRef); @@ -85,13 +83,7 @@ export class CollectionsDiscoverComponent { } openHelpDialog(): void { - this.dialogService.open(CollectionsHelpDialogComponent, { - focusOnShow: false, - header: this.translateService.instant('collections.helpDialog.header'), - closeOnEscape: true, - modal: true, - closable: true, - }); + this.customDialogService.open(CollectionsHelpDialogComponent, { header: 'collections.helpDialog.header' }); } onSearchTriggered(searchValue: string): void { diff --git a/src/app/features/collections/components/collections-search-results/collections-search-results.component.html b/src/app/features/collections/components/collections-search-results/collections-search-results.component.html index 6cb8f6ee6..badb44087 100644 --- a/src/app/features/collections/components/collections-search-results/collections-search-results.component.html +++ b/src/app/features/collections/components/collections-search-results/collections-search-results.component.html @@ -11,13 +11,14 @@ } - +
+ +
} @else {

{{ 'collections.searchResults.noResultsFound' | translate }} diff --git a/src/app/features/files/components/file-metadata/file-metadata.component.ts b/src/app/features/files/components/file-metadata/file-metadata.component.ts index 4d7d3703b..ba39c7425 100644 --- a/src/app/features/files/components/file-metadata/file-metadata.component.ts +++ b/src/app/features/files/components/file-metadata/file-metadata.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Skeleton } from 'primeng/skeleton'; import { filter, map, of } from 'rxjs'; @@ -16,6 +15,7 @@ import { ENVIRONMENT } from '@core/provider/environment.provider'; import { languageCodes } from '@osf/shared/constants'; import { hasViewOnlyParam } from '@osf/shared/helpers'; import { LanguageCodeModel } from '@osf/shared/models'; +import { CustomDialogService } from '@osf/shared/services'; import { FileMetadataFields } from '../../constants'; import { PatchFileMetadata } from '../../models'; @@ -28,14 +28,12 @@ import { EditFileMetadataDialogComponent } from '../edit-file-metadata-dialog/ed templateUrl: './file-metadata.component.html', styleUrl: './file-metadata.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class FileMetadataComponent { private readonly actions = createDispatchMap({ setFileMetadata: SetFileMetadata }); private readonly route = inject(ActivatedRoute); private readonly router = inject(Router); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly environment = inject(ENVIRONMENT); fileMetadata = select(FilesSelectors.getFileCustomMetadata); @@ -68,14 +66,10 @@ export class FileMetadataComponent { } openEditFileMetadataDialog() { - this.dialogService + this.customDialogService .open(EditFileMetadataDialogComponent, { + header: 'files.detail.fileMetadata.edit', width: '448px', - focusOnShow: false, - header: this.translateService.instant('files.detail.fileMetadata.edit'), - closeOnEscape: true, - modal: true, - closable: true, data: this.fileMetadata(), }) .onClose.pipe(filter((res: PatchFileMetadata) => !!res)) diff --git a/src/app/features/files/pages/files/files.component.ts b/src/app/features/files/pages/files/files.component.ts index 3333fa78c..a055b7aff 100644 --- a/src/app/features/files/pages/files/files.component.ts +++ b/src/app/features/files/pages/files/files.component.ts @@ -5,7 +5,6 @@ import { TranslatePipe, TranslateService } from '@ngx-translate/core'; import { TreeDragDropService } from 'primeng/api'; import { Button } from 'primeng/button'; import { Dialog } from 'primeng/dialog'; -import { DialogService } from 'primeng/dynamicdialog'; import { Select } from 'primeng/select'; import { TableModule } from 'primeng/table'; @@ -72,7 +71,7 @@ import { ViewOnlyLinkMessageComponent, } from '@shared/components'; import { ConfiguredAddonModel, FileLabelModel, FilesTreeActions, OsfFile, StorageItem } from '@shared/models'; -import { CustomConfirmationService, FilesService, ToastService } from '@shared/services'; +import { CustomConfirmationService, CustomDialogService, FilesService, ToastService } from '@shared/services'; import { DataciteService } from '@shared/services/datacite/datacite.service'; import { CreateFolderDialogComponent, FileBrowserInfoComponent } from '../../components'; @@ -101,7 +100,7 @@ import { FilesSelectors } from '../../store'; templateUrl: './files.component.html', styleUrl: './files.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService, TreeDragDropService], + providers: [TreeDragDropService], }) export class FilesComponent { googleFilePickerComponent = viewChild(GoogleFilePickerComponent); @@ -111,7 +110,7 @@ export class FilesComponent { private readonly filesService = inject(FilesService); private readonly activeRoute = inject(ActivatedRoute); private readonly destroyRef = inject(DestroyRef); - private readonly dialogService = inject(DialogService); + private readonly customDialogService = inject(CustomDialogService); private readonly translateService = inject(TranslateService); private readonly router = inject(Router); private readonly dataciteService = inject(DataciteService); @@ -428,20 +427,14 @@ export class FilesComponent { if (!newFolderLink) return; - this.dialogService + this.customDialogService .open(CreateFolderDialogComponent, { + header: 'files.dialogs.createFolder.title', width: '448px', - focusOnShow: false, - header: this.translateService.instant('files.dialogs.createFolder.title'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((folderName: string) => !!folderName), - switchMap((folderName: string) => { - return this.actions.createFolder(newFolderLink, folderName); - }), + switchMap((folderName: string) => this.actions.createFolder(newFolderLink, folderName)), take(1), finalize(() => { this.updateFilesList(); @@ -473,13 +466,9 @@ export class FilesComponent { showInfoDialog() { const dialogWidth = this.isMedium() ? '850px' : '95vw'; - this.dialogService.open(FileBrowserInfoComponent, { + this.customDialogService.open(FileBrowserInfoComponent, { + header: 'files.filesBrowserDialog.title', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('files.filesBrowserDialog.title'), - closeOnEscape: true, - modal: true, - closable: true, data: this.resourceType(), }); } diff --git a/src/app/features/home/pages/dashboard/dashboard.component.ts b/src/app/features/home/pages/dashboard/dashboard.component.ts index efde941ef..e8b7f7e81 100644 --- a/src/app/features/home/pages/dashboard/dashboard.component.ts +++ b/src/app/features/home/pages/dashboard/dashboard.component.ts @@ -1,10 +1,9 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { SortEvent } from 'primeng/api'; import { Button } from 'primeng/button'; -import { DialogService, DynamicDialogRef } from 'primeng/dynamicdialog'; import { TablePageEvent } from 'primeng/table'; import { debounceTime, distinctUntilChanged, filter, tap } from 'rxjs'; @@ -25,7 +24,7 @@ import { DEFAULT_TABLE_PARAMS } from '@osf/shared/constants'; import { SortOrder } from '@osf/shared/enums'; import { IS_MEDIUM } from '@osf/shared/helpers'; import { MyResourcesItem, MyResourcesSearchFilters, TableParameters } from '@osf/shared/models'; -import { ProjectRedirectDialogService } from '@osf/shared/services'; +import { CustomDialogService, ProjectRedirectDialogService } from '@osf/shared/services'; import { ClearMyResources, GetMyProjects, MyResourcesSelectors } from '@osf/shared/stores'; @Component({ @@ -41,14 +40,12 @@ import { ClearMyResources, GetMyProjects, MyResourcesSelectors } from '@osf/shar ], templateUrl: './dashboard.component.html', styleUrl: './dashboard.component.scss', - providers: [DialogService], }) export class DashboardComponent implements OnInit { private readonly destroyRef = inject(DestroyRef); private readonly router = inject(Router); private readonly route = inject(ActivatedRoute); - private readonly translateService = inject(TranslateService); - private readonly dialogService = inject(DialogService); + private readonly customDialogService = inject(CustomDialogService); private readonly projectRedirectDialogService = inject(ProjectRedirectDialogService); readonly isMedium = toSignal(inject(IS_MEDIUM)); @@ -70,11 +67,8 @@ export class DashboardComponent implements OnInit { return this.projects().filter((project) => project.title.toLowerCase().includes(search)); }); - readonly existsProjects = computed(() => { - return this.projects().length || !!this.searchControl.value?.length; - }); + readonly existsProjects = computed(() => this.projects().length || !!this.searchControl.value?.length); - dialogRef: DynamicDialogRef | null = null; emailAddress = ''; constructor() { @@ -194,15 +188,8 @@ export class DashboardComponent implements OnInit { createProject(): void { const dialogWidth = this.isMedium() ? '850px' : '95vw'; - this.dialogService - .open(CreateProjectDialogComponent, { - width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('myProjects.header.createProject'), - closeOnEscape: true, - modal: true, - closable: true, - }) + this.customDialogService + .open(CreateProjectDialogComponent, { header: 'myProjects.header.createProject', width: dialogWidth }) .onClose.pipe( filter((result) => result?.project.id), tap((result) => this.projectRedirectDialogService.showProjectRedirectDialog(result.project.id)), diff --git a/src/app/features/metadata/dialogs/contributors-dialog/contributors-dialog.component.ts b/src/app/features/metadata/dialogs/contributors-dialog/contributors-dialog.component.ts index 3d8963356..012178381 100644 --- a/src/app/features/metadata/dialogs/contributors-dialog/contributors-dialog.component.ts +++ b/src/app/features/metadata/dialogs/contributors-dialog/contributors-dialog.component.ts @@ -1,9 +1,9 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService, DynamicDialogConfig, DynamicDialogRef } from 'primeng/dynamicdialog'; +import { DynamicDialogConfig, DynamicDialogRef } from 'primeng/dynamicdialog'; import { filter, forkJoin } from 'rxjs'; @@ -30,7 +30,7 @@ import { import { AddContributorType, ContributorPermission, ResourceType } from '@osf/shared/enums'; import { findChangedItems } from '@osf/shared/helpers'; import { ContributorDialogAddModel, ContributorModel } from '@osf/shared/models'; -import { CustomConfirmationService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, ToastService } from '@osf/shared/services'; import { AddContributor, ContributorsSelectors, @@ -46,17 +46,15 @@ import { imports: [Button, SearchInputComponent, TranslatePipe, FormsModule, ContributorsTableComponent], templateUrl: './contributors-dialog.component.html', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class ContributorsDialogComponent implements OnInit { searchControl = new FormControl(''); readonly destroyRef = inject(DestroyRef); - readonly translateService = inject(TranslateService); + readonly customDialogService = inject(CustomDialogService); readonly toastService = inject(ToastService); readonly dialogRef = inject(DynamicDialogRef); readonly config = inject(DynamicDialogConfig); - readonly dialogService = inject(DialogService); readonly customConfirmationService = inject(CustomConfirmationService); isLoading = select(ContributorsSelectors.isContributorsLoading); @@ -120,15 +118,11 @@ export class ContributorsDialogComponent implements OnInit { openAddContributorDialog(): void { const addedContributorIds = this.initialContributors().map((x) => x.userId); - this.dialogService + this.customDialogService .open(AddContributorDialogComponent, { + header: 'project.contributors.addDialog.addRegisteredContributor', width: '448px', data: addedContributorIds, - focusOnShow: false, - header: this.translateService.instant('project.contributors.addDialog.addRegisteredContributor'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ContributorDialogAddModel) => !!res), @@ -152,14 +146,10 @@ export class ContributorsDialogComponent implements OnInit { } openAddUnregisteredContributorDialog() { - this.dialogService + this.customDialogService .open(AddUnregisteredContributorDialogComponent, { + header: 'project.contributors.addDialog.addUnregisteredContributor', width: '448px', - focusOnShow: false, - header: this.translateService.instant('project.contributors.addDialog.addUnregisteredContributor'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ContributorDialogAddModel) => !!res), diff --git a/src/app/features/metadata/metadata.component.ts b/src/app/features/metadata/metadata.component.ts index 0d1b98d2e..383a6dd98 100644 --- a/src/app/features/metadata/metadata.component.ts +++ b/src/app/features/metadata/metadata.component.ts @@ -2,8 +2,6 @@ import { createDispatchMap, select } from '@ngxs/store'; import { TranslatePipe, TranslateService } from '@ngx-translate/core'; -import { DialogService } from 'primeng/dynamicdialog'; - import { EMPTY, filter, switchMap } from 'rxjs'; import { @@ -24,7 +22,7 @@ import { MetadataTabsComponent, SubHeaderComponent } from '@osf/shared/component import { MetadataResourceEnum, ResourceType, UserPermissions } from '@osf/shared/enums'; import { IS_MEDIUM } from '@osf/shared/helpers'; import { MetadataTabsModel, SubjectModel } from '@osf/shared/models'; -import { CustomConfirmationService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, ToastService } from '@osf/shared/services'; import { ContributorsSelectors, FetchChildrenSubjects, @@ -105,13 +103,12 @@ import { templateUrl: './metadata.component.html', styleUrl: './metadata.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class MetadataComponent implements OnInit { private readonly activeRoute = inject(ActivatedRoute); private readonly router = inject(Router); private readonly destroyRef = inject(DestroyRef); - private readonly dialogService = inject(DialogService); + private readonly customDialogService = inject(CustomDialogService); private readonly translateService = inject(TranslateService); private readonly toastService = inject(ToastService); private readonly customConfirmationService = inject(CustomConfirmationService); @@ -326,13 +323,9 @@ export class MetadataComponent implements OnInit { } openEditContributorDialog(): void { - this.dialogService + this.customDialogService .open(ContributorsDialogComponent, { header: this.translateService.instant('project.metadata.contributors.editContributors'), - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, breakpoints: { '768px': '95vw' }, data: { resourceId: this.resourceId, @@ -347,14 +340,10 @@ export class MetadataComponent implements OnInit { } openEditTitleDialog(): void { - this.dialogService + this.customDialogService .open(EditTitleDialogComponent, { - header: this.translateService.instant('project.metadata.editTitle'), + header: 'project.metadata.editTitle', width: '500px', - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, data: this.metadata()?.title, }) .onClose.pipe( @@ -370,14 +359,10 @@ export class MetadataComponent implements OnInit { } openEditDescriptionDialog(): void { - this.dialogService + this.customDialogService .open(DescriptionDialogComponent, { - header: this.translateService.instant('project.metadata.description.dialog.header'), + header: 'project.metadata.description.dialog.header', width: '500px', - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, data: this.metadata()?.description, }) .onClose.pipe( @@ -394,19 +379,16 @@ export class MetadataComponent implements OnInit { openEditResourceInformationDialog(): void { const currentCustomMetadata = this.customItemMetadata(); - const dialogRef = this.dialogService.open(ResourceInformationDialogComponent, { - header: this.translateService.instant('project.metadata.resourceInformation.dialog.header'), - width: '500px', - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, - data: { - customItemMetadata: currentCustomMetadata, - }, - }); - dialogRef.onClose - .pipe( + + this.customDialogService + .open(ResourceInformationDialogComponent, { + header: 'project.metadata.resourceInformation.dialog.header', + width: '500px', + data: { + customItemMetadata: currentCustomMetadata, + }, + }) + .onClose.pipe( filter((result) => !!result && (result.resourceTypeGeneral || result.language)), switchMap((result) => { const updatedMetadata = { @@ -422,31 +404,23 @@ export class MetadataComponent implements OnInit { onShowResourceInfo() { const dialogWidth = this.isMedium() ? '850px' : '95vw'; - this.dialogService.open(ResourceInfoTooltipComponent, { + this.customDialogService.open(ResourceInfoTooltipComponent, { + header: 'project.metadata.resourceInformation.tooltipDialog.header', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('project.metadata.resourceInformation.tooltipDialog.header'), - closeOnEscape: true, - modal: true, - closable: true, data: this.resourceNameMap.get(this.resourceType()), }); } openEditLicenseDialog(): void { - const dialogRef = this.dialogService.open(LicenseDialogComponent, { - header: this.translateService.instant('project.metadata.license.dialog.header'), - width: '600px', - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, - data: { - metadata: this.metadata(), - }, - }); - dialogRef.onClose - .pipe( + this.customDialogService + .open(LicenseDialogComponent, { + header: 'project.metadata.license.dialog.header', + width: '600px', + data: { + metadata: this.metadata(), + }, + }) + .onClose.pipe( filter((result) => !!result && result.licenseId), switchMap((result) => { return this.actions.updateResourceLicense( @@ -463,19 +437,15 @@ export class MetadataComponent implements OnInit { openEditFundingDialog(): void { const currentCustomMetadata = this.customItemMetadata(); - const dialogRef = this.dialogService.open(FundingDialogComponent, { - header: this.translateService.instant('project.metadata.funding.dialog.header'), - width: '600px', - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, - data: { - funders: currentCustomMetadata?.funders || [], - }, - }); - dialogRef.onClose - .pipe( + this.customDialogService + .open(FundingDialogComponent, { + header: 'project.metadata.funding.dialog.header', + width: '600px', + data: { + funders: currentCustomMetadata?.funders || [], + }, + }) + .onClose.pipe( filter((result) => !!result && result.fundingEntries), switchMap((result) => { const updatedMetadata = { @@ -489,14 +459,10 @@ export class MetadataComponent implements OnInit { } openEditAffiliatedInstitutionsDialog(): void { - this.dialogService + this.customDialogService .open(AffiliatedInstitutionsDialogComponent, { - header: this.translateService.instant('project.metadata.affiliatedInstitutions.dialog.header'), + header: 'project.metadata.affiliatedInstitutions.dialog.header', width: '500px', - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, data: this.affiliatedInstitutions(), }) .onClose.pipe( @@ -541,17 +507,13 @@ export class MetadataComponent implements OnInit { } private openEditPublicationDoi() { - const dialogRef = this.dialogService.open(PublicationDoiDialogComponent, { - header: this.translateService.instant('project.metadata.doi.dialog.header'), - width: '600px', - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, - data: this.metadata()?.publicationDoi, - }); - dialogRef.onClose - .pipe( + this.customDialogService + .open(PublicationDoiDialogComponent, { + header: 'project.metadata.doi.dialog.header', + width: '600px', + data: this.metadata()?.publicationDoi, + }) + .onClose.pipe( filter((result: DialogValueModel) => !!result), switchMap((result) => this.actions.updateMetadata(this.resourceId, this.resourceType(), { article_doi: result.value }) @@ -566,13 +528,18 @@ export class MetadataComponent implements OnInit { if (!records) { return; } + const record = records.find((r) => r.id === recordId); + if (!record) { return; } + this.selectedCedarRecord.set(record); this.cedarFormReadonly.set(true); + const templateId = record.relationships?.template?.data?.id; + if (templateId && templates?.data) { const template = templates.data.find((t) => t.id === templateId); if (template) { diff --git a/src/app/features/moderation/components/collection-submission-item/collection-submission-item.component.ts b/src/app/features/moderation/components/collection-submission-item/collection-submission-item.component.ts index 7c0f867f7..e0c007a32 100644 --- a/src/app/features/moderation/components/collection-submission-item/collection-submission-item.component.ts +++ b/src/app/features/moderation/components/collection-submission-item/collection-submission-item.component.ts @@ -3,7 +3,6 @@ import { select } from '@ngxs/store'; import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core'; import { ActivatedRoute, Router } from '@angular/router'; @@ -22,13 +21,14 @@ import { SubmissionReviewStatus } from '../../enums'; imports: [TranslatePipe, IconComponent, DateAgoPipe, Button], templateUrl: './collection-submission-item.component.html', styleUrl: './collection-submission-item.component.scss', - providers: [DialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class CollectionSubmissionItemComponent { private router = inject(Router); private activatedRoute = inject(ActivatedRoute); + submission = input.required(); + collectionProvider = select(CollectionsSelectors.getCollectionProvider); readonly reviewStatusIcon = ReviewStatusIcon; diff --git a/src/app/features/moderation/components/moderators-list/moderators-list.component.ts b/src/app/features/moderation/components/moderators-list/moderators-list.component.ts index 7f37baf80..b1d219c4b 100644 --- a/src/app/features/moderation/components/moderators-list/moderators-list.component.ts +++ b/src/app/features/moderation/components/moderators-list/moderators-list.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { debounceTime, distinctUntilChanged, filter, forkJoin, map, of } from 'rxjs'; @@ -25,7 +24,7 @@ import { ActivatedRoute } from '@angular/router'; import { UserSelectors } from '@core/store/user'; import { SearchInputComponent } from '@osf/shared/components'; import { ResourceType } from '@osf/shared/enums'; -import { CustomConfirmationService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, ToastService } from '@osf/shared/services'; import { AddModeratorType, ModeratorPermission } from '../../enums'; import { ModeratorDialogAddModel, ModeratorModel } from '../../models'; @@ -47,16 +46,14 @@ import { ModeratorsTableComponent } from '../moderators-table/moderators-table.c templateUrl: './moderators-list.component.html', styleUrl: './moderators-list.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class ModeratorsListComponent implements OnInit { searchControl = new FormControl(''); private readonly route = inject(ActivatedRoute); private readonly destroyRef = inject(DestroyRef); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly customConfirmationService = inject(CustomConfirmationService); - private readonly dialogService = inject(DialogService); private readonly toastService = inject(ToastService); readonly providerId = toSignal( @@ -76,9 +73,10 @@ export class ModeratorsListComponent implements OnInit { const initialModerators = this.initialModerators(); if (!currentUserId) return false; - return initialModerators.some((moderator: ModeratorModel) => { - return moderator.userId === currentUserId && moderator.permission === ModeratorPermission.Admin; - }); + return initialModerators.some( + (moderator: ModeratorModel) => + moderator.userId === currentUserId && moderator.permission === ModeratorPermission.Admin + ); }); actions = createDispatchMap({ @@ -103,15 +101,11 @@ export class ModeratorsListComponent implements OnInit { openAddModeratorDialog() { const addedModeratorsIds = this.initialModerators().map((x) => x.userId); - this.dialogService + this.customDialogService .open(AddModeratorDialogComponent, { + header: 'moderation.addModerator', width: '448px', data: addedModeratorsIds, - focusOnShow: false, - header: this.translateService.instant('moderation.addModerator'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ModeratorDialogAddModel) => !!res), @@ -133,14 +127,11 @@ export class ModeratorsListComponent implements OnInit { } openInviteModeratorDialog() { - this.dialogService + this.customDialogService .open(InviteModeratorDialogComponent, { + header: 'moderation.inviteModerator', width: '448px', focusOnShow: false, - header: this.translateService.instant('moderation.inviteModerator'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ModeratorDialogAddModel) => !!res), diff --git a/src/app/features/moderation/components/moderators-table/moderators-table.component.ts b/src/app/features/moderation/components/moderators-table/moderators-table.component.ts index e3c721fd9..206cc71a4 100644 --- a/src/app/features/moderation/components/moderators-table/moderators-table.component.ts +++ b/src/app/features/moderation/components/moderators-table/moderators-table.component.ts @@ -1,7 +1,6 @@ -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Skeleton } from 'primeng/skeleton'; import { TableModule } from 'primeng/table'; @@ -18,6 +17,7 @@ import { } from '@osf/shared/components'; import { DEFAULT_TABLE_PARAMS } from '@osf/shared/constants'; import { TableParameters } from '@osf/shared/models'; +import { CustomDialogService } from '@osf/shared/services'; @Component({ selector: 'osf-moderators-table', @@ -25,7 +25,6 @@ import { TableParameters } from '@osf/shared/models'; templateUrl: './moderators-table.component.html', styleUrl: './moderators-table.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class ModeratorsTableComponent { items = input([]); @@ -36,8 +35,7 @@ export class ModeratorsTableComponent { update = output(); remove = output(); - dialogService = inject(DialogService); - translateService = inject(TranslateService); + customDialogService = inject(CustomDialogService); readonly tableParams = signal({ ...DEFAULT_TABLE_PARAMS }); readonly permissionsOptions = MODERATION_PERMISSIONS; @@ -54,26 +52,18 @@ export class ModeratorsTableComponent { } openEducationHistory(contributor: ModeratorModel) { - this.dialogService.open(EducationHistoryDialogComponent, { + this.customDialogService.open(EducationHistoryDialogComponent, { + header: 'project.contributors.table.headers.education', width: '552px', data: contributor.education, - focusOnShow: false, - header: this.translateService.instant('project.contributors.table.headers.education'), - closeOnEscape: true, - modal: true, - closable: true, }); } openEmploymentHistory(contributor: ModeratorModel) { - this.dialogService.open(EmploymentHistoryDialogComponent, { + this.customDialogService.open(EmploymentHistoryDialogComponent, { + header: 'project.contributors.table.headers.employment', width: '552px', data: contributor.employment, - focusOnShow: false, - header: this.translateService.instant('project.contributors.table.headers.employment'), - closeOnEscape: true, - modal: true, - closable: true, }); } } diff --git a/src/app/features/my-projects/my-projects.component.ts b/src/app/features/my-projects/my-projects.component.ts index 3f392c093..0e2e32b83 100644 --- a/src/app/features/my-projects/my-projects.component.ts +++ b/src/app/features/my-projects/my-projects.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import type { SortEvent } from 'primeng/api'; -import { DialogService } from 'primeng/dynamicdialog'; import { TablePageEvent } from 'primeng/table'; import { Tab, TabList, TabPanel, TabPanels, Tabs } from 'primeng/tabs'; @@ -38,7 +37,7 @@ import { GetMyRegistrations, MyResourcesSelectors, } from '@osf/shared/stores'; -import { ProjectRedirectDialogService } from '@shared/services'; +import { CustomDialogService, ProjectRedirectDialogService } from '@shared/services'; import { CreateProjectDialogComponent } from './components'; import { MY_PROJECTS_TABS } from './constants'; @@ -60,15 +59,13 @@ import { MyProjectsTab } from './enums'; ], templateUrl: './my-projects.component.html', styleUrl: './my-projects.component.scss', - providers: [DialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class MyProjectsComponent implements OnInit { readonly destroyRef = inject(DestroyRef); - readonly dialogService = inject(DialogService); + readonly customDialogService = inject(CustomDialogService); readonly router = inject(Router); readonly route = inject(ActivatedRoute); - readonly translateService = inject(TranslateService); readonly projectRedirectDialogService = inject(ProjectRedirectDialogService); readonly isLoading = signal(false); @@ -328,14 +325,10 @@ export class MyProjectsComponent implements OnInit { createProject(): void { const dialogWidth = this.isTablet() ? '850px' : '95vw'; - this.dialogService + this.customDialogService .open(CreateProjectDialogComponent, { + header: 'myProjects.header.createProject', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('myProjects.header.createProject'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((result) => result?.project.id), diff --git a/src/app/features/preprints/components/preprint-provider-hero/preprint-provider-hero.component.ts b/src/app/features/preprints/components/preprint-provider-hero/preprint-provider-hero.component.ts index 37218f65e..634e4932b 100644 --- a/src/app/features/preprints/components/preprint-provider-hero/preprint-provider-hero.component.ts +++ b/src/app/features/preprints/components/preprint-provider-hero/preprint-provider-hero.component.ts @@ -1,7 +1,6 @@ -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Skeleton } from 'primeng/skeleton'; import { TitleCasePipe } from '@angular/common'; @@ -10,6 +9,7 @@ import { FormControl } from '@angular/forms'; import { RouterLink } from '@angular/router'; import { PreprintProviderDetails } from '@osf/features/preprints/models'; +import { CustomDialogService } from '@osf/shared/services'; import { SearchInputComponent } from '@shared/components'; import { DecodeHtmlPipe } from '@shared/pipes'; @@ -20,12 +20,10 @@ import { PreprintsHelpDialogComponent } from '../preprints-help-dialog/preprints imports: [Button, RouterLink, SearchInputComponent, Skeleton, TranslatePipe, DecodeHtmlPipe, TitleCasePipe], templateUrl: './preprint-provider-hero.component.html', styleUrl: './preprint-provider-hero.component.scss', - providers: [DialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class PreprintProviderHeroComponent { - translateService = inject(TranslateService); - dialogService = inject(DialogService); + customDialogService = inject(CustomDialogService); searchControl = input(new FormControl()); preprintProvider = input.required(); @@ -37,12 +35,6 @@ export class PreprintProviderHeroComponent { } openHelpDialog() { - this.dialogService.open(PreprintsHelpDialogComponent, { - focusOnShow: false, - header: this.translateService.instant('preprints.helpDialog.header'), - closeOnEscape: true, - modal: true, - closable: true, - }); + this.customDialogService.open(PreprintsHelpDialogComponent, { header: 'preprints.helpDialog.header' }); } } diff --git a/src/app/features/preprints/components/stepper/file-step/file-step.component.ts b/src/app/features/preprints/components/stepper/file-step/file-step.component.ts index d3f23ff67..f2ce56e52 100644 --- a/src/app/features/preprints/components/stepper/file-step/file-step.component.ts +++ b/src/app/features/preprints/components/stepper/file-step/file-step.component.ts @@ -4,7 +4,6 @@ import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService } from 'primeng/dynamicdialog'; import { Select, SelectChangeEvent } from 'primeng/select'; import { Skeleton } from 'primeng/skeleton'; import { Tooltip } from 'primeng/tooltip'; @@ -63,7 +62,6 @@ import { CustomConfirmationService, ToastService } from '@shared/services'; ], templateUrl: './file-step.component.html', styleUrl: './file-step.component.scss', - providers: [DialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class FileStepComponent implements OnInit { @@ -105,15 +103,11 @@ export class FileStepComponent implements OnInit { versionFileMode = signal(false); - preprintHasPrimaryFile = computed(() => { - return !!this.preprint()?.primaryFileId; - }); + preprintHasPrimaryFile = computed(() => !!this.preprint()?.primaryFileId); - cancelSourceOptionButtonVisible = computed(() => { - return ( - !this.preprintFile() && this.selectedFileSource() !== PreprintFileSource.None && !this.isPreprintFileLoading() - ); - }); + cancelSourceOptionButtonVisible = computed( + () => !this.preprintFile() && this.selectedFileSource() !== PreprintFileSource.None && !this.isPreprintFileLoading() + ); projectNameControl = new FormControl(null); @@ -129,9 +123,7 @@ export class FileStepComponent implements OnInit { nextClicked = output(); backClicked = output(); - isFileSourceSelected = computed(() => { - return this.selectedFileSource() !== PreprintFileSource.None; - }); + isFileSourceSelected = computed(() => this.selectedFileSource() !== PreprintFileSource.None); ngOnInit() { this.actions.getPreprintFilesLinks(); diff --git a/src/app/features/preprints/components/stepper/metadata-step/contributors/contributors.component.ts b/src/app/features/preprints/components/stepper/metadata-step/contributors/contributors.component.ts index 50d28844b..507a0f494 100644 --- a/src/app/features/preprints/components/stepper/metadata-step/contributors/contributors.component.ts +++ b/src/app/features/preprints/components/stepper/metadata-step/contributors/contributors.component.ts @@ -1,10 +1,9 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService } from 'primeng/dynamicdialog'; import { Message } from 'primeng/message'; import { TableModule } from 'primeng/table'; @@ -33,7 +32,7 @@ import { import { AddContributorType, ContributorPermission, ResourceType } from '@osf/shared/enums'; import { findChangedItems } from '@osf/shared/helpers'; import { ContributorDialogAddModel, ContributorModel } from '@osf/shared/models'; -import { CustomConfirmationService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, ToastService } from '@osf/shared/services'; import { AddContributor, ContributorsSelectors, @@ -48,14 +47,12 @@ import { templateUrl: './contributors.component.html', styleUrl: './contributors.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class ContributorsComponent implements OnInit { preprintId = input(''); readonly destroyRef = inject(DestroyRef); - readonly translateService = inject(TranslateService); - readonly dialogService = inject(DialogService); + readonly customDialogService = inject(CustomDialogService); readonly toastService = inject(ToastService); readonly customConfirmationService = inject(CustomConfirmationService); @@ -114,15 +111,11 @@ export class ContributorsComponent implements OnInit { openAddContributorDialog() { const addedContributorIds = this.initialContributors().map((x) => x.userId); - this.dialogService + this.customDialogService .open(AddContributorDialogComponent, { + header: 'project.contributors.addDialog.addRegisteredContributor', width: '448px', data: addedContributorIds, - focusOnShow: false, - header: this.translateService.instant('project.contributors.addDialog.addRegisteredContributor'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ContributorDialogAddModel) => !!res), @@ -144,14 +137,10 @@ export class ContributorsComponent implements OnInit { } openAddUnregisteredContributorDialog() { - this.dialogService + this.customDialogService .open(AddUnregisteredContributorDialogComponent, { + header: 'project.contributors.addDialog.addUnregisteredContributor', width: '448px', - focusOnShow: false, - header: this.translateService.instant('project.contributors.addDialog.addUnregisteredContributor'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ContributorDialogAddModel) => !!res), diff --git a/src/app/features/preprints/pages/preprint-details/preprint-details.component.ts b/src/app/features/preprints/pages/preprint-details/preprint-details.component.ts index 2e44cfc24..58d4a0d85 100644 --- a/src/app/features/preprints/pages/preprint-details/preprint-details.component.ts +++ b/src/app/features/preprints/pages/preprint-details/preprint-details.component.ts @@ -3,7 +3,6 @@ import { createDispatchMap, select, Store } from '@ngxs/store'; import { TranslatePipe, TranslateService } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Skeleton } from 'primeng/skeleton'; import { filter, map, of } from 'rxjs'; @@ -50,7 +49,7 @@ import { GetPreprintProviderById, PreprintProvidersSelectors } from '@osf/featur import { CreateNewVersion, PreprintStepperSelectors } from '@osf/features/preprints/store/preprint-stepper'; import { IS_MEDIUM, pathJoin } from '@osf/shared/helpers'; import { ReviewPermissions, UserPermissions } from '@shared/enums'; -import { MetaTagsService } from '@shared/services'; +import { CustomDialogService, MetaTagsService } from '@shared/services'; import { DataciteService } from '@shared/services/datacite/datacite.service'; import { ContributorsSelectors } from '@shared/stores'; @@ -75,7 +74,7 @@ import { PreprintWarningBannerComponent } from '../../components/preprint-detail ], templateUrl: './preprint-details.component.html', styleUrl: './preprint-details.component.scss', - providers: [DialogService, DatePipe], + providers: [DatePipe], changeDetection: ChangeDetectionStrategy.OnPush, }) export class PreprintDetailsComponent implements OnInit, OnDestroy { @@ -86,8 +85,8 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy { private readonly route = inject(ActivatedRoute); private readonly location = inject(Location); private readonly store = inject(Store); - private readonly dialogService = inject(DialogService); private readonly destroyRef = inject(DestroyRef); + private readonly customDialogService = inject(CustomDialogService); private readonly translateService = inject(TranslateService); private readonly metaTags = inject(MetaTagsService); private readonly datePipe = inject(DatePipe); @@ -314,26 +313,23 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy { handleWithdrawClicked() { const dialogWidth = this.isMedium() ? '700px' : '340px'; - const dialogRef = this.dialogService.open(WithdrawDialogComponent, { - header: this.translateService.instant('preprints.details.withdrawDialog.title', { - preprintWord: this.preprintProvider()!.preprintWord, - }), - focusOnShow: false, - closeOnEscape: true, - width: dialogWidth, - modal: true, - closable: true, - data: { - preprint: this.preprint(), - provider: this.preprintProvider(), - }, - }); - - dialogRef.onClose.pipe(takeUntilDestroyed(this.destroyRef), filter(Boolean)).subscribe({ - next: () => { - this.fetchPreprint(this.preprintId()); - }, - }); + this.customDialogService + .open(WithdrawDialogComponent, { + header: this.translateService.instant('preprints.details.withdrawDialog.title', { + preprintWord: this.preprintProvider()!.preprintWord, + }), + width: dialogWidth, + data: { + preprint: this.preprint(), + provider: this.preprintProvider(), + }, + }) + .onClose.pipe(takeUntilDestroyed(this.destroyRef), filter(Boolean)) + .subscribe({ + next: () => { + this.fetchPreprint(this.preprintId()); + }, + }); } editPreprintClicked() { diff --git a/src/app/features/project/contributors/contributors.component.ts b/src/app/features/project/contributors/contributors.component.ts index 6059f9773..eaec7ce66 100644 --- a/src/app/features/project/contributors/contributors.component.ts +++ b/src/app/features/project/contributors/contributors.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Select } from 'primeng/select'; import { TableModule } from 'primeng/table'; @@ -40,7 +39,7 @@ import { ViewOnlyLinkJsonApi, ViewOnlyLinkModel, } from '@osf/shared/models'; -import { CustomConfirmationService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, ToastService } from '@osf/shared/services'; import { AddContributor, ContributorsSelectors, @@ -76,14 +75,12 @@ import { ResourceInfoModel } from './models'; templateUrl: './contributors.component.html', styleUrl: './contributors.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class ContributorsComponent implements OnInit { searchControl = new FormControl(''); readonly destroyRef = inject(DestroyRef); - readonly translateService = inject(TranslateService); - readonly dialogService = inject(DialogService); + readonly customDialogService = inject(CustomDialogService); readonly toastService = inject(ToastService); readonly customConfirmationService = inject(CustomConfirmationService); @@ -205,15 +202,11 @@ export class ContributorsComponent implements OnInit { openAddContributorDialog() { const addedContributorIds = this.initialContributors().map((x) => x.userId); - this.dialogService + this.customDialogService .open(AddContributorDialogComponent, { + header: 'project.contributors.addDialog.addRegisteredContributor', width: '448px', data: addedContributorIds, - focusOnShow: false, - header: this.translateService.instant('project.contributors.addDialog.addRegisteredContributor'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ContributorDialogAddModel) => !!res), @@ -235,14 +228,10 @@ export class ContributorsComponent implements OnInit { } openAddUnregisteredContributorDialog() { - this.dialogService + this.customDialogService .open(AddUnregisteredContributorDialogComponent, { + header: 'project.contributors.addDialog.addUnregisteredContributor', width: '448px', - focusOnShow: false, - header: this.translateService.instant('project.contributors.addDialog.addUnregisteredContributor'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ContributorDialogAddModel) => !!res), @@ -289,15 +278,11 @@ export class ContributorsComponent implements OnInit { rootParentId: this.resourceDetails().rootParentId, }; - this.dialogService + this.customDialogService .open(CreateViewLinkDialogComponent, { + header: 'project.contributors.createLinkDialog.dialogTitle', width: '448px', - focusOnShow: false, - header: this.translateService.instant('project.contributors.createLinkDialog.dialogTitle'), data: currentResource, - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res) => !!res), diff --git a/src/app/features/project/overview/components/add-component-dialog/add-component-dialog.component.html b/src/app/features/project/overview/components/add-component-dialog/add-component-dialog.component.html index 9f40bc758..ee2298811 100644 --- a/src/app/features/project/overview/components/add-component-dialog/add-component-dialog.component.html +++ b/src/app/features/project/overview/components/add-component-dialog/add-component-dialog.component.html @@ -63,7 +63,7 @@

{{ ('project.overview.dialog.addComponent.license.description' | translate) + ' ' + currentProject()?.title + '.' }} - + {{ 'project.overview.dialog.addComponent.license.learnMore' | translate }}

diff --git a/src/app/features/project/overview/components/linked-resources/linked-resources.component.ts b/src/app/features/project/overview/components/linked-resources/linked-resources.component.ts index 94c34efa2..0f53d3a79 100644 --- a/src/app/features/project/overview/components/linked-resources/linked-resources.component.ts +++ b/src/app/features/project/overview/components/linked-resources/linked-resources.component.ts @@ -1,9 +1,8 @@ import { select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Skeleton } from 'primeng/skeleton'; import { ChangeDetectionStrategy, Component, inject, input } from '@angular/core'; @@ -11,6 +10,7 @@ import { toSignal } from '@angular/core/rxjs-interop'; import { ContributorsListComponent, IconComponent, TruncatedTextComponent } from '@osf/shared/components'; import { IS_MEDIUM } from '@osf/shared/helpers'; +import { CustomDialogService } from '@osf/shared/services'; import { NodeLinksSelectors } from '@osf/shared/stores'; import { DeleteNodeLinkDialogComponent } from '../delete-node-link-dialog/delete-node-link-dialog.component'; @@ -21,12 +21,10 @@ import { LinkResourceDialogComponent } from '../link-resource-dialog/link-resour imports: [Button, Skeleton, TranslatePipe, TruncatedTextComponent, IconComponent, ContributorsListComponent], templateUrl: './linked-resources.component.html', styleUrl: './linked-resources.component.scss', - providers: [DialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class LinkedResourcesComponent { - private dialogService = inject(DialogService); - private translateService = inject(TranslateService); + private customDialogService = inject(CustomDialogService); canEdit = input.required(); @@ -37,13 +35,9 @@ export class LinkedResourcesComponent { openLinkProjectModal() { const dialogWidth = this.isMedium() ? '850px' : '95vw'; - this.dialogService.open(LinkResourceDialogComponent, { + this.customDialogService.open(LinkResourceDialogComponent, { + header: 'project.overview.dialog.linkProject.header', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('project.overview.dialog.linkProject.header'), - closeOnEscape: true, - modal: true, - closable: true, }); } @@ -54,13 +48,9 @@ export class LinkedResourcesComponent { if (!currentLink) return; - this.dialogService.open(DeleteNodeLinkDialogComponent, { + this.customDialogService.open(DeleteNodeLinkDialogComponent, { + header: 'project.overview.dialog.deleteNodeLink.header', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('project.overview.dialog.deleteNodeLink.header'), - closeOnEscape: true, - modal: true, - closable: true, data: { currentLink, }, diff --git a/src/app/features/project/overview/components/overview-components/overview-components.component.ts b/src/app/features/project/overview/components/overview-components/overview-components.component.ts index d04e23a9d..9ff668591 100644 --- a/src/app/features/project/overview/components/overview-components/overview-components.component.ts +++ b/src/app/features/project/overview/components/overview-components/overview-components.component.ts @@ -1,9 +1,8 @@ import { select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Menu } from 'primeng/menu'; import { Skeleton } from 'primeng/skeleton'; @@ -15,6 +14,7 @@ import { UserSelectors } from '@core/store/user'; import { ContributorsListComponent, IconComponent, TruncatedTextComponent } from '@osf/shared/components'; import { ResourceType, UserPermissions } from '@osf/shared/enums'; import { IS_XSMALL } from '@osf/shared/helpers'; +import { CustomDialogService } from '@osf/shared/services'; import { ComponentOverview } from '@shared/models'; import { ProjectOverviewSelectors } from '../../store'; @@ -30,8 +30,7 @@ import { DeleteComponentDialogComponent } from '../delete-component-dialog/delet }) export class OverviewComponentsComponent { private router = inject(Router); - private dialogService = inject(DialogService); - private translateService = inject(TranslateService); + private customDialogService = inject(CustomDialogService); isMobile = toSignal(inject(IS_XSMALL)); canEdit = input.required(); @@ -91,26 +90,18 @@ export class OverviewComponentsComponent { handleAddComponent(): void { const dialogWidth = this.isMobile() ? '95vw' : '850px'; - this.dialogService.open(AddComponentDialogComponent, { + this.customDialogService.open(AddComponentDialogComponent, { + header: 'project.overview.dialog.addComponent.header', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('project.overview.dialog.addComponent.header'), - closeOnEscape: true, - modal: true, - closable: true, }); } private handleDeleteComponent(componentId: string): void { const dialogWidth = this.isMobile() ? '95vw' : '650px'; - this.dialogService.open(DeleteComponentDialogComponent, { + this.customDialogService.open(DeleteComponentDialogComponent, { + header: 'project.overview.dialog.deleteComponent.header', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('project.overview.dialog.deleteComponent.header'), - closeOnEscape: true, - modal: true, - closable: true, data: { componentId, resourceType: ResourceType.Project, diff --git a/src/app/features/project/overview/components/overview-toolbar/overview-toolbar.component.ts b/src/app/features/project/overview/components/overview-toolbar/overview-toolbar.component.ts index bcaf905f9..f41b112c7 100644 --- a/src/app/features/project/overview/components/overview-toolbar/overview-toolbar.component.ts +++ b/src/app/features/project/overview/components/overview-toolbar/overview-toolbar.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select, Store } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Menu } from 'primeng/menu'; import { ToggleSwitch } from 'primeng/toggleswitch'; import { Tooltip } from 'primeng/tooltip'; @@ -21,7 +20,7 @@ import { IconComponent } from '@osf/shared/components'; import { ResourceType } from '@osf/shared/enums'; import { ShareableContent, ToolbarResource } from '@osf/shared/models'; import { FileSizePipe } from '@osf/shared/pipes'; -import { SocialShareService, ToastService } from '@osf/shared/services'; +import { CustomDialogService, SocialShareService, ToastService } from '@osf/shared/services'; import { AddResourceToBookmarks, BookmarksSelectors, @@ -56,10 +55,10 @@ import { TogglePublicityDialogComponent } from '../toggle-publicity-dialog/toggl }) export class OverviewToolbarComponent { private store = inject(Store); - private dialogService = inject(DialogService); - private translateService = inject(TranslateService); + private customDialogService = inject(CustomDialogService); private toastService = inject(ToastService); private socialShareService = inject(SocialShareService); + private readonly router = inject(Router); private readonly route = inject(ActivatedRoute); @@ -154,15 +153,11 @@ export class OverviewToolbarComponent { .pipe(takeUntilDestroyed(this.destroyRef)) .subscribe(() => this.isPublic.set(resource.isPublic)); - this.dialogService.open(TogglePublicityDialogComponent, { - focusOnShow: false, + this.customDialogService.open(TogglePublicityDialogComponent, { + header: isCurrentlyPublic + ? 'project.overview.dialog.makePrivate.header' + : 'project.overview.dialog.makePublic.header', width: dialogWidth, - header: this.translateService.instant( - isCurrentlyPublic ? 'project.overview.dialog.makePrivate.header' : 'project.overview.dialog.makePublic.header' - ), - closeOnEscape: true, - modal: true, - closable: true, data: { projectId: resource.id, isCurrentlyPublic, @@ -210,13 +205,10 @@ export class OverviewToolbarComponent { : resource?.resourceType === ResourceType.Registration ? 'project.overview.dialog.fork.headerRegistry' : ''; + if (resource) { - this.dialogService.open(ForkDialogComponent, { - focusOnShow: false, - header: this.translateService.instant(headerTranslation), - closeOnEscape: true, - modal: true, - closable: true, + this.customDialogService.open(ForkDialogComponent, { + header: headerTranslation, data: { resource: resource, }, @@ -225,14 +217,8 @@ export class OverviewToolbarComponent { } private handleDuplicateProject(): void { - this.dialogService - .open(DuplicateDialogComponent, { - focusOnShow: false, - header: this.translateService.instant('project.overview.dialog.duplicate.header'), - closeOnEscape: true, - modal: true, - closable: true, - }) + this.customDialogService + .open(DuplicateDialogComponent, { header: 'project.overview.dialog.duplicate.header' }) .onClose.subscribe({ next: () => { const duplicatedProject = this.duplicatedProject(); diff --git a/src/app/features/project/overview/project-overview.component.ts b/src/app/features/project/overview/project-overview.component.ts index 53d447925..468c8e2a1 100644 --- a/src/app/features/project/overview/project-overview.component.ts +++ b/src/app/features/project/overview/project-overview.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { ButtonModule } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Message } from 'primeng/message'; import { TagModule } from 'primeng/tag'; @@ -34,7 +33,7 @@ import { import { Mode, ResourceType } from '@osf/shared/enums'; import { hasViewOnlyParam, IS_XSMALL } from '@osf/shared/helpers'; import { MapProjectOverview } from '@osf/shared/mappers'; -import { MetaTagsService, ToastService } from '@osf/shared/services'; +import { CustomDialogService, MetaTagsService, ToastService } from '@osf/shared/services'; import { ClearCollections, ClearWiki, @@ -100,7 +99,7 @@ import { ViewOnlyLinkMessageComponent, ViewOnlyLinkMessageComponent, ], - providers: [DialogService, DatePipe], + providers: [DatePipe], changeDetection: ChangeDetectionStrategy.OnPush, }) export class ProjectOverviewComponent implements OnInit { @@ -110,8 +109,7 @@ export class ProjectOverviewComponent implements OnInit { private readonly router = inject(Router); private readonly destroyRef = inject(DestroyRef); private readonly toastService = inject(ToastService); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly dataciteService = inject(DataciteService); private readonly metaTags = inject(MetaTagsService); private readonly datePipe = inject(DatePipe); @@ -291,14 +289,10 @@ export class ProjectOverviewComponent implements OnInit { handleOpenMakeDecisionDialog() { const dialogWidth = this.isMobile() ? '95vw' : '600px'; - this.dialogService + this.customDialogService .open(MakeDecisionDialogComponent, { + header: 'moderation.makeDecision.header', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('moderation.makeDecision.header'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe(takeUntilDestroyed(this.destroyRef)) .subscribe((data) => { diff --git a/src/app/features/project/project-addons/components/configure-addon/configure-addon.component.ts b/src/app/features/project/project-addons/components/configure-addon/configure-addon.component.ts index ec4c8765f..13e91adad 100644 --- a/src/app/features/project/project-addons/components/configure-addon/configure-addon.component.ts +++ b/src/app/features/project/project-addons/components/configure-addon/configure-addon.component.ts @@ -5,7 +5,6 @@ import { TranslatePipe } from '@ngx-translate/core'; import { BreadcrumbModule } from 'primeng/breadcrumb'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService } from 'primeng/dynamicdialog'; import { Skeleton } from 'primeng/skeleton'; import { @@ -54,7 +53,7 @@ import { AddonDialogService } from '../../services/addon-dialog.service'; ], templateUrl: './configure-addon.component.html', styleUrl: './configure-addon.component.scss', - providers: [DialogService, AddonDialogService], + providers: [AddonDialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class ConfigureAddonComponent implements OnInit { diff --git a/src/app/features/project/project-addons/components/connect-configured-addon/connect-configured-addon.component.ts b/src/app/features/project/project-addons/components/connect-configured-addon/connect-configured-addon.component.ts index 106313f31..907623058 100644 --- a/src/app/features/project/project-addons/components/connect-configured-addon/connect-configured-addon.component.ts +++ b/src/app/features/project/project-addons/components/connect-configured-addon/connect-configured-addon.component.ts @@ -4,7 +4,7 @@ import { TranslatePipe, TranslateService } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { DialogModule } from 'primeng/dialog'; -import { DialogService, DynamicDialogModule } from 'primeng/dynamicdialog'; +import { DynamicDialogModule } from 'primeng/dynamicdialog'; import { RadioButtonModule } from 'primeng/radiobutton'; import { StepPanel, StepPanels, Stepper } from 'primeng/stepper'; import { TableModule } from 'primeng/table'; @@ -65,7 +65,7 @@ import { AddonDialogService } from '../../services'; DynamicDialogModule, ], templateUrl: './connect-configured-addon.component.html', - providers: [RadioButtonModule, DialogService, AddonDialogService], + providers: [AddonDialogService], styleUrl: './connect-configured-addon.component.scss', }) export class ConnectConfiguredAddonComponent { diff --git a/src/app/features/project/registrations/registrations.component.ts b/src/app/features/project/registrations/registrations.component.ts index 22bb24739..8ac6abb1c 100644 --- a/src/app/features/project/registrations/registrations.component.ts +++ b/src/app/features/project/registrations/registrations.component.ts @@ -2,7 +2,6 @@ import { createDispatchMap, select } from '@ngxs/store'; import { TranslatePipe } from '@ngx-translate/core'; -import { DialogService } from 'primeng/dynamicdialog'; import { PaginatorState } from 'primeng/paginator'; import { map, of } from 'rxjs'; @@ -35,14 +34,14 @@ import { GetRegistrations, RegistrationsSelectors } from './store'; ], templateUrl: './registrations.component.html', styleUrl: './registrations.component.scss', - providers: [DialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class RegistrationsComponent implements OnInit { private readonly route = inject(ActivatedRoute); private readonly router = inject(Router); private readonly environment = inject(ENVIRONMENT); - hasAdminAccess = select(CurrentResourceSelectors.hasAdminAccess); + + readonly hasAdminAccess = select(CurrentResourceSelectors.hasAdminAccess); readonly projectId = toSignal(this.route.parent?.params.pipe(map((params) => params['id'])) ?? of(undefined)); registrations = select(RegistrationsSelectors.getRegistrations); diff --git a/src/app/features/registries/components/files-control/files-control.component.ts b/src/app/features/registries/components/files-control/files-control.component.ts index 0cf8fc50b..e87d8e36a 100644 --- a/src/app/features/registries/components/files-control/files-control.component.ts +++ b/src/app/features/registries/components/files-control/files-control.component.ts @@ -1,11 +1,10 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { TreeDragDropService } from 'primeng/api'; import { Button } from 'primeng/button'; import { Dialog } from 'primeng/dialog'; -import { DialogService } from 'primeng/dynamicdialog'; import { EMPTY, filter, finalize, Observable, shareReplay, take } from 'rxjs'; @@ -30,7 +29,7 @@ import { FilesTreeComponent, LoadingSpinnerComponent } from '@osf/shared/compone import { FILE_SIZE_LIMIT } from '@osf/shared/constants'; import { ClearFileDirective } from '@osf/shared/directives'; import { FilesTreeActions, OsfFile } from '@osf/shared/models'; -import { FilesService, ToastService } from '@osf/shared/services'; +import { CustomDialogService, FilesService, ToastService } from '@osf/shared/services'; import { CreateFolder, @@ -57,7 +56,7 @@ import { templateUrl: './files-control.component.html', styleUrl: './files-control.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService, TreeDragDropService], + providers: [TreeDragDropService], }) export class FilesControlComponent implements OnDestroy { attachedFiles = input.required[]>(); @@ -68,10 +67,9 @@ export class FilesControlComponent implements OnDestroy { filesViewOnly = input(false); private readonly filesService = inject(FilesService); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly destroyRef = inject(DestroyRef); - private toastService = inject(ToastService); + private readonly toastService = inject(ToastService); private readonly helpScoutService = inject(HelpScoutService); readonly files = select(RegistriesSelectors.getFiles); @@ -136,14 +134,10 @@ export class FilesControlComponent implements OnDestroy { if (!newFolderLink) return; - this.dialogService + this.customDialogService .open(CreateFolderDialogComponent, { + header: 'files.dialogs.createFolder.title', width: '448px', - focusOnShow: false, - header: this.translateService.instant('files.dialogs.createFolder.title'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe(filter((folderName: string) => !!folderName)) .subscribe((folderName) => { diff --git a/src/app/features/registries/components/justification-review/justification-review.component.ts b/src/app/features/registries/components/justification-review/justification-review.component.ts index 3988ad984..015c67152 100644 --- a/src/app/features/registries/components/justification-review/justification-review.component.ts +++ b/src/app/features/registries/components/justification-review/justification-review.component.ts @@ -1,10 +1,9 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService } from 'primeng/dynamicdialog'; import { Message } from 'primeng/message'; import { ChangeDetectionStrategy, Component, computed, inject } from '@angular/core'; @@ -13,7 +12,7 @@ import { ActivatedRoute, Router } from '@angular/router'; import { RegistrationBlocksDataComponent } from '@osf/shared/components'; import { INPUT_VALIDATION_MESSAGES } from '@osf/shared/constants'; import { FieldType, RevisionReviewStates } from '@osf/shared/enums'; -import { CustomConfirmationService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, ToastService } from '@osf/shared/services'; import { SchemaActionTrigger } from '../../enums'; import { ClearState, DeleteSchemaResponse, HandleSchemaResponse, RegistriesSelectors } from '../../store'; @@ -25,14 +24,12 @@ import { ConfirmContinueEditingDialogComponent } from '../confirm-continue-editi templateUrl: './justification-review.component.html', styleUrl: './justification-review.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class JustificationReviewComponent { private readonly router = inject(Router); private readonly route = inject(ActivatedRoute); private readonly customConfirmationService = inject(CustomConfirmationService); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly toastService = inject(ToastService); readonly pages = select(RegistriesSelectors.getPagesSchema); @@ -126,13 +123,10 @@ export class JustificationReviewComponent { } continueEditing() { - this.dialogService + this.customDialogService .open(ConfirmContinueEditingDialogComponent, { + header: 'registries.justification.confirmContinueEditing.header', width: '552px', - header: this.translateService.instant('registries.justification.confirmContinueEditing.header'), - focusOnShow: false, - closeOnEscape: true, - modal: true, data: { revisionId: this.revisionId, }, diff --git a/src/app/features/registries/components/registries-metadata-step/registries-contributors/registries-contributors.component.ts b/src/app/features/registries/components/registries-metadata-step/registries-contributors/registries-contributors.component.ts index 6f9d7e441..609a57ac7 100644 --- a/src/app/features/registries/components/registries-metadata-step/registries-contributors/registries-contributors.component.ts +++ b/src/app/features/registries/components/registries-metadata-step/registries-contributors/registries-contributors.component.ts @@ -1,10 +1,9 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService } from 'primeng/dynamicdialog'; import { TableModule } from 'primeng/table'; import { filter, forkJoin, map, of } from 'rxjs'; @@ -33,7 +32,7 @@ import { import { AddContributorType, ContributorPermission, ResourceType } from '@osf/shared/enums'; import { findChangedItems } from '@osf/shared/helpers'; import { ContributorDialogAddModel, ContributorModel } from '@osf/shared/models'; -import { CustomConfirmationService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, ToastService } from '@osf/shared/services'; import { AddContributor, ContributorsSelectors, @@ -48,14 +47,12 @@ import { templateUrl: './registries-contributors.component.html', styleUrl: './registries-contributors.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class RegistriesContributorsComponent implements OnInit { control = input.required(); readonly destroyRef = inject(DestroyRef); - readonly translateService = inject(TranslateService); - readonly dialogService = inject(DialogService); + readonly customDialogService = inject(CustomDialogService); readonly toastService = inject(ToastService); readonly customConfirmationService = inject(CustomConfirmationService); @@ -128,15 +125,11 @@ export class RegistriesContributorsComponent implements OnInit { openAddContributorDialog() { const addedContributorIds = this.initialContributors().map((x) => x.userId); - this.dialogService + this.customDialogService .open(AddContributorDialogComponent, { + header: 'project.contributors.addDialog.addRegisteredContributor', width: '448px', data: addedContributorIds, - focusOnShow: false, - header: this.translateService.instant('project.contributors.addDialog.addRegisteredContributor'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ContributorDialogAddModel) => !!res), @@ -158,14 +151,10 @@ export class RegistriesContributorsComponent implements OnInit { } openAddUnregisteredContributorDialog() { - this.dialogService + this.customDialogService .open(AddUnregisteredContributorDialogComponent, { + header: 'project.contributors.addDialog.addUnregisteredContributor', width: '448px', - focusOnShow: false, - header: this.translateService.instant('project.contributors.addDialog.addUnregisteredContributor'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe( filter((res: ContributorDialogAddModel) => !!res), diff --git a/src/app/features/registries/components/registry-provider-hero/registry-provider-hero.component.ts b/src/app/features/registries/components/registry-provider-hero/registry-provider-hero.component.ts index a5377306a..cfe83aa9a 100644 --- a/src/app/features/registries/components/registry-provider-hero/registry-provider-hero.component.ts +++ b/src/app/features/registries/components/registry-provider-hero/registry-provider-hero.component.ts @@ -1,7 +1,6 @@ -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Skeleton } from 'primeng/skeleton'; import { TitleCasePipe } from '@angular/common'; @@ -14,7 +13,7 @@ import { HeaderStyleHelper } from '@osf/shared/helpers'; import { RegistryProviderDetails } from '@osf/shared/models'; import { SearchInputComponent } from '@shared/components'; import { DecodeHtmlPipe } from '@shared/pipes'; -import { BrandService } from '@shared/services'; +import { BrandService, CustomDialogService } from '@shared/services'; @Component({ selector: 'osf-registry-provider-hero', @@ -25,8 +24,7 @@ import { BrandService } from '@shared/services'; }) export class RegistryProviderHeroComponent implements OnDestroy { private readonly router = inject(Router); - private readonly translateService = inject(TranslateService); - private readonly dialogService = inject(DialogService); + private readonly customDialogService = inject(CustomDialogService); private readonly WHITE = '#ffffff'; searchControl = input(new FormControl()); @@ -59,13 +57,7 @@ export class RegistryProviderHeroComponent implements OnDestroy { } openHelpDialog() { - this.dialogService.open(PreprintsHelpDialogComponent, { - focusOnShow: false, - header: this.translateService.instant('preprints.helpDialog.header'), - closeOnEscape: true, - modal: true, - closable: true, - }); + this.customDialogService.open(PreprintsHelpDialogComponent, { header: 'preprints.helpDialog.header' }); } navigateToCreatePage() { diff --git a/src/app/features/registries/components/review/review.component.ts b/src/app/features/registries/components/review/review.component.ts index f2cfb1f41..d7c52631f 100644 --- a/src/app/features/registries/components/review/review.component.ts +++ b/src/app/features/registries/components/review/review.component.ts @@ -1,11 +1,10 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Accordion, AccordionContent, AccordionHeader, AccordionPanel } from 'primeng/accordion'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService } from 'primeng/dynamicdialog'; import { Message } from 'primeng/message'; import { Tag } from 'primeng/tag'; @@ -20,7 +19,7 @@ import { ContributorsListComponent, RegistrationBlocksDataComponent } from '@osf import { INPUT_VALIDATION_MESSAGES } from '@osf/shared/constants'; import { FieldType, ResourceType } from '@osf/shared/enums'; import { InterpolatePipe } from '@osf/shared/pipes'; -import { CustomConfirmationService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, ToastService } from '@osf/shared/services'; import { ContributorsSelectors, FetchSelectedSubjects, @@ -58,14 +57,12 @@ import { SelectComponentsDialogComponent } from '../select-components-dialog/sel templateUrl: './review.component.html', styleUrl: './review.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class ReviewComponent { private readonly router = inject(Router); private readonly route = inject(ActivatedRoute); private readonly customConfirmationService = inject(CustomConfirmationService); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly toastService = inject(ToastService); private readonly environment = inject(ENVIRONMENT); @@ -159,13 +156,10 @@ export class ReviewComponent { } openSelectComponentsForRegistrationDialog(): void { - this.dialogService + this.customDialogService .open(SelectComponentsDialogComponent, { + header: 'registries.review.selectComponents.title', width: '552px', - focusOnShow: false, - header: this.translateService.instant('registries.review.selectComponents.title'), - closeOnEscape: true, - modal: true, data: { parent: this.draftRegistration()?.branchedFrom, components: this.components(), @@ -179,13 +173,10 @@ export class ReviewComponent { } openConfirmRegistrationDialog(components?: string[]): void { - this.dialogService + this.customDialogService .open(ConfirmRegistrationDialogComponent, { + header: 'registries.review.confirmation.title', width: '552px', - focusOnShow: false, - header: this.translateService.instant('registries.review.confirmation.title'), - closeOnEscape: true, - modal: true, data: { draftId: this.draftId(), projectId: diff --git a/src/app/features/registries/pages/registries-provider-search/registries-provider-search.component.ts b/src/app/features/registries/pages/registries-provider-search/registries-provider-search.component.ts index cdf5dbed2..bc32f2b16 100644 --- a/src/app/features/registries/pages/registries-provider-search/registries-provider-search.component.ts +++ b/src/app/features/registries/pages/registries-provider-search/registries-provider-search.component.ts @@ -1,7 +1,5 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { DialogService } from 'primeng/dynamicdialog'; - import { ChangeDetectionStrategy, Component, inject, OnDestroy, OnInit } from '@angular/core'; import { FormControl } from '@angular/forms'; import { ActivatedRoute } from '@angular/router'; @@ -24,7 +22,6 @@ import { RegistryProviderHeroComponent } from '../../components/registry-provide templateUrl: './registries-provider-search.component.html', styleUrl: './registries-provider-search.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class RegistriesProviderSearchComponent implements OnInit, OnDestroy { private route = inject(ActivatedRoute); diff --git a/src/app/features/registry/components/registry-statuses/registry-statuses.component.ts b/src/app/features/registry/components/registry-statuses/registry-statuses.component.ts index 864fda317..0b179c285 100644 --- a/src/app/features/registry/components/registry-statuses/registry-statuses.component.ts +++ b/src/app/features/registry/components/registry-statuses/registry-statuses.component.ts @@ -1,16 +1,15 @@ import { createDispatchMap } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Accordion, AccordionContent, AccordionHeader, AccordionPanel } from 'primeng/accordion'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { ChangeDetectionStrategy, Component, computed, HostBinding, inject, input } from '@angular/core'; import { RouterLink } from '@angular/router'; import { RegistrationReviewStates, RegistryStatus, RevisionReviewStates } from '@osf/shared/enums'; -import { CustomConfirmationService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService } from '@osf/shared/services'; import { RegistryOverview } from '../../models'; import { MakePublic } from '../../store/registry-overview'; @@ -25,8 +24,7 @@ import { WithdrawDialogComponent } from '../withdraw-dialog/withdraw-dialog.comp }) export class RegistryStatusesComponent { @HostBinding('class') classes = 'flex-1 flex'; - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); registry = input.required(); canEdit = input(false); @@ -54,14 +52,11 @@ export class RegistryStatusesComponent { openWithdrawDialog(): void { const registry = this.registry(); + if (registry) { - this.dialogService.open(WithdrawDialogComponent, { + this.customDialogService.open(WithdrawDialogComponent, { + header: 'registry.overview.withdrawRegistration', width: '552px', - focusOnShow: false, - header: this.translateService.instant('registry.overview.withdrawRegistration'), - closeOnEscape: true, - modal: true, - closable: true, data: { registryId: registry.id, }, diff --git a/src/app/features/registry/pages/registry-overview/registry-overview.component.ts b/src/app/features/registry/pages/registry-overview/registry-overview.component.ts index 0ca7f2890..e07bfbc92 100644 --- a/src/app/features/registry/pages/registry-overview/registry-overview.component.ts +++ b/src/app/features/registry/pages/registry-overview/registry-overview.component.ts @@ -1,8 +1,7 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; -import { DialogService } from 'primeng/dynamicdialog'; import { Message } from 'primeng/message'; import { map, of, switchMap, tap } from 'rxjs'; @@ -35,7 +34,7 @@ import { RegistrationReviewStates, ResourceType, RevisionReviewStates, UserPermi import { hasViewOnlyParam, toCamelCase } from '@osf/shared/helpers'; import { MapRegistryOverview } from '@osf/shared/mappers'; import { SchemaResponse, ToolbarResource } from '@osf/shared/models'; -import { ToastService } from '@osf/shared/services'; +import { CustomDialogService, ToastService } from '@osf/shared/services'; import { FetchSelectedSubjects, GetBookmarksCollectionId, SubjectsSelectors } from '@osf/shared/stores'; import { ArchivingMessageComponent, RegistryRevisionsComponent, RegistryStatusesComponent } from '../../components'; @@ -70,7 +69,6 @@ import { templateUrl: './registry-overview.component.html', styleUrl: './registry-overview.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class RegistryOverviewComponent { @HostBinding('class') classes = 'flex-1 flex flex-column w-full h-full'; @@ -78,8 +76,7 @@ export class RegistryOverviewComponent { private readonly router = inject(Router); private readonly destroyRef = inject(DestroyRef); private readonly toastService = inject(ToastService); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); readonly registry = select(RegistryOverviewSelectors.getRegistry); readonly isRegistryLoading = select(RegistryOverviewSelectors.isRegistryLoading); @@ -290,19 +287,14 @@ export class RegistryOverviewComponent { } handleOpenMakeDecisionDialog() { - const dialogWidth = '600px'; this.actions .getRegistryReviewActions(this.registry()?.id || '') .pipe( switchMap(() => - this.dialogService + this.customDialogService .open(RegistryMakeDecisionComponent, { - width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('moderation.makeDecision.header'), - closeOnEscape: true, - modal: true, - closable: true, + header: 'moderation.makeDecision.header', + width: '600px', data: { registry: this.registry(), revisionId: this.revisionId, diff --git a/src/app/features/registry/pages/registry-resources/registry-resources.component.ts b/src/app/features/registry/pages/registry-resources/registry-resources.component.ts index 31373db97..beaff82f8 100644 --- a/src/app/features/registry/pages/registry-resources/registry-resources.component.ts +++ b/src/app/features/registry/pages/registry-resources/registry-resources.component.ts @@ -1,9 +1,8 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { filter, finalize, switchMap, take } from 'rxjs'; @@ -13,7 +12,7 @@ import { ActivatedRoute } from '@angular/router'; import { GetResourceMetadata, MetadataSelectors } from '@osf/features/metadata/store'; import { IconComponent, LoadingSpinnerComponent, SubHeaderComponent } from '@osf/shared/components'; -import { CustomConfirmationService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, ToastService } from '@osf/shared/services'; import { ResourceType, UserPermissions } from '@shared/enums'; import { AddResourceDialogComponent, EditResourceDialogComponent } from '../../components'; @@ -31,13 +30,11 @@ import { templateUrl: './registry-resources.component.html', styleUrl: './registry-resources.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class RegistryResourcesComponent { @HostBinding('class') classes = 'flex-1 flex flex-column w-full h-full'; private readonly route = inject(ActivatedRoute); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly toastService = inject(ToastService); private readonly customConfirmationService = inject(CustomConfirmationService); private readonly destroyRef = inject(DestroyRef); @@ -65,9 +62,7 @@ export class RegistryResourcesComponent { return registry.currentUserPermissions.includes(UserPermissions.Write); }); - addButtonVisible = computed(() => { - return !!this.registry()?.identifiers?.length && this.canEdit(); - }); + addButtonVisible = computed(() => !!this.registry()?.identifiers?.length && this.canEdit()); constructor() { this.actions.fetchRegistryData(this.registryId, ResourceType.Registration); @@ -95,13 +90,9 @@ export class RegistryResourcesComponent { } openAddResourceDialog() { - return this.dialogService.open(AddResourceDialogComponent, { - header: this.translateService.instant('resources.add'), + return this.customDialogService.open(AddResourceDialogComponent, { + header: 'resources.add', width: '500px', - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, data: { id: this.registryId }, }).onClose; } @@ -109,14 +100,10 @@ export class RegistryResourcesComponent { updateResource(resource: RegistryResource) { if (!this.registryId) return; - this.dialogService + this.customDialogService .open(EditResourceDialogComponent, { - header: this.translateService.instant('resources.edit'), + header: 'resources.edit', width: '500px', - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, data: { id: this.registryId, resource: resource }, }) .onClose.pipe( diff --git a/src/app/features/settings/account-settings/account-settings.component.ts b/src/app/features/settings/account-settings/account-settings.component.ts index a905f49e8..2a0187d38 100644 --- a/src/app/features/settings/account-settings/account-settings.component.ts +++ b/src/app/features/settings/account-settings/account-settings.component.ts @@ -2,8 +2,6 @@ import { createDispatchMap, select } from '@ngxs/store'; import { TranslatePipe } from '@ngx-translate/core'; -import { DialogService } from 'primeng/dynamicdialog'; - import { ChangeDetectionStrategy, Component, effect } from '@angular/core'; import { ReactiveFormsModule } from '@angular/forms'; @@ -39,7 +37,6 @@ import { GetAccountSettings, GetExternalIdentities, GetUserInstitutions } from ' AffiliatedInstitutionsComponent, TranslatePipe, ], - providers: [DialogService], templateUrl: './account-settings.component.html', styleUrl: './account-settings.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/src/app/features/settings/account-settings/components/connected-emails/connected-emails.component.ts b/src/app/features/settings/account-settings/components/connected-emails/connected-emails.component.ts index 7f6b93474..030c2b832 100644 --- a/src/app/features/settings/account-settings/components/connected-emails/connected-emails.component.ts +++ b/src/app/features/settings/account-settings/components/connected-emails/connected-emails.component.ts @@ -1,10 +1,9 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService } from 'primeng/dynamicdialog'; import { Skeleton } from 'primeng/skeleton'; import { filter, finalize, throttleTime } from 'rxjs'; @@ -16,7 +15,7 @@ import { DeleteEmail, GetEmails, MakePrimary, ResendConfirmation, UserEmailsSele import { UserSelectors } from '@osf/core/store/user'; import { ReadonlyInputComponent } from '@osf/shared/components'; import { IS_SMALL } from '@osf/shared/helpers'; -import { CustomConfirmationService, LoaderService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, LoaderService, ToastService } from '@osf/shared/services'; import { AccountEmail } from '../../models'; import { ConfirmationSentDialogComponent } from '../confirmation-sent-dialog/confirmation-sent-dialog.component'; @@ -32,8 +31,7 @@ import { AddEmailComponent } from '../'; export class ConnectedEmailsComponent { readonly isSmall = toSignal(inject(IS_SMALL)); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly destroyRef = inject(DestroyRef); private readonly customConfirmationService = inject(CustomConfirmationService); private readonly loaderService = inject(LoaderService); @@ -62,27 +60,19 @@ export class ConnectedEmailsComponent { }); addEmail() { - this.dialogService + this.customDialogService .open(AddEmailComponent, { + header: 'settings.accountSettings.connectedEmails.dialog.title', width: '448px', - focusOnShow: false, - header: this.translateService.instant('settings.accountSettings.connectedEmails.dialog.title'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe(filter((email: string) => !!email)) .subscribe((email) => this.showConfirmationSentDialog(email)); } showConfirmationSentDialog(email: string) { - this.dialogService.open(ConfirmationSentDialogComponent, { + this.customDialogService.open(ConfirmationSentDialogComponent, { + header: 'settings.accountSettings.connectedEmails.confirmationSentDialog.header', width: '448px', - focusOnShow: false, - header: this.translateService.instant('settings.accountSettings.connectedEmails.confirmationSentDialog.header'), - closeOnEscape: true, - modal: true, - closable: true, data: email, }); } diff --git a/src/app/features/settings/account-settings/components/deactivate-account/deactivate-account.component.ts b/src/app/features/settings/account-settings/components/deactivate-account/deactivate-account.component.ts index 622f9dc26..e3520abd1 100644 --- a/src/app/features/settings/account-settings/components/deactivate-account/deactivate-account.component.ts +++ b/src/app/features/settings/account-settings/components/deactivate-account/deactivate-account.component.ts @@ -1,17 +1,16 @@ import { createDispatchMap, select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService } from 'primeng/dynamicdialog'; import { Message } from 'primeng/message'; import { filter } from 'rxjs'; import { ChangeDetectionStrategy, Component, inject } from '@angular/core'; -import { LoaderService, ToastService } from '@osf/shared/services'; +import { CustomDialogService, LoaderService, ToastService } from '@osf/shared/services'; import { AccountSettingsSelectors, CancelDeactivationRequest, DeactivateAccount } from '../../store'; import { CancelDeactivationComponent } from '../cancel-deactivation/cancel-deactivation.component'; @@ -25,8 +24,7 @@ import { DeactivationWarningComponent } from '../deactivation-warning/deactivati changeDetection: ChangeDetectionStrategy.OnPush, }) export class DeactivateAccountComponent { - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly toastService = inject(ToastService); private readonly loaderService = inject(LoaderService); @@ -38,14 +36,10 @@ export class DeactivateAccountComponent { accountSettings = select(AccountSettingsSelectors.getAccountSettings); deactivateAccount() { - this.dialogService + this.customDialogService .open(DeactivationWarningComponent, { + header: 'settings.accountSettings.deactivateAccount.dialog.deactivate.title', width: '552px', - focusOnShow: false, - header: this.translateService.instant('settings.accountSettings.deactivateAccount.dialog.deactivate.title'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe(filter((res: boolean) => res)) .subscribe(() => { @@ -59,14 +53,10 @@ export class DeactivateAccountComponent { } cancelDeactivation() { - this.dialogService + this.customDialogService .open(CancelDeactivationComponent, { + header: 'settings.accountSettings.deactivateAccount.dialog.undo.title', width: '552px', - focusOnShow: false, - header: this.translateService.instant('settings.accountSettings.deactivateAccount.dialog.undo.title'), - closeOnEscape: true, - modal: true, - closable: true, }) .onClose.pipe(filter((res: boolean) => res)) .subscribe(() => { diff --git a/src/app/features/settings/developer-apps/developer-apps-container.component.ts b/src/app/features/settings/developer-apps/developer-apps-container.component.ts index b384321cd..7e9ea5e6a 100644 --- a/src/app/features/settings/developer-apps/developer-apps-container.component.ts +++ b/src/app/features/settings/developer-apps/developer-apps-container.component.ts @@ -1,7 +1,5 @@ import { TranslatePipe, TranslateService } from '@ngx-translate/core'; -import { DialogService } from 'primeng/dynamicdialog'; - import { map } from 'rxjs'; import { ChangeDetectionStrategy, Component, inject } from '@angular/core'; @@ -10,6 +8,7 @@ import { Router, RouterOutlet } from '@angular/router'; import { SubHeaderComponent } from '@osf/shared/components'; import { IS_MEDIUM } from '@osf/shared/helpers'; +import { CustomDialogService } from '@osf/shared/services'; import { DeveloperAppAddEditFormComponent } from './components'; @@ -18,11 +17,10 @@ import { DeveloperAppAddEditFormComponent } from './components'; imports: [RouterOutlet, SubHeaderComponent, TranslatePipe], templateUrl: './developer-apps-container.component.html', styleUrl: './developer-apps-container.component.scss', - providers: [DialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class DeveloperAppsContainerComponent { - private readonly dialogService = inject(DialogService); + private readonly customDialogService = inject(CustomDialogService); private readonly router = inject(Router); private readonly isMedium = toSignal(inject(IS_MEDIUM)); private readonly translateService = inject(TranslateService); @@ -34,13 +32,9 @@ export class DeveloperAppsContainerComponent { createDeveloperApp(): void { const dialogWidth = this.isMedium() ? '500px' : '340px'; - this.dialogService.open(DeveloperAppAddEditFormComponent, { + this.customDialogService.open(DeveloperAppAddEditFormComponent, { + header: 'settings.developerApps.form.createTitle', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('settings.developerApps.form.createTitle'), - closeOnEscape: true, - modal: true, - closable: true, }); } } diff --git a/src/app/features/settings/developer-apps/pages/developer-app-details/developer-app-details.component.ts b/src/app/features/settings/developer-apps/pages/developer-app-details/developer-app-details.component.ts index 5b39b234a..a70c64111 100644 --- a/src/app/features/settings/developer-apps/pages/developer-app-details/developer-app-details.component.ts +++ b/src/app/features/settings/developer-apps/pages/developer-app-details/developer-app-details.component.ts @@ -4,7 +4,6 @@ import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService, DynamicDialogRef } from 'primeng/dynamicdialog'; import { IconField } from 'primeng/iconfield'; import { InputIcon } from 'primeng/inputicon'; import { InputText } from 'primeng/inputtext'; @@ -38,7 +37,6 @@ import { DeleteDeveloperApp, DeveloperAppsSelectors, GetDeveloperAppDetails, Res ], templateUrl: './developer-app-details.component.html', styleUrl: './developer-app-details.component.scss', - providers: [DialogService, DynamicDialogRef], changeDetection: ChangeDetectionStrategy.OnPush, }) export class DeveloperAppDetailsComponent { diff --git a/src/app/features/settings/tokens/components/token-add-edit-form/token-add-edit-form.component.ts b/src/app/features/settings/tokens/components/token-add-edit-form/token-add-edit-form.component.ts index cf2a5d7d1..83d098b35 100644 --- a/src/app/features/settings/tokens/components/token-add-edit-form/token-add-edit-form.component.ts +++ b/src/app/features/settings/tokens/components/token-add-edit-form/token-add-edit-form.component.ts @@ -1,10 +1,10 @@ import { createDispatchMap, select, Store } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Checkbox } from 'primeng/checkbox'; -import { DialogService, DynamicDialogRef } from 'primeng/dynamicdialog'; +import { DynamicDialogRef } from 'primeng/dynamicdialog'; import { map } from 'rxjs'; @@ -15,7 +15,7 @@ import { ActivatedRoute, Router } from '@angular/router'; import { TextInputComponent } from '@osf/shared/components'; import { InputLimits } from '@osf/shared/constants'; -import { ToastService } from '@osf/shared/services'; +import { CustomDialogService, ToastService } from '@osf/shared/services'; import { TokenForm, TokenFormControls, TokenModel } from '../../models'; import { CreateToken, GetTokens, TokensSelectors, UpdateToken } from '../../store'; @@ -31,8 +31,7 @@ import { TokenCreatedDialogComponent } from '../token-created-dialog/token-creat export class TokenAddEditFormComponent implements OnInit { private readonly route = inject(ActivatedRoute); private readonly router = inject(Router); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly toastService = inject(ToastService); private readonly store = inject(Store); @@ -112,12 +111,9 @@ export class TokenAddEditFormComponent implements OnInit { } showTokenCreatedDialog(tokenName: string, tokenValue: string) { - this.dialogService.open(TokenCreatedDialogComponent, { + this.customDialogService.open(TokenCreatedDialogComponent, { + header: 'settings.tokens.createdDialog.title', width: '500px', - header: this.translateService.instant('settings.tokens.createdDialog.title'), - closeOnEscape: true, - modal: true, - closable: true, data: { tokenName, tokenValue, diff --git a/src/app/features/settings/tokens/pages/token-details/token-details.component.ts b/src/app/features/settings/tokens/pages/token-details/token-details.component.ts index 454885e29..107d978dd 100644 --- a/src/app/features/settings/tokens/pages/token-details/token-details.component.ts +++ b/src/app/features/settings/tokens/pages/token-details/token-details.component.ts @@ -4,7 +4,6 @@ import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService, DynamicDialogRef } from 'primeng/dynamicdialog'; import { ChangeDetectionStrategy, Component, computed, inject, OnInit, signal } from '@angular/core'; import { ActivatedRoute, Router, RouterLink } from '@angular/router'; @@ -21,7 +20,6 @@ import { DeleteToken, GetTokenById, TokensSelectors } from '../../store'; changeDetection: ChangeDetectionStrategy.OnPush, templateUrl: './token-details.component.html', styleUrls: ['./token-details.component.scss'], - providers: [DialogService, DynamicDialogRef], }) export class TokenDetailsComponent implements OnInit { private readonly customConfirmationService = inject(CustomConfirmationService); diff --git a/src/app/features/settings/tokens/tokens.component.ts b/src/app/features/settings/tokens/tokens.component.ts index 194bfd636..e218e876f 100644 --- a/src/app/features/settings/tokens/tokens.component.ts +++ b/src/app/features/settings/tokens/tokens.component.ts @@ -1,8 +1,6 @@ import { createDispatchMap } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; - -import { DialogService } from 'primeng/dynamicdialog'; +import { TranslatePipe } from '@ngx-translate/core'; import { map } from 'rxjs'; @@ -12,6 +10,7 @@ import { Router, RouterOutlet } from '@angular/router'; import { SubHeaderComponent } from '@osf/shared/components'; import { IS_SMALL } from '@osf/shared/helpers'; +import { CustomDialogService } from '@osf/shared/services'; import { TokenAddEditFormComponent } from './components'; import { GetScopes } from './store'; @@ -21,13 +20,11 @@ import { GetScopes } from './store'; imports: [SubHeaderComponent, RouterOutlet, TranslatePipe], templateUrl: './tokens.component.html', styleUrl: './tokens.component.scss', - providers: [DialogService], changeDetection: ChangeDetectionStrategy.OnPush, }) export class TokensComponent implements OnInit { - private readonly dialogService = inject(DialogService); + private readonly customDialogService = inject(CustomDialogService); private readonly router = inject(Router); - private readonly translateService = inject(TranslateService); private readonly actions = createDispatchMap({ getScopes: GetScopes }); readonly isSmall = toSignal(inject(IS_SMALL)); @@ -42,13 +39,9 @@ export class TokensComponent implements OnInit { createToken(): void { const dialogWidth = this.isSmall() ? '800px ' : '95vw'; - this.dialogService.open(TokenAddEditFormComponent, { + this.customDialogService.open(TokenAddEditFormComponent, { + header: 'settings.tokens.form.createTitle', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('settings.tokens.form.createTitle'), - closeOnEscape: true, - modal: true, - closable: true, }); } } diff --git a/src/app/shared/components/addons/storage-item-selector/storage-item-selector.component.ts b/src/app/shared/components/addons/storage-item-selector/storage-item-selector.component.ts index f426232d0..fb3fbd92f 100644 --- a/src/app/shared/components/addons/storage-item-selector/storage-item-selector.component.ts +++ b/src/app/shared/components/addons/storage-item-selector/storage-item-selector.component.ts @@ -6,7 +6,6 @@ import { MenuItem } from 'primeng/api'; import { BreadcrumbModule } from 'primeng/breadcrumb'; import { Button } from 'primeng/button'; import { Card } from 'primeng/card'; -import { DialogService } from 'primeng/dynamicdialog'; import { InputText } from 'primeng/inputtext'; import { RadioButton } from 'primeng/radiobutton'; import { Skeleton } from 'primeng/skeleton'; @@ -30,6 +29,7 @@ import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms'; import { AddonType, OperationNames, StorageItemType } from '@osf/shared/enums'; import { convertCamelCaseToNormal, IS_MEDIUM, IS_XSMALL } from '@osf/shared/helpers'; import { OperationInvokeData, StorageItem } from '@osf/shared/models'; +import { CustomDialogService } from '@osf/shared/services'; import { AddonsSelectors, ClearOperationInvocations } from '@osf/shared/stores'; import { GoogleFilePickerComponent } from '../../google-file-picker/google-file-picker.component'; @@ -57,8 +57,9 @@ import { ResourceTypeInfoDialogComponent } from '../resource-type-info-dialog/re }) export class StorageItemSelectorComponent implements OnInit { private destroyRef = inject(DestroyRef); + private customDialogService = inject(CustomDialogService); private translateService = inject(TranslateService); - private dialogService = inject(DialogService); + readonly AddonType = AddonType; isMedium = toSignal(inject(IS_MEDIUM)); isMobile = toSignal(inject(IS_XSMALL)); @@ -253,13 +254,9 @@ export class StorageItemSelectorComponent implements OnInit { openInfoDialog() { const dialogWidth = this.isMedium() ? '850px' : '95vw'; - this.dialogService.open(ResourceTypeInfoDialogComponent, { + this.customDialogService.open(ResourceTypeInfoDialogComponent, { + header: 'settings.addons.configureAddon.aboutResourceType', width: dialogWidth, - focusOnShow: false, - header: this.translateService.instant('settings.addons.configureAddon.aboutResourceType'), - closeOnEscape: true, - modal: true, - closable: true, }); } } diff --git a/src/app/shared/components/contributors/contributors-table/contributors-table.component.ts b/src/app/shared/components/contributors/contributors-table/contributors-table.component.ts index 2e8eda2a3..1b42a40ec 100644 --- a/src/app/shared/components/contributors/contributors-table/contributors-table.component.ts +++ b/src/app/shared/components/contributors/contributors-table/contributors-table.component.ts @@ -1,8 +1,7 @@ -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Checkbox } from 'primeng/checkbox'; -import { DialogService } from 'primeng/dynamicdialog'; import { Skeleton } from 'primeng/skeleton'; import { TableModule } from 'primeng/table'; import { Tooltip } from 'primeng/tooltip'; @@ -17,6 +16,7 @@ import { SelectComponent } from '@osf/shared/components/select/select.component' import { DEFAULT_TABLE_PARAMS, PERMISSION_OPTIONS } from '@osf/shared/constants'; import { ContributorPermission } from '@osf/shared/enums'; import { ContributorModel, SelectOption, TableParameters } from '@osf/shared/models'; +import { CustomDialogService } from '@osf/shared/services'; @Component({ selector: 'osf-contributors-table', @@ -24,7 +24,6 @@ import { ContributorModel, SelectOption, TableParameters } from '@osf/shared/mod templateUrl: './contributors-table.component.html', styleUrl: './contributors-table.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class ContributorsTableComponent { contributors = input([]); @@ -55,8 +54,8 @@ export class ContributorsTableComponent { }); remove = output(); - dialogService = inject(DialogService); - translateService = inject(TranslateService); + + customDialogService = inject(CustomDialogService); readonly tableParams = signal({ ...DEFAULT_TABLE_PARAMS }); readonly permissionsOptions: SelectOption[] = PERMISSION_OPTIONS; @@ -70,26 +69,18 @@ export class ContributorsTableComponent { } openEducationHistory(contributor: ContributorModel) { - this.dialogService.open(EducationHistoryDialogComponent, { + this.customDialogService.open(EducationHistoryDialogComponent, { + header: 'project.contributors.table.headers.education', width: '552px', data: contributor.education, - focusOnShow: false, - header: this.translateService.instant('project.contributors.table.headers.education'), - closeOnEscape: true, - modal: true, - closable: true, }); } openEmploymentHistory(contributor: ContributorModel) { - this.dialogService.open(EmploymentHistoryDialogComponent, { + this.customDialogService.open(EmploymentHistoryDialogComponent, { + header: 'project.contributors.table.headers.employment', width: '552px', data: contributor.employment, - focusOnShow: false, - header: this.translateService.instant('project.contributors.table.headers.employment'), - closeOnEscape: true, - modal: true, - closable: true, }); } } diff --git a/src/app/shared/components/files-tree/files-tree.component.ts b/src/app/shared/components/files-tree/files-tree.component.ts index cdae7ea25..72bdfa333 100644 --- a/src/app/shared/components/files-tree/files-tree.component.ts +++ b/src/app/shared/components/files-tree/files-tree.component.ts @@ -1,10 +1,9 @@ import { select } from '@ngxs/store'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { PrimeTemplate } from 'primeng/api'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { PaginatorState } from 'primeng/paginator'; import { Tree, TreeNodeDropEvent } from 'primeng/tree'; @@ -38,7 +37,7 @@ import { FileMenuType } from '@osf/shared/enums'; import { hasViewOnlyParam } from '@osf/shared/helpers'; import { FileLabelModel, FileMenuAction, FileMenuFlags, FilesTreeActions, OsfFile } from '@osf/shared/models'; import { FileSizePipe } from '@osf/shared/pipes'; -import { CustomConfirmationService, FilesService, ToastService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService, FilesService, ToastService } from '@osf/shared/services'; import { DataciteService } from '@osf/shared/services/datacite/datacite.service'; import { CurrentResourceSelectors } from '@shared/stores'; @@ -72,8 +71,7 @@ export class FilesTreeComponent implements OnDestroy, AfterViewInit { readonly toastService = inject(ToastService); readonly route = inject(ActivatedRoute); readonly customConfirmationService = inject(CustomConfirmationService); - readonly dialogService = inject(DialogService); - readonly translateService = inject(TranslateService); + readonly customDialogService = inject(CustomDialogService); readonly dataciteService = inject(DataciteService); private readonly environment = inject(ENVIRONMENT); readonly clipboard = inject(Clipboard); @@ -314,14 +312,10 @@ export class FilesTreeComponent implements OnDestroy, AfterViewInit { } confirmRename(file: OsfFile): void { - this.dialogService + this.customDialogService .open(RenameFileDialogComponent, { + header: 'files.dialogs.renameFile.title', width: '448px', - focusOnShow: false, - header: this.translateService.instant('files.dialogs.renameFile.title'), - closeOnEscape: true, - modal: true, - closable: true, data: { currentName: file.name, }, @@ -364,19 +358,12 @@ export class FilesTreeComponent implements OnDestroy, AfterViewInit { .setMoveFileCurrentFolder?.(this.currentFolder()) .pipe(take(1)) .subscribe(() => { - const header = - action === 'move' - ? this.translateService.instant('files.dialogs.moveFile.title') - : this.translateService.instant('files.dialogs.copyFile.title'); + const header = action === 'move' ? 'files.dialogs.moveFile.title' : 'files.dialogs.copyFile.title'; - this.dialogService + this.customDialogService .open(MoveFileDialogComponent, { + header, width: '552px', - focusOnShow: false, - header: header, - closeOnEscape: true, - modal: true, - closable: true, data: { file: file, resourceId: this.resourceId(), diff --git a/src/app/shared/components/wiki/edit-section/edit-section.component.ts b/src/app/shared/components/wiki/edit-section/edit-section.component.ts index 9add131aa..421da33ef 100644 --- a/src/app/shared/components/wiki/edit-section/edit-section.component.ts +++ b/src/app/shared/components/wiki/edit-section/edit-section.component.ts @@ -1,14 +1,15 @@ import { LMarkdownEditorModule, MdEditorOption } from 'ngx-markdown-editor'; -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; import { Checkbox } from 'primeng/checkbox'; -import { DialogService } from 'primeng/dynamicdialog'; import { Panel } from 'primeng/panel'; import { ChangeDetectionStrategy, Component, effect, inject, input, OnInit, output } from '@angular/core'; import { FormsModule } from '@angular/forms'; +import { CustomDialogService } from '@osf/shared/services'; + import 'ace-builds/src-noconflict/ext-language_tools'; import { WikiSyntaxHelpDialogComponent } from '../wiki-syntax-help-dialog/wiki-syntax-help-dialog.component'; @@ -19,7 +20,6 @@ import { WikiSyntaxHelpDialogComponent } from '../wiki-syntax-help-dialog/wiki-s templateUrl: './edit-section.component.html', styleUrl: './edit-section.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class EditSectionComponent implements OnInit { readonly currentContent = input.required(); @@ -31,8 +31,8 @@ export class EditSectionComponent implements OnInit { private editorInstance: any; content = ''; initialContent = ''; - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + + private readonly customDialogService = inject(CustomDialogService); public options: MdEditorOption = { showPreviewPanel: false, @@ -100,10 +100,7 @@ export class EditSectionComponent implements OnInit { } openSyntaxHelpDialog() { - this.dialogService.open(WikiSyntaxHelpDialogComponent, { - header: this.translateService.instant('project.wiki.syntaxHelp.header'), - modal: true, - }); + this.customDialogService.open(WikiSyntaxHelpDialogComponent, { header: 'project.wiki.syntaxHelp.header' }); } toggleAutocomplete() { diff --git a/src/app/shared/components/wiki/wiki-list/wiki-list.component.ts b/src/app/shared/components/wiki/wiki-list/wiki-list.component.ts index c0adc5204..f65d26d75 100644 --- a/src/app/shared/components/wiki/wiki-list/wiki-list.component.ts +++ b/src/app/shared/components/wiki/wiki-list/wiki-list.component.ts @@ -1,7 +1,6 @@ -import { TranslatePipe, TranslateService } from '@ngx-translate/core'; +import { TranslatePipe } from '@ngx-translate/core'; import { Button } from 'primeng/button'; -import { DialogService } from 'primeng/dynamicdialog'; import { Panel } from 'primeng/panel'; import { PanelMenu } from 'primeng/panelmenu'; import { Skeleton } from 'primeng/skeleton'; @@ -10,7 +9,7 @@ import { ChangeDetectionStrategy, Component, computed, inject, input, output, si import { Router } from '@angular/router'; import { ComponentWiki, Wiki, WikiItemType, WikiMenuItem } from '@osf/shared/models'; -import { CustomConfirmationService } from '@osf/shared/services'; +import { CustomConfirmationService, CustomDialogService } from '@osf/shared/services'; import { AddWikiDialogComponent } from '../add-wiki-dialog/add-wiki-dialog.component'; @@ -20,7 +19,6 @@ import { AddWikiDialogComponent } from '../add-wiki-dialog/add-wiki-dialog.compo templateUrl: './wiki-list.component.html', styleUrl: './wiki-list.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, - providers: [DialogService], }) export class WikiListComponent { readonly list = input.required(); @@ -34,8 +32,7 @@ export class WikiListComponent { readonly deleteWiki = output(); readonly createWiki = output(); - private readonly dialogService = inject(DialogService); - private readonly translateService = inject(TranslateService); + private readonly customDialogService = inject(CustomDialogService); private readonly customConfirmationService = inject(CustomConfirmationService); private readonly router = inject(Router); @@ -85,13 +82,9 @@ export class WikiListComponent { }); openAddWikiDialog() { - this.dialogService + this.customDialogService .open(AddWikiDialogComponent, { - header: this.translateService.instant('project.wiki.addNewWiki'), - focusOnShow: false, - closeOnEscape: true, - modal: true, - closable: true, + header: 'project.wiki.addNewWiki', width: '448px', data: { resourceId: this.resourceId(), diff --git a/src/app/shared/services/custom-dialog.service.ts b/src/app/shared/services/custom-dialog.service.ts new file mode 100644 index 000000000..0e7b39e72 --- /dev/null +++ b/src/app/shared/services/custom-dialog.service.ts @@ -0,0 +1,31 @@ +import { TranslateService } from '@ngx-translate/core'; + +import { DialogService, DynamicDialogConfig, DynamicDialogRef } from 'primeng/dynamicdialog'; + +import { inject, Injectable } from '@angular/core'; + +@Injectable({ + providedIn: 'root', +}) +export class CustomDialogService { + private readonly dialogService = inject(DialogService); + private readonly translateService = inject(TranslateService); + + private readonly defaultOptions: Partial = { + focusOnShow: false, + closeOnEscape: true, + modal: true, + closable: true, + }; + + // eslint-disable-next-line @typescript-eslint/no-explicit-any + open(component: any, config?: Partial): DynamicDialogRef { + const finalConfig = { + ...this.defaultOptions, + ...config, + header: config?.header ? this.translateService.instant(config.header) : undefined, + }; + + return this.dialogService.open(component, finalConfig); + } +} diff --git a/src/app/shared/services/index.ts b/src/app/shared/services/index.ts index d39400ab3..14f0c0149 100644 --- a/src/app/shared/services/index.ts +++ b/src/app/shared/services/index.ts @@ -5,6 +5,7 @@ export { BrandService } from './brand.service'; export { CollectionsService } from './collections.service'; export { ContributorsService } from './contributors.service'; export { CustomConfirmationService } from './custom-confirmation.service'; +export { CustomDialogService } from './custom-dialog.service'; export { DuplicatesService } from './duplicates.service'; export { FilesService } from './files.service'; export { GlobalSearchService } from './global-search.service'; diff --git a/src/styles/components/collections.scss b/src/styles/components/collections.scss index 07401a6b3..035b82955 100644 --- a/src/styles/components/collections.scss +++ b/src/styles/components/collections.scss @@ -14,18 +14,6 @@ .collections-heading { color: var(--branding-secondary-color); } - - .collections-heading-btn { - --p-button-primary-background: var(--branding-primary-color); - --p-button-primary-border-color: var(--branding-primary-color); - --p-button-primary-color: var(--branding-secondary-color); - --p-button-primary-hover-background: var(--branding-primary-color); - --p-button-primary-hover-border-color: var(--branding-primary-color); - --p-button-primary-hover-color: var(--branding-secondary-color); - --p-button-primary-active-background: var(--branding-primary-color); - --p-button-primary-active-border-color: var(--branding-primary-color); - --p-button-primary-active-color: var(--branding-secondary-color); - } } .search-input-container {