+
diff --git a/demo-shell/src/app/components/form/form.component.scss b/demo-shell/src/app/components/form/app-form.component.scss similarity index 97% rename from demo-shell/src/app/components/form/form.component.scss rename to demo-shell/src/app/components/form/app-form.component.scss index c399a34a6e..01e2aa41cc 100644 --- a/demo-shell/src/app/components/form/form.component.scss +++ b/demo-shell/src/app/components/form/app-form.component.scss @@ -2,10 +2,6 @@ padding: 10px; } -.app-main-content { - padding: 0 15px; -} - .app-card-view { width: 30%; display: inline-block; @@ -31,7 +27,8 @@ } } -.main-content { +.app-main-content { + padding: 0 15px; .adf-form-config-editor { height: 500px; diff --git a/demo-shell/src/app/components/form/form.component.ts b/demo-shell/src/app/components/form/app-form.component.ts similarity index 80% rename from demo-shell/src/app/components/form/form.component.ts rename to demo-shell/src/app/components/form/app-form.component.ts index 20c4c61ecd..ded685d090 100644 --- a/demo-shell/src/app/components/form/form.component.ts +++ b/demo-shell/src/app/components/form/app-form.component.ts @@ -17,23 +17,32 @@ import { Component, inject, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core'; import { FormModel, FormFieldModel, FormService, FormOutcomeEvent, NotificationService, FormRenderingService } from '@alfresco/adf-core'; -import { ProcessFormRenderingService } from '@alfresco/adf-process-services'; +import { FormComponent, ProcessFormRenderingService } from '@alfresco/adf-process-services'; import { InMemoryFormService } from '../../services/in-memory-form.service'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { CoreAutomationService } from '../../../testing/automation.service'; +import { CommonModule } from '@angular/common'; +import { MatTabsModule } from '@angular/material/tabs'; +import { MonacoEditorModule } from 'ngx-monaco-editor-v2'; +import { MatButtonModule } from '@angular/material/button'; +import { FormsModule } from '@angular/forms'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatIconModule } from '@angular/material/icon'; @Component({ selector: 'app-form', - templateUrl: './form.component.html', - styleUrls: ['./form.component.scss'], + standalone: true, + imports: [CommonModule, MatTabsModule, FormComponent, MonacoEditorModule, MatButtonModule, FormsModule, TranslateModule, MatIconModule], + templateUrl: './app-form.component.html', + styleUrls: ['./app-form.component.scss'], providers: [ { provide: FormService, useClass: InMemoryFormService }, { provide: FormRenderingService, useClass: ProcessFormRenderingService } ], encapsulation: ViewEncapsulation.None }) -export class FormComponent implements OnInit, OnDestroy { +export class AppFormComponent implements OnInit, OnDestroy { private formService = inject(FormService); private notificationService = inject(NotificationService); private automationService = inject(CoreAutomationService); diff --git a/demo-shell/src/app/components/login/login.component.ts b/demo-shell/src/app/components/login/login.component.ts index 2d93a1ba8b..56a5fbcd5f 100644 --- a/demo-shell/src/app/components/login/login.component.ts +++ b/demo-shell/src/app/components/login/login.component.ts @@ -16,12 +16,16 @@ */ import { Component, ViewEncapsulation } from '@angular/core'; +import { MatIconModule } from '@angular/material/icon'; +import { AppConfigPipe, LoginComponent } from '@alfresco/adf-core'; +import { RouterLink } from '@angular/router'; @Component({ selector: 'app-login', + standalone: true, + imports: [MatIconModule, LoginComponent, AppConfigPipe, RouterLink], templateUrl: './login.component.html', styleUrls: ['./login.component.scss'], encapsulation: ViewEncapsulation.None }) -export class LoginComponent { -} +export class AppLoginComponent {} diff --git a/demo-shell/src/app/components/login/login.module.ts b/demo-shell/src/app/components/login/login.module.ts deleted file mode 100644 index 41c901e098..0000000000 --- a/demo-shell/src/app/components/login/login.module.ts +++ /dev/null @@ -1,41 +0,0 @@ -/*! - * @license - * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { NgModule } from '@angular/core'; -import { LoginComponent } from './login.component'; -import { Routes, RouterModule } from '@angular/router'; -import { CommonModule } from '@angular/common'; -import { CoreModule } from '@alfresco/adf-core'; -import { ContentModule } from '@alfresco/adf-content-services'; - -const routes: Routes = [ - { - path: '', - component: LoginComponent - } -]; - -@NgModule({ - imports: [ - CommonModule, - CoreModule, - RouterModule.forChild(routes), - ContentModule.forChild() - ], - declarations: [LoginComponent] -}) -export class AppLoginModule {} diff --git a/demo-shell/src/app/components/logout/logout.component.ts b/demo-shell/src/app/components/logout/logout.component.ts index 43dcf78aa4..4e31a8a838 100644 --- a/demo-shell/src/app/components/logout/logout.component.ts +++ b/demo-shell/src/app/components/logout/logout.component.ts @@ -16,9 +16,12 @@ */ import { Component } from '@angular/core'; +import { MatButtonModule } from '@angular/material/button'; @Component({ selector: 'app-logout', + standalone: true, + imports: [MatButtonModule], templateUrl: './logout.component.html', styleUrls: ['./logout.component.scss'] }) diff --git a/demo-shell/src/app/components/permissions/demo-permissions.component.ts b/demo-shell/src/app/components/permissions/demo-permissions.component.ts index c7455999e8..661c866140 100644 --- a/demo-shell/src/app/components/permissions/demo-permissions.component.ts +++ b/demo-shell/src/app/components/permissions/demo-permissions.component.ts @@ -17,18 +17,19 @@ import { Component, OnInit, Optional } from '@angular/core'; import { ActivatedRoute, Params } from '@angular/router'; +import { PermissionListComponent } from '@alfresco/adf-content-services'; @Component({ selector: 'app-permissions', + standalone: true, + imports: [PermissionListComponent], templateUrl: './demo-permissions.component.html', styleUrls: ['./demo-permissions.component.scss'] }) export class DemoPermissionComponent implements OnInit { - nodeId: string; - constructor(@Optional() private route: ActivatedRoute) { - } + constructor(@Optional() private route: ActivatedRoute) {} ngOnInit() { if (this.route) { diff --git a/demo-shell/src/app/components/process-list-demo/process-list-demo.component.ts b/demo-shell/src/app/components/process-list-demo/process-list-demo.component.ts index d11b9ab180..a233fed685 100644 --- a/demo-shell/src/app/components/process-list-demo/process-list-demo.component.ts +++ b/demo-shell/src/app/components/process-list-demo/process-list-demo.component.ts @@ -16,15 +16,35 @@ */ import { Component, OnInit, OnDestroy } from '@angular/core'; -import { UntypedFormGroup, UntypedFormBuilder, Validators, UntypedFormControl, AbstractControl } from '@angular/forms'; +import { UntypedFormGroup, UntypedFormBuilder, Validators, UntypedFormControl, AbstractControl, ReactiveFormsModule } from '@angular/forms'; import { ActivatedRoute, Params } from '@angular/router'; import { debounceTime, takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; import { ProcessInstanceQueryRepresentationSort, ProcessInstanceQueryRepresentationState } from '@alfresco/js-api'; +import { CommonModule } from '@angular/common'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { MatSelectModule } from '@angular/material/select'; +import { MatButtonModule } from '@angular/material/button'; +import { ProcessInstanceListComponent } from '@alfresco/adf-process-services'; +import { DataColumnComponent, DataColumnListComponent, PaginationComponent } from '@alfresco/adf-core'; const DEFAULT_SIZE = 20; @Component({ + standalone: true, + imports: [ + CommonModule, + ReactiveFormsModule, + MatFormFieldModule, + MatInputModule, + MatSelectModule, + MatButtonModule, + ProcessInstanceListComponent, + DataColumnListComponent, + DataColumnComponent, + PaginationComponent + ], templateUrl: './process-list-demo.component.html', styleUrls: [`./process-list-demo.component.scss`] }) diff --git a/demo-shell/src/app/components/process-list-demo/process-list.module.ts b/demo-shell/src/app/components/process-list-demo/process-list.module.ts deleted file mode 100644 index 083668b8a5..0000000000 --- a/demo-shell/src/app/components/process-list-demo/process-list.module.ts +++ /dev/null @@ -1,40 +0,0 @@ -/*! - * @license - * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { NgModule } from '@angular/core'; -import { ProcessListDemoComponent } from './process-list-demo.component'; -import { Routes, RouterModule } from '@angular/router'; -import { CommonModule } from '@angular/common'; -import { CoreModule } from '@alfresco/adf-core'; -import { ProcessModule } from '@alfresco/adf-process-services'; - -const routes: Routes = [ - { - path: '', - component: ProcessListDemoComponent - }, - { - path: ':id', - component: ProcessListDemoComponent - } -]; - -@NgModule({ - imports: [CommonModule, RouterModule.forChild(routes), CoreModule, ProcessModule], - declarations: [ProcessListDemoComponent] -}) -export class AppProcessListModule {} diff --git a/demo-shell/src/app/components/process-service/apps-view.component.ts b/demo-shell/src/app/components/process-service/apps-view.component.ts index 011b22f706..5909fcfebb 100644 --- a/demo-shell/src/app/components/process-service/apps-view.component.ts +++ b/demo-shell/src/app/components/process-service/apps-view.component.ts @@ -18,9 +18,12 @@ import { Component } from '@angular/core'; import { Router } from '@angular/router'; import { AppDefinitionRepresentation } from '@alfresco/js-api'; +import { AppsListComponent } from '@alfresco/adf-process-services'; @Component({ selector: 'app-process-list-view', + standalone: true, + imports: [AppsListComponent], templateUrl: './apps-view.component.html' }) export class AppsViewComponent { diff --git a/demo-shell/src/app/components/process-service/form-node-viewer.component.ts b/demo-shell/src/app/components/process-service/form-node-viewer.component.ts index af8b85b204..8d39ff90be 100644 --- a/demo-shell/src/app/components/process-service/form-node-viewer.component.ts +++ b/demo-shell/src/app/components/process-service/form-node-viewer.component.ts @@ -17,23 +17,24 @@ import { Component, OnInit } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; +import { FormComponent } from '@alfresco/adf-process-services'; +import { CommonModule } from '@angular/common'; @Component({ selector: 'app-form-node-viewer', + standalone: true, + imports: [CommonModule, FormComponent], templateUrl: './form-node-viewer.component.html', styleUrls: ['./form-node-viewer.component.css'] }) export class FormNodeViewerComponent implements OnInit { - nodeId: string; - constructor(private route: ActivatedRoute) { - } + constructor(private route: ActivatedRoute) {} ngOnInit() { this.route.params.subscribe((params) => { this.nodeId = params['id']; }); } - } diff --git a/demo-shell/src/app/components/process-service/form-viewer.component.ts b/demo-shell/src/app/components/process-service/form-viewer.component.ts index ddac3398ab..b899e66a46 100644 --- a/demo-shell/src/app/components/process-service/form-viewer.component.ts +++ b/demo-shell/src/app/components/process-service/form-viewer.component.ts @@ -17,18 +17,20 @@ import { Component, OnInit } from '@angular/core'; import { ActivatedRoute, Params } from '@angular/router'; +import { CommonModule } from '@angular/common'; +import { FormComponent } from '@alfresco/adf-process-services'; @Component({ selector: 'app-form-viewer', + standalone: true, + imports: [CommonModule, FormComponent], templateUrl: './form-viewer.component.html', styleUrls: ['./form-viewer.component.css'] }) export class FormViewerComponent implements OnInit { - taskId: string; - constructor(private route: ActivatedRoute) { - } + constructor(private route: ActivatedRoute) {} ngOnInit() { this.route.params.subscribe((params: Params) => { diff --git a/demo-shell/src/app/components/process-service/process-attachments.component.ts b/demo-shell/src/app/components/process-service/process-attachments.component.ts index 135da94e85..66918feb04 100644 --- a/demo-shell/src/app/components/process-service/process-attachments.component.ts +++ b/demo-shell/src/app/components/process-service/process-attachments.component.ts @@ -16,15 +16,32 @@ */ import { Component, inject, Input, OnChanges, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; -import { ProcessAttachmentListComponent, ProcessService, ProcessUploadService } from '@alfresco/adf-process-services'; -import { UploadService } from '@alfresco/adf-content-services'; +import { + CreateProcessAttachmentComponent, + ProcessAttachmentListComponent, + ProcessService, + ProcessUploadService +} from '@alfresco/adf-process-services'; +import { UploadDragAreaComponent, UploadService } from '@alfresco/adf-content-services'; import { PreviewService } from '../../services/preview.service'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { ProcessInstanceRepresentation } from '@alfresco/js-api'; +import { CommonModule } from '@angular/common'; +import { EmptyListComponent } from '@alfresco/adf-core'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'app-process-attachments', + standalone: true, + imports: [ + CommonModule, + UploadDragAreaComponent, + ProcessAttachmentListComponent, + EmptyListComponent, + TranslateModule, + CreateProcessAttachmentComponent + ], templateUrl: './process-attachments.component.html', styleUrls: ['./process-attachments.component.css'], providers: [{ provide: UploadService, useClass: ProcessUploadService }], diff --git a/demo-shell/src/app/components/process-service/process-service.component.html b/demo-shell/src/app/components/process-service/process-service.component.html index 699a9ed999..d80a425abf 100644 --- a/demo-shell/src/app/components/process-service/process-service.component.html +++ b/demo-shell/src/app/components/process-service/process-service.component.html @@ -20,9 +20,7 @@ (success)="onSuccessTaskFilterList()" #activitiFilter>
-
+
(); - constructor(public router: Router, - private preferences: UserPreferencesService, - private queryBuilder: SearchQueryBuilderService, - private route: ActivatedRoute) { + constructor( + public router: Router, + private preferences: UserPreferencesService, + private queryBuilder: SearchQueryBuilderService, + private route: ActivatedRoute + ) { combineLatest([this.route.params, this.queryBuilder.configUpdated]) .pipe(takeUntil(this.onDestroy$)) .subscribe(([params, searchConfig]) => { @@ -55,7 +77,7 @@ export class SearchResultComponent implements OnInit, OnDestroy { if (query) { this.queryBuilder.userQuery = query; } - }); + }); queryBuilder.paging = { maxItems: this.preferences.paginationSize, @@ -68,21 +90,17 @@ export class SearchResultComponent implements OnInit, OnDestroy { this.sorting = this.getSorting(); - this.queryBuilder.updated - .pipe(takeUntil(this.onDestroy$)) - .subscribe(() => { - this.sorting = this.getSorting(); - this.isLoading = true; - }); + this.queryBuilder.updated.pipe(takeUntil(this.onDestroy$)).subscribe(() => { + this.sorting = this.getSorting(); + this.isLoading = true; + }); - this.queryBuilder.executed - .pipe(takeUntil(this.onDestroy$)) - .subscribe((resultSetPaging: ResultSetPaging) => { - this.queryBuilder.paging.skipCount = 0; + this.queryBuilder.executed.pipe(takeUntil(this.onDestroy$)).subscribe((resultSetPaging: ResultSetPaging) => { + this.queryBuilder.paging.skipCount = 0; - this.onSearchResultLoaded(resultSetPaging); - this.isLoading = false; - }); + this.onSearchResultLoaded(resultSetPaging); + this.isLoading = false; + }); if (this.route) { this.route.params.forEach((params: Params) => { @@ -91,18 +109,20 @@ export class SearchResultComponent implements OnInit, OnDestroy { this.queryBuilder.update(); } else { this.queryBuilder.userQuery = null; - this.queryBuilder.executed.next(new ResultSetPaging({ - list: { - pagination: { totalItems: 0 }, - entries: [] - } - })); + this.queryBuilder.executed.next( + new ResultSetPaging({ + list: { + pagination: { totalItems: 0 }, + entries: [] + } + }) + ); } }); } } - private formatSearchQuery(userInput: string, fields = ['cm:name']) { + private formatSearchQuery(userInput: string, fields = ['cm:name']) { if (!userInput) { return null; } @@ -142,6 +162,6 @@ export class SearchResultComponent implements OnInit, OnDestroy { } switchLayout() { - this.router.navigate(['search-filter-chips', { q: this.searchedWord }] ); + this.router.navigate(['search-filter-chips', { q: this.searchedWord }]); } } diff --git a/demo-shell/src/app/components/settings/host-settings.component.ts b/demo-shell/src/app/components/settings/host-settings.component.ts index d5891f2c14..d025c89c4e 100644 --- a/demo-shell/src/app/components/settings/host-settings.component.ts +++ b/demo-shell/src/app/components/settings/host-settings.component.ts @@ -16,16 +16,33 @@ */ import { Component, EventEmitter, Output, ViewEncapsulation, OnInit, Input } from '@angular/core'; -import { Validators, UntypedFormGroup, UntypedFormBuilder, UntypedFormControl } from '@angular/forms'; +import { Validators, UntypedFormGroup, UntypedFormBuilder, UntypedFormControl, ReactiveFormsModule } from '@angular/forms'; import { AppConfigService, AppConfigValues, StorageService, AlfrescoApiService, AuthenticationService } from '@alfresco/adf-core'; import { ENTER } from '@angular/cdk/keycodes'; -import { MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field'; +import { MAT_FORM_FIELD_DEFAULT_OPTIONS, MatFormFieldModule } from '@angular/material/form-field'; +import { CommonModule } from '@angular/common'; +import { MatSelectModule } from '@angular/material/select'; +import { MatRadioModule } from '@angular/material/radio'; +import { MatInputModule } from '@angular/material/input'; +import { MatSlideToggleModule } from '@angular/material/slide-toggle'; +import { MatButtonModule } from '@angular/material/button'; export const HOST_REGEX = '^(http|https)://.*[^/]$'; @Component({ providers: [{ provide: MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: { floatLabel: 'always' } }], selector: 'adf-host-settings', + standalone: true, + imports: [ + CommonModule, + ReactiveFormsModule, + MatFormFieldModule, + MatSelectModule, + MatRadioModule, + MatInputModule, + MatSlideToggleModule, + MatButtonModule + ], templateUrl: 'host-settings.component.html', host: { class: 'adf-host-settings' }, styleUrls: ['./host-settings.component.scss'], @@ -161,7 +178,10 @@ export class HostSettingsComponent implements OnInit { } private createIdentityFormControl(): UntypedFormControl { - return new UntypedFormControl(this.appConfig.get(AppConfigValues.IDENTITY_HOST), [Validators.required, Validators.pattern(HOST_REGEX)]); + return new UntypedFormControl(this.appConfig.get(AppConfigValues.IDENTITY_HOST), [ + Validators.required, + Validators.pattern(HOST_REGEX) + ]); } private createECMFormControl(): UntypedFormControl { @@ -203,7 +223,7 @@ export class HostSettingsComponent implements OnInit { } private saveOAuthValues(values: any) { - if (values.oauthConfig.publicUrls && (typeof values.oauthConfig.publicUrls === 'string')) { + if (values.oauthConfig.publicUrls && typeof values.oauthConfig.publicUrls === 'string') { values.oauthConfig.publicUrls = values.oauthConfig.publicUrls.split(','); } @@ -278,5 +298,4 @@ export class HostSettingsComponent implements OnInit { get oauthConfig(): UntypedFormControl { return this.form.get('oauthConfig') as UntypedFormControl; } - } diff --git a/demo-shell/src/app/components/settings/settings.component.ts b/demo-shell/src/app/components/settings/settings.component.ts index 3a361a8ed2..0f01b52391 100644 --- a/demo-shell/src/app/components/settings/settings.component.ts +++ b/demo-shell/src/app/components/settings/settings.component.ts @@ -17,9 +17,13 @@ import { Component } from '@angular/core'; import { Router } from '@angular/router'; +import { CommonModule } from '@angular/common'; +import { HostSettingsComponent } from './host-settings.component'; @Component({ selector: 'app-settings', + standalone: true, + imports: [CommonModule, HostSettingsComponent], templateUrl: './settings.component.html' }) export class SettingsComponent { diff --git a/demo-shell/src/app/components/settings/settings.module.ts b/demo-shell/src/app/components/settings/settings.module.ts deleted file mode 100644 index 92f04bcb0d..0000000000 --- a/demo-shell/src/app/components/settings/settings.module.ts +++ /dev/null @@ -1,46 +0,0 @@ -/*! - * @license - * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { NgModule } from '@angular/core'; -import { SettingsComponent } from './settings.component'; -import { Routes, RouterModule } from '@angular/router'; -import { CommonModule } from '@angular/common'; -import { CoreModule } from '@alfresco/adf-core'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { HostSettingsComponent } from './host-settings.component'; - -const routes: Routes = [ - { - path: '', - component: SettingsComponent - } -]; - -@NgModule({ - imports: [ - CommonModule, - RouterModule.forChild(routes), - CoreModule, - FormsModule, - ReactiveFormsModule - ], - declarations: [ - SettingsComponent, - HostSettingsComponent - ] -}) -export class AppSettingsModule {} diff --git a/demo-shell/src/app/components/task-list-demo/task-list-demo.component.html b/demo-shell/src/app/components/task-list-demo/task-list-demo.component.html index 2721918a71..ab7fc8f192 100644 --- a/demo-shell/src/app/components/task-list-demo/task-list-demo.component.html +++ b/demo-shell/src/app/components/task-list-demo/task-list-demo.component.html @@ -3,9 +3,7 @@
App Id - + App ID must be a number @@ -13,16 +11,12 @@ Task Name - + Task Id - + @@ -182,8 +176,6 @@ - - +
diff --git a/demo-shell/src/app/components/task-list-demo/task-list-demo.component.ts b/demo-shell/src/app/components/task-list-demo/task-list-demo.component.ts index 25f52b8ee7..100f03e348 100644 --- a/demo-shell/src/app/components/task-list-demo/task-list-demo.component.ts +++ b/demo-shell/src/app/components/task-list-demo/task-list-demo.component.ts @@ -16,20 +16,43 @@ */ import { Component, OnInit, OnDestroy } from '@angular/core'; -import { UntypedFormGroup, UntypedFormBuilder, Validators, UntypedFormControl, AbstractControl } from '@angular/forms'; +import { UntypedFormGroup, UntypedFormBuilder, Validators, UntypedFormControl, AbstractControl, ReactiveFormsModule } from '@angular/forms'; import { ActivatedRoute, Params } from '@angular/router'; import { debounceTime, takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; import { set } from 'date-fns'; +import { CommonModule } from '@angular/common'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { MatDatepickerModule } from '@angular/material/datepicker'; +import { MatSelectModule } from '@angular/material/select'; +import { MatButtonModule } from '@angular/material/button'; +import { TaskListComponent } from '@alfresco/adf-process-services'; +import { DataColumnComponent, DataColumnListComponent, FullNamePipe, LocalizedDatePipe, PaginationComponent } from '@alfresco/adf-core'; const DEFAULT_SIZE = 20; @Component({ selector: 'app-task-list-demo', + standalone: true, + imports: [ + CommonModule, + ReactiveFormsModule, + MatFormFieldModule, + MatInputModule, + MatDatepickerModule, + MatSelectModule, + MatButtonModule, + TaskListComponent, + DataColumnListComponent, + DataColumnComponent, + FullNamePipe, + LocalizedDatePipe, + PaginationComponent + ], templateUrl: './task-list-demo.component.html', styleUrls: [`./task-list-demo.component.scss`] }) - export class TaskListDemoComponent implements OnInit, OnDestroy { taskListForm: UntypedFormGroup; @@ -54,33 +77,31 @@ export class TaskListDemoComponent implements OnInit, OnDestroy { includeProcessInstance: boolean; assignmentOptions = [ - {value: 'assignee', title: 'Assignee'}, - {value: 'candidate', title: 'Candidate'} + { value: 'assignee', title: 'Assignee' }, + { value: 'candidate', title: 'Candidate' } ]; includeProcessInstanceOptions = [ - {value: 'include', title: 'Include'}, - {value: 'exclude', title: 'Exclude'} + { value: 'include', title: 'Include' }, + { value: 'exclude', title: 'Exclude' } ]; stateOptions = [ - {value: 'all', title: 'All'}, - {value: 'active', title: 'Active'}, - {value: 'completed', title: 'Completed'} + { value: 'all', title: 'All' }, + { value: 'active', title: 'Active' }, + { value: 'completed', title: 'Completed' } ]; sortOptions = [ - {value: 'created-asc', title: 'Created (asc)'}, - {value: 'created-desc', title: 'Created (desc)'}, - {value: 'due-asc', title: 'Due (asc)'}, - {value: 'due-desc', title: 'Due (desc)'} + { value: 'created-asc', title: 'Created (asc)' }, + { value: 'created-desc', title: 'Created (desc)' }, + { value: 'due-asc', title: 'Due (asc)' }, + { value: 'due-desc', title: 'Due (desc)' } ]; private onDestroy$ = new Subject(); - constructor(private route: ActivatedRoute, - private formBuilder: UntypedFormBuilder) { - } + constructor(private route: ActivatedRoute, private formBuilder: UntypedFormBuilder) {} ngOnInit() { if (this.route) { @@ -120,16 +141,11 @@ export class TaskListDemoComponent implements OnInit, OnDestroy { taskIncludeProcessInstance: new UntypedFormControl() }); - this.taskListForm.valueChanges - .pipe( - debounceTime(500), - takeUntil(this.onDestroy$) - ) - .subscribe(taskFilter => { - if (this.isFormValid()) { - this.filterTasks(taskFilter); - } - }); + this.taskListForm.valueChanges.pipe(debounceTime(500), takeUntil(this.onDestroy$)).subscribe((taskFilter) => { + if (this.isFormValid()) { + this.filterTasks(taskFilter); + } + }); } filterTasks(taskFilter: any) { diff --git a/demo-shell/src/app/components/task-list-demo/task-list.module.ts b/demo-shell/src/app/components/task-list-demo/task-list.module.ts deleted file mode 100644 index 7196e67536..0000000000 --- a/demo-shell/src/app/components/task-list-demo/task-list.module.ts +++ /dev/null @@ -1,40 +0,0 @@ -/*! - * @license - * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { NgModule } from '@angular/core'; -import { TaskListDemoComponent } from './task-list-demo.component'; -import { Routes, RouterModule } from '@angular/router'; -import { CommonModule } from '@angular/common'; -import { CoreModule, FullNamePipe, LocalizedDatePipe } from '@alfresco/adf-core'; -import { ProcessModule } from '@alfresco/adf-process-services'; - -const routes: Routes = [ - { - path: '', - component: TaskListDemoComponent - }, - { - path: ':id', - component: TaskListDemoComponent - } -]; - -@NgModule({ - imports: [CommonModule, RouterModule.forChild(routes), CoreModule, ProcessModule, LocalizedDatePipe, FullNamePipe], - declarations: [TaskListDemoComponent] -}) -export class AppTaskListModule {} diff --git a/demo-shell/src/app/folder-directive/folder-create.directive.ts b/demo-shell/src/app/folder-directive/folder-create.directive.ts index 3e49d2c532..9161b7d8fa 100644 --- a/demo-shell/src/app/folder-directive/folder-create.directive.ts +++ b/demo-shell/src/app/folder-directive/folder-create.directive.ts @@ -26,7 +26,8 @@ const DEFAULT_FOLDER_PARENT_ID = '-my-'; const DIALOG_WIDTH: number = 400; @Directive({ - selector: '[adf-create-folder]' + selector: '[adf-create-folder]', + standalone: true }) export class FolderCreateDirective { /** Parent folder where the new folder will be located after creation. */ diff --git a/demo-shell/src/app/folder-directive/folder-directive.module.ts b/demo-shell/src/app/folder-directive/folder-directive.module.ts deleted file mode 100644 index 1ea7408d91..0000000000 --- a/demo-shell/src/app/folder-directive/folder-directive.module.ts +++ /dev/null @@ -1,29 +0,0 @@ -/*! - * @license - * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { CommonModule } from '@angular/common'; -import { NgModule } from '@angular/core'; -import { MaterialModule } from '../material.module'; - -import { FolderCreateDirective } from './folder-create.directive'; - -@NgModule({ - imports: [CommonModule, MaterialModule], - declarations: [FolderCreateDirective], - exports: [FolderCreateDirective] -}) -export class FolderDirectiveModule {} diff --git a/demo-shell/src/app/folder-directive/index.ts b/demo-shell/src/app/folder-directive/index.ts index 1e4e590bae..417b5dad12 100644 --- a/demo-shell/src/app/folder-directive/index.ts +++ b/demo-shell/src/app/folder-directive/index.ts @@ -16,5 +16,3 @@ */ export * from './folder-create.directive'; - -export * from './folder-directive.module'; diff --git a/demo-shell/src/app/material.module.ts b/demo-shell/src/app/material.module.ts deleted file mode 100644 index ea97216864..0000000000 --- a/demo-shell/src/app/material.module.ts +++ /dev/null @@ -1,63 +0,0 @@ -/*! - * @license - * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { NgModule } from '@angular/core'; -import { MatCardModule } from '@angular/material/card'; -import { MatDialogModule } from '@angular/material/dialog'; -import { MatExpansionModule } from '@angular/material/expansion'; -import { MatInputModule } from '@angular/material/input'; -import { MatListModule } from '@angular/material/list'; -import { MatMenuModule } from '@angular/material/menu'; -import { MatProgressBarModule } from '@angular/material/progress-bar'; -import { MatSelectModule } from '@angular/material/select'; -import { MatSidenavModule } from '@angular/material/sidenav'; -import { MatSlideToggleModule } from '@angular/material/slide-toggle'; -import { MatSnackBarModule } from '@angular/material/snack-bar'; -import { MatToolbarModule } from '@angular/material/toolbar'; - -@NgModule({ - imports: [ - MatSlideToggleModule, - MatInputModule, - MatSelectModule, - MatDialogModule, - MatSidenavModule, - MatProgressBarModule, - MatCardModule, - MatListModule, - MatMenuModule, - MatToolbarModule, - MatSnackBarModule, - MatExpansionModule - ], - exports: [ - MatSlideToggleModule, - MatInputModule, - MatSelectModule, - MatDialogModule, - MatSidenavModule, - MatProgressBarModule, - MatCardModule, - MatListModule, - MatMenuModule, - MatToolbarModule, - MatSnackBarModule, - MatExpansionModule - ] -}) -export class MaterialModule { -} diff --git a/docs/README.md b/docs/README.md index ad25423a9b..2bb6e9cf4d 100644 --- a/docs/README.md +++ b/docs/README.md @@ -264,61 +264,60 @@ for more information about installing and using the source code. ### Components -| Name | Description | Source link | -| ---- | ----------- | ----------- | -| [Add Permission Dialog Component](content-services/components/add-permission-dialog.component.md) | Displays a dialog to search for people or groups to add to the current node permissions. | [Source](../lib/content-services/src/lib/permission-manager/components/add-permission/add-permission-dialog.component.ts) | -| [Add Permission Panel Component](content-services/components/add-permission-panel.component.md) | Searches for people or groups to add to the current node permissions. | [Source](../lib/content-services/src/lib/permission-manager/components/add-permission/add-permission-panel.component.ts) | -| [Add Permission Component](content-services/components/add-permission.component.md) | Searches for people or groups to add to the current node permissions. | [Source](../lib/content-services/src/lib/permission-manager/components/add-permission/add-permission.component.ts) | -| [Alfresco Viewer component](content-services/components/alfresco-viewer.component.md) | Displays content from an ACS repository. | [Source](../lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts) | -| [Aspect List Dialog component](content-services/components/aspect-list-dialog.component.md) | Allows a user to choose aspects for a node. | [Source](../lib/content-services/src/lib/aspect-list/aspect-list-dialog.component.ts) | -| [Aspect List component](content-services/components/aspect-list.component.md) | This component will show in an expandable row list with checkboxes all the aspect of a node, if a node id is given, or otherwise a complete list. | | -| The aspect are filtered via the app.config.json in this way : | [Source](../lib/content-services/src/lib/aspect-list/aspect-list.component.ts) | | -| [Breadcrumb Component](content-services/components/breadcrumb.component.md) | Indicates the current position within a navigation hierarchy. | [Source](../lib/content-services/src/lib/breadcrumb/breadcrumb.component.ts) | -| [Content Action component](content-services/components/content-action.component.md) | Adds options to a Document List actions menu for a particular content type. | [Source](../lib/content-services/src/lib/document-list/components/content-action/content-action.component.ts) | -| [Content Metadata Card component](content-services/components/content-metadata-card.component.md) | Displays and edits metadata related to a node. | [Source](../lib/content-services/src/lib/content-metadata/components/content-metadata-card/content-metadata-card.component.ts) | -| [Content Node Selector Panel component](content-services/components/content-node-selector-panel.component.md) | Opens a Content Node Selector in its own dialog window. | [Source](../lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.ts) | -| [Content Node Selector component](content-services/components/content-node-selector.component.md) | Allows a user to select items from a Content Services repository. | [Source](../lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts) | -| [Content Type Dialog component](content-services/components/content-type-dialog.component.md) | Confirm dialog when user changes content type of a node. | [Source](../lib/content-services/src/lib/content-type/content-type-dialog.component.ts) | -| [Document List component](content-services/components/document-list.component.md) | Displays the documents from a repository. | [Source](../lib/content-services/src/lib/document-list/components/document-list.component.ts) | -| [Dropdown Breadcrumb Component](content-services/components/dropdown-breadcrumb.component.md) | Indicates the current position within a navigation hierarchy using a dropdown menu. | [Source](../lib/content-services/src/lib/breadcrumb/dropdown-breadcrumb.component.ts) | -| [File Uploading Dialog Component](content-services/components/file-uploading-dialog.component.md) | Shows a dialog listing all the files uploaded with the Upload Button or Drag Area components. | [Source](../lib/content-services/src/lib/upload/components/file-uploading-dialog.component.ts) | -| [Node Comments Component](content-services/components/node-comments.component.md) | Displays comments from users involved in a specified content and allows an involved user to add a comment to a content. | [Source](../lib/content-services/src/lib/node-comments/node-comments.component.ts) | -| [Permission List Component](content-services/components/permission-list.component.md) | Shows node permissions as a table. | [Source](../lib/content-services/src/lib/permission-manager/components/permission-list/permission-list.component.ts) | -| [Search check list component](content-services/components/search-check-list.component.md) | Implements a checklist widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-check-list/search-check-list.component.ts) | -| [Search Chip Input Component](content-services/components/search-chip-input.component.md) | Displays input for providing phrases display as "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-input/search-chip-input.component.ts) | -| [Search Chip Autocomplete Input component](content-services/components/search-chip-autocomplete-input.component.md) | Displays an input with autocomplete options. | [Source](../lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts) | -| [Search Chip List Component](content-services/components/search-chip-list.component.md) | Displays search criteria as a set of "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-list/search-chip-list.component.ts) | -| [Search control component](content-services/components/search-control.component.md) | Displays a input text that shows find-as-you-type suggestions. | [Source](../lib/content-services/src/lib/search/components/search-control.component.ts) | -| [Search Date Range Component](content-services/components/search-date-range.component.md) | Displays a UI to configure different kinds of search criteria around date. Options are 'Anytime', 'In the last' and 'Between' | [Source](../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts) | -| [Search Date Range Tabbed component](content-services/components/search-date-range-tabbed.component.md) | Implements a tabbed advanced search widget for the Search Date Range component. | [Source](../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts) | -| [Search datetime range component](content-services/components/search-datetime-range.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.ts) | -| [Search Filter Autocomplete Chips component](content-services/components/search-filter-autocomplete-chips.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts) | -| [Search Filter Chips component](content-services/components/search-filter-chips.component.md) | Represents a chip based container component for custom search and faceted search settings. | [Source](../lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.ts) | -| [Search Filter component](content-services/components/search-filter.component.md) | Represents a main container component for custom search and faceted search settings. | [Source](../lib/content-services/src/lib/search/components/search-filter/search-filter.component.ts) | -| [Search Filter Tabbed component](content-services/components/search-filter-tabbed.component.md) | Represents a container component for creating tabbed layout. | [Source](../lib/content-services/src/lib/search/components/search-filter/search-filter.component.ts) | -| [Search Form component](content-services/components/search-form.component.md) | Search Form screenshot | [Source](../lib/content-services/src/lib/search/components/search-form/search-form.component.ts) | -| [Search Logical Filter component](content-services/components/search-logical-filter.component.md) | Displays 3 chip inputs each representing different logical condition for search query. | [Source](../lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.ts) | -| [Search Properties component](content-services/components/search-properties.component.md) | Allows to search by file size and type.| [Source](../lib/content-services/src/lib/search/components/search-properties/search-properties.component.ts) | -| [Search number range component](content-services/components/search-number-range.component.md) | Implements a number range widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-number-range/search-number-range.component.ts) | -| [Search radio component](content-services/components/search-radio.component.md) | Implements a radio button list widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-radio/search-radio.component.ts) | -| [Search slider component](content-services/components/search-slider.component.md) | Implements a numeric slider widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-slider/search-slider.component.ts) | -| [Search Sorting Picker Component](content-services/components/search-sorting-picker.component.md) | Provides an ability to select one of the predefined sorting definitions for search results: | [Source](../lib/content-services/src/lib/search/components/search-sorting-picker/search-sorting-picker.component.ts) | -| [Search text component](content-services/components/search-text.component.md) | Implements a text input widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-text/search-text.component.ts) | -| [Search component](content-services/components/search.component.md) | Searches items for supplied search terms. | [Source](../lib/content-services/src/lib/search/components/search.component.ts) | -| [Sites Dropdown component](content-services/components/sites-dropdown.component.md) | Displays a dropdown menu to show and interact with the sites of the current user. | [Source](../lib/content-services/src/lib/content-node-selector/site-dropdown/sites-dropdown.component.ts) | -| [Tag Node Actions List component](content-services/components/tag-actions.component.md) | Shows available actions for tags. | [Source](../lib/content-services/src/lib/tag/tag-actions.component.ts) | -| [Tag List component](content-services/components/tag-list.component.md) | Shows tags for an item. | [Source](../lib/content-services/src/lib/tag/tag-list.component.ts) | -| [Tag Node List component](content-services/components/tag-node-list.component.md) | Shows tags for a node. | [Source](../lib/content-services/src/lib/tag/tag-node-list.component.ts) | -| [Tags Creator component](content-services/components/tags-creator.component.md) | Allows to create multiple tags. That component contains input and two lists. Top list is all created tags, bottom list is searched tags based on input's value. | [Source](../lib/content-services/src/lib/tag/tags-creator/tags-creator.component.ts) | -| [Tree View component](content-services/components/tree-view.component.md) | Shows the folder and subfolders of a node as a tree view. | [Source](../lib/content-services/src/lib/tree-view/components/tree-view.component.ts) | -| [Tree component](content-services/components/tree.component.md) | Shows the nodes in tree structure, each node containing children is collapsible/expandable. Can be integrated with any datasource extending Tree service. | [Source](../lib/content-services/src/lib/tree/components/tree.component.ts) | -| [Upload Button Component](content-services/components/upload-button.component.md) | Activates a file upload. | [Source](../lib/content-services/src/lib/upload/components/upload-button.component.ts) | -| [Upload Drag Area Component](content-services/components/upload-drag-area.component.md) | Adds a drag and drop area to upload files to ACS. | [Source](../lib/content-services/src/lib/upload/components/upload-drag-area.component.ts) | +| Name | Description | Source link | +|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------| ----------- | -------- | +| [Add Permission Dialog Component](content-services/components/add-permission-dialog.component.md) | Displays a dialog to search for people or groups to add to the current node permissions. | [Source](../lib/content-services/src/lib/permission-manager/components/add-permission/add-permission-dialog.component.ts) | +| [Add Permission Panel Component](content-services/components/add-permission-panel.component.md) | Searches for people or groups to add to the current node permissions. | [Source](../lib/content-services/src/lib/permission-manager/components/add-permission/add-permission-panel.component.ts) | +| [Add Permission Component](content-services/components/add-permission.component.md) | Searches for people or groups to add to the current node permissions. | [Source](../lib/content-services/src/lib/permission-manager/components/add-permission/add-permission.component.ts) | +| [Alfresco Viewer component](content-services/components/alfresco-viewer.component.md) | Displays content from an ACS repository. | [Source](../lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts) | +| [Aspect List Dialog component](content-services/components/aspect-list-dialog.component.md) | Allows a user to choose aspects for a node. | [Source](../lib/content-services/src/lib/aspect-list/aspect-list-dialog.component.ts) | +| [Aspect List component](content-services/components/aspect-list.component.md) | This component will show in an expandable row list with checkboxes all the aspect of a node, if a node id is given, or otherwise a complete list. | [Source](../lib/content-services/src/lib/aspect-list/aspect-list.component.ts) | | +| [Breadcrumb Component](content-services/components/breadcrumb.component.md) | Indicates the current position within a navigation hierarchy. | [Source](../lib/content-services/src/lib/breadcrumb/breadcrumb.component.ts) | +| [Content Action component](content-services/components/content-action.component.md) | Adds options to a Document List actions menu for a particular content type. | [Source](../lib/content-services/src/lib/document-list/components/content-action/content-action.component.ts) | +| [Content Metadata Card component](content-services/components/content-metadata-card.component.md) | Displays and edits metadata related to a node. | [Source](../lib/content-services/src/lib/content-metadata/components/content-metadata-card/content-metadata-card.component.ts) | +| [Content Node Selector Panel component](content-services/components/content-node-selector-panel.component.md) | Opens a Content Node Selector in its own dialog window. | [Source](../lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.ts) | +| [Content Node Selector component](content-services/components/content-node-selector.component.md) | Allows a user to select items from a Content Services repository. | [Source](../lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts) | +| [Content Type Dialog component](content-services/components/content-type-dialog.component.md) | Confirm dialog when user changes content type of a node. | [Source](../lib/content-services/src/lib/content-type/content-type-dialog.component.ts) | +| [Document List component](content-services/components/document-list.component.md) | Displays the documents from a repository. | [Source](../lib/content-services/src/lib/document-list/components/document-list.component.ts) | +| [Dropdown Breadcrumb Component](content-services/components/dropdown-breadcrumb.component.md) | Indicates the current position within a navigation hierarchy using a dropdown menu. | [Source](../lib/content-services/src/lib/breadcrumb/dropdown-breadcrumb.component.ts) | +| [File Uploading Dialog Component](content-services/components/file-uploading-dialog.component.md) | Shows a dialog listing all the files uploaded with the Upload Button or Drag Area components. | [Source](../lib/content-services/src/lib/upload/components/file-uploading-dialog.component.ts) | +| [Node Comments Component](content-services/components/node-comments.component.md) | Displays comments from users involved in a specified content and allows an involved user to add a comment to a content. | [Source](../lib/content-services/src/lib/node-comments/node-comments.component.ts) | +| [Permission List Component](content-services/components/permission-list.component.md) | Shows node permissions as a table. | [Source](../lib/content-services/src/lib/permission-manager/components/permission-list/permission-list.component.ts) | +| [Search check list component](content-services/components/search-check-list.component.md) | Implements a checklist widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-check-list/search-check-list.component.ts) | +| [Search Chip Input Component](content-services/components/search-chip-input.component.md) | Displays input for providing phrases display as "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-input/search-chip-input.component.ts) | +| [Search Chip Autocomplete Input component](content-services/components/search-chip-autocomplete-input.component.md) | Displays an input with autocomplete options. | [Source](../lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts) | +| [Search Chip List Component](content-services/components/search-chip-list.component.md) | Displays search criteria as a set of "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-list/search-chip-list.component.ts) | +| [Search control component](content-services/components/search-control.component.md) | Displays a input text that shows find-as-you-type suggestions. | [Source](../lib/content-services/src/lib/search/components/search-control.component.ts) | +| [Search Date Range Component](content-services/components/search-date-range.component.md) | Displays a UI to configure different kinds of search criteria around date. Options are 'Anytime', 'In the last' and 'Between' | [Source](../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts) | +| [Search Date Range Tabbed component](content-services/components/search-date-range-tabbed.component.md) | Implements a tabbed advanced search widget for the Search Date Range component. | [Source](../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts) | +| [Search datetime range component](content-services/components/search-datetime-range.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.ts) | +| [Search Filter Autocomplete Chips component](content-services/components/search-filter-autocomplete-chips.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts) | +| [Search Filter Chips component](content-services/components/search-filter-chips.component.md) | Represents a chip based container component for custom search and faceted search settings. | [Source](../lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.ts) | +| [Search Filter component](content-services/components/search-filter.component.md) | Represents a main container component for custom search and faceted search settings. | [Source](../lib/content-services/src/lib/search/components/search-filter/search-filter.component.ts) | +| [Search Filter Tabbed component](content-services/components/search-filter-tabbed.component.md) | Represents a container component for creating tabbed layout. | [Source](../lib/content-services/src/lib/search/components/search-filter/search-filter.component.ts) | +| [Search Form component](content-services/components/search-form.component.md) | Search Form screenshot | [Source](../lib/content-services/src/lib/search/components/search-form/search-form.component.ts) | +| [Search Logical Filter component](content-services/components/search-logical-filter.component.md) | Displays 3 chip inputs each representing different logical condition for search query. | [Source](../lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.ts) | +| [Search Properties component](content-services/components/search-properties.component.md) | Allows to search by file size and type.| [Source](../lib/content-services/src/lib/search/components/search-properties/search-properties.component.ts) | +| [Search number range component](content-services/components/search-number-range.component.md) | Implements a number range widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-number-range/search-number-range.component.ts) | +| [Search radio component](content-services/components/search-radio.component.md) | Implements a radio button list widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-radio/search-radio.component.ts) | +| [Search slider component](content-services/components/search-slider.component.md) | Implements a numeric slider widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-slider/search-slider.component.ts) | +| [Search Sorting Picker Component](content-services/components/search-sorting-picker.component.md) | Provides an ability to select one of the predefined sorting definitions for search results: | [Source](../lib/content-services/src/lib/search/components/search-sorting-picker/search-sorting-picker.component.ts) | +| [Search text component](content-services/components/search-text.component.md) | Implements a text input widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-text/search-text.component.ts) | +| [Search component](content-services/components/search.component.md) | Searches items for supplied search terms. | [Source](../lib/content-services/src/lib/search/components/search.component.ts) | +| [Sites Dropdown component](content-services/components/sites-dropdown.component.md) | Displays a dropdown menu to show and interact with the sites of the current user. | [Source](../lib/content-services/src/lib/content-node-selector/site-dropdown/sites-dropdown.component.ts) | +| [Tag Node Actions List component](content-services/components/tag-actions.component.md) | Shows available actions for tags. | [Source](../lib/content-services/src/lib/tag/tag-actions/tag-actions.component.ts) | +| [Tag List component](content-services/components/tag-list.component.md) | Shows tags for an item. | [Source](../lib/content-services/src/lib/tag/tag-list/tag-list.component.ts) | +| [Tag Node List component](content-services/components/tag-node-list.component.md) | Shows tags for a node. | [Source](../lib/content-services/src/lib/tag/tag-node-list/tag-node-list.component.ts) | +| [Tags Creator component](content-services/components/tags-creator.component.md) | Allows to create multiple tags. That component contains input and two lists. Top list is all created tags, bottom list is searched tags based on input's value. | [Source](../lib/content-services/src/lib/tag/tags-creator/tags-creator.component.ts) | +| [Tree View component](content-services/components/tree-view.component.md) | Shows the folder and subfolders of a node as a tree view. | [Source](../lib/content-services/src/lib/tree-view/components/tree-view.component.ts) | +| [Tree component](content-services/components/tree.component.md) | Shows the nodes in tree structure, each node containing children is collapsible/expandable. Can be integrated with any datasource extending Tree service. | [Source](../lib/content-services/src/lib/tree/components/tree.component.ts) | +| [Upload Button Component](content-services/components/upload-button.component.md) | Activates a file upload. | [Source](../lib/content-services/src/lib/upload/components/upload-button.component.ts) | +| [Upload Drag Area Component](content-services/components/upload-drag-area.component.md) | Adds a drag and drop area to upload files to ACS. | [Source](../lib/content-services/src/lib/upload/components/upload-drag-area.component.ts) | | [Upload Version Button Component (Workaround)](content-services/components/upload-version-button.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Activates a file version upload. | [Source](../lib/content-services/src/lib/upload/components/upload-version-button.component.ts) | -| [Version Comparison Component](content-services/components/version-comparison.component.md) | Displays the side by side comparison between the current target node (type, name, icon) and the new file that should update it's version. | [Source](../lib/content-services/src/lib/version-manager/version-comparison.component.ts) | -| [Version List component](content-services/components/version-list.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Displays the version history of a node in a Version Manager component. | [Source](../lib/content-services/src/lib/version-manager/version-list.component.ts) | -| [Version Manager Component](content-services/components/version-manager.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Displays the version history of a node with the ability to upload a new version. | [Source](../lib/content-services/src/lib/version-manager/version-manager.component.ts) | -| [Version Upload component](content-services/components/version-upload.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Displays the new version's minor/major changes and the optional comment of a node in a Version Manager component. | [Source](../lib/content-services/src/lib/version-manager/version-upload.component.ts) | +| [Version Comparison Component](content-services/components/version-comparison.component.md) | Displays the side by side comparison between the current target node (type, name, icon) and the new file that should update it's version. | [Source](../lib/content-services/src/lib/version-manager/version-comparison.component.ts) | +| [Version List component](content-services/components/version-list.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Displays the version history of a node in a Version Manager component. | [Source](../lib/content-services/src/lib/version-manager/version-list.component.ts) | +| [Version Manager Component](content-services/components/version-manager.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Displays the version history of a node with the ability to upload a new version. | [Source](../lib/content-services/src/lib/version-manager/version-manager.component.ts) | +| [Version Upload component](content-services/components/version-upload.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Displays the new version's minor/major changes and the optional comment of a node in a Version Manager component. | [Source](../lib/content-services/src/lib/version-manager/version-upload.component.ts) | ### Directives @@ -348,8 +347,7 @@ for more information about installing and using the source code. | Name | Description | Source link | | ---- | ----------- | ----------- | -| [Base Card View Content Update interface](content-services/interfaces/base-card-view-content-update.interface.md) | Specifies required properties and methods for Card View Content Update service. | | -| Extends from BaseCardViewUpdate. | [Source](../lib/content-services/src/lib/interfaces/base-card-view-content-update.interface.ts) | | +| [Base Card View Content Update interface](content-services/interfaces/base-card-view-content-update.interface.md) | Specifies required properties and methods for Card View Content Update service. Extends from BaseCardViewUpdate. | [Source](../lib/content-services/src/lib/interfaces/base-card-view-content-update.interface.ts) | | | [Search widget interface](content-services/interfaces/search-widget.interface.md) | Specifies required properties for Search filter component widgets. | [Source](../lib/content-services/src/lib/search/models/search-widget.interface.ts) | | [Content Metadata Custom Panel interface](content-services/interfaces/content-metadata-custom-panel.interface.md) | Specifies required properties for metadata custom panel. | [Source](../lib/content-services/src/lib/content-metadata/interfaces/content-metadata-custom-panel.interface.ts) | @@ -372,8 +370,7 @@ for more information about installing and using the source code. | Name | Description | Source link | | ---- | ----------- | ----------- | | [Audit Service](content-services/services/audit.service.md) | Manages Audit apps and entries. | [Source](../lib/content-services/src/lib/audit/audit.service.ts) | -| [Card View Content Update Service](content-services/services/card-view-content-update.service.md) | Manages Card View properties in the content services environment. | | -| Implements BaseCardViewContentUpdate. | [Source](../lib/content-services/src/lib/common/services/card-view-content-update.service.ts) | | +| [Card View Content Update Service](content-services/services/card-view-content-update.service.md) | Manages Card View properties in the content services environment. Implements BaseCardViewContentUpdate. | [Source](../lib/content-services/src/lib/common/services/card-view-content-update.service.ts) | | | [Category tree datasource service](content-services/services/category-tree-datasource.service.md) | Datasource service for category tree. | [Source](../lib/content-services/src/lib/category/services/category-tree-datasource.service.ts) | | [Category service](content-services/services/category.service.md) | Manages categories in Content Services. | [Source](../lib/content-services/src/lib/category/services/category.service.ts) | | [Content Comment List Service](content-services/services/content-comment-list.service.md) | Gets user image for comments in Content Services. | [Source](../lib/content-services/src/lib/node-comments/services/content-comment-list.service.ts) | diff --git a/docs/content-services/components/alfresco-viewer.component.md b/docs/content-services/components/alfresco-viewer.component.md index 633c2f205c..836617e878 100644 --- a/docs/content-services/components/alfresco-viewer.component.md +++ b/docs/content-services/components/alfresco-viewer.component.md @@ -4,12 +4,12 @@ Added: 6.0.0 Status: Active --- -# [Alfresco Viewer component](../../../lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts "Defined in alfresco-viewer.component.ts") +# Alfresco Viewer Component + +`component`, `standalone` Displays content from an ACS repository. -See it live: [Viewer Quickstart](https://embed.plnkr.co/iTuG1lFIXfsP95l6bDW6/) - ## Contents - [Basic usage](#basic-usage) @@ -30,6 +30,12 @@ See it live: [Viewer Quickstart](https://embed.plnkr.co/iTuG1lFIXfsP95l6bDW6/) ## Basic usage +Use the following standalone component import: + +```typescript +import { AlfrescoViewerComponent } from '@alfresco/adf-content-services'; +``` + Using with node id: ```html @@ -53,65 +59,66 @@ Note that if you have a URL which contains a shared link ID, you should extract ID portion and use it with the `sharedLinkId` property rather than using the whole URL with `urlFile`. -### [Transclusions](../../user-guide/transclusion.md) +### Transclusions -The [Alfresco Viewer component](viewer.component.md) lets you transclude content for the toolbar (and toolbar buttons), +The viewer lets you transclude content for the toolbar (and toolbar buttons), the sidebar, thumbnails, and the "Open with" and "More actions" menus. -See the [Custom layout](#custom-layout) section for full details of all available tranclusions. + +See [Transclusion](../../user-guide/transclusion.md) for more details. +See the [Custom layout](#custom-layout) section for full details of all available transclusions. ## Class members ### Properties -| Name | Type | Default value | Description | -| ---- | ---- | ------------- | ----------- | -| allowDownload | `boolean` | true | Toggles downloading. | -| allowFullScreen | `boolean` | true | Toggles the 'Full Screen' feature. | -| allowGoBack | `boolean` | true | Allows `back` navigation. | -| closeButtonPosition | `CloseButtonPosition` | `left` | Set close button position right/left. | -| hideInfoButton | `boolean` | false | Toggles Info button. | -| allowLeftSidebar | `boolean` | false | Allow the left the sidebar. | -| allowNavigate | `boolean` | false | Toggles before/next navigation. You can use the arrow buttons to navigate between documents in the collection. | -| allowPrint | `boolean` | false | Toggles printing. | -| allowRightSidebar | `boolean` | false | Allow the right sidebar. | -| canNavigateBefore | `boolean` | true | Toggles the "before" ("<") button. Requires `allowNavigate` to be enabled. | -| canNavigateNext | `boolean` | true | Toggles the next (">") button. Requires `allowNavigate` to be enabled. | -| maxRetries | `number` | 30 | Number of times the Viewer will retry fetching content Rendition. There is a delay of at least one second between attempts. | -| nodeId | `string` | null | Node Id of the file to load. | -| overlayMode | `boolean` | false | If `true` then show the Viewer as a full page over the current content. Otherwise fit inside the parent div. | -| sharedLinkId | `string` | null | Shared link id (to display shared file). | -| showLeftSidebar | `boolean` | false | Toggles left sidebar visibility. Requires `allowLeftSidebar` to be set to `true`. | -| showRightSidebar | `boolean` | false | Toggles right sidebar visibility. Requires `allowRightSidebar` to be set to `true`. | -| showToolbar | `boolean` | true | Hide or show the toolbar | -| showViewer | `boolean` | true | Hide or show the viewer | -| sidebarLeftTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`` | null | The template for the left sidebar. The template context contains the loaded node data. | -| sidebarRightTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`` | null | The template for the right sidebar. The template context contains the loaded node data. | -| versionId | `string` | null | Version Id of the file to load. | +| Name | Type | Default value | Description | +|----------------------|-----------------------|---------------|-----------------------------------------------------------------------------------------------------------------------------| +| allowDownload | `boolean` | true | Toggles downloading. | +| allowFullScreen | `boolean` | true | Toggles the 'Full Screen' feature. | +| allowGoBack | `boolean` | true | Allows `back` navigation. | +| closeButtonPosition | `CloseButtonPosition` | `left` | Set close button position right/left. | +| hideInfoButton | `boolean` | false | Toggles Info button. | +| allowLeftSidebar | `boolean` | false | Allow the left the sidebar. | +| allowNavigate | `boolean` | false | Toggles before/next navigation. You can use the arrow buttons to navigate between documents in the collection. | +| allowPrint | `boolean` | false | Toggles printing. | +| allowRightSidebar | `boolean` | false | Allow the right sidebar. | +| canNavigateBefore | `boolean` | true | Toggles the "before" ("<") button. Requires `allowNavigate` to be enabled. | +| canNavigateNext | `boolean` | true | Toggles the next (">") button. Requires `allowNavigate` to be enabled. | +| maxRetries | `number` | 30 | Number of times the Viewer will retry fetching content Rendition. There is a delay of at least one second between attempts. | +| nodeId | `string` | null | Node Id of the file to load. | +| overlayMode | `boolean` | false | If `true` then show the Viewer as a full page over the current content. Otherwise fit inside the parent div. | +| sharedLinkId | `string` | null | Shared link id (to display shared file). | +| showLeftSidebar | `boolean` | false | Toggles left sidebar visibility. Requires `allowLeftSidebar` to be set to `true`. | +| showRightSidebar | `boolean` | false | Toggles right sidebar visibility. Requires `allowRightSidebar` to be set to `true`. | +| showToolbar | `boolean` | true | Hide or show the toolbar | +| showViewer | `boolean` | true | Hide or show the viewer | +| sidebarLeftTemplate | `TemplateRef` | null | The template for the left sidebar. The template context contains the loaded node data. | +| sidebarRightTemplate | `TemplateRef` | null | The template for the right sidebar. The template context contains the loaded node data. | +| versionId | `string` | null | Version Id of the file to load. | ### Events -| Name | Type | Description | -| ---- | ---- | ----------- | -| invalidSharedLink | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`` | Emitted when the shared link used is not valid. | -| navigateBefore | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`` | Emitted when user clicks 'Navigate Before' ("<") button. | -| navigateNext | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`` | Emitted when user clicks 'Navigate Next' (">") button. | -| showViewerChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`` | Emitted when the viewer close | +| Name | Type | Description | +|-------------------|---------------------------------------------|-------------------------------------------------------------| +| invalidSharedLink | `EventEmitter` | Emitted when the shared link used is not valid. | +| navigateBefore | `EventEmitter` | Emitted when user clicks 'Navigate Before' ("<") button. | +| navigateNext | `EventEmitter` | Emitted when user clicks 'Navigate Next' (">") button. | +| showViewerChange | `EventEmitter` | Emitted when the viewer close | ## Keyboard shortcuts -| Name | Description | -| ---- | ----------- | -| Esc | Close the viewer (overlay mode only). | -| Left | Invoke 'Navigate before' action. | -| Right | Invoke 'Navigate next' action. | -| Ctrl+F | Activate full-screen mode. | +| Name | Description | +|--------|---------------------------------------| +| Esc | Close the viewer (overlay mode only). | +| Left | Invoke 'Navigate before' action. | +| Right | Invoke 'Navigate next' action. | +| Ctrl+F | Activate full-screen mode. | ## Details ### Integrating with the Document List component -Below is the most simple integration of the Viewer and -[Document List](../../content-services/components/document-list.component.md) components within your custom component: +Integrating Viewer and [Document List](./document-list.component.md) components within your custom component: ```html ``` -Note: you need to add the `ng2-3d-editor` dependency to your `package.json` file to make the example above work. +> this example requires `ng2-3d-editor` dependency You need to keep all instances of `adf-viewer-extension` inside `viewerExtensions` template, also you can define multiple `adf-viewer-extension` templates if required: @@ -284,7 +290,7 @@ You need to keep all instances of `adf-viewer-extension` inside `viewerExtension ### Custom layout -The [Alfresco Viewer Component](viewer.component.md) lets you transclude custom content in several different places as +The viewer component lets you transclude custom content in several different places as explained in the sections below. #### Custom toolbar @@ -329,7 +335,7 @@ The result should look like this: #### Custom sidebar -The [Alfresco Viewer Component](viewer.component.md) also supports custom sidebar components and layouts. +The viewer component also supports custom sidebar components and layouts. Set the `allowRightSidebar` property to `true` to enable this feature. The custom sidebar can be injected in two different ways. The first way is to use @@ -372,8 +378,6 @@ import { Component, Input } from '@angular/core'; }) export class CustomThumbnailsComponent { @Input() pdfViewer: any; - - ... } ``` @@ -445,15 +449,23 @@ You can enable a custom "More actions" menu by providing at least one action ins You can set a default zoom scaling value for pdf viewer by adding the following code in `app.config.json`. Note: For the pdf viewer the value has to be within the range of 25 - 1000. -"adf-alfresco-viewer": { -"pdf-viewer-scaling": 150 +```json +{ + "adf-alfresco-viewer": { + "pdf-viewer-scaling": 150 + } } +``` In the same way you can set a default zoom scaling value for the image viewer by adding the following code in `app.config.json`. -"adf-alfresco-viewer": { -"image-viewer-scaling": 150 +```json +{ + "adf-alfresco-viewer": { + "image-viewer-scaling": 150 + } } +``` By default the viewer's zoom scaling is set to 100%. @@ -465,7 +477,6 @@ true. ```html - ... ``` diff --git a/docs/content-services/components/tag-actions.component.md b/docs/content-services/components/tag-actions.component.md index 78dbc778e3..e1e7299de0 100644 --- a/docs/content-services/components/tag-actions.component.md +++ b/docs/content-services/components/tag-actions.component.md @@ -5,7 +5,7 @@ Status: Active Last reviewed: 2018-11-19 --- -# [Tag Node Actions List component](../../../lib/content-services/src/lib/tag/tag-actions.component.ts "Defined in tag-actions.component.ts") +# [Tag Node Actions List component](../../../lib/content-services/src/lib/tag/tag-actions/tag-actions.component.ts "Defined in tag-actions.component.ts") Shows available actions for tags. diff --git a/docs/content-services/components/tag-list.component.md b/docs/content-services/components/tag-list.component.md index 3e4fe204e3..42970e1fcb 100644 --- a/docs/content-services/components/tag-list.component.md +++ b/docs/content-services/components/tag-list.component.md @@ -5,7 +5,7 @@ Status: Active Last reviewed: 2018-11-14 --- -# [Tag List component](../../../lib/content-services/src/lib/tag/tag-list.component.ts "Defined in tag-list.component.ts") +# [Tag List component](../../../lib/content-services/src/lib/tag/tag-list/tag-list.component.ts "Defined in tag-list.component.ts") Shows tags for an item. diff --git a/docs/content-services/components/tag-node-list.component.md b/docs/content-services/components/tag-node-list.component.md index d018a90f50..372e3a1ee1 100644 --- a/docs/content-services/components/tag-node-list.component.md +++ b/docs/content-services/components/tag-node-list.component.md @@ -5,7 +5,7 @@ Status: Active Last reviewed: 2018-11-19 --- -# [Tag Node List component](../../../lib/content-services/src/lib/tag/tag-node-list.component.ts "Defined in tag-node-list.component.ts") +# [Tag Node List component](../../../lib/content-services/src/lib/tag/tag-node-list/tag-node-list.component.ts "Defined in tag-node-list.component.ts") Shows tags for a node. diff --git a/docs/core/components/viewer.component.md b/docs/core/components/viewer.component.md index 05c9b9e40c..059e1b13cf 100644 --- a/docs/core/components/viewer.component.md +++ b/docs/core/components/viewer.component.md @@ -5,10 +5,12 @@ Status: Active Last reviewed: 2023-01-30 --- -# [Viewer component](../../../lib/core/src/lib/viewer/components/viewer.component.ts "Defined in viewer.component.ts") +# Viewer Component Displays content from blob file or url file. +> For Alfresco Content Services support, see the [Alfresco Viewer](../../content-services/components/alfresco-viewer.component.md) component details. + ## Contents - [Basic usage](#basic-usage) @@ -171,13 +173,13 @@ The [Viewer component](viewer.component.md) consists of separate Views that hand Configure your webpack-enabled application with the PDF.js library as follows. -1. Install pdfjs-dist +- Install pdfjs-dist ```sh npm install pdfjs-dist ``` -2. Update `vendors.ts` by appending the following code. This will enable the [viewer component](viewer.component.md) +- Update `vendors.ts` by appending the following code. This will enable the [viewer component](viewer.component.md) and compatibility mode for all browsers. It will also configure the web worker for the PDF.js library to render PDF files in the background: @@ -189,7 +191,7 @@ pdfjsLib.PDFJS.workerSrc = './pdf.worker.js'; require('pdfjs-dist/web/pdf_viewer.js'); ``` -3. Update the `plugins` section of the `webpack.common.js` file with the following lines: +- Update the `plugins` section of the `webpack.common.js` file with the following lines: ```js new CopyWebpackPlugin([ @@ -376,15 +378,23 @@ You can enable a custom "More actions" menu by providing at least one action ins You can set a default zoom scaling value for pdf viewer by adding the following code in `app.config.json`. Note: For the pdf viewer the value has to be within the range of 25 - 1000. -"adf-viewer": { -"pdf-viewer-scaling": 150 +```json +{ + "adf-viewer": { + "pdf-viewer-scaling": 150 + } } +``` In the same way you can set a default zoom scaling value for the image viewer by adding the following code in `app.config.json`. -"adf-viewer": { -"image-viewer-scaling": 150 +```json +{ + "adf-viewer": { + "image-viewer-scaling": 150 + } } +``` By default the viewer's zoom scaling is set to 100%. @@ -396,13 +406,15 @@ In case the user decides to wait, the viewer can further be configured to displa In order to configure this feature, add the following code in `app.config.json`. -``` - "viewer": { - "enableDownloadPrompt": true, - "enableDownloadPromptReminder": true, - "downloadPromptDelay": 50, - "downloadPromptReminderDelay": 30 - } +```json +{ + "viewer": { + "enableDownloadPrompt": true, + "enableDownloadPromptReminder": true, + "downloadPromptDelay": 50, + "downloadPromptReminderDelay": 30 + } +} ``` Here `enableDownloadPrompt: true` enables the dialog to be visible after a set period of time. This time can be configured by updating the value in the @@ -411,7 +423,7 @@ Here `enableDownloadPrompt: true` enables the dialog to be visible after a set p The second boolean flag `enableDownloadPromptReminder: true` can be used to configure whether the reminder prompts should be displayed or not. `downloadPromptReminderDelay` property can be used to configure the time to wait between reminder prompts. -Note: All times in this configuration must be provided in seconds +> All times in this configuration must be provided in seconds ## See also diff --git a/lib/content-services/src/lib/aspect-list/aspect-list-dialog.component.ts b/lib/content-services/src/lib/aspect-list/aspect-list-dialog.component.ts index 6d74b92ee3..c3ecce92de 100644 --- a/lib/content-services/src/lib/aspect-list/aspect-list-dialog.component.ts +++ b/lib/content-services/src/lib/aspect-list/aspect-list-dialog.component.ts @@ -16,11 +16,18 @@ */ import { Component, Inject, OnInit, ViewEncapsulation } from '@angular/core'; -import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; +import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog'; import { AspectListDialogComponentData } from './aspect-list-dialog-data.interface'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatButtonModule } from '@angular/material/button'; +import { AspectListComponent } from './aspect-list.component'; +import { AutoFocusDirective } from '../directives/auto-focus.directive'; +import { CommonModule } from '@angular/common'; @Component({ selector: 'adf-aspect-list-dialog', + standalone: true, + imports: [CommonModule, MatDialogModule, TranslateModule, MatButtonModule, AspectListComponent, AutoFocusDirective], templateUrl: './aspect-list-dialog.component.html', styleUrls: ['./aspect-list-dialog.component.scss'], encapsulation: ViewEncapsulation.None diff --git a/lib/content-services/src/lib/aspect-list/aspect-list.component.spec.ts b/lib/content-services/src/lib/aspect-list/aspect-list.component.spec.ts index 23ca42c00e..c353b14573 100644 --- a/lib/content-services/src/lib/aspect-list/aspect-list.component.spec.ts +++ b/lib/content-services/src/lib/aspect-list/aspect-list.component.spec.ts @@ -119,7 +119,7 @@ describe('AspectListComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentTestingModule], + imports: [ContentTestingModule, AspectListComponent], providers: [AspectListService] }); }); diff --git a/lib/content-services/src/lib/aspect-list/aspect-list.component.ts b/lib/content-services/src/lib/aspect-list/aspect-list.component.ts index 55c100741c..be229dff94 100644 --- a/lib/content-services/src/lib/aspect-list/aspect-list.component.ts +++ b/lib/content-services/src/lib/aspect-list/aspect-list.component.ts @@ -20,10 +20,18 @@ import { NodesApiService } from '../common/services/nodes-api.service'; import { Observable, Subject, zip } from 'rxjs'; import { concatMap, map, takeUntil, tap } from 'rxjs/operators'; import { AspectListService } from './services/aspect-list.service'; -import { MatCheckboxChange } from '@angular/material/checkbox'; +import { MatCheckboxChange, MatCheckboxModule } from '@angular/material/checkbox'; import { AspectEntry } from '@alfresco/js-api'; +import { CommonModule } from '@angular/common'; +import { MatExpansionModule } from '@angular/material/expansion'; +import { MatTableModule } from '@angular/material/table'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; + @Component({ selector: 'adf-aspect-list', + standalone: true, + imports: [CommonModule, MatExpansionModule, MatCheckboxModule, MatTableModule, TranslateModule, MatProgressSpinnerModule], templateUrl: './aspect-list.component.html', styleUrls: ['./aspect-list.component.scss'], encapsulation: ViewEncapsulation.None diff --git a/lib/content-services/src/lib/aspect-list/aspect-list.module.ts b/lib/content-services/src/lib/aspect-list/aspect-list.module.ts index 03308022a1..a48892ad28 100644 --- a/lib/content-services/src/lib/aspect-list/aspect-list.module.ts +++ b/lib/content-services/src/lib/aspect-list/aspect-list.module.ts @@ -15,34 +15,15 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; import { AspectListComponent } from './aspect-list.component'; -import { MatTableModule } from '@angular/material/table'; -import { MatExpansionModule } from '@angular/material/expansion'; -import { MatCheckboxModule } from '@angular/material/checkbox'; -import { PipeModule } from '@alfresco/adf-core'; -import { TranslateModule } from '@ngx-translate/core'; -import { MatDialogModule } from '@angular/material/dialog'; import { AspectListDialogComponent } from './aspect-list-dialog.component'; -import { MatButtonModule } from '@angular/material/button'; -import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; -import { ContentDirectiveModule } from '../directives/content-directive.module'; +export const ASPECT_LIST_DIRECTIVES = [AspectListComponent, AspectListDialogComponent] as const; + +/** @deprecated use `...ASPECT_LIST_DIRECTIVES` or import the individual components */ @NgModule({ - imports: [ - CommonModule, - MatTableModule, - MatExpansionModule, - MatCheckboxModule, - PipeModule, - TranslateModule, - MatDialogModule, - MatButtonModule, - MatProgressSpinnerModule, - ContentDirectiveModule - ], - exports: [AspectListComponent, AspectListDialogComponent], - declarations: [AspectListComponent, AspectListDialogComponent] + imports: [...ASPECT_LIST_DIRECTIVES], + exports: [...ASPECT_LIST_DIRECTIVES] }) export class AspectListModule {} diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts index ec4f84e51e..beb90feec4 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts @@ -21,8 +21,8 @@ import { forkJoin, Observable, of, Subject, zip } from 'rxjs'; import { AppConfigService, CardViewBaseItemModel, + CardViewComponent, CardViewItem, - CardViewModule, NotificationService, TranslationService, UpdateNotification @@ -68,12 +68,12 @@ enum DefaultPanels { MatButtonModule, TranslateModule, MatIconModule, - CardViewModule, MatChipsModule, CategoriesManagementComponent, DynamicExtensionComponent, MatProgressBarModule, - TagsCreatorComponent + TagsCreatorComponent, + CardViewComponent ], templateUrl: './content-metadata.component.html', styleUrls: ['./content-metadata.component.scss'], diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.html b/lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.html index 9893f98da0..6d13e7aa0d 100644 --- a/lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.html +++ b/lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.html @@ -44,8 +44,7 @@ {{ 'SEARCH.SEARCH_HEADER.TITLE' | translate }}
- - +
diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.ts b/lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.ts index 43b0fb0c7e..1308497778 100644 --- a/lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.ts +++ b/lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.ts @@ -23,10 +23,15 @@ import { InfinitePaginationComponent, PaginatedComponent, DataSorting, - ShowHeaderMode + ShowHeaderMode, + ToolbarTitleComponent, + ToolbarComponent, + DataColumnListComponent, + DataColumnComponent, + CustomEmptyContentTemplateDirective } from '@alfresco/adf-core'; import { NodesApiService, UploadService, FileUploadCompleteEvent, FileUploadDeleteEvent, SitesService } from '../../common'; -import { UntypedFormControl } from '@angular/forms'; +import { ReactiveFormsModule, UntypedFormControl } from '@angular/forms'; import { Node, NodePaging, Pagination, SiteEntry, SitePaging, NodeEntry, SearchRequest, RequestScope } from '@alfresco/js-api'; import { DocumentListComponent } from '../../document-list/components/document-list.component'; import { RowFilter } from '../../document-list/data/row-filter.model'; @@ -36,8 +41,20 @@ import { ShareDataRow } from '../../document-list/data/share-data-row.model'; import { NodeEntryEvent } from '../../document-list/components/node.event'; import { debounceTime, takeUntil } from 'rxjs/operators'; import { Subject } from 'rxjs'; -import { SearchQueryBuilderService } from '../../search'; import { ContentNodeSelectorPanelService } from './content-node-selector-panel.service'; +import { CommonModule } from '@angular/common'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatInputModule } from '@angular/material/input'; +import { AutoFocusDirective } from '../../directives/auto-focus.directive'; +import { NodeCounterDirective } from '../../directives/node-counter.directive'; +import { MatIconModule } from '@angular/material/icon'; +import { DropdownSitesComponent } from '../site-dropdown/sites-dropdown.component'; +import { MatButtonModule } from '@angular/material/button'; +import { NameLocationCellComponent } from '../name-location-cell/name-location-cell.component'; +import { DropdownBreadcrumbComponent } from '../../breadcrumb/dropdown-breadcrumb.component'; +import { SearchQueryBuilderService } from '../../search/services/search-query-builder.service'; +import { SearchPanelComponent } from '../../search/components/search-panel/search-panel.component'; export type ValidationFunction = (entry: Node) => boolean; @@ -45,6 +62,30 @@ export const defaultValidation = () => true; @Component({ selector: 'adf-content-node-selector-panel', + standalone: true, + imports: [ + CommonModule, + MatFormFieldModule, + TranslateModule, + MatInputModule, + ReactiveFormsModule, + AutoFocusDirective, + MatIconModule, + DropdownSitesComponent, + MatButtonModule, + ToolbarTitleComponent, + ToolbarComponent, + DropdownBreadcrumbComponent, + NodeCounterDirective, + DocumentListComponent, + HighlightDirective, + DataColumnListComponent, + DataColumnComponent, + NameLocationCellComponent, + InfinitePaginationComponent, + CustomEmptyContentTemplateDirective, + SearchPanelComponent + ], templateUrl: './content-node-selector-panel.component.html', styleUrls: ['./content-node-selector-panel.component.scss'], encapsulation: ViewEncapsulation.None, diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts index 1dcbffc4c5..40cd42cc9e 100644 --- a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts +++ b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts @@ -15,7 +15,7 @@ * limitations under the License. */ -import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog'; +import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { CUSTOM_ELEMENTS_SCHEMA, EventEmitter } from '@angular/core'; import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ContentNodeSelectorComponent } from './content-node-selector.component'; @@ -28,7 +28,6 @@ import { of } from 'rxjs'; import { ContentTestingModule } from '../testing/content.testing.module'; import { DocumentListService } from '../document-list/services/document-list.service'; import { DocumentListComponent } from '../document-list/components/document-list.component'; -import { UploadModule } from '../upload'; import { ContentNodeSelectorPanelComponent } from './content-node-selector-panel/content-node-selector-panel.component'; import { NodeAction } from '../document-list/models/node-action.enum'; import { SitesService } from '../common/services/sites.service'; @@ -60,7 +59,7 @@ describe('ContentNodeSelectorComponent', () => { }; TestBed.configureTestingModule({ - imports: [ContentTestingModule, MatDialogModule, UploadModule], + imports: [ContentTestingModule, ContentNodeSelectorComponent], providers: [ { provide: MAT_DIALOG_DATA, useValue: data }, { diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts index 3785c6741d..5d3397c035 100644 --- a/lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts +++ b/lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts @@ -16,8 +16,8 @@ */ import { Component, Inject, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core'; -import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; -import { TranslationService, NotificationService } from '@alfresco/adf-core'; +import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog'; +import { TranslationService, NotificationService, ToolbarTitleComponent, ToolbarComponent, EmptyListComponent } from '@alfresco/adf-core'; import { Node } from '@alfresco/js-api'; import { AllowableOperationsEnum } from '../common/models/allowable-operations.enum'; import { ContentService } from '../common/services/content.service'; @@ -28,9 +28,38 @@ import { NodeAction } from '../document-list/models/node-action.enum'; import { OverlayContainer } from '@angular/cdk/overlay'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; +import { CommonModule } from '@angular/common'; +import { MatTabsModule } from '@angular/material/tabs'; +import { TranslateModule } from '@ngx-translate/core'; +import { DropdownBreadcrumbComponent } from '../breadcrumb/dropdown-breadcrumb.component'; +import { NodeCounterDirective } from '../directives/node-counter.directive'; +import { MatIconModule } from '@angular/material/icon'; +import { UploadDragAreaComponent } from '../upload/components/upload-drag-area.component'; +import { FileUploadingDialogComponent } from '../upload/components/file-uploading-dialog.component'; +import { ContentNodeSelectorPanelComponent } from './content-node-selector-panel/content-node-selector-panel.component'; +import { UploadButtonComponent } from '../upload/components/upload-button.component'; +import { MatButtonModule } from '@angular/material/button'; @Component({ selector: 'adf-content-node-selector', + standalone: true, + imports: [ + CommonModule, + MatDialogModule, + MatTabsModule, + TranslateModule, + ToolbarTitleComponent, + ToolbarComponent, + DropdownBreadcrumbComponent, + NodeCounterDirective, + MatIconModule, + UploadDragAreaComponent, + FileUploadingDialogComponent, + EmptyListComponent, + ContentNodeSelectorPanelComponent, + UploadButtonComponent, + MatButtonModule + ], templateUrl: './content-node-selector.component.html', styleUrls: ['./content-node-selector.component.scss'], encapsulation: ViewEncapsulation.None diff --git a/lib/content-services/src/lib/content-node-selector/content-node-selector.module.ts b/lib/content-services/src/lib/content-node-selector/content-node-selector.module.ts index bb2f131c40..59112a1c11 100644 --- a/lib/content-services/src/lib/content-node-selector/content-node-selector.module.ts +++ b/lib/content-services/src/lib/content-node-selector/content-node-selector.module.ts @@ -15,39 +15,22 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { MaterialModule } from '../material.module'; import { ContentNodeSelectorPanelComponent } from './content-node-selector-panel/content-node-selector-panel.component'; import { ContentNodeSelectorComponent } from './content-node-selector.component'; -import { BREADCRUMB_DIRECTIVES } from '../breadcrumb/breadcrumb.module'; -import { SearchModule } from '../search/search.module'; -import { CoreModule } from '@alfresco/adf-core'; -import { DocumentListModule } from '../document-list/document-list.module'; import { NameLocationCellComponent } from './name-location-cell/name-location-cell.component'; -import { CONTENT_UPLOAD_DIRECTIVES } from '../upload/upload.module'; -import { SearchQueryBuilderService } from '../search/services/search-query-builder.service'; -import { CONTENT_DIRECTIVES } from '../directives/content-directive.module'; import { DropdownSitesComponent } from './site-dropdown/sites-dropdown.component'; +export const CONTENT_NODE_SELECTOR_DIRECTIVES = [ + ContentNodeSelectorPanelComponent, + NameLocationCellComponent, + ContentNodeSelectorComponent, + DropdownSitesComponent +]; + +/** @deprecated use `...CONTENT_NODE_SELECTOR_DIRECTIVES` or import the individual components */ @NgModule({ - imports: [ - FormsModule, - ReactiveFormsModule, - CoreModule, - CommonModule, - MaterialModule, - DropdownSitesComponent, - ...BREADCRUMB_DIRECTIVES, - SearchModule, - DocumentListModule, - NameLocationCellComponent, - CONTENT_DIRECTIVES, - ...CONTENT_UPLOAD_DIRECTIVES - ], - exports: [ContentNodeSelectorPanelComponent, NameLocationCellComponent, ContentNodeSelectorComponent], - declarations: [ContentNodeSelectorPanelComponent, ContentNodeSelectorComponent], - providers: [SearchQueryBuilderService] + imports: [...CONTENT_NODE_SELECTOR_DIRECTIVES], + exports: [...CONTENT_NODE_SELECTOR_DIRECTIVES] }) export class ContentNodeSelectorModule {} diff --git a/lib/content-services/src/lib/content-node-share/content-node-share.dialog.ts b/lib/content-services/src/lib/content-node-share/content-node-share.dialog.ts index 5f1d241e8a..31f4a3da91 100644 --- a/lib/content-services/src/lib/content-node-share/content-node-share.dialog.ts +++ b/lib/content-services/src/lib/content-node-share/content-node-share.dialog.ts @@ -23,7 +23,7 @@ import { Subject } from 'rxjs'; import { ContentService } from '../common/services/content.service'; import { SharedLinksApiService } from './services/shared-links-api.service'; import { SharedLinkBodyCreate } from '@alfresco/js-api'; -import { ClipboardModule, ConfirmDialogComponent } from '@alfresco/adf-core'; +import { ClipboardDirective, ConfirmDialogComponent } from '@alfresco/adf-core'; import { ContentNodeShareSettings } from './content-node-share.settings'; import { RenditionService } from '../common/services/rendition.service'; import { format, add, endOfDay, isBefore } from 'date-fns'; @@ -53,8 +53,8 @@ interface SharedDialogFormProps { MatFormFieldModule, MatDatepickerModule, MatInputModule, - ClipboardModule, - MatButtonModule + MatButtonModule, + ClipboardDirective ], templateUrl: './content-node-share.dialog.html', styleUrls: ['./content-node-share.dialog.scss'], diff --git a/lib/content-services/src/lib/content-type/content-type-dialog.component.html b/lib/content-services/src/lib/content-type/content-type-dialog.component.html index 27bd67b774..dd28edb54a 100644 --- a/lib/content-services/src/lib/content-type/content-type-dialog.component.html +++ b/lib/content-services/src/lib/content-type/content-type-dialog.component.html @@ -1,7 +1,7 @@

{{title | translate}}

-

{{description | translate}}

{{confirmMessage | translate}}

@@ -39,7 +39,7 @@
diff --git a/lib/content-services/src/lib/content-type/content-type-dialog.component.ts b/lib/content-services/src/lib/content-type/content-type-dialog.component.ts index 52e689c83d..b298b2896f 100644 --- a/lib/content-services/src/lib/content-type/content-type-dialog.component.ts +++ b/lib/content-services/src/lib/content-type/content-type-dialog.component.ts @@ -17,18 +17,24 @@ import { TypeEntry } from '@alfresco/js-api'; import { Component, Inject, OnInit, ViewEncapsulation } from '@angular/core'; -import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; +import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog'; import { ContentTypeDialogComponentData } from './content-type-metadata.interface'; import { ContentTypeService } from './content-type.service'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatExpansionModule } from '@angular/material/expansion'; +import { MatTableModule } from '@angular/material/table'; +import { MatButtonModule } from '@angular/material/button'; @Component({ selector: 'adf-content-type-dialog', + standalone: true, + imports: [CommonModule, MatDialogModule, TranslateModule, MatExpansionModule, MatTableModule, MatButtonModule], templateUrl: './content-type-dialog.component.html', styleUrls: ['./content-type-dialog.component.scss'], encapsulation: ViewEncapsulation.None }) export class ContentTypeDialogComponent implements OnInit { - title: string; description: string; nodeType: string; @@ -39,9 +45,11 @@ export class ContentTypeDialogComponent implements OnInit { propertyColumns: string[] = ['name', 'title', 'dataType']; - constructor(private dialog: MatDialogRef, - @Inject(MAT_DIALOG_DATA) public data: ContentTypeDialogComponentData, - private contentTypeService: ContentTypeService) { + constructor( + private dialog: MatDialogRef, + @Inject(MAT_DIALOG_DATA) public data: ContentTypeDialogComponentData, + private contentTypeService: ContentTypeService + ) { this.title = data.title; this.description = data.description; this.confirmMessage = data.confirmMessage; @@ -49,7 +57,9 @@ export class ContentTypeDialogComponent implements OnInit { this.contentTypeService.getContentTypeByPrefix(this.nodeType).subscribe((contentTypeEntry) => { this.currentContentType = contentTypeEntry; - this.typeProperties = this.currentContentType.entry.properties.filter((property) => property.id.startsWith(this.currentContentType.entry.model.namespacePrefix)); + this.typeProperties = this.currentContentType.entry.properties.filter((property) => + property.id.startsWith(this.currentContentType.entry.model.namespacePrefix) + ); }); } diff --git a/lib/content-services/src/lib/content-type/content-type.module.ts b/lib/content-services/src/lib/content-type/content-type.module.ts deleted file mode 100644 index 47c3564d18..0000000000 --- a/lib/content-services/src/lib/content-type/content-type.module.ts +++ /dev/null @@ -1,45 +0,0 @@ -/*! - * @license - * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved. - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -import { CommonModule } from '@angular/common'; -import { NgModule } from '@angular/core'; -import { MatTableModule } from '@angular/material/table'; -import { MatExpansionModule } from '@angular/material/expansion'; -import { MatCheckboxModule } from '@angular/material/checkbox'; -import { TranslateModule } from '@ngx-translate/core'; -import { MatDialogModule } from '@angular/material/dialog'; -import { MatButtonModule } from '@angular/material/button'; -import { ContentTypeDialogComponent } from './content-type-dialog.component'; - -@NgModule({ - imports: [ - CommonModule, - MatTableModule, - MatExpansionModule, - MatCheckboxModule, - TranslateModule, - MatDialogModule, - MatButtonModule - ], - exports: [ - ContentTypeDialogComponent - ], - declarations: [ - ContentTypeDialogComponent - ] -}) -export class ContentTypeModule { } diff --git a/lib/content-services/src/lib/content-type/index.ts b/lib/content-services/src/lib/content-type/index.ts index ce67d246b3..fc169b7bf8 100644 --- a/lib/content-services/src/lib/content-type/index.ts +++ b/lib/content-services/src/lib/content-type/index.ts @@ -18,5 +18,3 @@ export * from './content-type.service'; export * from './content-type-metadata.interface'; export * from './content-type-dialog.component'; - -export * from './content-type.module'; diff --git a/lib/content-services/src/lib/content.module.ts b/lib/content-services/src/lib/content.module.ts index e4ab61c6f9..67d850db19 100644 --- a/lib/content-services/src/lib/content.module.ts +++ b/lib/content-services/src/lib/content.module.ts @@ -15,81 +15,75 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule, ModuleWithProviders, APP_INITIALIZER } from '@angular/core'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { CoreModule, SearchTextModule, provideTranslations } from '@alfresco/adf-core'; -import { MaterialModule } from './material.module'; +import { provideTranslations } from '@alfresco/adf-core'; +import { MatDatetimepickerModule, MatNativeDatetimeModule } from '@mat-datetimepicker/core'; import { CONTENT_TAG_DIRECTIVES } from './tag/tag.module'; -import { DocumentListModule } from './document-list/document-list.module'; -import { SearchModule } from './search/search.module'; +import { DOCUMENT_LIST_DIRECTIVES } from './document-list/document-list.module'; +import { CONTENT_SEARCH_DIRECTIVES } from './search/search.module'; import { BREADCRUMB_DIRECTIVES } from './breadcrumb/breadcrumb.module'; import { CONTENT_VERSION_DIRECTIVES } from './version-manager/version-manager.module'; -import { ContentNodeSelectorModule } from './content-node-selector/content-node-selector.module'; +import { CONTENT_NODE_SELECTOR_DIRECTIVES } from './content-node-selector/content-node-selector.module'; import { CONTENT_NODE_SHARE_DIRECTIVES } from './content-node-share/content-node-share.module'; import { CONTENT_DIRECTIVES } from './directives/content-directive.module'; import { CONTENT_DIALOG_DIRECTIVES } from './dialogs/dialog.module'; import { CONTENT_METADATA_DIRECTIVES } from './content-metadata/content-metadata.module'; import { CONTENT_PERMISSION_MANAGER_DIRECTIVES } from './permission-manager/permission-manager.module'; -import { ContentTypeModule } from './content-type/content-type.module'; -import { AspectListModule } from './aspect-list/aspect-list.module'; +import { ASPECT_LIST_DIRECTIVES } from './aspect-list/aspect-list.module'; import { versionCompatibilityFactory } from './version-compatibility/version-compatibility-factory'; import { VersionCompatibilityService } from './version-compatibility/version-compatibility.service'; import { CONTENT_PIPES } from './pipes/content-pipe.module'; -import { NodeCommentsModule } from './node-comments/node-comments.module'; -import { AlfrescoViewerModule } from './viewer/alfresco-viewer.module'; import { contentAuthLoaderFactory } from './auth-loader/content-auth-loader-factory'; import { ContentAuthLoaderService } from './auth-loader/content-auth-loader.service'; -import { DropdownSitesComponent } from './content-node-selector/site-dropdown/sites-dropdown.component'; import { CategoriesManagementComponent } from './category'; import { TreeComponent } from './tree'; import { NewVersionUploaderDialogComponent } from './new-version-uploader'; import { VersionCompatibilityDirective } from './version-compatibility'; import { CONTENT_UPLOAD_DIRECTIVES } from './upload'; import { TreeViewComponent } from './tree-view'; +import { NodeCommentsComponent } from './node-comments'; +import { AlfrescoViewerComponent } from './viewer'; +import { ContentTypeDialogComponent } from './content-type'; +import { MaterialModule } from './material.module'; @NgModule({ imports: [ - ...CONTENT_PIPES, - CoreModule, - ...CONTENT_TAG_DIRECTIVES, - CommonModule, - FormsModule, - ReactiveFormsModule, - ...CONTENT_DIALOG_DIRECTIVES, - SearchModule, - DocumentListModule, - ...CONTENT_UPLOAD_DIRECTIVES, MaterialModule, - DropdownSitesComponent, + MatDatetimepickerModule, + MatNativeDatetimeModule, + ...CONTENT_PIPES, + ...CONTENT_TAG_DIRECTIVES, + ...CONTENT_DIALOG_DIRECTIVES, + ...CONTENT_SEARCH_DIRECTIVES, + ...DOCUMENT_LIST_DIRECTIVES, + ...CONTENT_UPLOAD_DIRECTIVES, ...BREADCRUMB_DIRECTIVES, - ContentNodeSelectorModule, + ...CONTENT_NODE_SELECTOR_DIRECTIVES, ...CONTENT_NODE_SHARE_DIRECTIVES, ...CONTENT_METADATA_DIRECTIVES, ...CONTENT_DIRECTIVES, ...CONTENT_PERMISSION_MANAGER_DIRECTIVES, ...CONTENT_VERSION_DIRECTIVES, TreeViewComponent, - ContentTypeModule, - AspectListModule, + ContentTypeDialogComponent, + ...ASPECT_LIST_DIRECTIVES, VersionCompatibilityDirective, - NodeCommentsModule, + NodeCommentsComponent, TreeComponent, - SearchTextModule, - AlfrescoViewerModule, + AlfrescoViewerComponent, CategoriesManagementComponent, NewVersionUploaderDialogComponent ], providers: [provideTranslations('adf-content-services', 'assets/adf-content-services')], exports: [ + MaterialModule, ...CONTENT_PIPES, ...CONTENT_TAG_DIRECTIVES, - DocumentListModule, + ...DOCUMENT_LIST_DIRECTIVES, ...CONTENT_UPLOAD_DIRECTIVES, - SearchModule, - DropdownSitesComponent, + ...CONTENT_SEARCH_DIRECTIVES, ...BREADCRUMB_DIRECTIVES, - ContentNodeSelectorModule, + ...CONTENT_NODE_SELECTOR_DIRECTIVES, ...CONTENT_NODE_SHARE_DIRECTIVES, ...CONTENT_METADATA_DIRECTIVES, ...CONTENT_DIALOG_DIRECTIVES, @@ -97,13 +91,12 @@ import { TreeViewComponent } from './tree-view'; ...CONTENT_PERMISSION_MANAGER_DIRECTIVES, ...CONTENT_VERSION_DIRECTIVES, TreeViewComponent, - AspectListModule, - ContentTypeModule, + ...ASPECT_LIST_DIRECTIVES, + ContentTypeDialogComponent, VersionCompatibilityDirective, - NodeCommentsModule, + NodeCommentsComponent, TreeComponent, - SearchTextModule, - AlfrescoViewerModule, + AlfrescoViewerComponent, CategoriesManagementComponent, NewVersionUploaderDialogComponent ] @@ -131,6 +124,10 @@ export class ContentModule { }; } + /** + * @deprecated use `ContentModule` instead + * @returns ModuleWithProviders + */ static forChild(): ModuleWithProviders { return { ngModule: ContentModule diff --git a/lib/content-services/src/lib/directives/check-allowable-operation.directive.spec.ts b/lib/content-services/src/lib/directives/check-allowable-operation.directive.spec.ts index ea15e51780..837716540e 100644 --- a/lib/content-services/src/lib/directives/check-allowable-operation.directive.spec.ts +++ b/lib/content-services/src/lib/directives/check-allowable-operation.directive.spec.ts @@ -20,7 +20,6 @@ import { ContentService } from '../common/services/content.service'; import { CheckAllowableOperationDirective } from './check-allowable-operation.directive'; import { TestBed } from '@angular/core/testing'; import { NodeAllowableOperationSubject } from '../interfaces/node-allowable-operation-subject.interface'; -import { ContentDirectiveModule } from './content-directive.module'; import { RedirectAuthService } from '@alfresco/adf-core'; import { EMPTY, of } from 'rxjs'; import { HttpClientTestingModule } from '@angular/common/http/testing'; @@ -38,7 +37,7 @@ describe('CheckAllowableOperationDirective', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentDirectiveModule, HttpClientTestingModule], + imports: [HttpClientTestingModule], providers: [{ provide: RedirectAuthService, useValue: { onLogin: EMPTY, onTokenReceived: of() } }] }); changeDetectorMock = { detectChanges: () => {} } as ChangeDetectorRef; diff --git a/lib/content-services/src/lib/directives/library-membership.directive.spec.ts b/lib/content-services/src/lib/directives/library-membership.directive.spec.ts index 6743278752..ec9172f5e8 100644 --- a/lib/content-services/src/lib/directives/library-membership.directive.spec.ts +++ b/lib/content-services/src/lib/directives/library-membership.directive.spec.ts @@ -20,7 +20,6 @@ import { LibraryMembershipDirective } from './library-membership.directive'; import { SimpleChange } from '@angular/core'; import { of, throwError, Subject } from 'rxjs'; import { AlfrescoApiService, AlfrescoApiServiceMock } from '@alfresco/adf-core'; -import { ContentDirectiveModule } from './content-directive.module'; import { SitesService } from '../common/services/sites.service'; import { HttpClientTestingModule } from '@angular/common/http/testing'; @@ -38,7 +37,7 @@ describe('LibraryMembershipDirective', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [HttpClientTestingModule, ContentDirectiveModule], + imports: [HttpClientTestingModule], providers: [SitesService, { provide: AlfrescoApiService, useClass: AlfrescoApiServiceMock }] }); diff --git a/lib/content-services/src/lib/directives/node-delete.directive.spec.ts b/lib/content-services/src/lib/directives/node-delete.directive.spec.ts index 3c0508b2bf..32a322aca2 100644 --- a/lib/content-services/src/lib/directives/node-delete.directive.spec.ts +++ b/lib/content-services/src/lib/directives/node-delete.directive.spec.ts @@ -19,13 +19,15 @@ import { Component, DebugElement, ViewChild } from '@angular/core'; import { ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NodeDeleteDirective } from './node-delete.directive'; -import { ContentDirectiveModule } from './content-directive.module'; import { HttpClientTestingModule } from '@angular/common/http/testing'; import { TranslateModule } from '@ngx-translate/core'; import { RedirectAuthService, TranslationMock, TranslationService } from '@alfresco/adf-core'; import { EMPTY, of } from 'rxjs'; +import { CheckAllowableOperationDirective } from './check-allowable-operation.directive'; @Component({ + standalone: true, + imports: [NodeDeleteDirective], template: `
` }) class TestComponent { @@ -38,10 +40,12 @@ class TestComponent { } @Component({ - template: `
` + standalone: true, + imports: [NodeDeleteDirective, CheckAllowableOperationDirective], + template: `
` }) class TestWithPermissionsComponent { - selection = []; + selection: any[] = []; @ViewChild(NodeDeleteDirective, { static: true }) deleteDirective: NodeDeleteDirective; @@ -50,6 +54,8 @@ class TestWithPermissionsComponent { } @Component({ + standalone: true, + imports: [NodeDeleteDirective], template: ` delete permanent
` }) @@ -79,12 +85,11 @@ describe('NodeDeleteDirective', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentDirectiveModule, HttpClientTestingModule, TranslateModule.forRoot()], + imports: [HttpClientTestingModule, TranslateModule.forRoot(), TestComponent, TestWithPermissionsComponent, TestDeletePermanentComponent], providers: [ { provide: TranslationService, useClass: TranslationMock }, { provide: RedirectAuthService, useValue: { onLogin: EMPTY, onTokenReceived: of() } } - ], - declarations: [TestComponent, TestWithPermissionsComponent, TestDeletePermanentComponent] + ] }); fixture = TestBed.createComponent(TestComponent); fixtureWithPermissions = TestBed.createComponent(TestWithPermissionsComponent); diff --git a/lib/content-services/src/lib/directives/node-download.directive.spec.ts b/lib/content-services/src/lib/directives/node-download.directive.spec.ts index bbc6bd3551..2795b657ce 100755 --- a/lib/content-services/src/lib/directives/node-download.directive.spec.ts +++ b/lib/content-services/src/lib/directives/node-download.directive.spec.ts @@ -21,18 +21,20 @@ import { MatDialog, MatDialogModule } from '@angular/material/dialog'; import { Component, DebugElement, ViewChild } from '@angular/core'; import { AlfrescoApiService, AlfrescoApiServiceMock } from '@alfresco/adf-core'; import { NodeDownloadDirective } from './node-download.directive'; -import { ContentDirectiveModule } from '@alfresco/adf-content-services'; import { HttpClientTestingModule } from '@angular/common/http/testing'; +import { ContentApi } from '@alfresco/js-api'; @Component({ + standalone: true, + imports: [NodeDownloadDirective], template: '
' }) class TestComponent { @ViewChild(NodeDownloadDirective, { static: true }) downloadDirective: NodeDownloadDirective; - selection; - version; + selection: any[]; + version: any; } describe('NodeDownloadDirective', () => { @@ -41,8 +43,9 @@ describe('NodeDownloadDirective', () => { let element: DebugElement; let dialog: MatDialog; let apiService: AlfrescoApiService; - let contentService; - let dialogSpy; + let contentService: ContentApi; + let dialogSpy: jasmine.Spy; + const mockOauth2Auth: any = { oauth2Auth: { callCustomApi: () => Promise.resolve() @@ -53,8 +56,7 @@ describe('NodeDownloadDirective', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentDirectiveModule, HttpClientTestingModule, MatDialogModule], - declarations: [TestComponent], + imports: [HttpClientTestingModule, MatDialogModule, TestComponent], providers: [{ provide: AlfrescoApiService, useClass: AlfrescoApiServiceMock }] }); fixture = TestBed.createComponent(TestComponent); @@ -62,7 +64,7 @@ describe('NodeDownloadDirective', () => { element = fixture.debugElement.query(By.directive(NodeDownloadDirective)); dialog = TestBed.inject(MatDialog); apiService = TestBed.inject(AlfrescoApiService); - contentService = component.downloadDirective['contentApi']; + contentService = component.downloadDirective.contentApi; dialogSpy = spyOn(dialog, 'open'); }); diff --git a/lib/content-services/src/lib/directives/node-restore.directive.spec.ts b/lib/content-services/src/lib/directives/node-restore.directive.spec.ts index a77fc376d1..6d3a96aa8e 100644 --- a/lib/content-services/src/lib/directives/node-restore.directive.spec.ts +++ b/lib/content-services/src/lib/directives/node-restore.directive.spec.ts @@ -20,15 +20,17 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NodeRestoreDirective } from './node-restore.directive'; import { TranslationMock, TranslationService } from '@alfresco/adf-core'; -import { ContentDirectiveModule } from './content-directive.module'; import { HttpClientTestingModule } from '@angular/common/http/testing'; import { TranslateModule } from '@ngx-translate/core'; +import { TrashcanApi } from '@alfresco/js-api'; @Component({ + standalone: true, + imports: [NodeRestoreDirective], template: `
` }) class TestComponent { - selection = []; + selection: any[] = []; doneSpy = jasmine.createSpy('doneSpy'); } @@ -37,25 +39,24 @@ describe('NodeRestoreDirective', () => { let fixture: ComponentFixture; let element: DebugElement; let component: TestComponent; - let trashcanApi; - let directiveInstance; + let trashcanApi: TrashcanApi; + let directiveInstance: NodeRestoreDirective; let restoreNodeSpy: any; let translationService: TranslationService; beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentDirectiveModule, HttpClientTestingModule, TranslateModule.forRoot()], - providers: [{ provide: TranslationService, useClass: TranslationMock }], - declarations: [TestComponent] + imports: [HttpClientTestingModule, TranslateModule.forRoot(), TestComponent], + providers: [{ provide: TranslationService, useClass: TranslationMock }] }); fixture = TestBed.createComponent(TestComponent); component = fixture.componentInstance; element = fixture.debugElement.query(By.directive(NodeRestoreDirective)); directiveInstance = element.injector.get(NodeRestoreDirective); - trashcanApi = directiveInstance['trashcanApi']; + trashcanApi = directiveInstance.trashcanApi; - restoreNodeSpy = spyOn(trashcanApi, 'restoreDeletedNode').and.returnValue(Promise.resolve()); + restoreNodeSpy = spyOn(trashcanApi, 'restoreDeletedNode').and.returnValue(Promise.resolve({} as any)); spyOn(trashcanApi, 'listDeletedNodes').and.returnValue( Promise.resolve({ list: { entries: [] } @@ -115,16 +116,6 @@ describe('NodeRestoreDirective', () => { }); }); - it('should reset status', () => { - directiveInstance.restoreProcessStatus.fail = [{}]; - directiveInstance.restoreProcessStatus.success = [{}]; - - directiveInstance.restoreProcessStatus.reset(); - - expect(directiveInstance.restoreProcessStatus.fail).toEqual([]); - expect(directiveInstance.restoreProcessStatus.success).toEqual([]); - }); - it('should emit event on finish', (done) => { spyOn(element.nativeElement, 'dispatchEvent'); diff --git a/lib/content-services/src/lib/document-list/components/content-action/content-action-list.component.ts b/lib/content-services/src/lib/document-list/components/content-action/content-action-list.component.ts index bcbecd868f..fd0f94fbf1 100644 --- a/lib/content-services/src/lib/document-list/components/content-action/content-action-list.component.ts +++ b/lib/content-services/src/lib/document-list/components/content-action/content-action-list.component.ts @@ -15,21 +15,19 @@ * limitations under the License. */ - /* eslint-disable @angular-eslint/component-selector */ +/* eslint-disable @angular-eslint/component-selector */ import { Component } from '@angular/core'; - import { ContentActionModel } from './../../models/content-action.model'; import { DocumentListComponent } from './../document-list.component'; @Component({ selector: 'content-actions', - template: '' + template: '', + standalone: true }) export class ContentActionListComponent { - - constructor(private documentList: DocumentListComponent) { - } + constructor(private documentList: DocumentListComponent) {} /** * Registers action handler within the parent document list component. diff --git a/lib/content-services/src/lib/document-list/components/content-action/content-action.component.ts b/lib/content-services/src/lib/document-list/components/content-action/content-action.component.ts index f07151a7ba..f8e9494fbb 100644 --- a/lib/content-services/src/lib/document-list/components/content-action/content-action.component.ts +++ b/lib/content-services/src/lib/document-list/components/content-action/content-action.component.ts @@ -15,7 +15,7 @@ * limitations under the License. */ - /* eslint-disable @angular-eslint/component-selector */ +/* eslint-disable @angular-eslint/component-selector */ import { Component, EventEmitter, Input, OnInit, Output, OnChanges, SimpleChanges, OnDestroy } from '@angular/core'; @@ -28,14 +28,11 @@ import { Subscription } from 'rxjs'; @Component({ selector: 'content-action', + standalone: true, template: '', - providers: [ - DocumentActionsService, - FolderActionsService - ] + providers: [DocumentActionsService, FolderActionsService] }) export class ContentActionComponent implements OnInit, OnChanges, OnDestroy { - /** The title of the action as shown in the menu. */ @Input() title: string = 'Action'; @@ -98,8 +95,8 @@ export class ContentActionComponent implements OnInit, OnChanges, OnDestroy { constructor( private list: ContentActionListComponent, private documentActions: DocumentActionsService, - private folderActions: FolderActionsService) { - } + private folderActions: FolderActionsService + ) {} ngOnInit() { if (this.target === ContentActionTarget.All) { diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.spec.ts b/lib/content-services/src/lib/document-list/components/document-list.component.spec.ts index b5abb445e8..317f11bd1a 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.spec.ts +++ b/lib/content-services/src/lib/document-list/components/document-list.component.spec.ts @@ -18,11 +18,11 @@ import { AppConfigService, AuthenticationService, + CustomLoadingContentTemplateDirective, DataColumn, DataColumnComponent, DataColumnListComponent, DataTableComponent, - DataTableModule, ObjectDataTableAdapter, ShowHeaderMode, ThumbnailService @@ -56,13 +56,13 @@ import { ImageResolver } from '../data/image-resolver.model'; import { RowFilter } from '../data/row-filter.model'; import { ShareDataRow } from '../data/share-data-row.model'; import { ShareDataTableAdapter } from '../data/share-datatable-adapter'; -import { DocumentListModule } from '../document-list.module'; import { ContentActionModel } from '../models/content-action.model'; import { DocumentLoaderNode } from '../models/document-folder.model'; import { MatDialog } from '@angular/material/dialog'; import { FileAutoDownloadComponent } from './file-auto-download/file-auto-download.component'; import { DocumentListComponent } from './document-list.component'; import { CustomResourcesService, DocumentListService } from '../public-api'; +import { CommonModule } from '@angular/common'; const mockDialog = { open: jasmine.createSpy('open') @@ -87,7 +87,7 @@ describe('DocumentList', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentTestingModule], + imports: [ContentTestingModule, DocumentListComponent], schemas: [CUSTOM_ELEMENTS_SCHEMA], providers: [{ provide: MatDialog, useValue: mockDialog }] }); @@ -109,7 +109,7 @@ describe('DocumentList', () => { spyFolder = spyOn(documentListService, 'getFolder').and.returnValue(of({ list: {} })); spyFolderNode = spyOn(documentListService, 'getFolderNode').and.returnValue(of(new NodeEntry({ entry: new Node() }))); - spyOn(documentList['nodesApi'], 'getNode').and.returnValue(Promise.resolve(new NodeEntry({ entry: new Node() }))); + spyOn(documentList.nodesApi, 'getNode').and.returnValue(Promise.resolve(new NodeEntry({ entry: new Node() }))); documentList.ngOnInit(); documentList.currentFolderId = 'no-node'; @@ -1608,6 +1608,9 @@ describe('DocumentList', () => { }); it('should display fileAutoDownload dialog if node size exceeds appConfig.viewer.fileAutoDownloadSizeThresholdInMB', async () => { + const dialog = fixture.debugElement.injector.get(MatDialog); + spyOn(dialog, 'open').and.stub(); + appConfigService.config = { ...appConfigService.config, viewer: { @@ -1630,7 +1633,7 @@ describe('DocumentList', () => { fixture.detectChanges(); await fixture.whenStable(); - expect(mockDialog.open).toHaveBeenCalledWith(FileAutoDownloadComponent, { disableClose: true, data: node }); + expect(dialog.open).toHaveBeenCalledWith(FileAutoDownloadComponent, { disableClose: true, data: node }); }); describe('Preselect nodes', () => { @@ -1870,6 +1873,8 @@ describe('DocumentList', () => { }); @Component({ + standalone: true, + imports: [CommonModule, DocumentListComponent, CustomLoadingContentTemplateDirective], template: ` @@ -1896,8 +1901,7 @@ describe('DocumentListComponent rendering', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [CustomTemplateComponent], - imports: [ContentTestingModule, DataTableModule, DocumentListModule] + imports: [ContentTestingModule, CustomTemplateComponent] }); fixture = TestBed.createComponent(CustomTemplateComponent); component = fixture.componentInstance; diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.ts b/lib/content-services/src/lib/document-list/components/document-list.component.ts index 6a4ee625fe..c5a43e40d0 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.ts +++ b/lib/content-services/src/lib/document-list/components/document-list.component.ts @@ -21,6 +21,7 @@ import { AlfrescoApiService, AppConfigService, + ColumnsSelectorComponent, CustomEmptyContentTemplateDirective, CustomLoadingContentTemplateDirective, CustomNoPermissionTemplateDirective, @@ -33,6 +34,11 @@ import { DataTableComponent, DataTableSchema, DataTableService, + EmptyListComponent, + LoadingContentTemplateDirective, + MainMenuDataTableTemplateDirective, + NoContentTemplateDirective, + NoPermissionTemplateDirective, PaginatedComponent, PaginationModel, RequestPaginationModel, @@ -75,11 +81,31 @@ import { LockService } from '../services/lock.service'; import { ADF_DOCUMENT_PARENT_COMPONENT } from './document-list.token'; import { FileAutoDownloadComponent } from './file-auto-download/file-auto-download.component'; import { NodeEntityEvent, NodeEntryEvent } from './node.event'; +import { CommonModule } from '@angular/common'; +import { FilterHeaderComponent } from './filter-header/filter-header.component'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatIconModule } from '@angular/material/icon'; +import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; const BYTES_TO_MB_CONVERSION_VALUE = 1048576; @Component({ selector: 'adf-document-list', + standalone: true, + imports: [ + CommonModule, + DataTableComponent, + FilterHeaderComponent, + NoContentTemplateDirective, + EmptyListComponent, + TranslateModule, + NoPermissionTemplateDirective, + MatIconModule, + LoadingContentTemplateDirective, + MatProgressSpinnerModule, + MainMenuDataTableTemplateDirective, + ColumnsSelectorComponent + ], templateUrl: './document-list.component.html', styleUrls: ['./document-list.component.scss'], providers: [ diff --git a/lib/content-services/src/lib/document-list/components/file-auto-download/file-auto-download.component.spec.ts b/lib/content-services/src/lib/document-list/components/file-auto-download/file-auto-download.component.spec.ts index 5c4b52e96f..43a5b0a216 100644 --- a/lib/content-services/src/lib/document-list/components/file-auto-download/file-auto-download.component.spec.ts +++ b/lib/content-services/src/lib/document-list/components/file-auto-download/file-auto-download.component.spec.ts @@ -23,7 +23,7 @@ import { By } from '@angular/platform-browser'; import { TranslateModule } from '@ngx-translate/core'; import { TranslationMock, TranslationService } from '@alfresco/adf-core'; import { MatButtonModule } from '@angular/material/button'; -import { NodeDownloadDirective } from '../../../directives'; +import { NodeDownloadDirective } from '../../../directives/node-download.directive'; import { HttpClientTestingModule } from '@angular/common/http/testing'; const mockDialog = { @@ -37,8 +37,14 @@ describe('FileAutoDownloadComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [HttpClientTestingModule, TranslateModule.forRoot(), MatDialogModule, MatButtonModule, NodeDownloadDirective], - declarations: [FileAutoDownloadComponent], + imports: [ + HttpClientTestingModule, + TranslateModule.forRoot(), + MatDialogModule, + MatButtonModule, + NodeDownloadDirective, + FileAutoDownloadComponent + ], providers: [ { provide: MatDialogRef, useValue: mockDialog }, { provide: MAT_DIALOG_DATA, useValue: null }, diff --git a/lib/content-services/src/lib/document-list/components/file-auto-download/file-auto-download.component.ts b/lib/content-services/src/lib/document-list/components/file-auto-download/file-auto-download.component.ts index 6ba38dc259..f5b4562b6d 100644 --- a/lib/content-services/src/lib/document-list/components/file-auto-download/file-auto-download.component.ts +++ b/lib/content-services/src/lib/document-list/components/file-auto-download/file-auto-download.component.ts @@ -16,12 +16,18 @@ */ import { Component, Inject } from '@angular/core'; -import { MAT_DIALOG_DATA } from '@angular/material/dialog'; +import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog'; import { NodeEntry } from '@alfresco/js-api'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatButtonModule } from '@angular/material/button'; +import { NodeDownloadDirective } from '../../../directives/node-download.directive'; @Component({ - selector: 'adf-file-auto-download', - templateUrl: './file-auto-download.component.html' + selector: 'adf-file-auto-download', + standalone: true, + imports: [CommonModule, MatDialogModule, TranslateModule, MatButtonModule, NodeDownloadDirective], + templateUrl: './file-auto-download.component.html' }) export class FileAutoDownloadComponent { constructor(@Inject(MAT_DIALOG_DATA) public node: NodeEntry) {} diff --git a/lib/content-services/src/lib/document-list/components/filter-header/filter-header.component.spec.ts b/lib/content-services/src/lib/document-list/components/filter-header/filter-header.component.spec.ts index 17fb110571..4a63441097 100644 --- a/lib/content-services/src/lib/document-list/components/filter-header/filter-header.component.spec.ts +++ b/lib/content-services/src/lib/document-list/components/filter-header/filter-header.component.spec.ts @@ -48,7 +48,7 @@ describe('FilterHeaderComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentTestingModule], + imports: [ContentTestingModule, FilterHeaderComponent], providers: [ { provide: ADF_DOCUMENT_PARENT_COMPONENT, useExisting: DocumentListComponent }, { provide: SearchService, useValue: searchMock }, diff --git a/lib/content-services/src/lib/document-list/components/filter-header/filter-header.component.ts b/lib/content-services/src/lib/document-list/components/filter-header/filter-header.component.ts index 5ba0c06183..24250a4b67 100644 --- a/lib/content-services/src/lib/document-list/components/filter-header/filter-header.component.ts +++ b/lib/content-services/src/lib/document-list/components/filter-header/filter-header.component.ts @@ -16,15 +16,19 @@ */ import { Component, Inject, OnInit, OnChanges, SimpleChanges, Input, Output, EventEmitter, OnDestroy } from '@angular/core'; -import { PaginationModel, DataSorting } from '@alfresco/adf-core'; +import { PaginationModel, DataSorting, HeaderFilterTemplateDirective } from '@alfresco/adf-core'; import { SearchHeaderQueryBuilderService } from '../../../search/services/search-header-query-builder.service'; import { FilterSearch } from './../../../search/models/filter-search.interface'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { ADF_DOCUMENT_PARENT_COMPONENT } from '../document-list.token'; +import { CommonModule } from '@angular/common'; +import { SearchFilterContainerComponent } from '../../../search/components/search-filter-container/search-filter-container.component'; @Component({ selector: 'adf-filter-header', + standalone: true, + imports: [CommonModule, HeaderFilterTemplateDirective, SearchFilterContainerComponent], templateUrl: './filter-header.component.html' }) export class FilterHeaderComponent implements OnInit, OnChanges, OnDestroy { diff --git a/lib/content-services/src/lib/document-list/components/library-name-column/library-name-column.component.spec.ts b/lib/content-services/src/lib/document-list/components/library-name-column/library-name-column.component.spec.ts index 55801bbe48..8b71fc28dd 100644 --- a/lib/content-services/src/lib/document-list/components/library-name-column/library-name-column.component.spec.ts +++ b/lib/content-services/src/lib/document-list/components/library-name-column/library-name-column.component.spec.ts @@ -27,7 +27,7 @@ describe('LibraryNameColumnComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentTestingModule], + imports: [ContentTestingModule, LibraryNameColumnComponent], schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA] }); node = { diff --git a/lib/content-services/src/lib/document-list/components/library-name-column/library-name-column.component.ts b/lib/content-services/src/lib/document-list/components/library-name-column/library-name-column.component.ts index 940bb27d5d..9f46d70c89 100644 --- a/lib/content-services/src/lib/document-list/components/library-name-column/library-name-column.component.ts +++ b/lib/content-services/src/lib/document-list/components/library-name-column/library-name-column.component.ts @@ -22,9 +22,13 @@ import { NodesApiService } from '../../../common/services/nodes-api.service'; import { BehaviorSubject, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-library-name-column', + standalone: true, + imports: [CommonModule, TranslateModule], template: ` { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentTestingModule], + imports: [ContentTestingModule, LibraryRoleColumnComponent], schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA] }); fixture = TestBed.createComponent(LibraryRoleColumnComponent); diff --git a/lib/content-services/src/lib/document-list/components/library-role-column/library-role-column.component.ts b/lib/content-services/src/lib/document-list/components/library-role-column/library-role-column.component.ts index fdb0a08efd..18913e3850 100644 --- a/lib/content-services/src/lib/document-list/components/library-role-column/library-role-column.component.ts +++ b/lib/content-services/src/lib/document-list/components/library-role-column/library-role-column.component.ts @@ -21,9 +21,13 @@ import { SiteEntry, Site } from '@alfresco/js-api'; import { ShareDataRow } from '../../data/share-data-row.model'; import { takeUntil } from 'rxjs/operators'; import { NodesApiService } from '../../../common/services/nodes-api.service'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-library-role-column', + standalone: true, + imports: [CommonModule, TranslateModule], template: ` {{ displayText$ | async | translate }} diff --git a/lib/content-services/src/lib/document-list/components/library-status-column/library-status-column.component.ts b/lib/content-services/src/lib/document-list/components/library-status-column/library-status-column.component.ts index 1038500561..e5ed8ffb15 100644 --- a/lib/content-services/src/lib/document-list/components/library-status-column/library-status-column.component.ts +++ b/lib/content-services/src/lib/document-list/components/library-status-column/library-status-column.component.ts @@ -21,9 +21,13 @@ import { BehaviorSubject, Subject } from 'rxjs'; import { Site, SiteEntry } from '@alfresco/js-api'; import { ShareDataRow } from '../../data/share-data-row.model'; import { takeUntil } from 'rxjs/operators'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-library-status-column', + standalone: true, + imports: [CommonModule, TranslateModule], template: ` {{ displayText$ | async | translate }} diff --git a/lib/content-services/src/lib/document-list/components/name-column/name-column.component.spec.ts b/lib/content-services/src/lib/document-list/components/name-column/name-column.component.spec.ts index 28f8f0fc96..33d5101f7c 100644 --- a/lib/content-services/src/lib/document-list/components/name-column/name-column.component.spec.ts +++ b/lib/content-services/src/lib/document-list/components/name-column/name-column.component.spec.ts @@ -27,7 +27,7 @@ describe('NameColumnComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentTestingModule] + imports: [ContentTestingModule, NameColumnComponent] }); fixture = TestBed.createComponent(NameColumnComponent); diff --git a/lib/content-services/src/lib/document-list/components/name-column/name-column.component.ts b/lib/content-services/src/lib/document-list/components/name-column/name-column.component.ts index 919a7b763d..636db2aeb9 100644 --- a/lib/content-services/src/lib/document-list/components/name-column/name-column.component.ts +++ b/lib/content-services/src/lib/document-list/components/name-column/name-column.component.ts @@ -21,9 +21,14 @@ import { BehaviorSubject, Subject } from 'rxjs'; import { NodesApiService } from '../../../common/services/nodes-api.service'; import { ShareDataRow } from '../../data/share-data-row.model'; import { takeUntil } from 'rxjs/operators'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; +import { NodeNameTooltipPipe } from '../../../pipes/node-name-tooltip.pipe'; @Component({ selector: 'adf-name-column', + standalone: true, + imports: [CommonModule, TranslateModule, NodeNameTooltipPipe], template: ` {{ displayText }} diff --git a/lib/content-services/src/lib/document-list/document-list.module.ts b/lib/content-services/src/lib/document-list/document-list.module.ts index bacf96ab1c..298f27f59a 100644 --- a/lib/content-services/src/lib/document-list/document-list.module.ts +++ b/lib/content-services/src/lib/document-list/document-list.module.ts @@ -15,18 +15,10 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; -import { CoreModule, EditJsonDialogModule } from '@alfresco/adf-core'; - -import { MaterialModule } from '../material.module'; -import { UploadModule } from '../upload/upload.module'; -import { SearchModule } from './../search/search.module'; - import { ContentActionListComponent } from './components/content-action/content-action-list.component'; import { ContentActionComponent } from './components/content-action/content-action.component'; import { DocumentListComponent } from './components/document-list.component'; - import { TrashcanNameColumnComponent } from './components/trashcan-name-column/trashcan-name-column.component'; import { LibraryStatusColumnComponent } from './components/library-status-column/library-status-column.component'; import { LibraryRoleColumnComponent } from './components/library-role-column/library-role-column.component'; @@ -34,42 +26,23 @@ import { LibraryNameColumnComponent } from './components/library-name-column/lib import { NameColumnComponent } from './components/name-column/name-column.component'; import { FilterHeaderComponent } from './components/filter-header/filter-header.component'; import { FileAutoDownloadComponent } from './components/file-auto-download/file-auto-download.component'; -import { ContentDirectiveModule } from '../directives/content-directive.module'; -import { NodeNameTooltipPipe } from '../pipes'; +export const DOCUMENT_LIST_DIRECTIVES = [ + ContentActionComponent, + FileAutoDownloadComponent, + FilterHeaderComponent, + LibraryNameColumnComponent, + LibraryRoleColumnComponent, + LibraryStatusColumnComponent, + NameColumnComponent, + TrashcanNameColumnComponent, + ContentActionListComponent, + DocumentListComponent +] as const; + +/** @deprecated use `...DOCUMENT_LIST_DIRECTIVES` or import standalone components */ @NgModule({ - imports: [ - CoreModule, - CommonModule, - MaterialModule, - UploadModule, - EditJsonDialogModule, - SearchModule, - ContentDirectiveModule, - NodeNameTooltipPipe - ], - declarations: [ - DocumentListComponent, - TrashcanNameColumnComponent, - LibraryStatusColumnComponent, - LibraryRoleColumnComponent, - LibraryNameColumnComponent, - NameColumnComponent, - ContentActionComponent, - ContentActionListComponent, - FilterHeaderComponent, - FileAutoDownloadComponent - ], - exports: [ - DocumentListComponent, - TrashcanNameColumnComponent, - LibraryStatusColumnComponent, - LibraryRoleColumnComponent, - LibraryNameColumnComponent, - NameColumnComponent, - ContentActionComponent, - ContentActionListComponent, - FilterHeaderComponent - ] + imports: [...DOCUMENT_LIST_DIRECTIVES], + exports: [...DOCUMENT_LIST_DIRECTIVES] }) export class DocumentListModule {} diff --git a/lib/content-services/src/lib/new-version-uploader/models/new-version-uploader.model.ts b/lib/content-services/src/lib/new-version-uploader/models/new-version-uploader.model.ts index ab89500a6b..1de798ac20 100644 --- a/lib/content-services/src/lib/new-version-uploader/models/new-version-uploader.model.ts +++ b/lib/content-services/src/lib/new-version-uploader/models/new-version-uploader.model.ts @@ -24,6 +24,8 @@ export interface NewVersionUploaderDialogData { file?: File; currentVersion?: Version; showVersionsOnly?: boolean; + showComments?: boolean; + allowDownload?: boolean; } export type NewVersionUploaderData = VersionManagerUploadData | ViewVersion | RefreshData; diff --git a/lib/content-services/src/lib/new-version-uploader/new-version-uploader.dialog.html b/lib/content-services/src/lib/new-version-uploader/new-version-uploader.dialog.html index 87665c2002..b8d774c4e7 100644 --- a/lib/content-services/src/lib/new-version-uploader/new-version-uploader.dialog.html +++ b/lib/content-services/src/lib/new-version-uploader/new-version-uploader.dialog.html @@ -18,8 +18,8 @@
{ ); mockNewVersionUploaderDialogData = { node: mockNode, - file: mockFile + file: mockFile, + showComments: true, + allowDownload: true }; }); @@ -170,7 +172,9 @@ describe('NewVersionUploaderService', () => { const mockNewVersionUploaderDialogDataWithVersionsOnly = { node: mockNode, file: mockFile, - showVersionsOnly: true + showVersionsOnly: true, + showComments: true, + allowDownload: true }; service.openUploadNewVersionDialog(mockNewVersionUploaderDialogDataWithVersionsOnly).toPromise(); tick(); diff --git a/lib/content-services/src/lib/new-version-uploader/new-version-uploader.service.ts b/lib/content-services/src/lib/new-version-uploader/new-version-uploader.service.ts index aa5ebfedf0..79c3c69543 100644 --- a/lib/content-services/src/lib/new-version-uploader/new-version-uploader.service.ts +++ b/lib/content-services/src/lib/new-version-uploader/new-version-uploader.service.ts @@ -18,9 +18,8 @@ import { Injectable } from '@angular/core'; import { MatDialog, MatDialogConfig } from '@angular/material/dialog'; import { AlfrescoApiService } from '@alfresco/adf-core'; - import { NewVersionUploaderDialogComponent } from './new-version-uploader.dialog'; -import { VersionPaging, VersionsApi } from '@alfresco/js-api'; +import { VersionsApi } from '@alfresco/js-api'; import { NewVersionUploaderData, NewVersionUploaderDialogData } from './models'; import { Observable } from 'rxjs'; import { OverlayContainer } from '@angular/cdk/overlay'; @@ -53,18 +52,19 @@ export class NewVersionUploaderService { config?: MatDialogConfig, selectorAutoFocusedOnClose?: string ): Observable { - const { file, node, showVersionsOnly } = data; - const showComments = true; - const allowDownload = true; + const { file, node, showVersionsOnly, showComments, allowDownload } = data; return new Observable((observer) => { - this.versionsApi.listVersionHistory(node.id).then((versionPaging: VersionPaging) => { - const dialogRef = this.dialog.open(NewVersionUploaderDialogComponent, { - data: { file, node, currentVersion: versionPaging.list.entries[0].entry, showComments, allowDownload, showVersionsOnly }, - panelClass: this.composePanelClass(showVersionsOnly), - width: '630px', - ...(config && Object.keys(config).length > 0 && config) - }); + this.versionsApi.listVersionHistory(node.id).then((versionPaging) => { + const dialogRef = this.dialog.open( + NewVersionUploaderDialogComponent, + { + data: { file, node, currentVersion: versionPaging.list.entries[0].entry, showComments, allowDownload, showVersionsOnly }, + panelClass: this.composePanelClass(showVersionsOnly), + width: '630px', + ...(config && Object.keys(config).length > 0 && config) + } + ); dialogRef.componentInstance.dialogAction.asObservable().subscribe((newVersionUploaderData) => { observer.next(newVersionUploaderData); }); diff --git a/lib/content-services/src/lib/node-comments/node-comments.component.ts b/lib/content-services/src/lib/node-comments/node-comments.component.ts index 4b3c4f875c..9fdad0be05 100644 --- a/lib/content-services/src/lib/node-comments/node-comments.component.ts +++ b/lib/content-services/src/lib/node-comments/node-comments.component.ts @@ -16,20 +16,23 @@ */ import { Component, Input, ViewEncapsulation } from '@angular/core'; -import { ADF_COMMENTS_SERVICE } from '@alfresco/adf-core'; +import { ADF_COMMENTS_SERVICE, CommentsComponent } from '@alfresco/adf-core'; import { NodeCommentsService } from './services/node-comments.service'; @Component({ selector: 'adf-node-comments', + standalone: true, + imports: [CommentsComponent], templateUrl: './node-comments.component.html', encapsulation: ViewEncapsulation.None, - providers: [{ - provide: ADF_COMMENTS_SERVICE, - useClass: NodeCommentsService - }] + providers: [ + { + provide: ADF_COMMENTS_SERVICE, + useClass: NodeCommentsService + } + ] }) export class NodeCommentsComponent { - /** nodeId of the document that has comments */ @Input() nodeId: string; diff --git a/lib/content-services/src/lib/node-comments/node-comments.module.ts b/lib/content-services/src/lib/node-comments/node-comments.module.ts index ca4d5d1e9d..e3ce6ff5fe 100644 --- a/lib/content-services/src/lib/node-comments/node-comments.module.ts +++ b/lib/content-services/src/lib/node-comments/node-comments.module.ts @@ -16,13 +16,11 @@ */ import { NgModule } from '@angular/core'; -import { CommonModule } from '@angular/common'; import { NodeCommentsComponent } from './node-comments.component'; -import { CoreModule } from '@alfresco/adf-core'; +/** @deprecated import NodeCommentsComponent standalone component directly */ @NgModule({ - imports: [CommonModule, CoreModule], - declarations: [NodeCommentsComponent], + imports: [NodeCommentsComponent], exports: [NodeCommentsComponent] }) export class NodeCommentsModule {} diff --git a/lib/content-services/src/lib/node-comments/public-api.ts b/lib/content-services/src/lib/node-comments/public-api.ts index 95b35cfc28..93ef6f089c 100644 --- a/lib/content-services/src/lib/node-comments/public-api.ts +++ b/lib/content-services/src/lib/node-comments/public-api.ts @@ -16,7 +16,5 @@ */ export * from './node-comments.component'; - export * from './services/node-comments.service'; - export * from './node-comments.module'; diff --git a/lib/content-services/src/lib/permission-manager/components/add-permission/add-permission-panel.component.ts b/lib/content-services/src/lib/permission-manager/components/add-permission/add-permission-panel.component.ts index d692e235a2..0068300d11 100644 --- a/lib/content-services/src/lib/permission-manager/components/add-permission/add-permission-panel.component.ts +++ b/lib/content-services/src/lib/permission-manager/components/add-permission/add-permission-panel.component.ts @@ -29,7 +29,6 @@ import { MatFormFieldModule } from '@angular/material/form-field'; import { MatInputModule } from '@angular/material/input'; import { TranslateModule } from '@ngx-translate/core'; import { MatIconModule } from '@angular/material/icon'; -import { SearchModule } from '../../../search'; import { UserIconColumnComponent } from '../user-icon-column/user-icon-column.component'; @Component({ @@ -42,9 +41,9 @@ import { UserIconColumnComponent } from '../user-icon-column/user-icon-column.co TranslateModule, ReactiveFormsModule, MatIconModule, - SearchModule, MatListModule, - UserIconColumnComponent + UserIconColumnComponent, + SearchComponent ], templateUrl: './add-permission-panel.component.html', styleUrls: ['./add-permission-panel.component.scss'], diff --git a/lib/content-services/src/lib/search/components/empty-search-result.component.ts b/lib/content-services/src/lib/search/components/empty-search-result.component.ts index 1e0316c1d3..0d861f9637 100644 --- a/lib/content-services/src/lib/search/components/empty-search-result.component.ts +++ b/lib/content-services/src/lib/search/components/empty-search-result.component.ts @@ -19,6 +19,7 @@ import { Component, ViewEncapsulation } from '@angular/core'; @Component({ selector: 'adf-empty-search-result', + standalone: true, templateUrl: './empty-search-result.component.html', encapsulation: ViewEncapsulation.None }) diff --git a/lib/content-services/src/lib/search/components/reset-search.directive.ts b/lib/content-services/src/lib/search/components/reset-search.directive.ts index e17cf36e89..a428b7f997 100644 --- a/lib/content-services/src/lib/search/components/reset-search.directive.ts +++ b/lib/content-services/src/lib/search/components/reset-search.directive.ts @@ -19,7 +19,8 @@ import { Directive, HostListener } from '@angular/core'; import { SearchFacetFiltersService } from '../services/search-facet-filters.service'; @Directive({ - selector: '[adf-reset-search]' + selector: '[adf-reset-search]', + standalone: true }) export class ResetSearchDirective { @HostListener('click') @@ -27,5 +28,5 @@ export class ResetSearchDirective { this.filterService.reset(); } - constructor(private filterService: SearchFacetFiltersService) { } + constructor(private filterService: SearchFacetFiltersService) {} } diff --git a/lib/content-services/src/lib/search/components/search-control.component.ts b/lib/content-services/src/lib/search/components/search-control.component.ts index 658c98f381..5ef36ec7ba 100644 --- a/lib/content-services/src/lib/search/components/search-control.component.ts +++ b/lib/content-services/src/lib/search/components/search-control.component.ts @@ -15,7 +15,7 @@ * limitations under the License. */ -import { AuthenticationService, ThumbnailService, SearchTextInputComponent } from '@alfresco/adf-core'; +import { AuthenticationService, ThumbnailService, SearchTextInputComponent, HighlightPipe } from '@alfresco/adf-core'; import { Component, EventEmitter, @@ -32,11 +32,16 @@ import { import { NodeEntry } from '@alfresco/js-api'; import { Subject } from 'rxjs'; import { SearchComponent } from './search.component'; -import { MatListItem } from '@angular/material/list'; +import { MatListItem, MatListModule } from '@angular/material/list'; import { EmptySearchResultComponent } from './empty-search-result.component'; +import { CommonModule } from '@angular/common'; +import { MatIconModule } from '@angular/material/icon'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-search-control', + standalone: true, + imports: [CommonModule, SearchTextInputComponent, SearchComponent, MatListModule, MatIconModule, HighlightPipe, TranslateModule], templateUrl: './search-control.component.html', styleUrls: ['./search-control.component.scss'], encapsulation: ViewEncapsulation.None, diff --git a/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.spec.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.spec.ts index a5bdfddcd9..03810ec457 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.spec.ts +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.spec.ts @@ -61,8 +61,7 @@ describe('SearchDateRangeTabbedComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [SearchDateRangeTabbedComponent, SearchFilterTabbedComponent, SearchDateRangeComponent], - imports: [ContentTestingModule], + imports: [ContentTestingModule, SearchFilterTabbedComponent, SearchDateRangeComponent, SearchDateRangeTabbedComponent], providers: [ { provide: SearchFilterTabbedComponent, useClass: MockSearchFilterTabbedComponent }, { provide: SearchDateRangeComponent, useClass: MockSearchDateRangeComponent } diff --git a/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts index 6b5fe974a3..8f27817149 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts @@ -25,14 +25,20 @@ import { SearchQueryBuilderService } from '../../services/search-query-builder.s import { InLastDateType } from './search-date-range/in-last-date-type'; import { TranslationService } from '@alfresco/adf-core'; import { endOfDay, endOfToday, format, formatISO, startOfDay, startOfMonth, startOfWeek, subDays, subMonths, subWeeks } from 'date-fns'; +import { CommonModule } from '@angular/common'; +import { SearchFilterTabbedComponent } from '../search-filter-tabbed/search-filter-tabbed.component'; +import { SearchDateRangeComponent } from './search-date-range/search-date-range.component'; +import { SearchFilterTabDirective } from '../search-filter-tabbed/search-filter-tab.directive'; const DEFAULT_DATE_DISPLAY_FORMAT = 'dd-MMM-yy'; @Component({ - selector: 'adf-search-date-range-tabbed', - templateUrl: './search-date-range-tabbed.component.html', - styleUrls: [ './search-date-range-tabbed.component.scss'], - encapsulation: ViewEncapsulation.None + selector: 'adf-search-date-range-tabbed', + standalone: true, + imports: [CommonModule, SearchFilterTabbedComponent, SearchDateRangeComponent, SearchFilterTabDirective], + templateUrl: './search-date-range-tabbed.component.html', + styleUrls: ['./search-date-range-tabbed.component.scss'], + encapsulation: ViewEncapsulation.None }) export class SearchDateRangeTabbedComponent implements SearchWidget, OnInit { displayValue$ = new Subject(); diff --git a/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.spec.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.spec.ts index f50781f5de..8a85e34d97 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.spec.ts +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.spec.ts @@ -36,8 +36,7 @@ describe('SearchDateRangeComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [SearchDateRangeComponent], - imports: [ContentTestingModule] + imports: [ContentTestingModule, SearchDateRangeComponent] }); fixture = TestBed.createComponent(SearchDateRangeComponent); diff --git a/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts index 2a2ce4e23b..b4feca97db 100644 --- a/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts +++ b/lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts @@ -23,22 +23,40 @@ import { DateFnsAdapter, MAT_DATE_FNS_FORMATS } from '@angular/material-date-fns import { InLastDateType } from './in-last-date-type'; import { DateRangeType } from './date-range-type'; import { SearchDateRange } from './search-date-range'; -import { FormBuilder, UntypedFormControl, Validators } from '@angular/forms'; +import { FormBuilder, ReactiveFormsModule, UntypedFormControl, Validators } from '@angular/forms'; import { takeUntil } from 'rxjs/operators'; import { UserPreferencesService, UserPreferenceValues, DateFnsUtils } from '@alfresco/adf-core'; +import { CommonModule } from '@angular/common'; +import { MatRadioModule } from '@angular/material/radio'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { MatSelectModule } from '@angular/material/select'; +import { MatDatepickerModule } from '@angular/material/datepicker'; const DEFAULT_DATE_DISPLAY_FORMAT = 'dd-MMM-yy'; @Component({ selector: 'adf-search-date-range', + standalone: true, + imports: [ + CommonModule, + MatRadioModule, + ReactiveFormsModule, + TranslateModule, + MatFormFieldModule, + MatInputModule, + MatSelectModule, + MatDatepickerModule + ], templateUrl: './search-date-range.component.html', styleUrls: ['./search-date-range.component.scss'], providers: [ - { provide: DateAdapter, useClass: DateFnsAdapter, deps: [ MAT_DATE_LOCALE ] }, + { provide: DateAdapter, useClass: DateFnsAdapter, deps: [MAT_DATE_LOCALE] }, { provide: MAT_DATE_FORMATS, useValue: MAT_DATE_FNS_FORMATS } ], encapsulation: ViewEncapsulation.None, - host: {class: 'adf-search-date-range'} + host: { class: 'adf-search-date-range' } }) export class SearchDateRangeComponent implements OnInit, OnDestroy { @Input() @@ -74,12 +92,14 @@ export class SearchDateRangeComponent implements OnInit, OnDestroy { readonly DateRangeType = DateRangeType; readonly InLastDateType = InLastDateType; - constructor(private formBuilder: FormBuilder, - private userPreferencesService: UserPreferencesService, - private dateAdapter: DateAdapter, - @Inject(MAT_DATE_FORMATS) private dateFormatConfig: MatDateFormats) {} + constructor( + private formBuilder: FormBuilder, + private userPreferencesService: UserPreferencesService, + private dateAdapter: DateAdapter, + @Inject(MAT_DATE_FORMATS) private dateFormatConfig: MatDateFormats + ) {} - readonly endDateValidator = (formControl: UntypedFormControl): ({ [key: string]: boolean } | null) => { + readonly endDateValidator = (formControl: UntypedFormControl): { [key: string]: boolean } | null => { if (isBefore(formControl.value, this.betweenStartDateFormControl.value) || isAfter(formControl.value, this.convertedMaxDate)) { return { invalidDate: true @@ -90,16 +110,15 @@ export class SearchDateRangeComponent implements OnInit, OnDestroy { ngOnInit(): void { this.dateFormatConfig.display.dateInput = this.dateFormat; - this.convertedMaxDate = endOfDay(this.maxDate && this.maxDate !== 'today' ? - parse(this.maxDate, this.dateFormat, new Date()) : new Date()); + this.convertedMaxDate = endOfDay(this.maxDate && this.maxDate !== 'today' ? parse(this.maxDate, this.dateFormat, new Date()) : new Date()); this.userPreferencesService .select(UserPreferenceValues.Locale) .pipe(takeUntil(this.destroy$)) - .subscribe(locale => this.dateAdapter.setLocale(DateFnsUtils.getLocaleFromString(locale))); - this.form.controls.dateRangeType.valueChanges.pipe(takeUntil(this.destroy$)) + .subscribe((locale) => this.dateAdapter.setLocale(DateFnsUtils.getLocaleFromString(locale))); + this.form.controls.dateRangeType.valueChanges + .pipe(takeUntil(this.destroy$)) .subscribe((dateRangeType) => this.updateValidators(dateRangeType)); - this.form.valueChanges.pipe(takeUntil(this.destroy$)) - .subscribe(() => this.onChange()); + this.form.valueChanges.pipe(takeUntil(this.destroy$)).subscribe(() => this.onChange()); } ngOnDestroy() { @@ -108,7 +127,7 @@ export class SearchDateRangeComponent implements OnInit, OnDestroy { } private updateValidators(dateRangeType: DateRangeType) { - switch(dateRangeType) { + switch (dateRangeType) { case DateRangeType.BETWEEN: this.betweenStartDateFormControl.setValidators(Validators.required); this.betweenEndDateFormControl.setValidators([Validators.required, this.endDateValidator]); @@ -140,7 +159,7 @@ export class SearchDateRangeComponent implements OnInit, OnDestroy { dateChanged(event: Event, formControl: UntypedFormControl) { if (event?.target['value']?.trim()) { const date = parse(event.target['value'], this.dateFormat, new Date()); - if(!isValid(date)) { + if (!isValid(date)) { formControl.setErrors({ ...formControl.errors, required: false, @@ -165,7 +184,7 @@ export class SearchDateRangeComponent implements OnInit, OnDestroy { } preventIncorrectNumberCharacters(event: KeyboardEvent): boolean { - switch(event.key) { + switch (event.key) { case '.': case '-': case 'e': diff --git a/lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.spec.ts b/lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.spec.ts index 012c7bd93b..217164a15b 100644 --- a/lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.spec.ts +++ b/lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.spec.ts @@ -32,7 +32,7 @@ describe('SearchDatetimeRangeComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ContentTestingModule] + imports: [ContentTestingModule, SearchDatetimeRangeComponent] }); fixture = TestBed.createComponent(SearchDatetimeRangeComponent); component = fixture.componentInstance; diff --git a/lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.ts b/lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.ts index ba7259f192..66cb3f1098 100644 --- a/lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.ts +++ b/lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.ts @@ -16,16 +16,20 @@ */ import { Component, OnInit, ViewEncapsulation } from '@angular/core'; -import { FormControl, FormGroup, Validators } from '@angular/forms'; +import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; import { ADF_DATE_FORMATS, ADF_DATETIME_FORMATS, AdfDateFnsAdapter, AdfDateTimeFnsAdapter, DateFnsUtils } from '@alfresco/adf-core'; import { SearchWidget } from '../../models/search-widget.interface'; import { SearchWidgetSettings } from '../../models/search-widget-settings.interface'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; import { LiveErrorStateMatcher } from '../../forms/live-error-state-matcher'; import { Subject } from 'rxjs'; -import { DatetimeAdapter, MAT_DATETIME_FORMATS, MatDatetimepickerInputEvent } from '@mat-datetimepicker/core'; +import { DatetimeAdapter, MAT_DATETIME_FORMATS, MatDatetimepickerInputEvent, MatDatetimepickerModule } from '@mat-datetimepicker/core'; import { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core'; import { isValid, isBefore, startOfMinute, endOfMinute } from 'date-fns'; +import { CommonModule } from '@angular/common'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { TranslateModule } from '@ngx-translate/core'; export interface DatetimeRangeValue { from: string; @@ -41,6 +45,8 @@ export const DEFAULT_DATETIME_FORMAT: string = 'dd/MM/yyyy HH:mm'; @Component({ selector: 'adf-search-datetime-range', + standalone: true, + imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, TranslateModule, MatDatetimepickerModule], templateUrl: './search-datetime-range.component.html', styleUrls: ['./search-datetime-range.component.scss'], providers: [ @@ -70,8 +76,7 @@ export class SearchDatetimeRangeComponent implements SearchWidget, OnInit { enableChangeUpdate: boolean; displayValue$: Subject = new Subject(); - constructor(private dateAdapter: DateAdapter, - private dateTimeAdapter: DatetimeAdapter) {} + constructor(private dateAdapter: DateAdapter, private dateTimeAdapter: DatetimeAdapter) {} getFromValidationMessage(): string { return this.from.hasError('invalidOnChange') || this.hasParseError(this.from) @@ -235,7 +240,6 @@ export class SearchDatetimeRangeComponent implements SearchWidget, OnInit { } setFromMaxDatetime() { - this.fromMaxDatetime = - !this.to.value || (this.maxDatetime && isBefore(this.maxDatetime, this.to.value)) ? this.maxDatetime : this.to.value; + this.fromMaxDatetime = !this.to.value || (this.maxDatetime && isBefore(this.maxDatetime, this.to.value)) ? this.maxDatetime : this.to.value; } } diff --git a/lib/content-services/src/lib/search/components/search-facet-field/search-facet-field.component.ts b/lib/content-services/src/lib/search/components/search-facet-field/search-facet-field.component.ts index 94c9b278e3..6c95ba696f 100644 --- a/lib/content-services/src/lib/search/components/search-facet-field/search-facet-field.component.ts +++ b/lib/content-services/src/lib/search/components/search-facet-field/search-facet-field.component.ts @@ -17,16 +17,25 @@ import { Component, inject, Input, ViewEncapsulation } from '@angular/core'; import { FacetField } from '../../models/facet-field.interface'; -import { MatCheckboxChange } from '@angular/material/checkbox'; +import { MatCheckboxChange, MatCheckboxModule } from '@angular/material/checkbox'; import { FacetFieldBucket } from '../../models/facet-field-bucket.interface'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; import { SearchFacetFiltersService } from '../../services/search-facet-filters.service'; import { FacetWidget } from '../../models/facet-widget.interface'; import { TranslationService } from '@alfresco/adf-core'; import { Subject } from 'rxjs'; +import { CommonModule } from '@angular/common'; +import { MatButtonModule } from '@angular/material/button'; +import { MatIconModule } from '@angular/material/icon'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { TranslateModule } from '@ngx-translate/core'; +import { FormsModule } from '@angular/forms'; @Component({ selector: 'adf-search-facet-field', + standalone: true, + imports: [CommonModule, MatButtonModule, MatIconModule, MatFormFieldModule, MatInputModule, TranslateModule, FormsModule, MatCheckboxModule], templateUrl: './search-facet-field.component.html', styleUrls: ['./search-facet-field.component.scss'], encapsulation: ViewEncapsulation.None diff --git a/lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.spec.ts b/lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.spec.ts index da6c71d9b1..55f96bc514 100644 --- a/lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.spec.ts +++ b/lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.spec.ts @@ -30,8 +30,7 @@ describe('SearchFilterAutocompleteChipsComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [SearchFilterAutocompleteChipsComponent], - imports: [ContentTestingModule], + imports: [ContentTestingModule, SearchFilterAutocompleteChipsComponent], providers: [ { provide: TagService, diff --git a/lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts b/lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts index 03e81d4ef1..ae15fc75f0 100644 --- a/lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts +++ b/lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts @@ -24,9 +24,15 @@ import { SearchFilterList } from '../../models/search-filter-list.model'; import { TagService } from '../../../tag/services/tag.service'; import { CategoryService } from '../../../category/services/category.service'; import { AutocompleteField, AutocompleteOption } from '../../models/autocomplete-option.interface'; +import { CommonModule } from '@angular/common'; +import { SearchChipAutocompleteInputComponent } from '../search-chip-autocomplete-input'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatButtonModule } from '@angular/material/button'; @Component({ selector: 'adf-search-filter-autocomplete-chips', + standalone: true, + imports: [CommonModule, SearchChipAutocompleteInputComponent, TranslateModule, MatButtonModule], templateUrl: './search-filter-autocomplete-chips.component.html', encapsulation: ViewEncapsulation.None }) @@ -98,19 +104,17 @@ export class SearchFilterAutocompleteChipsComponent implements SearchWidget, OnI } optionComparator(option1: AutocompleteOption, option2: AutocompleteOption): boolean { - return option1.id - ? option1.id.toUpperCase() === option2.id.toUpperCase() - : option1.value.toUpperCase() === option2.value.toUpperCase(); + return option1.id ? option1.id.toUpperCase() === option2.id.toUpperCase() : option1.value.toUpperCase() === option2.value.toUpperCase(); } private updateQuery() { - this.displayValue$.next(this.selectedOptions.map(option => option.value).join(', ')); + this.displayValue$.next(this.selectedOptions.map((option) => option.value).join(', ')); if (this.context && this.settings && this.settings.field) { let queryFragments; if (this.settings.field === AutocompleteField.CATEGORIES) { - queryFragments = this.selectedOptions.map(val => `${this.settings.field}:"workspace://SpacesStore/${val.id}"`); + queryFragments = this.selectedOptions.map((val) => `${this.settings.field}:"workspace://SpacesStore/${val.id}"`); } else { - queryFragments = this.selectedOptions.map(val => val.query ?? `${this.settings.field}:"${val.value}"`); + queryFragments = this.selectedOptions.map((val) => val.query ?? `${this.settings.field}:"${val.value}"`); } this.context.queryFragments[this.id] = queryFragments.join(' OR '); this.context.update(); @@ -120,10 +124,12 @@ export class SearchFilterAutocompleteChipsComponent implements SearchWidget, OnI private setOptions() { switch (this.settings.field) { case AutocompleteField.TAG: - this.tagService.getAllTheTags().subscribe(tagPaging => { - this.autocompleteOptionsSubject$.next(tagPaging.list.entries.map(tag => ({ - value: tag.entry.tag - }))); + this.tagService.getAllTheTags().subscribe((tagPaging) => { + this.autocompleteOptionsSubject$.next( + tagPaging.list.entries.map((tag) => ({ + value: tag.entry.tag + })) + ); }); break; case AutocompleteField.CATEGORIES: @@ -136,11 +142,13 @@ export class SearchFilterAutocompleteChipsComponent implements SearchWidget, OnI private searchForExistingCategories(searchTerm: string) { this.categoryService.searchCategories(searchTerm, 0, 15).subscribe((existingCategoriesResult) => { - this.autocompleteOptionsSubject$.next(existingCategoriesResult.list.entries.map((rowEntry) => { - const path = rowEntry.entry.path.name.split('/').splice(3).join('/'); - const fullPath = path ? `${path}/${rowEntry.entry.name}` : rowEntry.entry.name; - return {id: rowEntry.entry.id, value: rowEntry.entry.name, fullPath}; - })); + this.autocompleteOptionsSubject$.next( + existingCategoriesResult.list.entries.map((rowEntry) => { + const path = rowEntry.entry.path.name.split('/').splice(3).join('/'); + const fullPath = path ? `${path}/${rowEntry.entry.name}` : rowEntry.entry.name; + return { id: rowEntry.entry.id, value: rowEntry.entry.name, fullPath }; + }) + ); }); } } diff --git a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html index 75f7e10f0e..5a7d40953e 100644 --- a/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html +++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component.html @@ -1,9 +1,9 @@ - - close - + close
diff --git a/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component.ts b/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component.ts index 493b9cd921..2266943db6 100644 --- a/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component.ts +++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component.ts @@ -16,12 +16,19 @@ */ import { Component, EventEmitter, Output, ViewEncapsulation } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { MatButtonModule } from '@angular/material/button'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatIconModule } from '@angular/material/icon'; +import { MatDividerModule } from '@angular/material/divider'; @Component({ - selector: 'adf-search-filter-menu-card', - templateUrl: './search-filter-menu-card.component.html', - styleUrls: ['./search-filter-menu-card.component.scss'], - encapsulation: ViewEncapsulation.None + selector: 'adf-search-filter-menu-card', + standalone: true, + imports: [CommonModule, MatButtonModule, TranslateModule, MatIconModule, MatDividerModule], + templateUrl: './search-filter-menu-card.component.html', + styleUrls: ['./search-filter-menu-card.component.scss'], + encapsulation: ViewEncapsulation.None }) export class SearchFilterMenuCardComponent { @Output() diff --git a/lib/content-services/src/lib/search/components/search-filter-chips/search-widget-chip/search-widget-chip.component.html b/lib/content-services/src/lib/search/components/search-filter-chips/search-widget-chip/search-widget-chip.component.html index 9a91c8f000..d255e3745c 100644 --- a/lib/content-services/src/lib/search/components/search-filter-chips/search-widget-chip/search-widget-chip.component.html +++ b/lib/content-services/src/lib/search/components/search-filter-chips/search-widget-chip/search-widget-chip.component.html @@ -1,8 +1,8 @@ ) { } + constructor(public readonly templateRef: TemplateRef) {} } diff --git a/lib/content-services/src/lib/search/components/search-filter-tabbed/search-filter-tabbed.component.ts b/lib/content-services/src/lib/search/components/search-filter-tabbed/search-filter-tabbed.component.ts index bf72706bef..cac2dedba6 100644 --- a/lib/content-services/src/lib/search/components/search-filter-tabbed/search-filter-tabbed.component.ts +++ b/lib/content-services/src/lib/search/components/search-filter-tabbed/search-filter-tabbed.component.ts @@ -17,12 +17,17 @@ import { Component, ContentChildren, QueryList, ViewEncapsulation } from '@angular/core'; import { SearchFilterTabDirective } from './search-filter-tab.directive'; +import { CommonModule } from '@angular/common'; +import { MatTabsModule } from '@angular/material/tabs'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ - selector: 'adf-search-filter-tabbed', - templateUrl: './search-filter-tabbed.component.html', - styleUrls: ['./search-filter-tabbed.component.scss'], - encapsulation: ViewEncapsulation.None + selector: 'adf-search-filter-tabbed', + standalone: true, + imports: [CommonModule, MatTabsModule, TranslateModule], + templateUrl: './search-filter-tabbed.component.html', + styleUrls: ['./search-filter-tabbed.component.scss'], + encapsulation: ViewEncapsulation.None }) export class SearchFilterTabbedComponent { @ContentChildren(SearchFilterTabDirective) diff --git a/lib/content-services/src/lib/search/components/search-filter/search-filter-card/search-filter-card.component.ts b/lib/content-services/src/lib/search/components/search-filter/search-filter-card/search-filter-card.component.ts index 98c12bd47a..36c6526a43 100644 --- a/lib/content-services/src/lib/search/components/search-filter/search-filter-card/search-filter-card.component.ts +++ b/lib/content-services/src/lib/search/components/search-filter/search-filter-card/search-filter-card.component.ts @@ -18,9 +18,14 @@ import { Component, Input, ViewChild, ViewEncapsulation } from '@angular/core'; import { SearchWidgetContainerComponent } from '../../search-widget-container/search-widget-container.component'; import { SearchCategory } from '../../../models/search-category.interface'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatButtonModule } from '@angular/material/button'; @Component({ selector: 'adf-search-filter-card', + standalone: true, + imports: [CommonModule, SearchWidgetContainerComponent, TranslateModule, MatButtonModule], templateUrl: './search-filter-card.component.html', encapsulation: ViewEncapsulation.None }) diff --git a/lib/content-services/src/lib/search/components/search-filter/search-filter.component.html b/lib/content-services/src/lib/search/components/search-filter/search-filter.component.html index 10900ba161..3d20a9e650 100644 --- a/lib/content-services/src/lib/search/components/search-filter/search-filter.component.html +++ b/lib/content-services/src/lib/search/components/search-filter/search-filter.component.html @@ -16,9 +16,7 @@ {{ category.name | translate }} - - + diff --git a/lib/content-services/src/lib/search/components/search-filter/search-filter.component.ts b/lib/content-services/src/lib/search/components/search-filter/search-filter.component.ts index 425381a417..8a744b426b 100644 --- a/lib/content-services/src/lib/search/components/search-filter/search-filter.component.ts +++ b/lib/content-services/src/lib/search/components/search-filter/search-filter.component.ts @@ -20,9 +20,28 @@ import { SearchQueryBuilderService } from '../../services/search-query-builder.s import { FacetFieldBucket } from '../../models/facet-field-bucket.interface'; import { FacetField } from '../../models/facet-field.interface'; import { SearchFacetFiltersService } from '../../services/search-facet-filters.service'; +import { CommonModule } from '@angular/common'; +import { MatExpansionModule } from '@angular/material/expansion'; +import { MatButtonModule } from '@angular/material/button'; +import { TranslateModule } from '@ngx-translate/core'; +import { SearchFilterCardComponent } from './search-filter-card/search-filter-card.component'; +import { ResetSearchDirective } from '../reset-search.directive'; +import { SearchFacetFieldComponent } from '../search-facet-field'; +import { SearchFacetTabbedContentComponent } from '../search-filter-chips'; @Component({ selector: 'adf-search-filter', + standalone: true, + imports: [ + CommonModule, + MatExpansionModule, + MatButtonModule, + TranslateModule, + SearchFilterCardComponent, + ResetSearchDirective, + SearchFacetFieldComponent, + SearchFacetTabbedContentComponent + ], templateUrl: './search-filter.component.html', styleUrls: ['./search-filter.component.scss'], encapsulation: ViewEncapsulation.None, diff --git a/lib/content-services/src/lib/search/components/search-form/search-form.component.ts b/lib/content-services/src/lib/search/components/search-form/search-form.component.ts index ffc16136eb..1b865c788c 100644 --- a/lib/content-services/src/lib/search/components/search-form/search-form.component.ts +++ b/lib/content-services/src/lib/search/components/search-form/search-form.component.ts @@ -18,9 +18,16 @@ import { Component, EventEmitter, inject, Output, ViewEncapsulation } from '@angular/core'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; import { SearchForm } from '../../models/search-form.interface'; +import { CommonModule } from '@angular/common'; +import { MatButtonModule } from '@angular/material/button'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatMenuModule } from '@angular/material/menu'; +import { MatIconModule } from '@angular/material/icon'; @Component({ selector: 'adf-search-form', + standalone: true, + imports: [CommonModule, MatButtonModule, TranslateModule, MatMenuModule, MatIconModule], templateUrl: './search-form.component.html', styleUrls: ['./search-form.component.scss'], encapsulation: ViewEncapsulation.None diff --git a/lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.spec.ts b/lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.spec.ts index 3fedd0c9b8..6c79cc6698 100644 --- a/lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.spec.ts +++ b/lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.spec.ts @@ -26,8 +26,7 @@ describe('SearchLogicalFilterComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [SearchLogicalFilterComponent], - imports: [ContentTestingModule] + imports: [ContentTestingModule, SearchLogicalFilterComponent] }); fixture = TestBed.createComponent(SearchLogicalFilterComponent); diff --git a/lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.ts b/lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.ts index 581e535354..f935049434 100644 --- a/lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.ts +++ b/lib/content-services/src/lib/search/components/search-logical-filter/search-logical-filter.component.ts @@ -21,6 +21,10 @@ import { SearchWidgetSettings } from '../../models/search-widget-settings.interf import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; import { Subject } from 'rxjs'; import { TranslationService } from '@alfresco/adf-core'; +import { CommonModule } from '@angular/common'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { TranslateModule } from '@ngx-translate/core'; +import { FormsModule } from '@angular/forms'; export enum LogicalSearchFields { MATCH_ALL = 'matchAll', @@ -35,6 +39,8 @@ export interface LogicalSearchCondition extends LogicalSearchConditionEnumValued @Component({ selector: 'adf-search-logical-filter', + standalone: true, + imports: [CommonModule, MatFormFieldModule, TranslateModule, FormsModule], templateUrl: './search-logical-filter.component.html', styleUrls: ['./search-logical-filter.component.scss'], encapsulation: ViewEncapsulation.None diff --git a/lib/content-services/src/lib/search/components/search-number-range/search-number-range.component.ts b/lib/content-services/src/lib/search/components/search-number-range/search-number-range.component.ts index b086120c5a..3299794a72 100644 --- a/lib/content-services/src/lib/search/components/search-number-range/search-number-range.component.ts +++ b/lib/content-services/src/lib/search/components/search-number-range/search-number-range.component.ts @@ -16,22 +16,28 @@ */ import { Component, OnInit, ViewEncapsulation } from '@angular/core'; -import { UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms'; +import { ReactiveFormsModule, UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms'; import { SearchWidget } from '../../models/search-widget.interface'; import { SearchWidgetSettings } from '../../models/search-widget-settings.interface'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; import { LiveErrorStateMatcher } from '../../forms/live-error-state-matcher'; import { Subject } from 'rxjs'; +import { CommonModule } from '@angular/common'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatButtonModule } from '@angular/material/button'; @Component({ selector: 'adf-search-number-range', + standalone: true, + imports: [CommonModule, ReactiveFormsModule, MatFormFieldModule, MatInputModule, TranslateModule, MatButtonModule], templateUrl: './search-number-range.component.html', styleUrls: ['./search-number-range.component.scss'], encapsulation: ViewEncapsulation.None, host: { class: 'adf-search-number-range' } }) export class SearchNumberRangeComponent implements SearchWidget, OnInit { - from: UntypedFormControl; to: UntypedFormControl; @@ -53,17 +59,12 @@ export class SearchNumberRangeComponent implements SearchWidget, OnInit { displayValue$: Subject = new Subject(); ngOnInit(): void { - if (this.settings) { this.field = this.settings.field; this.format = this.settings.format || '[{FROM} TO {TO}]'; } - this.validators = Validators.compose([ - Validators.required, - Validators.pattern(/^-?(0|[1-9]\d*)?$/), - Validators.min(0) - ]); + this.validators = Validators.compose([Validators.required, Validators.pattern(/^-?(0|[1-9]\d*)?$/), Validators.min(0)]); if (this.startValue) { this.from = new UntypedFormControl(this.startValue['from'], this.validators); @@ -73,17 +74,20 @@ export class SearchNumberRangeComponent implements SearchWidget, OnInit { this.to = new UntypedFormControl('', this.validators); } - this.form = new UntypedFormGroup({ - from: this.from, - to: this.to - }, this.formValidator); + this.form = new UntypedFormGroup( + { + from: this.from, + to: this.to + }, + this.formValidator + ); this.enableChangeUpdate = this.settings?.allowUpdateOnChange ?? true; this.updateDisplayValue(); } formValidator(formGroup: UntypedFormGroup) { - return parseInt(formGroup.get('from').value, 10) < parseInt(formGroup.get('to').value, 10) ? null : {mismatch: true}; + return parseInt(formGroup.get('from').value, 10) < parseInt(formGroup.get('to').value, 10) ? null : { mismatch: true }; } apply(model: { from: string; to: string }, isValid: boolean) { diff --git a/lib/content-services/src/lib/search/components/search-panel/search-panel.component.ts b/lib/content-services/src/lib/search/components/search-panel/search-panel.component.ts index f43f2950cf..066c3cb5d4 100644 --- a/lib/content-services/src/lib/search/components/search-panel/search-panel.component.ts +++ b/lib/content-services/src/lib/search/components/search-panel/search-panel.component.ts @@ -18,9 +18,13 @@ import { Component, OnInit, ViewEncapsulation } from '@angular/core'; import { ContentNodeSelectorPanelService } from '../../../content-node-selector/content-node-selector-panel/content-node-selector-panel.service'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; +import { CommonModule } from '@angular/common'; +import { SearchFilterComponent } from '../search-filter'; @Component({ selector: 'adf-search-panel', + standalone: true, + imports: [CommonModule, SearchFilterComponent], templateUrl: './search-panel.component.html', styleUrls: ['./search-panel.component.scss'], encapsulation: ViewEncapsulation.None, diff --git a/lib/content-services/src/lib/search/components/search-properties/search-properties.component.spec.ts b/lib/content-services/src/lib/search/components/search-properties/search-properties.component.spec.ts index 923a1d46fd..c128f178da 100644 --- a/lib/content-services/src/lib/search/components/search-properties/search-properties.component.spec.ts +++ b/lib/content-services/src/lib/search/components/search-properties/search-properties.component.spec.ts @@ -60,8 +60,7 @@ describe('SearchPropertiesComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [SearchPropertiesComponent], - imports: [ContentTestingModule] + imports: [ContentTestingModule, SearchPropertiesComponent] }).compileComponents(); fixture = TestBed.createComponent(SearchPropertiesComponent); diff --git a/lib/content-services/src/lib/search/components/search-properties/search-properties.component.ts b/lib/content-services/src/lib/search/components/search-properties/search-properties.component.ts index 389ffad44f..2ea947d3d7 100644 --- a/lib/content-services/src/lib/search/components/search-properties/search-properties.component.ts +++ b/lib/content-services/src/lib/search/components/search-properties/search-properties.component.ts @@ -16,7 +16,7 @@ */ import { AfterViewChecked, Component, ElementRef, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; -import { FormBuilder } from '@angular/forms'; +import { FormBuilder, ReactiveFormsModule } from '@angular/forms'; import { FileSizeCondition } from './file-size-condition'; import { FileSizeOperator } from './file-size-operator.enum'; import { FileSizeUnit } from './file-size-unit.enum'; @@ -24,12 +24,18 @@ import { Subject } from 'rxjs'; import { SearchWidgetSettings } from '../../models/search-widget-settings.interface'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; import { SearchProperties } from './search-properties'; -import { TranslateService } from '@ngx-translate/core'; +import { TranslateModule, TranslateService } from '@ngx-translate/core'; import { SearchWidget } from '../../models/search-widget.interface'; import { AutocompleteOption } from '../../models/autocomplete-option.interface'; +import { CommonModule } from '@angular/common'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatSelectModule } from '@angular/material/select'; +import { SearchChipAutocompleteInputComponent } from '../search-chip-autocomplete-input'; @Component({ selector: 'adf-search-properties', + standalone: true, + imports: [CommonModule, ReactiveFormsModule, TranslateModule, MatFormFieldModule, MatSelectModule, SearchChipAutocompleteInputComponent], templateUrl: './search-properties.component.html', styleUrls: ['./search-properties.component.scss'], encapsulation: ViewEncapsulation.None @@ -47,7 +53,7 @@ export class SearchPropertiesComponent implements OnInit, AfterViewChecked, Sear fileSize: undefined, fileSizeUnit: FileSizeUnit.KB }); - private _fileSizeOperators = Object.keys(FileSizeOperator).map(key => FileSizeOperator[key]); + private _fileSizeOperators = Object.keys(FileSizeOperator).map((key) => FileSizeOperator[key]); private _fileSizeUnits = [FileSizeUnit.KB, FileSizeUnit.MB, FileSizeUnit.GB]; private canvas = document.createElement('canvas'); private _fileSizeOperatorsMaxWidth: number; @@ -56,7 +62,7 @@ export class SearchPropertiesComponent implements OnInit, AfterViewChecked, Sear private sizeField: string; private nameField: string; - @ViewChild('fileSizeOperatorSelect', {read: ElementRef}) + @ViewChild('fileSizeOperatorSelect', { read: ElementRef }) fileSizeOperatorSelectElement: ElementRef; get form(): SearchPropertiesComponent['_form'] { @@ -102,8 +108,12 @@ export class SearchPropertiesComponent implements OnInit, AfterViewChecked, Sear if (this.fileSizeOperatorSelectElement?.nativeElement.clientWidth && !this._fileSizeOperatorsMaxWidth) { setTimeout(() => { const extraFreeSpace = 20; - this._fileSizeOperatorsMaxWidth = Math.max(...this._fileSizeOperators.map((operator) => - this.getOperatorNameWidth(operator, this.getCanvasFont(this.fileSizeOperatorSelectElement.nativeElement)))) + + this._fileSizeOperatorsMaxWidth = + Math.max( + ...this._fileSizeOperators.map((operator) => + this.getOperatorNameWidth(operator, this.getCanvasFont(this.fileSizeOperatorSelectElement.nativeElement)) + ) + ) + this.fileSizeOperatorSelectElement.nativeElement.querySelector('.mat-mdc-select-arrow-wrapper').clientWidth + extraFreeSpace; }); @@ -144,7 +154,9 @@ export class SearchPropertiesComponent implements OnInit, AfterViewChecked, Sear const extensionWithDot = filterValue.startsWith('.'); return extensions.filter((option) => { const optionLowerCase = option.value.toLowerCase(); - return extensionWithDot && filterValueLowerCase ? optionLowerCase.startsWith(filterValueLowerCase) : optionLowerCase.includes(filterValue); + return extensionWithDot && filterValueLowerCase + ? optionLowerCase.startsWith(filterValueLowerCase) + : optionLowerCase.includes(filterValue); }); }; @@ -163,7 +175,9 @@ export class SearchPropertiesComponent implements OnInit, AfterViewChecked, Sear let query = ''; let displayedValue = ''; if (this.form.value.fileSize !== undefined && this.form.value.fileSize !== null) { - displayedValue = `${this.translateService.instant(this.form.value.fileSizeOperator)} ${this.form.value.fileSize} ${this.translateService.instant(this.form.value.fileSizeUnit.abbreviation)}`; + displayedValue = `${this.translateService.instant(this.form.value.fileSizeOperator)} ${ + this.form.value.fileSize + } ${this.translateService.instant(this.form.value.fileSizeUnit.abbreviation)}`; const size = this.form.value.fileSize * this.form.value.fileSizeUnit.bytes; switch (this.form.value.fileSizeOperator) { case FileSizeOperator.AT_MOST: @@ -208,11 +222,11 @@ export class SearchPropertiesComponent implements OnInit, AfterViewChecked, Sear } private parseToAutocompleteOptions(array: string[]): AutocompleteOption[] { - return array.map(value => ({value})); + return array.map((value) => ({ value })); } private parseFromAutocompleteOptions(array: AutocompleteOption[]): string[] { - return array.flatMap(option => option.value); + return array.flatMap((option) => option.value); } private getOperatorNameWidth(operator: string, font: string): number { diff --git a/lib/content-services/src/lib/search/components/search-radio/search-radio.component.ts b/lib/content-services/src/lib/search/components/search-radio/search-radio.component.ts index 15f6dcd0c9..8f93a20798 100644 --- a/lib/content-services/src/lib/search/components/search-radio/search-radio.component.ts +++ b/lib/content-services/src/lib/search/components/search-radio/search-radio.component.ts @@ -16,13 +16,18 @@ */ import { Component, Input, OnInit, ViewEncapsulation } from '@angular/core'; -import { MatRadioChange } from '@angular/material/radio'; +import { MatRadioChange, MatRadioModule } from '@angular/material/radio'; import { SearchWidget } from '../../models/search-widget.interface'; import { SearchWidgetSettings } from '../../models/search-widget-settings.interface'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; import { SearchFilterList } from '../../models/search-filter-list.model'; import { Subject } from 'rxjs'; +import { CommonModule } from '@angular/common'; +import { FormsModule } from '@angular/forms'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatButtonModule } from '@angular/material/button'; +import { MatIconModule } from '@angular/material/icon'; export interface SearchRadioOption { name: string; @@ -31,13 +36,14 @@ export interface SearchRadioOption { @Component({ selector: 'adf-search-radio', + standalone: true, + imports: [CommonModule, MatRadioModule, FormsModule, TranslateModule, MatButtonModule, MatIconModule], templateUrl: './search-radio.component.html', styleUrls: ['./search-radio.component.scss'], encapsulation: ViewEncapsulation.None, host: { class: 'adf-search-radio' } }) export class SearchRadioComponent implements SearchWidget, OnInit { - /** The value of the selected radio button. */ @Input() value: string; @@ -61,9 +67,7 @@ export class SearchRadioComponent implements SearchWidget, OnInit { this.pageSize = this.settings.pageSize || 5; if (this.settings.options && this.settings.options.length > 0) { - this.options = new SearchFilterList( - this.settings.options, this.pageSize - ); + this.options = new SearchFilterList(this.settings.options, this.pageSize); } } @@ -119,7 +123,7 @@ export class SearchRadioComponent implements SearchWidget, OnInit { } updateDisplayValue(): void { - const selectOptions = this.options.items.find(({ value}) => value === this.value); + const selectOptions = this.options.items.find(({ value }) => value === this.value); if (selectOptions) { this.displayValue$.next(selectOptions.name); } else { diff --git a/lib/content-services/src/lib/search/components/search-slider/search-slider.component.ts b/lib/content-services/src/lib/search/components/search-slider/search-slider.component.ts index 174b6850ca..f65bd2fcbb 100644 --- a/lib/content-services/src/lib/search/components/search-slider/search-slider.component.ts +++ b/lib/content-services/src/lib/search/components/search-slider/search-slider.component.ts @@ -20,9 +20,16 @@ import { SearchWidget } from '../../models/search-widget.interface'; import { SearchWidgetSettings } from '../../models/search-widget-settings.interface'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; import { Subject } from 'rxjs'; +import { CommonModule } from '@angular/common'; +import { MatSliderModule } from '@angular/material/slider'; +import { FormsModule } from '@angular/forms'; +import { MatButtonModule } from '@angular/material/button'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-search-slider', + standalone: true, + imports: [CommonModule, MatSliderModule, FormsModule, MatButtonModule, TranslateModule], templateUrl: './search-slider.component.html', styleUrls: ['./search-slider.component.scss'], encapsulation: ViewEncapsulation.None, @@ -105,7 +112,7 @@ export class SearchSliderComponent implements SearchWidget, OnInit { } private updateQuery(value: number | null) { - this.displayValue$.next( this.value ? `${this.value} ${this.settings.unit ?? ''}` : '' ); + this.displayValue$.next(this.value ? `${this.value} ${this.settings.unit ?? ''}` : ''); if (this.id && this.context && this.settings && this.settings.field) { if (value === null) { this.context.queryFragments[this.id] = ''; @@ -115,5 +122,4 @@ export class SearchSliderComponent implements SearchWidget, OnInit { this.context.update(); } } - } diff --git a/lib/content-services/src/lib/search/components/search-sorting-picker/search-sorting-picker.component.ts b/lib/content-services/src/lib/search/components/search-sorting-picker/search-sorting-picker.component.ts index e99ce18641..bc37ead28b 100644 --- a/lib/content-services/src/lib/search/components/search-sorting-picker/search-sorting-picker.component.ts +++ b/lib/content-services/src/lib/search/components/search-sorting-picker/search-sorting-picker.component.ts @@ -18,9 +18,13 @@ import { Component, OnInit, ViewEncapsulation } from '@angular/core'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; import { SearchSortingDefinition } from '../../models/search-sorting-definition.interface'; +import { CommonModule } from '@angular/common'; +import { SortingPickerComponent } from '@alfresco/adf-core'; @Component({ selector: 'adf-search-sorting-picker', + standalone: true, + imports: [CommonModule, SortingPickerComponent], templateUrl: './search-sorting-picker.component.html', styleUrls: ['./search-sorting-picker.component.scss'], encapsulation: ViewEncapsulation.None, diff --git a/lib/content-services/src/lib/search/components/search-text/search-text.component.ts b/lib/content-services/src/lib/search/components/search-text/search-text.component.ts index e612da05e1..02002ba017 100644 --- a/lib/content-services/src/lib/search/components/search-text/search-text.component.ts +++ b/lib/content-services/src/lib/search/components/search-text/search-text.component.ts @@ -20,16 +20,24 @@ import { SearchWidget } from '../../models/search-widget.interface'; import { SearchWidgetSettings } from '../../models/search-widget-settings.interface'; import { SearchQueryBuilderService } from '../../services/search-query-builder.service'; import { Subject } from 'rxjs'; +import { CommonModule } from '@angular/common'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatInputModule } from '@angular/material/input'; +import { MatButtonModule } from '@angular/material/button'; +import { FormsModule } from '@angular/forms'; +import { MatIconModule } from '@angular/material/icon'; @Component({ selector: 'adf-search-text', + standalone: true, + imports: [CommonModule, MatFormFieldModule, TranslateModule, MatInputModule, MatButtonModule, FormsModule, MatIconModule], templateUrl: './search-text.component.html', styleUrls: ['./search-text.component.scss'], encapsulation: ViewEncapsulation.None, host: { class: 'adf-search-text' } }) export class SearchTextComponent implements SearchWidget, OnInit { - /** The content of the text box. */ @Input() value = ''; @@ -46,8 +54,7 @@ export class SearchTextComponent implements SearchWidget, OnInit { if (this.context && this.settings && this.settings.pattern) { const pattern = new RegExp(this.settings.pattern, 'g'); const match = pattern.exec(this.context.queryFragments[this.id] || ''); - if (this.settings.allowUpdateOnChange !== undefined && - this.settings.allowUpdateOnChange !== null) { + if (this.settings.allowUpdateOnChange !== undefined && this.settings.allowUpdateOnChange !== null) { this.enableChangeUpdate = this.settings.allowUpdateOnChange; } @@ -115,5 +122,4 @@ export class SearchTextComponent implements SearchWidget, OnInit { private getSearchSuffix(): string { return this.settings.searchSuffix ? this.settings.searchSuffix : ''; } - } diff --git a/lib/content-services/src/lib/search/components/search-widget-container/search-widget-container.component.ts b/lib/content-services/src/lib/search/components/search-widget-container/search-widget-container.component.ts index 1f4a6baf8e..c74d1f99a0 100644 --- a/lib/content-services/src/lib/search/components/search-widget-container/search-widget-container.component.ts +++ b/lib/content-services/src/lib/search/components/search-widget-container/search-widget-container.component.ts @@ -15,24 +15,14 @@ * limitations under the License. */ -import { - Component, - Input, - ViewChild, - ViewContainerRef, - OnInit, - OnDestroy, - ComponentRef, - SimpleChanges, - OnChanges, - Injector -} from '@angular/core'; +import { Component, Input, ViewChild, ViewContainerRef, OnInit, OnDestroy, ComponentRef, SimpleChanges, OnChanges, Injector } from '@angular/core'; import { SearchFilterService } from '../../services/search-filter.service'; import { Observable } from 'rxjs'; -import {SearchHeaderQueryBuilderService, SearchQueryBuilderService} from '../../services'; +import { SearchHeaderQueryBuilderService, SearchQueryBuilderService } from '../../services'; @Component({ selector: 'adf-search-widget-container', + standalone: true, template: '
' }) export class SearchWidgetContainerComponent implements OnInit, OnDestroy, OnChanges { @@ -59,8 +49,7 @@ export class SearchWidgetContainerComponent implements OnInit, OnDestroy, OnChan componentRef: ComponentRef; - constructor(private searchFilterService: SearchFilterService, private injector: Injector) { - } + constructor(private searchFilterService: SearchFilterService, private injector: Injector) {} ngOnInit() { const componentType = this.searchFilterService.widgets[this.selector]; diff --git a/lib/content-services/src/lib/search/components/search.component.ts b/lib/content-services/src/lib/search/components/search.component.ts index dd068faef3..078dde0f73 100644 --- a/lib/content-services/src/lib/search/components/search.component.ts +++ b/lib/content-services/src/lib/search/components/search.component.ts @@ -35,9 +35,13 @@ import { NodePaging, ResultSetPaging } from '@alfresco/js-api'; import { Subject } from 'rxjs'; import { debounceTime, takeUntil } from 'rxjs/operators'; import { SearchComponentInterface } from '@alfresco/adf-core'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-search', + standalone: true, + imports: [CommonModule, TranslateModule], templateUrl: './search.component.html', styleUrls: ['./search.component.scss'], encapsulation: ViewEncapsulation.None, diff --git a/lib/content-services/src/lib/search/search.module.ts b/lib/content-services/src/lib/search/search.module.ts index f2bb9eedbd..1e6c973193 100644 --- a/lib/content-services/src/lib/search/search.module.ts +++ b/lib/content-services/src/lib/search/search.module.ts @@ -15,13 +15,7 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { MaterialModule } from '../material.module'; - -import { CoreModule, SearchTextModule } from '@alfresco/adf-core'; - import { SearchControlComponent } from './components/search-control.component'; import { SearchComponent } from './components/search.component'; import { EmptySearchResultComponent } from './components/empty-search-result.component'; @@ -55,82 +49,46 @@ import { SearchDateRangeTabbedComponent } from './components/search-date-range-t import { SearchFilterTabDirective } from './components/search-filter-tabbed/search-filter-tab.directive'; import { SearchFacetChipTabbedComponent } from './components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component'; import { SearchFacetTabbedContentComponent } from './components/search-filter-chips/search-facet-chip-tabbed/search-facet-tabbed-content.component'; -import { SearchInputComponent } from './components/search-input'; -export const CONTENT_SEARCH_DIRECTIVES = [SearchCheckListComponent, SearchChipAutocompleteInputComponent, SearchChipListComponent] as const; +export const CONTENT_SEARCH_DIRECTIVES = [ + SearchCheckListComponent, + SearchChipAutocompleteInputComponent, + SearchChipListComponent, + EmptySearchResultComponent, + SearchFilterComponent, + SearchFilterCardComponent, + SearchWidgetContainerComponent, + SearchTextComponent, + SearchFilterAutocompleteChipsComponent, + SearchDatetimeRangeComponent, + SearchFacetFieldComponent, + ResetSearchDirective, + SearchDateRangeComponent, + SearchFilterMenuCardComponent, + SearchFacetChipTabbedComponent, + SearchFacetTabbedContentComponent, + SearchFilterTabbedComponent, + SearchFilterTabDirective, + SearchDateRangeTabbedComponent, + SearchSortingPickerComponent, + SearchSliderComponent, + SearchNumberRangeComponent, + SearchPanelComponent, + SearchRadioComponent, + SearchFilterContainerComponent, + SearchFormComponent, + SearchFilterChipsComponent, + SearchWidgetChipComponent, + SearchFacetChipComponent, + SearchLogicalFilterComponent, + SearchPropertiesComponent, + SearchComponent, + SearchControlComponent +] as const; +/** @deprecated use `...CONTENT_SEARCH_DIRECTIVES` or import the specific component */ @NgModule({ - imports: [ - ...CONTENT_SEARCH_DIRECTIVES, - CommonModule, - FormsModule, - ReactiveFormsModule, - MaterialModule, - CoreModule, - SearchTextModule, - SearchInputComponent - ], - declarations: [ - SearchComponent, - SearchControlComponent, - EmptySearchResultComponent, - SearchFilterComponent, - SearchFilterCardComponent, - SearchWidgetContainerComponent, - SearchTextComponent, - SearchFilterAutocompleteChipsComponent, - SearchRadioComponent, - SearchSliderComponent, - SearchNumberRangeComponent, - SearchPanelComponent, - SearchDatetimeRangeComponent, - SearchSortingPickerComponent, - SearchFilterContainerComponent, - SearchFormComponent, - SearchFilterChipsComponent, - SearchFilterMenuCardComponent, - SearchFacetFieldComponent, - SearchWidgetChipComponent, - SearchFacetChipComponent, - SearchLogicalFilterComponent, - ResetSearchDirective, - SearchPropertiesComponent, - SearchFilterTabbedComponent, - SearchDateRangeComponent, - SearchDateRangeTabbedComponent, - SearchFilterTabDirective, - SearchFacetChipTabbedComponent, - SearchFacetTabbedContentComponent - ], - exports: [ - SearchComponent, - SearchControlComponent, - EmptySearchResultComponent, - SearchFilterComponent, - SearchFilterCardComponent, - SearchWidgetContainerComponent, - SearchTextComponent, - SearchFilterAutocompleteChipsComponent, - SearchRadioComponent, - SearchSliderComponent, - SearchNumberRangeComponent, - SearchPanelComponent, - ...CONTENT_SEARCH_DIRECTIVES, - SearchDatetimeRangeComponent, - SearchSortingPickerComponent, - SearchFilterContainerComponent, - SearchFormComponent, - SearchFilterChipsComponent, - SearchFilterMenuCardComponent, - SearchFacetFieldComponent, - SearchWidgetChipComponent, - SearchLogicalFilterComponent, - SearchFilterTabbedComponent, - SearchDateRangeComponent, - SearchDateRangeTabbedComponent, - ResetSearchDirective, - SearchFacetChipTabbedComponent, - SearchFacetTabbedContentComponent - ] + imports: [...CONTENT_SEARCH_DIRECTIVES], + exports: [...CONTENT_SEARCH_DIRECTIVES] }) export class SearchModule {} diff --git a/lib/content-services/src/lib/tag/public-api.ts b/lib/content-services/src/lib/tag/public-api.ts index 6ae26d4473..7b8425a5f6 100644 --- a/lib/content-services/src/lib/tag/public-api.ts +++ b/lib/content-services/src/lib/tag/public-api.ts @@ -15,9 +15,9 @@ * limitations under the License. */ -export * from './tag-actions.component'; -export * from './tag-list.component'; -export * from './tag-node-list.component'; +export * from './tag-actions/tag-actions.component'; +export * from './tag-list/tag-list.component'; +export * from './tag-node-list/tag-node-list.component'; export * from './services/tag.service'; @@ -25,4 +25,3 @@ export * from './tag.module'; export * from './tags-creator/tags-creator-mode'; export * from './tags-creator/tags-creator.component'; - diff --git a/lib/content-services/src/lib/tag/tag-actions.component.html b/lib/content-services/src/lib/tag/tag-actions/tag-actions.component.html similarity index 100% rename from lib/content-services/src/lib/tag/tag-actions.component.html rename to lib/content-services/src/lib/tag/tag-actions/tag-actions.component.html diff --git a/lib/content-services/src/lib/tag/tag-actions.component.scss b/lib/content-services/src/lib/tag/tag-actions/tag-actions.component.scss similarity index 100% rename from lib/content-services/src/lib/tag/tag-actions.component.scss rename to lib/content-services/src/lib/tag/tag-actions/tag-actions.component.scss diff --git a/lib/content-services/src/lib/tag/tag-actions.component.spec.ts b/lib/content-services/src/lib/tag/tag-actions/tag-actions.component.spec.ts similarity index 97% rename from lib/content-services/src/lib/tag/tag-actions.component.spec.ts rename to lib/content-services/src/lib/tag/tag-actions/tag-actions.component.spec.ts index 54cdf665d5..cd65f8e4b3 100644 --- a/lib/content-services/src/lib/tag/tag-actions.component.spec.ts +++ b/lib/content-services/src/lib/tag/tag-actions/tag-actions.component.spec.ts @@ -17,9 +17,9 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { TagActionsComponent } from './tag-actions.component'; -import { TagService } from './services/tag.service'; +import { TagService } from '../services/tag.service'; import { of } from 'rxjs'; -import { ContentTestingModule } from '../testing/content.testing.module'; +import { ContentTestingModule } from '../../testing/content.testing.module'; describe('TagActionsComponent', () => { const dataTag = { diff --git a/lib/content-services/src/lib/tag/tag-actions.component.ts b/lib/content-services/src/lib/tag/tag-actions/tag-actions.component.ts similarity index 98% rename from lib/content-services/src/lib/tag/tag-actions.component.ts rename to lib/content-services/src/lib/tag/tag-actions/tag-actions.component.ts index 1563b00381..aa8aaf0b92 100644 --- a/lib/content-services/src/lib/tag/tag-actions.component.ts +++ b/lib/content-services/src/lib/tag/tag-actions/tag-actions.component.ts @@ -17,7 +17,7 @@ import { TranslationService } from '@alfresco/adf-core'; import { Component, EventEmitter, Input, OnChanges, Output, ViewEncapsulation, OnDestroy, OnInit } from '@angular/core'; -import { TagService } from './services/tag.service'; +import { TagService } from '../services/tag.service'; import { Subject } from 'rxjs'; import { TagPaging } from '@alfresco/js-api'; import { takeUntil } from 'rxjs/operators'; diff --git a/lib/content-services/src/lib/tag/tag-list.component.html b/lib/content-services/src/lib/tag/tag-list/tag-list.component.html similarity index 100% rename from lib/content-services/src/lib/tag/tag-list.component.html rename to lib/content-services/src/lib/tag/tag-list/tag-list.component.html diff --git a/lib/content-services/src/lib/tag/tag-list.component.scss b/lib/content-services/src/lib/tag/tag-list/tag-list.component.scss similarity index 100% rename from lib/content-services/src/lib/tag/tag-list.component.scss rename to lib/content-services/src/lib/tag/tag-list/tag-list.component.scss diff --git a/lib/content-services/src/lib/tag/tag-list.component.spec.ts b/lib/content-services/src/lib/tag/tag-list/tag-list.component.spec.ts similarity index 93% rename from lib/content-services/src/lib/tag/tag-list.component.spec.ts rename to lib/content-services/src/lib/tag/tag-list/tag-list.component.spec.ts index f459487bc4..8438c13b3d 100644 --- a/lib/content-services/src/lib/tag/tag-list.component.spec.ts +++ b/lib/content-services/src/lib/tag/tag-list/tag-list.component.spec.ts @@ -16,10 +16,10 @@ */ import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { TagService } from './services/tag.service'; -import { TagListComponent } from '././tag-list.component'; +import { TagService } from '../services/tag.service'; +import { TagListComponent } from './tag-list.component'; import { of } from 'rxjs'; -import { ContentTestingModule } from '../testing/content.testing.module'; +import { ContentTestingModule } from '../../testing/content.testing.module'; describe('TagList', () => { const dataTag = { diff --git a/lib/content-services/src/lib/tag/tag-list.component.ts b/lib/content-services/src/lib/tag/tag-list/tag-list.component.ts similarity index 98% rename from lib/content-services/src/lib/tag/tag-list.component.ts rename to lib/content-services/src/lib/tag/tag-list/tag-list.component.ts index ae3aa59cf5..38e6e10631 100644 --- a/lib/content-services/src/lib/tag/tag-list.component.ts +++ b/lib/content-services/src/lib/tag/tag-list/tag-list.component.ts @@ -16,7 +16,7 @@ */ import { Component, EventEmitter, OnInit, Output, ViewEncapsulation, OnDestroy } from '@angular/core'; -import { TagService } from './services/tag.service'; +import { TagService } from '../services/tag.service'; import { PaginationModel } from '@alfresco/adf-core'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; diff --git a/lib/content-services/src/lib/tag/tag-node-list.component.html b/lib/content-services/src/lib/tag/tag-node-list/tag-node-list.component.html similarity index 100% rename from lib/content-services/src/lib/tag/tag-node-list.component.html rename to lib/content-services/src/lib/tag/tag-node-list/tag-node-list.component.html diff --git a/lib/content-services/src/lib/tag/tag-node-list.component.spec.ts b/lib/content-services/src/lib/tag/tag-node-list/tag-node-list.component.spec.ts similarity index 98% rename from lib/content-services/src/lib/tag/tag-node-list.component.spec.ts rename to lib/content-services/src/lib/tag/tag-node-list/tag-node-list.component.spec.ts index d065f9ddcb..659de4aebf 100644 --- a/lib/content-services/src/lib/tag/tag-node-list.component.spec.ts +++ b/lib/content-services/src/lib/tag/tag-node-list/tag-node-list.component.spec.ts @@ -17,9 +17,9 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { TagNodeListComponent } from './tag-node-list.component'; -import { TagService } from './services/tag.service'; +import { TagService } from '../services/tag.service'; import { Observable, of, Subject } from 'rxjs'; -import { ContentTestingModule } from '../testing/content.testing.module'; +import { ContentTestingModule } from '../../testing/content.testing.module'; import { Tag, TagEntry, TagPaging } from '@alfresco/js-api'; import { DynamicChipListComponent } from '@alfresco/adf-core'; import { By } from '@angular/platform-browser'; diff --git a/lib/content-services/src/lib/tag/tag-node-list.component.ts b/lib/content-services/src/lib/tag/tag-node-list/tag-node-list.component.ts similarity index 98% rename from lib/content-services/src/lib/tag/tag-node-list.component.ts rename to lib/content-services/src/lib/tag/tag-node-list/tag-node-list.component.ts index 29792b63dc..7f46be393f 100644 --- a/lib/content-services/src/lib/tag/tag-node-list.component.ts +++ b/lib/content-services/src/lib/tag/tag-node-list/tag-node-list.component.ts @@ -16,7 +16,7 @@ */ import { Component, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Output, ViewEncapsulation } from '@angular/core'; -import { TagService } from './services/tag.service'; +import { TagService } from '../services/tag.service'; import { TagEntry } from '@alfresco/js-api'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; diff --git a/lib/content-services/src/lib/tag/tag.module.ts b/lib/content-services/src/lib/tag/tag.module.ts index eff5302962..6925062b2a 100644 --- a/lib/content-services/src/lib/tag/tag.module.ts +++ b/lib/content-services/src/lib/tag/tag.module.ts @@ -16,9 +16,9 @@ */ import { NgModule } from '@angular/core'; -import { TagActionsComponent } from './tag-actions.component'; -import { TagListComponent } from './tag-list.component'; -import { TagNodeListComponent } from './tag-node-list.component'; +import { TagActionsComponent } from './tag-actions/tag-actions.component'; +import { TagListComponent } from './tag-list/tag-list.component'; +import { TagNodeListComponent } from './tag-node-list/tag-node-list.component'; import { TagsCreatorComponent } from './tags-creator/tags-creator.component'; export const CONTENT_TAG_DIRECTIVES = [TagsCreatorComponent, TagActionsComponent, TagListComponent, TagNodeListComponent] as const; diff --git a/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.spec.ts b/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.spec.ts index b4ffba6161..263b3ab2b7 100644 --- a/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.spec.ts +++ b/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.spec.ts @@ -34,7 +34,7 @@ import { TranslationService, ViewUtilService, ViewerComponent, - ViewerModule, + VIEWER_DIRECTIVES, ViewerSidebarComponent } from '@alfresco/adf-core'; import { NodesApiService } from '../../common/services/nodes-api.service'; @@ -159,7 +159,7 @@ describe('AlfrescoViewerComponent', () => { MatIconModule, MatDialogModule, HttpClientTestingModule, - ViewerModule + ...VIEWER_DIRECTIVES ], declarations: [ ViewerWithCustomToolbarComponent, diff --git a/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts b/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts index ec9fd7c415..9973e91e4c 100644 --- a/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts +++ b/lib/content-services/src/lib/viewer/components/alfresco-viewer.component.ts @@ -34,7 +34,7 @@ import { CloseButtonPosition, Track, ViewerComponent, - ViewerModule, + VIEWER_DIRECTIVES, ViewerMoreActionsComponent, ViewerOpenWithComponent, ViewerSidebarComponent, @@ -61,7 +61,7 @@ import { NodeDownloadDirective } from '../../directives'; @Component({ selector: 'adf-alfresco-viewer', standalone: true, - imports: [CommonModule, TranslateModule, MatButtonModule, MatIconModule, ViewerModule, NodeDownloadDirective], + imports: [CommonModule, TranslateModule, MatButtonModule, MatIconModule, ...VIEWER_DIRECTIVES, NodeDownloadDirective], templateUrl: './alfresco-viewer.component.html', styleUrls: ['./alfresco-viewer.component.scss'], host: { class: 'adf-alfresco-viewer' }, diff --git a/lib/content-services/src/public-api.ts b/lib/content-services/src/public-api.ts index 759af620dc..b32168f614 100644 --- a/lib/content-services/src/public-api.ts +++ b/lib/content-services/src/public-api.ts @@ -45,4 +45,5 @@ export * from './lib/infinite-scroll-datasource'; export * from './lib/prediction/index'; export * from './lib/content.module'; +export * from './lib/material.module'; export * from './lib/testing/content.testing.module'; diff --git a/lib/core/src/lib/blank-page/blank-page.component.ts b/lib/core/src/lib/blank-page/blank-page.component.ts index 83f66df682..a8f73becef 100644 --- a/lib/core/src/lib/blank-page/blank-page.component.ts +++ b/lib/core/src/lib/blank-page/blank-page.component.ts @@ -18,7 +18,8 @@ import { Component } from '@angular/core'; @Component({ - selector: 'adf-blank-page', - template: `` + selector: 'adf-blank-page', + standalone: true, + template: `` }) export class BlankPageComponent {} diff --git a/lib/core/src/lib/blank-page/blank-page.module.ts b/lib/core/src/lib/blank-page/blank-page.module.ts index 9fd96dc055..acbe30d79b 100644 --- a/lib/core/src/lib/blank-page/blank-page.module.ts +++ b/lib/core/src/lib/blank-page/blank-page.module.ts @@ -19,13 +19,9 @@ import { NgModule } from '@angular/core'; import { BlankPageComponent } from './blank-page.component'; +/** @deprecated import standalone `BlankPageComponent` instead */ @NgModule({ - declarations: [ - BlankPageComponent - ], - exports: [ - BlankPageComponent - ] + imports: [BlankPageComponent], + exports: [BlankPageComponent] }) -export class BlankPageModule { -} +export class BlankPageModule {} diff --git a/lib/core/src/lib/card-view/card-view.module.ts b/lib/core/src/lib/card-view/card-view.module.ts index 2c8700b801..cbce5f3884 100644 --- a/lib/core/src/lib/card-view/card-view.module.ts +++ b/lib/core/src/lib/card-view/card-view.module.ts @@ -15,24 +15,7 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { MatButtonModule } from '@angular/material/button'; -import { MatCardModule } from '@angular/material/card'; -import { MatCheckboxModule } from '@angular/material/checkbox'; -import { MatChipsModule } from '@angular/material/chips'; -import { MatNativeDateModule } from '@angular/material/core'; -import { MatDatepickerModule } from '@angular/material/datepicker'; -import { MatIconModule } from '@angular/material/icon'; -import { MatInputModule } from '@angular/material/input'; -import { MatMenuModule } from '@angular/material/menu'; -import { MatSelectModule } from '@angular/material/select'; -import { MatSlideToggleModule } from '@angular/material/slide-toggle'; -import { MatTableModule } from '@angular/material/table'; -import { MatDatetimepickerModule, MatNativeDatetimeModule } from '@mat-datetimepicker/core'; -import { TranslateModule } from '@ngx-translate/core'; - import { CardViewComponent } from './components/card-view/card-view.component'; import { CardViewBoolItemComponent } from './components/card-view-boolitem/card-view-boolitem.component'; import { CardViewDateItemComponent } from './components/card-view-dateitem/card-view-dateitem.component'; @@ -44,49 +27,22 @@ import { CardViewSelectItemComponent } from './components/card-view-selectitem/c import { CardViewArrayItemComponent } from './components/card-view-arrayitem/card-view-arrayitem.component'; import { SelectFilterInputComponent } from './components/card-view-selectitem/select-filter-input/select-filter-input.component'; +export const CARD_VIEW_DIRECTIVES = [ + CardViewComponent, + CardViewBoolItemComponent, + CardViewDateItemComponent, + CardViewMapItemComponent, + CardViewTextItemComponent, + CardViewKeyValuePairsItemComponent, + CardViewSelectItemComponent, + CardViewItemDispatcherComponent, + CardViewArrayItemComponent, + SelectFilterInputComponent +] as const; + +/** @deprecated use `...CARD_VIEW_DIRECTIVES` or import standalone components directly */ @NgModule({ - imports: [ - CommonModule, - FormsModule, - ReactiveFormsModule, - TranslateModule, - MatDatepickerModule, - MatNativeDateModule, - MatCheckboxModule, - MatInputModule, - MatTableModule, - MatIconModule, - MatSelectModule, - MatButtonModule, - MatChipsModule, - MatMenuModule, - MatCardModule, - MatDatetimepickerModule, - MatNativeDatetimeModule, - MatSlideToggleModule - ], - declarations: [ - CardViewComponent, - CardViewBoolItemComponent, - CardViewDateItemComponent, - CardViewMapItemComponent, - CardViewTextItemComponent, - CardViewKeyValuePairsItemComponent, - CardViewSelectItemComponent, - CardViewItemDispatcherComponent, - CardViewArrayItemComponent, - SelectFilterInputComponent - ], - exports: [ - CardViewComponent, - CardViewBoolItemComponent, - CardViewDateItemComponent, - CardViewMapItemComponent, - CardViewTextItemComponent, - CardViewSelectItemComponent, - CardViewKeyValuePairsItemComponent, - CardViewArrayItemComponent, - SelectFilterInputComponent - ] + imports: [...CARD_VIEW_DIRECTIVES], + exports: [...CARD_VIEW_DIRECTIVES] }) export class CardViewModule {} diff --git a/lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.stories.ts b/lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.stories.ts index f035b1f458..41273f31ce 100644 --- a/lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.stories.ts +++ b/lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.stories.ts @@ -18,7 +18,7 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CardViewArrayItemComponent } from './card-view-arrayitem.component'; import { CoreStoryModule } from './../../../testing/core.story.module'; -import { CardViewArrayItemModel, CardViewModule } from '../../public-api'; +import { CardViewArrayItemModel, CARD_VIEW_DIRECTIVES } from '../../public-api'; import { of } from 'rxjs'; import { importProvidersFrom } from '@angular/core'; @@ -27,7 +27,7 @@ export default { title: 'Core/Card View/Card View Array Item', decorators: [ moduleMetadata({ - imports: [CardViewModule] + imports: [...CARD_VIEW_DIRECTIVES] }), applicationConfig({ providers: [importProvidersFrom(CoreStoryModule)] diff --git a/lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.ts b/lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.ts index b46fd205d0..39dd20dbb9 100644 --- a/lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-arrayitem/card-view-arrayitem.component.ts @@ -18,12 +18,21 @@ import { Component, ViewEncapsulation } from '@angular/core'; import { CardViewArrayItemModel } from '../../models/card-view-arrayitem.model'; import { BaseCardView } from '../base-card-view'; +import { CommonModule } from '@angular/common'; +import { MatChipsModule } from '@angular/material/chips'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatIconModule } from '@angular/material/icon'; +import { MatMenuModule } from '@angular/material/menu'; +import { MatCardModule } from '@angular/material/card'; +import { MatButtonModule } from '@angular/material/button'; @Component({ - selector: 'adf-card-view-arrayitem', - templateUrl: './card-view-arrayitem.component.html', - styleUrls: ['./card-view-arrayitem.component.scss'], - encapsulation: ViewEncapsulation.None + selector: 'adf-card-view-arrayitem', + standalone: true, + imports: [CommonModule, MatChipsModule, TranslateModule, MatIconModule, MatMenuModule, MatCardModule, MatButtonModule], + templateUrl: './card-view-arrayitem.component.html', + styleUrls: ['./card-view-arrayitem.component.scss'], + encapsulation: ViewEncapsulation.None }) export class CardViewArrayItemComponent extends BaseCardView { clicked(): void { diff --git a/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.stories.ts b/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.stories.ts index 774c506aa7..d99b63c62c 100644 --- a/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.stories.ts +++ b/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.stories.ts @@ -18,7 +18,7 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CardViewBoolItemComponent } from './card-view-boolitem.component'; import { CoreStoryModule } from './../../../testing/core.story.module'; -import { CardViewBoolItemModel, CardViewModule } from '../../public-api'; +import { CardViewBoolItemModel, CARD_VIEW_DIRECTIVES } from '../../public-api'; import { importProvidersFrom } from '@angular/core'; export default { @@ -26,7 +26,7 @@ export default { title: 'Core/Card View/Card View Bool Item', decorators: [ moduleMetadata({ - imports: [CardViewModule] + imports: [...CARD_VIEW_DIRECTIVES] }), applicationConfig({ providers: [importProvidersFrom(CoreStoryModule)] diff --git a/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.ts b/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.ts index d79c4e38e7..909de470f4 100644 --- a/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-boolitem/card-view-boolitem.component.ts @@ -16,28 +16,31 @@ */ import { Component, Input } from '@angular/core'; -import { MatCheckboxChange } from '@angular/material/checkbox'; +import { MatCheckboxChange, MatCheckboxModule } from '@angular/material/checkbox'; import { CardViewBoolItemModel } from '../../models/card-view-boolitem.model'; import { BaseCardView } from '../base-card-view'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-card-view-boolitem', + standalone: true, + imports: [CommonModule, MatCheckboxModule, TranslateModule], templateUrl: './card-view-boolitem.component.html', styles: [ ` - .adf-property-value { - padding: 15px 0; - } - ` + .adf-property-value { + padding: 15px 0; + } + ` ] }) - export class CardViewBoolItemComponent extends BaseCardView { @Input() editable: boolean; changed(change: MatCheckboxChange) { - this.cardViewUpdateService.update({ ...this.property } as CardViewBoolItemModel, change.checked ); + this.cardViewUpdateService.update({ ...this.property } as CardViewBoolItemModel, change.checked); this.property.value = change.checked; } } diff --git a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html index cb872fe601..329e83f7de 100644 --- a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html +++ b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html @@ -14,7 +14,6 @@ *ngIf="showProperty" [attr.data-automation-id]="'card-dateitem-' + property.key" (dblclick)="copyToClipboard(property.displayValue)" - matTooltipShowDelay="1000" [title]="'CORE.METADATA.ACTIONS.COPY_TO_CLIPBOARD' | translate" >{{ property.displayValue }} diff --git a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.stories.ts b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.stories.ts index 8a1ef94c8a..2deb7cf6cc 100644 --- a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.stories.ts +++ b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.stories.ts @@ -18,7 +18,7 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CardViewDateItemComponent } from './card-view-dateitem.component'; import { CoreStoryModule } from './../../../testing/core.story.module'; -import { CardViewDateItemModel, CardViewDatetimeItemModel, CardViewModule } from '../../public-api'; +import { CardViewDateItemModel, CardViewDatetimeItemModel, CARD_VIEW_DIRECTIVES } from '../../public-api'; import { importProvidersFrom } from '@angular/core'; export default { @@ -26,7 +26,7 @@ export default { title: 'Core/Card View/Card View Date Item', decorators: [ moduleMetadata({ - imports: [CardViewModule] + imports: [...CARD_VIEW_DIRECTIVES] }), applicationConfig({ providers: [importProvidersFrom(CoreStoryModule)] diff --git a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.ts b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.ts index 6f83a51cbb..a5f229b6eb 100644 --- a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.ts @@ -17,7 +17,13 @@ import { Component, Input, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core'; -import { DatetimeAdapter, MAT_DATETIME_FORMATS, MatDatetimepickerComponent, MatDatetimepickerInputEvent } from '@mat-datetimepicker/core'; +import { + DatetimeAdapter, + MAT_DATETIME_FORMATS, + MatDatetimepickerComponent, + MatDatetimepickerInputEvent, + MatDatetimepickerModule +} from '@mat-datetimepicker/core'; import { CardViewDateItemModel } from '../../models/card-view-dateitem.model'; import { UserPreferencesService, UserPreferenceValues } from '../../../common/services/user-preferences.service'; import { takeUntil } from 'rxjs/operators'; @@ -28,6 +34,11 @@ import { ADF_DATE_FORMATS, AdfDateFnsAdapter } from '../../../common/utils/date- import { ADF_DATETIME_FORMATS, AdfDateTimeFnsAdapter } from '../../../common/utils/datetime-fns-adapter'; import { isValid } from 'date-fns'; import { DateFnsUtils } from '../../../common/utils/date-fns-utils'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatIconModule } from '@angular/material/icon'; +import { MatChipsModule } from '@angular/material/chips'; +import { MatFormFieldModule } from '@angular/material/form-field'; @Component({ providers: [ @@ -37,6 +48,8 @@ import { DateFnsUtils } from '../../../common/utils/date-fns-utils'; { provide: DatetimeAdapter, useClass: AdfDateTimeFnsAdapter } ], selector: 'adf-card-view-dateitem', + standalone: true, + imports: [CommonModule, TranslateModule, MatIconModule, MatDatetimepickerModule, MatChipsModule, MatFormFieldModule], templateUrl: './card-view-dateitem.component.html', styleUrls: ['./card-view-dateitem.component.scss'], encapsulation: ViewEncapsulation.None, @@ -102,7 +115,7 @@ export class CardViewDateItemComponent extends BaseCardView 0) { this.property.value = this.property.value.map((date: Date | string) => new Date(date)); - this.valueDate = this.property.type === 'date' - ? DateFnsUtils.forceLocal(this.property.value[0]) - : this.property.value[0]; + this.valueDate = this.property.type === 'date' ? DateFnsUtils.forceLocal(this.property.value[0]) : this.property.value[0]; } } } diff --git a/lib/core/src/lib/card-view/components/card-view-item-dispatcher/card-view-item-dispatcher.component.spec.ts b/lib/core/src/lib/card-view/components/card-view-item-dispatcher/card-view-item-dispatcher.component.spec.ts index bd0520f0b0..043e2f7713 100644 --- a/lib/core/src/lib/card-view/components/card-view-item-dispatcher/card-view-item-dispatcher.component.spec.ts +++ b/lib/core/src/lib/card-view/components/card-view-item-dispatcher/card-view-item-dispatcher.component.spec.ts @@ -26,6 +26,7 @@ import { CardViewItemDispatcherComponent } from './card-view-item-dispatcher.com @Component({ selector: 'whatever-you-want-to-have', + standalone: true, template: '
Hey I am shiny!
' }) export class CardViewShinyCustomElementItemComponent { @@ -43,7 +44,7 @@ describe('CardViewItemDispatcherComponent', () => { cardItemTypeService.setComponentTypeResolver('shiny-custom-element', () => CardViewShinyCustomElementItemComponent); TestBed.configureTestingModule({ - declarations: [CardViewItemDispatcherComponent, CardViewShinyCustomElementItemComponent], + imports: [CardViewItemDispatcherComponent, CardViewShinyCustomElementItemComponent], providers: [{ provide: CardItemTypeService, useValue: cardItemTypeService }] }); diff --git a/lib/core/src/lib/card-view/components/card-view-item-dispatcher/card-view-item-dispatcher.component.ts b/lib/core/src/lib/card-view/components/card-view-item-dispatcher/card-view-item-dispatcher.component.ts index 0217cbc9b8..69b8be130d 100644 --- a/lib/core/src/lib/card-view/components/card-view-item-dispatcher/card-view-item-dispatcher.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-item-dispatcher/card-view-item-dispatcher.component.ts @@ -22,6 +22,7 @@ import { DEFAULT_SEPARATOR } from '../card-view-textitem/card-view-textitem.comp @Component({ selector: 'adf-card-view-item-dispatcher', + standalone: true, template: '' }) export class CardViewItemDispatcherComponent implements OnChanges { diff --git a/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.spec.ts b/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.spec.ts index 2ed8c17335..d936a68dd5 100644 --- a/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.spec.ts +++ b/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.spec.ts @@ -21,10 +21,7 @@ import { CardViewKeyValuePairsItemModel } from '../../models/card-view-keyvaluep import { CardViewKeyValuePairsItemComponent } from './card-view-keyvaluepairsitem.component'; import { CardViewUpdateService } from '../../services/card-view-update.service'; import { TranslateModule } from '@ngx-translate/core'; -import { MatIconModule } from '@angular/material/icon'; -import { MatTableModule } from '@angular/material/table'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; -import { FormsModule } from '@angular/forms'; describe('CardViewKeyValuePairsItemComponent', () => { let fixture: ComponentFixture; @@ -35,9 +32,8 @@ describe('CardViewKeyValuePairsItemComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [NoopAnimationsModule, TranslateModule.forRoot(), MatIconModule, MatTableModule, FormsModule], - providers: [CardViewUpdateService], - declarations: [CardViewKeyValuePairsItemComponent] + imports: [NoopAnimationsModule, TranslateModule.forRoot(), CardViewKeyValuePairsItemComponent], + providers: [CardViewUpdateService] }); fixture = TestBed.createComponent(CardViewKeyValuePairsItemComponent); cardViewUpdateService = TestBed.inject(CardViewUpdateService); diff --git a/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.stories.ts b/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.stories.ts index 86ca79d65c..907f0ec8a5 100644 --- a/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.stories.ts +++ b/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.stories.ts @@ -18,7 +18,7 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CardViewKeyValuePairsItemComponent } from './card-view-keyvaluepairsitem.component'; import { CoreStoryModule } from './../../../testing/core.story.module'; -import { CardViewModule, CardViewKeyValuePairsItemModel } from '../../public-api'; +import { CARD_VIEW_DIRECTIVES, CardViewKeyValuePairsItemModel } from '../../public-api'; import { importProvidersFrom } from '@angular/core'; export default { @@ -26,7 +26,7 @@ export default { title: 'Core/Card View/Card View Key Value Pairs Item', decorators: [ moduleMetadata({ - imports: [CoreStoryModule, CardViewModule] + imports: [CoreStoryModule, ...CARD_VIEW_DIRECTIVES] }), applicationConfig({ providers: [importProvidersFrom(CoreStoryModule)] diff --git a/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.ts b/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.ts index a40b9b3ab4..01502bff27 100644 --- a/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component.ts @@ -18,17 +18,24 @@ import { Component, OnChanges, ViewEncapsulation } from '@angular/core'; import { CardViewKeyValuePairsItemModel } from '../../models/card-view.models'; import { CardViewKeyValuePairsItemType } from '../../interfaces/card-view.interfaces'; -import { MatTableDataSource } from '@angular/material/table'; +import { MatTableDataSource, MatTableModule } from '@angular/material/table'; import { BaseCardView } from '../base-card-view'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatInputModule } from '@angular/material/input'; +import { FormsModule } from '@angular/forms'; +import { MatButtonModule } from '@angular/material/button'; +import { MatIconModule } from '@angular/material/icon'; @Component({ selector: 'adf-card-view-key-value-pairs-item', + standalone: true, + imports: [CommonModule, TranslateModule, MatTableModule, MatInputModule, FormsModule, MatButtonModule, MatIconModule], templateUrl: './card-view-keyvaluepairsitem.component.html', styleUrls: ['./card-view-keyvaluepairsitem.component.scss'], encapsulation: ViewEncapsulation.None, host: { class: 'adf-card-view-key-value-pairs-item' } }) - export class CardViewKeyValuePairsItemComponent extends BaseCardView implements OnChanges { values: CardViewKeyValuePairsItemType[]; matTableValues: MatTableDataSource; diff --git a/lib/core/src/lib/card-view/components/card-view-mapitem/card-view-mapitem.component.stories.ts b/lib/core/src/lib/card-view/components/card-view-mapitem/card-view-mapitem.component.stories.ts index 34e33c53fa..10f1b7e7a2 100644 --- a/lib/core/src/lib/card-view/components/card-view-mapitem/card-view-mapitem.component.stories.ts +++ b/lib/core/src/lib/card-view/components/card-view-mapitem/card-view-mapitem.component.stories.ts @@ -18,7 +18,7 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CardViewMapItemComponent } from './card-view-mapitem.component'; import { CoreStoryModule } from './../../../testing/core.story.module'; -import { CardViewMapItemModel, CardViewModule } from '../../public-api'; +import { CardViewMapItemModel, CARD_VIEW_DIRECTIVES } from '../../public-api'; import { importProvidersFrom } from '@angular/core'; export default { @@ -26,7 +26,7 @@ export default { title: 'Core/Card View/Card View Map Item', decorators: [ moduleMetadata({ - imports: [CardViewModule] + imports: [...CARD_VIEW_DIRECTIVES] }), applicationConfig({ providers: [importProvidersFrom(CoreStoryModule)] diff --git a/lib/core/src/lib/card-view/components/card-view-mapitem/card-view-mapitem.component.ts b/lib/core/src/lib/card-view/components/card-view-mapitem/card-view-mapitem.component.ts index 5e4ef2c0e0..bbc73d1938 100644 --- a/lib/core/src/lib/card-view/components/card-view-mapitem/card-view-mapitem.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-mapitem/card-view-mapitem.component.ts @@ -18,13 +18,16 @@ import { Component, Input } from '@angular/core'; import { CardViewMapItemModel } from '../../models/card-view-mapitem.model'; import { BaseCardView } from '../base-card-view'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-card-view-mapitem', + standalone: true, + imports: [CommonModule, TranslateModule], templateUrl: './card-view-mapitem.component.html', styleUrls: ['./card-view-mapitem.component.scss'] }) - export class CardViewMapItemComponent extends BaseCardView { @Input() displayEmpty: boolean = true; diff --git a/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.stories.ts b/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.stories.ts index e101a4cc8e..15d5590083 100644 --- a/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.stories.ts +++ b/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.stories.ts @@ -18,7 +18,7 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CardViewSelectItemComponent } from './card-view-selectitem.component'; import { CoreStoryModule } from './../../../testing/core.story.module'; -import { CardViewSelectItemModel, CardViewModule } from '../../public-api'; +import { CardViewSelectItemModel, CARD_VIEW_DIRECTIVES } from '../../public-api'; import { of } from 'rxjs'; import { importProvidersFrom } from '@angular/core'; @@ -27,7 +27,7 @@ export default { title: 'Core/Card View/Card View Select Item', decorators: [ moduleMetadata({ - imports: [CardViewModule] + imports: [...CARD_VIEW_DIRECTIVES] }), applicationConfig({ providers: [importProvidersFrom(CoreStoryModule)] @@ -52,8 +52,7 @@ export default { }, displayEmpty: { control: 'boolean', - description: - 'Defines if it should display CardView item when data is empty', + description: 'Defines if it should display CardView item when data is empty', table: { type: { summary: 'boolean' }, defaultValue: { summary: 'true' } diff --git a/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.ts b/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.ts index 4357a86e31..b3b482d2e2 100644 --- a/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.ts @@ -19,13 +19,19 @@ import { Component, Input, OnChanges, OnDestroy, OnInit, inject, ViewEncapsulati import { CardViewSelectItemModel } from '../../models/card-view-selectitem.model'; import { BehaviorSubject, combineLatest, Observable } from 'rxjs'; import { CardViewSelectItemOption } from '../../interfaces/card-view.interfaces'; -import { MatSelectChange } from '@angular/material/select'; +import { MatSelectChange, MatSelectModule } from '@angular/material/select'; import { BaseCardView } from '../base-card-view'; import { AppConfigService } from '../../../app-config/app-config.service'; import { takeUntil, map } from 'rxjs/operators'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { SelectFilterInputComponent } from './select-filter-input/select-filter-input.component'; @Component({ selector: 'adf-card-view-selectitem', + standalone: true, + imports: [CommonModule, TranslateModule, MatFormFieldModule, MatSelectModule, SelectFilterInputComponent], templateUrl: './card-view-selectitem.component.html', styleUrls: ['./card-view-selectitem.component.scss'], encapsulation: ViewEncapsulation.None, @@ -71,13 +77,10 @@ export class CardViewSelectItemComponent extends BaseCardView[]> { - return combineLatest([this.getOptions(), this.filter$]) - .pipe( - map(([items, filter]) => items.filter((item) => - filter ? item.label.toLowerCase().includes(filter.toLowerCase()) - : true)), - takeUntil(this.destroy$) - ); + return combineLatest([this.getOptions(), this.filter$]).pipe( + map(([items, filter]) => items.filter((item) => (filter ? item.label.toLowerCase().includes(filter.toLowerCase()) : true))), + takeUntil(this.destroy$) + ); } onChange(event: MatSelectChange): void { diff --git a/lib/core/src/lib/card-view/components/card-view-selectitem/select-filter-input/select-filter-input.component.ts b/lib/core/src/lib/card-view/components/card-view-selectitem/select-filter-input/select-filter-input.component.ts index 0e8478820c..c36de66eb4 100644 --- a/lib/core/src/lib/card-view/components/card-view-selectitem/select-filter-input/select-filter-input.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-selectitem/select-filter-input/select-filter-input.component.ts @@ -19,9 +19,18 @@ import { Component, ViewEncapsulation, ViewChild, ElementRef, OnDestroy, Inject, import { MatSelect } from '@angular/material/select'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; +import { CommonModule } from '@angular/common'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { FormsModule } from '@angular/forms'; +import { MatButtonModule } from '@angular/material/button'; +import { MatIconModule } from '@angular/material/icon'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-select-filter-input', + standalone: true, + imports: [CommonModule, MatFormFieldModule, MatInputModule, FormsModule, MatButtonModule, MatIconModule, TranslateModule], templateUrl: './select-filter-input.component.html', styleUrls: ['./select-filter-input.component.scss'], host: { class: 'adf-select-filter-input' }, diff --git a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.stories.ts b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.stories.ts index 1b12257643..3fe459793e 100644 --- a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.stories.ts +++ b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.stories.ts @@ -18,7 +18,7 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CardViewTextItemComponent } from './card-view-textitem.component'; import { CoreStoryModule } from './../../../testing/core.story.module'; -import { CardViewModule, CardViewTextItemModel } from '../../public-api'; +import { CARD_VIEW_DIRECTIVES, CardViewTextItemModel } from '../../public-api'; import { importProvidersFrom } from '@angular/core'; export default { @@ -26,7 +26,7 @@ export default { title: 'Core/Card View/Card View Text Item', decorators: [ moduleMetadata({ - imports: [CardViewModule] + imports: [...CARD_VIEW_DIRECTIVES] }), applicationConfig({ providers: [importProvidersFrom(CoreStoryModule)] @@ -43,8 +43,7 @@ export default { }, displayEmpty: { control: 'boolean', - description: - 'Defines if it should display CardView item when data is empty', + description: 'Defines if it should display CardView item when data is empty', table: { type: { summary: 'boolean' }, defaultValue: { summary: 'true' } @@ -90,7 +89,6 @@ export default { useChipsForMultiValueProperty: true, multiValueSeparator: ', ', displayLabelForChips: false - } } as Meta; diff --git a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts index c2f80dbdbb..75eab8962c 100644 --- a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts @@ -18,12 +18,18 @@ import { ChangeDetectorRef, Component, Input, OnChanges, OnDestroy, SimpleChanges, ViewEncapsulation } from '@angular/core'; import { CardViewTextItemModel } from '../../models/card-view-textitem.model'; import { BaseCardView } from '../base-card-view'; -import { MatChipInputEvent } from '@angular/material/chips'; +import { MatChipInputEvent, MatChipsModule } from '@angular/material/chips'; import { ClipboardService } from '../../../clipboard/clipboard.service'; import { TranslationService } from '../../../translation/translation.service'; import { CardViewItemValidator } from '../../interfaces/card-view-item-validator.interface'; -import { UntypedFormControl } from '@angular/forms'; +import { FormsModule, ReactiveFormsModule, UntypedFormControl } from '@angular/forms'; import { debounceTime, takeUntil, filter } from 'rxjs/operators'; +import { CommonModule } from '@angular/common'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatInputModule } from '@angular/material/input'; +import { MatIconModule } from '@angular/material/icon'; +import { MatButtonModule } from '@angular/material/button'; export const DEFAULT_SEPARATOR = ', '; const templateTypes = { @@ -36,6 +42,18 @@ const templateTypes = { @Component({ selector: 'adf-card-view-textitem', + standalone: true, + imports: [ + CommonModule, + MatFormFieldModule, + TranslateModule, + MatInputModule, + ReactiveFormsModule, + MatChipsModule, + MatIconModule, + FormsModule, + MatButtonModule + ], templateUrl: './card-view-textitem.component.html', styleUrls: ['./card-view-textitem.component.scss'], encapsulation: ViewEncapsulation.None, diff --git a/lib/core/src/lib/card-view/components/card-view/card-view.component.spec.ts b/lib/core/src/lib/card-view/components/card-view/card-view.component.spec.ts index f8383a9a5f..29e8bc47ef 100644 --- a/lib/core/src/lib/card-view/components/card-view/card-view.component.spec.ts +++ b/lib/core/src/lib/card-view/components/card-view/card-view.component.spec.ts @@ -54,7 +54,8 @@ describe('CardViewComponent', () => { MatDialogModule, MatDatepickerModule, MatSelectModule, - HttpClientTestingModule + HttpClientTestingModule, + CardViewComponent ], providers: [{ provide: TranslationService, useClass: TranslationMock }] }).compileComponents(); diff --git a/lib/core/src/lib/card-view/components/card-view/card-view.component.stories.ts b/lib/core/src/lib/card-view/components/card-view/card-view.component.stories.ts index fe1da4a888..8836da9cc2 100644 --- a/lib/core/src/lib/card-view/components/card-view/card-view.component.stories.ts +++ b/lib/core/src/lib/card-view/components/card-view/card-view.component.stories.ts @@ -18,7 +18,7 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CardViewComponent } from './card-view.component'; import { CoreStoryModule } from './../../../testing/core.story.module'; -import { CardViewModule } from '../../public-api'; +import { CARD_VIEW_DIRECTIVES } from '../../public-api'; import { cardViewDataSource, cardViewUndefinedValues } from '../../mock/card-view-content.mock'; import { importProvidersFrom } from '@angular/core'; @@ -27,7 +27,7 @@ export default { title: 'Core/Card View/Card View', decorators: [ moduleMetadata({ - imports: [CoreStoryModule, CardViewModule] + imports: [CoreStoryModule, ...CARD_VIEW_DIRECTIVES] }), applicationConfig({ providers: [importProvidersFrom(CoreStoryModule)] diff --git a/lib/core/src/lib/card-view/components/card-view/card-view.component.ts b/lib/core/src/lib/card-view/components/card-view/card-view.component.ts index 00fe045cb3..b01baa39d2 100644 --- a/lib/core/src/lib/card-view/components/card-view/card-view.component.ts +++ b/lib/core/src/lib/card-view/components/card-view/card-view.component.ts @@ -18,9 +18,13 @@ import { Component, Input, ViewEncapsulation } from '@angular/core'; import { CardViewItem } from '../../interfaces/card-view-item.interface'; import { DEFAULT_SEPARATOR } from '../card-view-textitem/card-view-textitem.component'; +import { CommonModule } from '@angular/common'; +import { CardViewItemDispatcherComponent } from '../card-view-item-dispatcher/card-view-item-dispatcher.component'; @Component({ selector: 'adf-card-view', + standalone: true, + imports: [CommonModule, CardViewItemDispatcherComponent], templateUrl: './card-view.component.html', styleUrls: ['./card-view.component.scss'], encapsulation: ViewEncapsulation.None @@ -28,7 +32,7 @@ import { DEFAULT_SEPARATOR } from '../card-view-textitem/card-view-textitem.comp export class CardViewComponent { /** (**required**) Items to show in the card view. */ @Input() - properties: CardViewItem []; + properties: CardViewItem[]; /** Toggles whether or not the items can be edited. */ @Input() diff --git a/lib/core/src/lib/card-view/public-api.ts b/lib/core/src/lib/card-view/public-api.ts index 5a2cbe120c..f27b0362d4 100644 --- a/lib/core/src/lib/card-view/public-api.ts +++ b/lib/core/src/lib/card-view/public-api.ts @@ -33,3 +33,4 @@ export * from './validators/card-view.validators'; export * from './models/card-view.models'; export * from './services/card-view.services'; export * from './card-view.module'; +export * from './components/card-view-item-dispatcher/card-view-item-dispatcher.component'; diff --git a/lib/core/src/lib/clipboard/clipboard.directive.spec.ts b/lib/core/src/lib/clipboard/clipboard.directive.spec.ts index 0b3dae3190..3447c34c93 100644 --- a/lib/core/src/lib/clipboard/clipboard.directive.spec.ts +++ b/lib/core/src/lib/clipboard/clipboard.directive.spec.ts @@ -42,9 +42,9 @@ describe('ClipboardDirective', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [TranslateModule.forRoot(), HttpClientTestingModule, MatSnackBarModule, MatButtonModule], + imports: [TranslateModule.forRoot(), HttpClientTestingModule, MatSnackBarModule, MatButtonModule, ClipboardDirective], providers: [ClipboardService, { provide: TranslationService, useClass: TranslationMock }], - declarations: [TestTargetClipboardComponent, ClipboardDirective] + declarations: [TestTargetClipboardComponent] }); fixture = TestBed.createComponent(TestTargetClipboardComponent); clipboardService = TestBed.inject(ClipboardService); @@ -86,9 +86,9 @@ describe('CopyClipboardDirective', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [TranslateModule.forRoot(), HttpClientTestingModule, MatSnackBarModule], + imports: [TranslateModule.forRoot(), HttpClientTestingModule, MatSnackBarModule, ClipboardDirective], providers: [ClipboardService, { provide: TranslationService, useClass: TranslationMock }], - declarations: [TestCopyClipboardComponent, ClipboardDirective] + declarations: [TestCopyClipboardComponent] }); fixture = TestBed.createComponent(TestCopyClipboardComponent); element = fixture.debugElement.nativeElement; diff --git a/lib/core/src/lib/clipboard/clipboard.directive.ts b/lib/core/src/lib/clipboard/clipboard.directive.ts index 1edc4f8e8f..d016ea67a7 100644 --- a/lib/core/src/lib/clipboard/clipboard.directive.ts +++ b/lib/core/src/lib/clipboard/clipboard.directive.ts @@ -17,9 +17,11 @@ import { Directive, Input, HostListener, Component, ViewContainerRef, ViewEncapsulation, OnInit } from '@angular/core'; import { ClipboardService } from './clipboard.service'; +import { TranslateModule } from '@ngx-translate/core'; @Directive({ selector: '[adf-clipboard]', + standalone: true, exportAs: 'adfClipboard' }) export class ClipboardDirective { @@ -73,6 +75,8 @@ export class ClipboardDirective { @Component({ selector: 'adf-copy-content-tooltip', + standalone: true, + imports: [TranslateModule], template: `{{ placeholder | translate }} `, encapsulation: ViewEncapsulation.None }) diff --git a/lib/core/src/lib/clipboard/clipboard.module.ts b/lib/core/src/lib/clipboard/clipboard.module.ts index 7845c0e72b..67f2335b82 100644 --- a/lib/core/src/lib/clipboard/clipboard.module.ts +++ b/lib/core/src/lib/clipboard/clipboard.module.ts @@ -15,23 +15,14 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; import { ClipboardDirective, ClipboardComponent } from './clipboard.directive'; -import { TranslateModule } from '@ngx-translate/core'; +export const CLIPBOARD_DIRECTIVES = [ClipboardDirective, ClipboardComponent] as const; + +/** @deprecated use `...CLIPBOARD_DIRECTIVES` or import standalone directives */ @NgModule({ - imports: [ - CommonModule, - TranslateModule - ], - declarations: [ - ClipboardDirective, - ClipboardComponent - ], - exports: [ - ClipboardDirective - ] + imports: [...CLIPBOARD_DIRECTIVES], + exports: [...CLIPBOARD_DIRECTIVES] }) - export class ClipboardModule {} diff --git a/lib/core/src/lib/comments/comment-list/comment-list.component.stories.ts b/lib/core/src/lib/comments/comment-list/comment-list.component.stories.ts index 8d157dbcc6..067d83b443 100644 --- a/lib/core/src/lib/comments/comment-list/comment-list.component.stories.ts +++ b/lib/core/src/lib/comments/comment-list/comment-list.component.stories.ts @@ -21,7 +21,6 @@ import { CommentListComponent } from './comment-list.component'; import { commentsTaskData, commentsNodeData } from '../mocks/comments.stories.mock'; import { CommentListServiceMock } from './mocks/comment-list.service.mock'; import { importProvidersFrom } from '@angular/core'; -import { CommentListModule } from './comment-list.module'; import { CommentsServiceStoriesMock } from '../mocks/comments.service.stories.mock'; import { ADF_COMMENTS_SERVICE } from '../interfaces/comments.token'; @@ -30,7 +29,7 @@ export default { title: 'Core/Comments/Comment List', decorators: [ moduleMetadata({ - imports: [CommentListModule], + imports: [CommentListComponent], providers: [ { provide: CommentListServiceMock, useValue: { getUserProfileImage: () => '../assets/images/logo.png' } }, { provide: ADF_COMMENTS_SERVICE, useClass: CommentsServiceStoriesMock } diff --git a/lib/core/src/lib/comments/comment-list/comment-list.component.ts b/lib/core/src/lib/comments/comment-list/comment-list.component.ts index 0cdde31988..7b9a09429f 100644 --- a/lib/core/src/lib/comments/comment-list/comment-list.component.ts +++ b/lib/core/src/lib/comments/comment-list/comment-list.component.ts @@ -19,9 +19,16 @@ import { Component, EventEmitter, Input, Output, ViewEncapsulation, inject } fro import { CommentModel } from '../../models/comment.model'; import { CommentsService } from '../interfaces/comments-service.interface'; import { ADF_COMMENTS_SERVICE } from '../interfaces/comments.token'; +import { CommonModule } from '@angular/common'; +import { MatListModule } from '@angular/material/list'; +import { MatLineModule } from '@angular/material/core'; +import { TimeAgoPipe } from '../../pipes'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-comment-list', + standalone: true, + imports: [CommonModule, MatListModule, MatLineModule, TimeAgoPipe, TranslateModule], templateUrl: './comment-list.component.html', styleUrls: ['./comment-list.component.scss'], encapsulation: ViewEncapsulation.None diff --git a/lib/core/src/lib/comments/comment-list/comment-list.module.ts b/lib/core/src/lib/comments/comment-list/comment-list.module.ts index ca40952005..1539c723e2 100644 --- a/lib/core/src/lib/comments/comment-list/comment-list.module.ts +++ b/lib/core/src/lib/comments/comment-list/comment-list.module.ts @@ -15,34 +15,12 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; -import { TranslateModule } from '@ngx-translate/core'; -import { MatButtonModule } from '@angular/material/button'; -import { MatFormFieldModule } from '@angular/material/form-field'; -import { MatInputModule } from '@angular/material/input'; -import { MatListModule } from '@angular/material/list'; -import { MatLineModule } from '@angular/material/core'; -import { FormsModule } from '@angular/forms'; -import { PipeModule } from '../../pipes/pipe.module'; - import { CommentListComponent } from './comment-list.component'; -import { TimeAgoPipe } from '../../pipes'; +/** @deprecated import `CommentListComponent` standalone component directly */ @NgModule({ - imports: [ - PipeModule, - FormsModule, - CommonModule, - TranslateModule, - MatButtonModule, - MatFormFieldModule, - MatInputModule, - MatListModule, - MatLineModule, - TimeAgoPipe - ], - declarations: [CommentListComponent], + imports: [CommentListComponent], exports: [CommentListComponent] }) export class CommentListModule {} diff --git a/lib/core/src/lib/comments/comments.component.spec.ts b/lib/core/src/lib/comments/comments.component.spec.ts index 04c8952d4b..292811fbd7 100644 --- a/lib/core/src/lib/comments/comments.component.spec.ts +++ b/lib/core/src/lib/comments/comments.component.spec.ts @@ -35,7 +35,7 @@ describe('CommentsComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [NoopAnimationsModule, HttpClientTestingModule, TranslateModule.forRoot()], + imports: [NoopAnimationsModule, HttpClientTestingModule, TranslateModule.forRoot(), CommentsComponent], providers: [ { provide: ADF_COMMENTS_SERVICE, diff --git a/lib/core/src/lib/comments/comments.component.stories.ts b/lib/core/src/lib/comments/comments.component.stories.ts index d97fd2bcf7..13f867e2f5 100644 --- a/lib/core/src/lib/comments/comments.component.stories.ts +++ b/lib/core/src/lib/comments/comments.component.stories.ts @@ -18,7 +18,6 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CoreStoryModule } from '../testing/core.story.module'; import { CommentsComponent } from './comments.component'; -import { CommentsModule } from './comments.module'; import { ADF_COMMENTS_SERVICE } from './interfaces/comments.token'; import { commentsStoriesData } from './mocks/comments.stories.mock'; import { CommentsServiceStoriesMock } from './mocks/comments.service.stories.mock'; @@ -29,7 +28,7 @@ export default { title: 'Core/Comments/Comment', decorators: [ moduleMetadata({ - imports: [CommentsModule], + imports: [CommentsComponent], providers: [ { provide: CommentsServiceStoriesMock, useValue: { getUserProfileImage: () => '../assets/images/logo.png' } }, { provide: ADF_COMMENTS_SERVICE, useClass: CommentsServiceStoriesMock } diff --git a/lib/core/src/lib/comments/comments.component.ts b/lib/core/src/lib/comments/comments.component.ts index 10915f8edb..e7ccaf2c77 100644 --- a/lib/core/src/lib/comments/comments.component.ts +++ b/lib/core/src/lib/comments/comments.component.ts @@ -16,27 +16,26 @@ */ import { CommentModel } from '../models/comment.model'; -import { - Component, - EventEmitter, - inject, - Input, - OnChanges, - Output, - SimpleChanges, - ViewEncapsulation -} from '@angular/core'; +import { Component, EventEmitter, inject, Input, OnChanges, Output, SimpleChanges, ViewEncapsulation } from '@angular/core'; import { ADF_COMMENTS_SERVICE } from './interfaces/comments.token'; import { CommentsService } from './interfaces/comments-service.interface'; +import { CommonModule } from '@angular/common'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { FormsModule } from '@angular/forms'; +import { MatButtonModule } from '@angular/material/button'; +import { CommentListComponent } from './comment-list'; @Component({ selector: 'adf-comments', + standalone: true, + imports: [CommonModule, TranslateModule, MatFormFieldModule, MatInputModule, FormsModule, MatButtonModule, CommentListComponent], templateUrl: './comments.component.html', styleUrls: ['./comments.component.scss'], encapsulation: ViewEncapsulation.None }) export class CommentsComponent implements OnChanges { - /** The numeric ID of the task. */ @Input() id: string; @@ -96,19 +95,18 @@ export class CommentsComponent implements OnChanges { this.beingAdded = true; - this.commentsService.add(this.id, this.message) - .subscribe( - (res: CommentModel) => { - this.addToComments(res); - this.resetMessage(); - }, - (err) => { - this.error.emit(err); - }, - () => { - this.beingAdded = false; - } - ); + this.commentsService.add(this.id, this.message).subscribe( + (res: CommentModel) => { + this.addToComments(res); + this.resetMessage(); + }, + (err) => { + this.error.emit(err); + }, + () => { + this.beingAdded = false; + } + ); } clearMessage(event: Event): void { diff --git a/lib/core/src/lib/comments/comments.module.ts b/lib/core/src/lib/comments/comments.module.ts index 6474693b2f..96969ecbd3 100644 --- a/lib/core/src/lib/comments/comments.module.ts +++ b/lib/core/src/lib/comments/comments.module.ts @@ -15,39 +15,12 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; -import { TranslateModule } from '@ngx-translate/core'; -import { MatButtonModule } from '@angular/material/button'; -import { MatFormFieldModule } from '@angular/material/form-field'; -import { MatInputModule } from '@angular/material/input'; -import { MatListModule } from '@angular/material/list'; -import { MatLineModule } from '@angular/material/core'; -import { FormsModule } from '@angular/forms'; -import { PipeModule } from '../pipes/pipe.module'; -import { CommentListModule } from './comment-list/comment-list.module'; - import { CommentsComponent } from './comments.component'; +/** @deprecated import standalone `CommentsComponent` directly */ @NgModule({ - imports: [ - PipeModule, - FormsModule, - CommonModule, - TranslateModule, - MatButtonModule, - MatFormFieldModule, - MatInputModule, - MatListModule, - MatLineModule, - CommentListModule - ], - declarations: [ - CommentsComponent - ], - exports: [ - CommentsComponent - ] + imports: [CommentsComponent], + exports: [CommentsComponent] }) -export class CommentsModule { -} +export class CommentsModule {} diff --git a/lib/core/src/lib/context-menu/context-menu.module.ts b/lib/core/src/lib/context-menu/context-menu.module.ts index 89c283e491..fa638317bd 100644 --- a/lib/core/src/lib/context-menu/context-menu.module.ts +++ b/lib/core/src/lib/context-menu/context-menu.module.ts @@ -19,8 +19,11 @@ import { NgModule } from '@angular/core'; import { ContextMenuDirective } from './context-menu.directive'; import { ContextMenuListComponent } from './context-menu-list.component'; +export const CONTEXT_MENU_DIRECTIVES = [ContextMenuListComponent, ContextMenuDirective] as const; + +/** @deprecated use `...CONTEXT_MENU_DIRECTIVES` or import standalone directives */ @NgModule({ - imports: [ContextMenuListComponent, ContextMenuDirective], - exports: [ContextMenuListComponent, ContextMenuDirective] + imports: [...CONTEXT_MENU_DIRECTIVES], + exports: [...CONTEXT_MENU_DIRECTIVES] }) export class ContextMenuModule {} diff --git a/lib/core/src/lib/context-menu/context-menu.spec.ts b/lib/core/src/lib/context-menu/context-menu.spec.ts index ef088a8fb0..1bee7feaa8 100644 --- a/lib/core/src/lib/context-menu/context-menu.spec.ts +++ b/lib/core/src/lib/context-menu/context-menu.spec.ts @@ -17,7 +17,7 @@ import { Component } from '@angular/core'; import { TestBed, ComponentFixture } from '@angular/core/testing'; -import { ContextMenuModule } from './context-menu.module'; +import { CONTEXT_MENU_DIRECTIVES } from './context-menu.module'; import { CoreTestingModule } from '../testing/core.testing.module'; import { HarnessLoader } from '@angular/cdk/testing'; import { MatIconHarness } from '@angular/material/icon/testing'; @@ -103,7 +103,7 @@ describe('ContextMenuDirective', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [CoreTestingModule, ContextMenuModule], + imports: [CoreTestingModule, CONTEXT_MENU_DIRECTIVES], declarations: [TestComponent] }); fixture = TestBed.createComponent(TestComponent); diff --git a/lib/core/src/lib/core.module.ts b/lib/core/src/lib/core.module.ts index 8d6e1000fd..4c420fb7a6 100644 --- a/lib/core/src/lib/core.module.ts +++ b/lib/core/src/lib/core.module.ts @@ -15,46 +15,38 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { APP_INITIALIZER, NgModule, ModuleWithProviders } from '@angular/core'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { TranslateModule, TranslateLoader, TranslateStore, TranslateService } from '@ngx-translate/core'; -import { MaterialModule } from './material.module'; import { ABOUT_DIRECTIVES } from './about/about.module'; -import { CardViewModule } from './card-view/card-view.module'; -import { ContextMenuModule } from './context-menu/context-menu.module'; +import { CARD_VIEW_DIRECTIVES } from './card-view/card-view.module'; +import { CONTEXT_MENU_DIRECTIVES } from './context-menu/context-menu.module'; import { DATATABLE_DIRECTIVES } from './datatable/datatable.module'; -import { InfoDrawerModule } from './info-drawer/info-drawer.module'; -import { LanguageMenuModule } from './language-menu/language-menu.module'; -import { LoginModule } from './login/login.module'; -import { PaginationModule } from './pagination/pagination.module'; -import { ToolbarModule } from './toolbar/toolbar.module'; -import { ViewerModule } from './viewer/viewer.module'; +import { INFO_DRAWER_DIRECTIVES } from './info-drawer/info-drawer.module'; +import { LANGUAGE_MENU_DIRECTIVES } from './language-menu/language-menu.module'; +import { LOGIN_DIRECTIVES } from './login/login.module'; +import { PAGINATION_DIRECTIVES } from './pagination/pagination.module'; +import { TOOLBAR_DIRECTIVES } from './toolbar/toolbar.module'; +import { VIEWER_DIRECTIVES } from './viewer/viewer.module'; import { FormBaseModule } from './form/form-base.module'; import { LAYOUT_DIRECTIVES } from './layout/layout.module'; -import { CommentsModule } from './comments/comments.module'; -import { CommentListModule } from './comments/comment-list/comment-list.module'; -import { TemplateModule } from './templates/template.module'; -import { ClipboardModule } from './clipboard/clipboard.module'; -import { NotificationHistoryModule } from './notifications/notification-history.module'; -import { BlankPageModule } from './blank-page/blank-page.module'; - -import { DirectiveModule } from './directives/directive.module'; -import { PipeModule } from './pipes/pipe.module'; - +import { CommentsComponent } from './comments/comments.component'; +import { CommentListComponent } from './comments/comment-list/comment-list.component'; +import { TEMPLATE_DIRECTIVES } from './templates/template.module'; +import { CLIPBOARD_DIRECTIVES } from './clipboard/clipboard.module'; +import { NOTIFICATION_HISTORY_DIRECTIVES } from './notifications/notification-history.module'; +import { BlankPageComponent } from './blank-page/blank-page.component'; +import { CORE_DIRECTIVES } from './directives/directive.module'; +import { CORE_PIPES } from './pipes/pipe.module'; import { TranslationService } from './translation/translation.service'; -import { SortingPickerModule } from './sorting-picker/sorting-picker.module'; import { TranslateLoaderService } from './translation/translate-loader.service'; -import { ExtensionsModule } from '@alfresco/adf-extensions'; import { directionalityConfigFactory } from './common/services/directionality-config-factory'; import { DirectionalityConfigService } from './common/services/directionality-config.service'; -import { SearchTextModule } from './search-text/search-text-input.module'; +import { SEARCH_TEXT_INPUT_DIRECTIVES } from './search-text/search-text-input.module'; import { AdfHttpClient } from '@alfresco/adf-core/api'; import { AuthenticationInterceptor, Authentication } from '@alfresco/adf-core/auth'; import { HttpClientModule, HttpClientXsrfModule, HTTP_INTERCEPTORS } from '@angular/common/http'; import { AuthenticationService } from './auth/services/authentication.service'; import { MAT_SNACK_BAR_DEFAULT_OPTIONS } from '@angular/material/snack-bar'; -import { IdentityUserInfoModule } from './identity-user-info/identity-user-info.module'; import { loadAppConfig } from './app-config/app-config.loader'; import { AppConfigService } from './app-config/app-config.service'; import { StorageService } from './common/services/storage.service'; @@ -63,83 +55,81 @@ import { AdfDateFnsAdapter } from './common/utils/date-fns-adapter'; import { MomentDateAdapter } from './common/utils/moment-date-adapter'; import { AdfDateTimeFnsAdapter } from './common/utils/datetime-fns-adapter'; import { AppConfigPipe, StoragePrefixFactory } from './app-config'; -import { UnsavedChangesDialogModule } from './dialogs'; -import { DynamicChipListModule } from './dynamic-chip-list'; import { IconComponent } from './icon'; +import { SortingPickerComponent } from './sorting-picker'; +import { DynamicChipListComponent } from './dynamic-chip-list'; +import { IdentityUserInfoComponent } from './identity-user-info'; +import { UnsavedChangesDialogComponent } from './dialogs'; +import { MaterialModule } from './material.module'; @NgModule({ imports: [ TranslateModule, - ExtensionsModule, ...ABOUT_DIRECTIVES, - ViewerModule, + ...VIEWER_DIRECTIVES, ...LAYOUT_DIRECTIVES, - PipeModule, - CommonModule, - IdentityUserInfoModule, - DirectiveModule, - FormsModule, - ReactiveFormsModule, - MaterialModule, + ...CORE_PIPES, + IdentityUserInfoComponent, + ...CORE_DIRECTIVES, AppConfigPipe, - PaginationModule, - ToolbarModule, - ContextMenuModule, - CardViewModule, + ...PAGINATION_DIRECTIVES, + ...TOOLBAR_DIRECTIVES, + ...CONTEXT_MENU_DIRECTIVES, + ...CARD_VIEW_DIRECTIVES, FormBaseModule, - CommentsModule, - CommentListModule, - LoginModule, - LanguageMenuModule, - InfoDrawerModule, + CommentsComponent, + CommentListComponent, + ...CLIPBOARD_DIRECTIVES, + ...LOGIN_DIRECTIVES, + ...LANGUAGE_MENU_DIRECTIVES, + ...INFO_DRAWER_DIRECTIVES, ...DATATABLE_DIRECTIVES, - TemplateModule, + ...TEMPLATE_DIRECTIVES, IconComponent, - SortingPickerModule, - NotificationHistoryModule, - SearchTextModule, - BlankPageModule, - UnsavedChangesDialogModule, - DynamicChipListModule, + SortingPickerComponent, + ...NOTIFICATION_HISTORY_DIRECTIVES, + ...SEARCH_TEXT_INPUT_DIRECTIVES, + BlankPageComponent, + UnsavedChangesDialogComponent, + DynamicChipListComponent, HttpClientModule, HttpClientXsrfModule.withOptions({ cookieName: 'CSRF-TOKEN', headerName: 'X-CSRF-TOKEN' - }) + }), + MaterialModule ], + providers: [...CORE_PIPES], exports: [ ...ABOUT_DIRECTIVES, - ViewerModule, + ...VIEWER_DIRECTIVES, ...LAYOUT_DIRECTIVES, - PipeModule, - CommonModule, - DirectiveModule, - ClipboardModule, - FormsModule, - IdentityUserInfoModule, - ReactiveFormsModule, - MaterialModule, + ...CORE_PIPES, + ...CORE_DIRECTIVES, + ...CLIPBOARD_DIRECTIVES, + IdentityUserInfoComponent, AppConfigPipe, - PaginationModule, - ToolbarModule, - ContextMenuModule, - CardViewModule, + ...PAGINATION_DIRECTIVES, + ...TOOLBAR_DIRECTIVES, + ...CONTEXT_MENU_DIRECTIVES, + ...CARD_VIEW_DIRECTIVES, FormBaseModule, - CommentsModule, - CommentListModule, - LoginModule, - LanguageMenuModule, - InfoDrawerModule, + CommentsComponent, + CommentListComponent, + ...LOGIN_DIRECTIVES, + ...LANGUAGE_MENU_DIRECTIVES, + ...INFO_DRAWER_DIRECTIVES, ...DATATABLE_DIRECTIVES, TranslateModule, - TemplateModule, - SortingPickerModule, + ...TEMPLATE_DIRECTIVES, + SortingPickerComponent, IconComponent, - NotificationHistoryModule, - SearchTextModule, - BlankPageModule, - UnsavedChangesDialogModule, - DynamicChipListModule + ...NOTIFICATION_HISTORY_DIRECTIVES, + ...SEARCH_TEXT_INPUT_DIRECTIVES, + BlankPageComponent, + UnsavedChangesDialogComponent, + DynamicChipListComponent, + MaterialModule ] }) export class CoreModule { @@ -184,6 +174,10 @@ export class CoreModule { }; } + /** + * @deprecated this api is deprecated, import `CoreModule` instead + * @returns ModuleWithProviders + */ static forChild(): ModuleWithProviders { return { ngModule: CoreModule diff --git a/lib/core/src/lib/datatable/components/datatable-cell/datatable-cell.component.ts b/lib/core/src/lib/datatable/components/datatable-cell/datatable-cell.component.ts index 719f80cbd3..f31ad460ee 100644 --- a/lib/core/src/lib/datatable/components/datatable-cell/datatable-cell.component.ts +++ b/lib/core/src/lib/datatable/components/datatable-cell/datatable-cell.component.ts @@ -23,12 +23,12 @@ import { BehaviorSubject, Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { DataTableService } from '../../services/datatable.service'; import { CommonModule } from '@angular/common'; -import { ClipboardModule } from '../../../clipboard'; +import { ClipboardDirective } from '../../../clipboard/clipboard.directive'; @Component({ selector: 'adf-datatable-cell', standalone: true, - imports: [CommonModule, ClipboardModule], + imports: [CommonModule, ClipboardDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: ` diff --git a/lib/core/src/lib/dialogs/unsaved-changes-dialog/unsaved-changes-dialog.component.ts b/lib/core/src/lib/dialogs/unsaved-changes-dialog/unsaved-changes-dialog.component.ts index 1ef532da1c..e178f06827 100644 --- a/lib/core/src/lib/dialogs/unsaved-changes-dialog/unsaved-changes-dialog.component.ts +++ b/lib/core/src/lib/dialogs/unsaved-changes-dialog/unsaved-changes-dialog.component.ts @@ -16,12 +16,19 @@ */ import { Component, ViewEncapsulation } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { MatDialogModule } from '@angular/material/dialog'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatButtonModule } from '@angular/material/button'; +import { MatIconModule } from '@angular/material/icon'; /** * Dialog which informs about unsaved changes. Allows discard them and proceed or close dialog and stop proceeding. */ @Component({ selector: 'adf-unsaved-changes-dialog', + standalone: true, + imports: [CommonModule, MatDialogModule, TranslateModule, MatButtonModule, MatIconModule], encapsulation: ViewEncapsulation.None, templateUrl: './unsaved-changes-dialog.component.html', styleUrls: ['./unsaved-changes-dialog.component.scss'] diff --git a/lib/core/src/lib/dialogs/unsaved-changes-dialog/unsaved-changes-dialog.module.ts b/lib/core/src/lib/dialogs/unsaved-changes-dialog/unsaved-changes-dialog.module.ts index 4688d00df0..36f159f24a 100644 --- a/lib/core/src/lib/dialogs/unsaved-changes-dialog/unsaved-changes-dialog.module.ts +++ b/lib/core/src/lib/dialogs/unsaved-changes-dialog/unsaved-changes-dialog.module.ts @@ -17,21 +17,10 @@ import { NgModule } from '@angular/core'; import { UnsavedChangesDialogComponent } from './unsaved-changes-dialog.component'; -import { MatDialogModule } from '@angular/material/dialog'; -import { TranslateModule } from '@ngx-translate/core'; -import { MatButtonModule } from '@angular/material/button'; -import { MatIconModule } from '@angular/material/icon'; -import { CommonModule } from '@angular/common'; +/** @deprecated import `UnsavedChangesDialogComponent` instead */ @NgModule({ - declarations: [UnsavedChangesDialogComponent], - imports: [ - MatDialogModule, - TranslateModule, - MatButtonModule, - MatIconModule, - CommonModule - ], + imports: [UnsavedChangesDialogComponent], exports: [UnsavedChangesDialogComponent] }) export class UnsavedChangesDialogModule {} diff --git a/lib/core/src/lib/directives/directive.module.ts b/lib/core/src/lib/directives/directive.module.ts index d3e514cfc2..9f1c7a8bdd 100644 --- a/lib/core/src/lib/directives/directive.module.ts +++ b/lib/core/src/lib/directives/directive.module.ts @@ -23,9 +23,18 @@ import { TooltipCardComponent } from './tooltip-card/tooltip-card.component'; import { TooltipCardDirective } from './tooltip-card/tooltip-card.directive'; import { UploadDirective } from './upload.directive'; +export const CORE_DIRECTIVES = [ + HighlightDirective, + LogoutDirective, + UploadDirective, + TooltipCardDirective, + TooltipCardComponent, + InfiniteSelectScrollDirective +]; + +/** @deprecated use `...CORE_DIRECTIVES` or import standalone directives directly */ @NgModule({ - imports: [HighlightDirective, LogoutDirective, UploadDirective, TooltipCardDirective, TooltipCardComponent, InfiniteSelectScrollDirective], - exports: [HighlightDirective, LogoutDirective, UploadDirective, TooltipCardDirective, TooltipCardComponent, InfiniteSelectScrollDirective] + imports: [...CORE_DIRECTIVES], + exports: [...CORE_DIRECTIVES] }) -/** @deprecated This module is deprecated and will be removed in a future release. Please consider importing standalone components and directives directly. */ export class DirectiveModule {} diff --git a/lib/core/src/lib/dynamic-chip-list/dynamic-chip-list.module.ts b/lib/core/src/lib/dynamic-chip-list/dynamic-chip-list.module.ts index e53fe15cb1..5979e9b1b9 100644 --- a/lib/core/src/lib/dynamic-chip-list/dynamic-chip-list.module.ts +++ b/lib/core/src/lib/dynamic-chip-list/dynamic-chip-list.module.ts @@ -18,6 +18,7 @@ import { NgModule } from '@angular/core'; import { DynamicChipListComponent } from './dynamic-chip-list.component'; +/** @deprecated use `DynamicChipListComponent` or import standalone components directly */ @NgModule({ imports: [DynamicChipListComponent], exports: [DynamicChipListComponent] diff --git a/lib/core/src/lib/form/components/widgets/number/number.widget.ts b/lib/core/src/lib/form/components/widgets/number/number.widget.ts index 5ad99ca870..01391f4f24 100644 --- a/lib/core/src/lib/form/components/widgets/number/number.widget.ts +++ b/lib/core/src/lib/form/components/widgets/number/number.widget.ts @@ -45,6 +45,7 @@ import { WidgetComponent } from '../widget.component'; '(select)': 'event($event)' }, imports: [NgIf, TranslateModule, MatFormFieldModule, MatInputModule, FormsModule, ErrorWidgetComponent], + providers: [DecimalNumberPipe], encapsulation: ViewEncapsulation.None }) export class NumberWidgetComponent extends WidgetComponent implements OnInit { diff --git a/lib/core/src/lib/form/public-api.ts b/lib/core/src/lib/form/public-api.ts index c1abd26de9..8dcd1d2373 100644 --- a/lib/core/src/lib/form/public-api.ts +++ b/lib/core/src/lib/form/public-api.ts @@ -21,6 +21,8 @@ export * from './components/inplace-form-input/inplace-form-input.component'; export * from './components/form-custom-button.directive'; export * from './components/form-renderer.component'; export * from './components/widgets'; +export * from './components/middlewares/middleware'; +export * from './components/middlewares/decimal-middleware.service'; export * from './services/form-rendering.service'; export * from './services/form.service'; diff --git a/lib/core/src/lib/header/header.component.ts b/lib/core/src/lib/header/header.component.ts index f149355f59..a25b8a6741 100644 --- a/lib/core/src/lib/header/header.component.ts +++ b/lib/core/src/lib/header/header.component.ts @@ -18,7 +18,7 @@ import { Component, HostBinding, Input, ViewEncapsulation } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ThemePalette } from '@angular/material/core'; -import { ToolbarModule } from '../toolbar'; +import { TOOLBAR_DIRECTIVES } from '../toolbar'; import { NavbarItem } from './navbar/navbar-item.component'; import { NavbarComponent } from './navbar/navbar.component'; @@ -27,7 +27,7 @@ export type HeaderVariant = 'minimal' | 'extended'; @Component({ selector: 'adf-header', standalone: true, - imports: [CommonModule, ToolbarModule, NavbarComponent], + imports: [CommonModule, ...TOOLBAR_DIRECTIVES, NavbarComponent], templateUrl: './header.component.html', styleUrls: ['./header.component.scss'], host: { class: 'adf-header' }, diff --git a/lib/core/src/lib/identity-user-info/identity-user-info.component.spec.ts b/lib/core/src/lib/identity-user-info/identity-user-info.component.spec.ts index d69fafd88e..5ea8a85132 100644 --- a/lib/core/src/lib/identity-user-info/identity-user-info.component.spec.ts +++ b/lib/core/src/lib/identity-user-info/identity-user-info.component.spec.ts @@ -51,7 +51,7 @@ describe('IdentityUserInfoComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [CoreTestingModule, MatMenuModule] + imports: [CoreTestingModule, MatMenuModule, IdentityUserInfoComponent] }); fixture = TestBed.createComponent(IdentityUserInfoComponent); component = fixture.componentInstance; diff --git a/lib/core/src/lib/identity-user-info/identity-user-info.component.stories.ts b/lib/core/src/lib/identity-user-info/identity-user-info.component.stories.ts index 27317c1657..6a599543de 100644 --- a/lib/core/src/lib/identity-user-info/identity-user-info.component.stories.ts +++ b/lib/core/src/lib/identity-user-info/identity-user-info.component.stories.ts @@ -18,7 +18,6 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CoreStoryModule } from '../testing/core.story.module'; import { IdentityUserInfoComponent } from './identity-user-info.component'; -import { IdentityUserInfoModule } from './identity-user-info.module'; import { importProvidersFrom } from '@angular/core'; const fakeIdentityUser = { @@ -33,7 +32,7 @@ export default { title: 'Core/Identity User Info/Identity User Info', decorators: [ moduleMetadata({ - imports: [IdentityUserInfoModule] + imports: [IdentityUserInfoComponent] }), applicationConfig({ providers: [importProvidersFrom(CoreStoryModule)] diff --git a/lib/core/src/lib/identity-user-info/identity-user-info.component.ts b/lib/core/src/lib/identity-user-info/identity-user-info.component.ts index cd2f0a1454..ecb1218dcd 100644 --- a/lib/core/src/lib/identity-user-info/identity-user-info.component.ts +++ b/lib/core/src/lib/identity-user-info/identity-user-info.component.ts @@ -16,18 +16,24 @@ */ import { Component, Input, OnDestroy, ViewChild, ViewEncapsulation } from '@angular/core'; -import { MatMenuTrigger, MenuPositionX, MenuPositionY } from '@angular/material/menu'; +import { MatMenuModule, MatMenuTrigger, MenuPositionX, MenuPositionY } from '@angular/material/menu'; import { IdentityUserModel } from '../auth/models/identity-user.model'; import { Subject } from 'rxjs'; +import { CommonModule } from '@angular/common'; +import { FullNamePipe, InitialUsernamePipe } from '../pipes'; +import { MatButtonModule } from '@angular/material/button'; +import { MatCardModule } from '@angular/material/card'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'adf-identity-user-info', + standalone: true, + imports: [CommonModule, FullNamePipe, MatMenuModule, InitialUsernamePipe, MatButtonModule, MatCardModule, TranslateModule], templateUrl: './identity-user-info.component.html', styleUrls: ['./identity-user-info.component.scss'], encapsulation: ViewEncapsulation.None }) export class IdentityUserInfoComponent implements OnDestroy { - @ViewChild(MatMenuTrigger) trigger: MatMenuTrigger; /** Is the user logged in */ diff --git a/lib/core/src/lib/identity-user-info/identity-user-info.module.ts b/lib/core/src/lib/identity-user-info/identity-user-info.module.ts index 591fabd707..c2f64bade7 100644 --- a/lib/core/src/lib/identity-user-info/identity-user-info.module.ts +++ b/lib/core/src/lib/identity-user-info/identity-user-info.module.ts @@ -16,29 +16,11 @@ */ import { NgModule } from '@angular/core'; -import { CommonModule } from '@angular/common'; import { IdentityUserInfoComponent } from './identity-user-info.component'; -import { MatButtonModule } from '@angular/material/button'; -import { MatCardModule } from '@angular/material/card'; -import { MatMenuModule } from '@angular/material/menu'; -import { MatTabsModule } from '@angular/material/tabs'; -import { TranslateModule } from '@ngx-translate/core'; -import { PipeModule } from '../pipes/pipe.module'; -import { FullNamePipe, InitialUsernamePipe } from '../pipes'; +/** @deprecated import `IdentityUserInfoComponent` directly */ @NgModule({ - declarations: [IdentityUserInfoComponent], - imports: [ - CommonModule, - MatButtonModule, - MatMenuModule, - MatTabsModule, - MatCardModule, - TranslateModule, - PipeModule, - InitialUsernamePipe, - FullNamePipe - ], + imports: [IdentityUserInfoComponent], exports: [IdentityUserInfoComponent] }) export class IdentityUserInfoModule {} diff --git a/lib/core/src/lib/info-drawer/info-drawer-layout.component.ts b/lib/core/src/lib/info-drawer/info-drawer-layout.component.ts index 7f33a179e3..455e35b40e 100644 --- a/lib/core/src/lib/info-drawer/info-drawer-layout.component.ts +++ b/lib/core/src/lib/info-drawer/info-drawer-layout.component.ts @@ -16,9 +16,12 @@ */ import { Component, Directive, Input, ViewEncapsulation } from '@angular/core'; +import { CommonModule } from '@angular/common'; @Component({ selector: 'adf-info-drawer-layout', + standalone: true, + imports: [CommonModule], templateUrl: './info-drawer-layout.component.html', styleUrls: ['./info-drawer-layout.component.scss'], encapsulation: ViewEncapsulation.None, @@ -33,6 +36,20 @@ export class InfoDrawerLayoutComponent { /** * Directive selectors without adf- prefix will be deprecated on 3.0.0 */ -@Directive({ selector: '[adf-info-drawer-title], [info-drawer-title]' }) export class InfoDrawerTitleDirective {} -@Directive({ selector: '[adf-info-drawer-buttons], [info-drawer-buttons]' }) export class InfoDrawerButtonsDirective {} -@Directive({ selector: '[adf-info-drawer-content], [info-drawer-content]' }) export class InfoDrawerContentDirective {} +@Directive({ + selector: '[adf-info-drawer-title], [info-drawer-title]', + standalone: true +}) +export class InfoDrawerTitleDirective {} + +@Directive({ + selector: '[adf-info-drawer-buttons], [info-drawer-buttons]', + standalone: true +}) +export class InfoDrawerButtonsDirective {} + +@Directive({ + selector: '[adf-info-drawer-content], [info-drawer-content]', + standalone: true +}) +export class InfoDrawerContentDirective {} diff --git a/lib/core/src/lib/info-drawer/info-drawer.component.stories.ts b/lib/core/src/lib/info-drawer/info-drawer.component.stories.ts index 98777f3ca9..915ae327b6 100644 --- a/lib/core/src/lib/info-drawer/info-drawer.component.stories.ts +++ b/lib/core/src/lib/info-drawer/info-drawer.component.stories.ts @@ -17,7 +17,7 @@ import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { InfoDrawerComponent } from './info-drawer.component'; -import { InfoDrawerModule } from './info-drawer.module'; +import { INFO_DRAWER_DIRECTIVES } from './info-drawer.module'; import { mockTabText, mockCardText } from './mock/info-drawer.mock'; import { importProvidersFrom } from '@angular/core'; import { CoreStoryModule } from '../../..'; @@ -27,7 +27,7 @@ export default { title: 'Core/Info Drawer/Info Drawer', decorators: [ moduleMetadata({ - imports: [InfoDrawerModule] + imports: [...INFO_DRAWER_DIRECTIVES] }), applicationConfig({ providers: [importProvidersFrom(CoreStoryModule)] @@ -212,8 +212,7 @@ export default { const tabLayoutTemplate: StoryFn = (args) => ({ props: args, - template: - ` + template: `
clear
@@ -235,8 +234,7 @@ const tabLayoutTemplate: StoryFn = (args) => ({ const singleLayoutTemplate: StoryFn = (args) => ({ props: args, - template: - ` + template: `
File info
diff --git a/lib/core/src/lib/info-drawer/info-drawer.component.ts b/lib/core/src/lib/info-drawer/info-drawer.component.ts index 9d8b3b054f..3342924a16 100644 --- a/lib/core/src/lib/info-drawer/info-drawer.component.ts +++ b/lib/core/src/lib/info-drawer/info-drawer.component.ts @@ -15,10 +15,31 @@ * limitations under the License. */ -import { Component, ContentChildren, EventEmitter, HostListener, Input, Output, QueryList, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core'; -import { MatTabChangeEvent } from '@angular/material/tabs'; +import { + Component, + ContentChildren, + EventEmitter, + HostListener, + Input, + Output, + QueryList, + TemplateRef, + ViewChild, + ViewEncapsulation +} from '@angular/core'; +import { MatTabChangeEvent, MatTabsModule } from '@angular/material/tabs'; +import { CommonModule } from '@angular/common'; +import { + InfoDrawerButtonsDirective, + InfoDrawerContentDirective, + InfoDrawerLayoutComponent, + InfoDrawerTitleDirective +} from './info-drawer-layout.component'; +import { TranslateModule } from '@ngx-translate/core'; +import { MatIconModule } from '@angular/material/icon'; @Component({ selector: 'adf-info-drawer-tab', + standalone: true, template: '', encapsulation: ViewEncapsulation.None }) @@ -37,6 +58,18 @@ export class InfoDrawerTabComponent { @Component({ selector: 'adf-info-drawer', + standalone: true, + imports: [ + CommonModule, + InfoDrawerLayoutComponent, + TranslateModule, + MatTabsModule, + MatIconModule, + InfoDrawerButtonsDirective, + InfoDrawerTitleDirective, + InfoDrawerContentDirective, + InfoDrawerTabComponent + ], templateUrl: './info-drawer.component.html', styleUrls: ['./info-drawer.component.scss'], encapsulation: ViewEncapsulation.None, @@ -45,7 +78,7 @@ export class InfoDrawerTabComponent { export class InfoDrawerComponent { /** The title of the info drawer (string or translation key). */ @Input() - title: string|null = null; + title: string | null = null; @Input() icon: string | null = null; diff --git a/lib/core/src/lib/info-drawer/info-drawer.module.ts b/lib/core/src/lib/info-drawer/info-drawer.module.ts index 5ca2bd55ef..a35c8702f7 100644 --- a/lib/core/src/lib/info-drawer/info-drawer.module.ts +++ b/lib/core/src/lib/info-drawer/info-drawer.module.ts @@ -15,41 +15,27 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; -import { InfoDrawerLayoutComponent, InfoDrawerTitleDirective, InfoDrawerButtonsDirective, InfoDrawerContentDirective } from './info-drawer-layout.component'; +import { + InfoDrawerLayoutComponent, + InfoDrawerTitleDirective, + InfoDrawerButtonsDirective, + InfoDrawerContentDirective +} from './info-drawer-layout.component'; import { InfoDrawerComponent, InfoDrawerTabComponent } from './info-drawer.component'; -import { TranslateModule } from '@ngx-translate/core'; -import { MatIconModule } from '@angular/material/icon'; -import { MatTabsModule } from '@angular/material/tabs'; -import { MatCardModule } from '@angular/material/card'; +export const INFO_DRAWER_DIRECTIVES = [ + InfoDrawerLayoutComponent, + InfoDrawerTabComponent, + InfoDrawerComponent, + InfoDrawerTitleDirective, + InfoDrawerButtonsDirective, + InfoDrawerContentDirective +] as const; + +/** @deprecated use `...INFO_DRAWER_DIRECTIVES` or import standalone directives directly */ @NgModule({ - imports: [ - CommonModule, - MatTabsModule, - MatIconModule, - MatCardModule, - TranslateModule - ], - declarations: [ - InfoDrawerLayoutComponent, - InfoDrawerTabComponent, - InfoDrawerComponent, - InfoDrawerTitleDirective, - InfoDrawerButtonsDirective, - InfoDrawerContentDirective - ], - exports: [ - InfoDrawerLayoutComponent, - InfoDrawerTabComponent, - InfoDrawerComponent, - InfoDrawerTitleDirective, - InfoDrawerButtonsDirective, - InfoDrawerContentDirective, - MatTabsModule, - MatCardModule, - MatIconModule - ] + imports: [...INFO_DRAWER_DIRECTIVES], + exports: [...INFO_DRAWER_DIRECTIVES] }) export class InfoDrawerModule {} diff --git a/lib/core/src/lib/language-menu/language-menu.component.spec.ts b/lib/core/src/lib/language-menu/language-menu.component.spec.ts index 02b6d4a548..ec9b8ed6a3 100644 --- a/lib/core/src/lib/language-menu/language-menu.component.spec.ts +++ b/lib/core/src/lib/language-menu/language-menu.component.spec.ts @@ -47,7 +47,7 @@ describe('LanguageMenuComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [CoreTestingModule] + imports: [CoreTestingModule, LanguageMenuComponent] }); fixture = TestBed.createComponent(LanguageMenuComponent); diff --git a/lib/core/src/lib/language-menu/language-menu.component.stories.ts b/lib/core/src/lib/language-menu/language-menu.component.stories.ts index f69fc884d5..f374dc7863 100644 --- a/lib/core/src/lib/language-menu/language-menu.component.stories.ts +++ b/lib/core/src/lib/language-menu/language-menu.component.stories.ts @@ -17,10 +17,8 @@ import { applicationConfig, componentWrapperDecorator, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CoreStoryModule } from '../testing/core.story.module'; - -import { LanguageMenuModule } from './language-menu.module'; +import { LANGUAGE_MENU_DIRECTIVES } from './language-menu.module'; import { LanguageMenuComponent } from './language-menu.component'; - import { LanguageService } from './service/language.service'; import { LanguageServiceMock } from '../mock/language.service.mock'; import { importProvidersFrom } from '@angular/core'; @@ -30,7 +28,7 @@ export default { title: 'Core/Language Menu/Language Menu', decorators: [ moduleMetadata({ - imports: [LanguageMenuModule], + imports: [...LANGUAGE_MENU_DIRECTIVES], providers: [{ provide: LanguageService, useClass: LanguageServiceMock }] }), applicationConfig({ diff --git a/lib/core/src/lib/language-menu/language-menu.component.ts b/lib/core/src/lib/language-menu/language-menu.component.ts index 55dd453c64..1d2724feda 100644 --- a/lib/core/src/lib/language-menu/language-menu.component.ts +++ b/lib/core/src/lib/language-menu/language-menu.component.ts @@ -19,19 +19,20 @@ import { Component, EventEmitter, Output } from '@angular/core'; import { LanguageService } from './service/language.service'; import { Observable } from 'rxjs'; import { LanguageItem } from '../common/services/language-item.interface'; +import { CommonModule } from '@angular/common'; +import { MatMenuModule } from '@angular/material/menu'; @Component({ selector: 'adf-language-menu', + standalone: true, + imports: [CommonModule, MatMenuModule], template: ` - + ` }) export class LanguageMenuComponent { - /** Emitted when the language change */ @Output() changedLanguage: EventEmitter = new EventEmitter(); diff --git a/lib/core/src/lib/language-menu/language-menu.module.ts b/lib/core/src/lib/language-menu/language-menu.module.ts index 084688de5d..85d36ab0ae 100644 --- a/lib/core/src/lib/language-menu/language-menu.module.ts +++ b/lib/core/src/lib/language-menu/language-menu.module.ts @@ -15,35 +15,15 @@ * limitations under the License. */ -import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; -import { TranslateModule } from '@ngx-translate/core'; - -import { MatMenuModule } from '@angular/material/menu'; -import { MatIconModule } from '@angular/material/icon'; -import { MatButtonModule } from '@angular/material/button'; - import { LanguageMenuComponent } from './language-menu.component'; import { LanguagePickerComponent } from './language-picker.component'; +export const LANGUAGE_MENU_DIRECTIVES = [LanguageMenuComponent, LanguagePickerComponent] as const; + +/** @deprecated use `...LANGUAGE_MENU_DIRECTIVES` or import components directly instead. */ @NgModule({ - imports: [ - CommonModule, - MatMenuModule, - MatIconModule, - MatButtonModule, - TranslateModule - ], - declarations: [ - LanguageMenuComponent, - LanguagePickerComponent - ], - exports: [ - LanguageMenuComponent, - LanguagePickerComponent, - MatMenuModule, - MatIconModule, - MatButtonModule - ] + imports: [...LANGUAGE_MENU_DIRECTIVES], + exports: [...LANGUAGE_MENU_DIRECTIVES] }) export class LanguageMenuModule {} diff --git a/lib/core/src/lib/language-menu/language-picker.component.stories.ts b/lib/core/src/lib/language-menu/language-picker.component.stories.ts index 951d241e12..a3def3fd3b 100644 --- a/lib/core/src/lib/language-menu/language-picker.component.stories.ts +++ b/lib/core/src/lib/language-menu/language-picker.component.stories.ts @@ -17,10 +17,8 @@ import { applicationConfig, componentWrapperDecorator, Meta, moduleMetadata, StoryFn } from '@storybook/angular'; import { CoreStoryModule } from '../testing/core.story.module'; - -import { LanguageMenuModule } from './language-menu.module'; +import { LANGUAGE_MENU_DIRECTIVES } from './language-menu.module'; import { LanguagePickerComponent } from './language-picker.component'; - import { LanguageService } from './service/language.service'; import { LanguageServiceMock } from '../mock/language.service.mock'; import { importProvidersFrom } from '@angular/core'; @@ -30,7 +28,7 @@ export default { title: 'Core/Language Menu/Language Picker', decorators: [ moduleMetadata({ - imports: [LanguageMenuModule], + imports: [...LANGUAGE_MENU_DIRECTIVES], providers: [{ provide: LanguageService, useClass: LanguageServiceMock }] }), applicationConfig({ diff --git a/lib/core/src/lib/language-menu/language-picker.component.ts b/lib/core/src/lib/language-menu/language-picker.component.ts index 7467a45100..835cc9fe2d 100644 --- a/lib/core/src/lib/language-menu/language-picker.component.ts +++ b/lib/core/src/lib/language-menu/language-picker.component.ts @@ -17,9 +17,16 @@ import { Component, EventEmitter, Output } from '@angular/core'; import { LanguageItem } from '../common/services/language-item.interface'; +import { CommonModule } from '@angular/common'; +import { MatMenuModule } from '@angular/material/menu'; +import { TranslateModule } from '@ngx-translate/core'; +import { LanguageMenuComponent } from './language-menu.component'; +import { MatIconModule } from '@angular/material/icon'; @Component({ selector: 'adf-picker-button', + standalone: true, + imports: [CommonModule, MatMenuModule, TranslateModule, LanguageMenuComponent, MatIconModule], template: `