inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-12 17:04:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

ACS-7390: Core and Content Services as Standalone components (#10001)

Browse Source
This commit is contained in:
Denys Vuika 2024-08-09 18:14:56 -04:00 committed by GitHub
parent 0277376c79
commit 93f9e80348
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
284 changed files with 2256 additions and 2497 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
demo-shell/src/app/app.module.ts
View File

@ -17,7 +17,6 @@
import { BrowserModule } from '@angular/platform-browser'; import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { NgChartsModule } from 'ng2-charts'; import { NgChartsModule } from 'ng2-charts';
import { HttpClientModule } from '@angular/common/http'; import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule, NoopAnimationsModule } from '@angular/platform-browser/animations'; import { BrowserAnimationsModule, NoopAnimationsModule } from '@angular/platform-browser/animations';
@ -25,62 +24,23 @@ import { TranslateModule } from '@ngx-translate/core';
import { AppConfigService, DebugAppConfigService, CoreModule, AuthModule, provideTranslations } from '@alfresco/adf-core'; import { AppConfigService, DebugAppConfigService, CoreModule, AuthModule, provideTranslations } from '@alfresco/adf-core';
import { ExtensionsModule } from '@alfresco/adf-extensions'; import { ExtensionsModule } from '@alfresco/adf-extensions';
import { AppComponent } from './app.component'; import { AppComponent } from './app.component';
import { MaterialModule } from './material.module';
import { LogoutComponent } from './components/logout/logout.component';
import { AppLayoutComponent } from './components/app-layout/app-layout.component';
import { SearchBarComponent } from './components/search/search-bar.component';
import { SearchResultComponent } from './components/search/search-result.component';
import { FormComponent } from './components/form/form.component';
import { ProcessServiceComponent } from './components/process-service/process-service.component';
import { ShowDiagramComponent } from './components/process-service/show-diagram.component';
import { FormViewerComponent } from './components/process-service/form-viewer.component';
import { FormNodeViewerComponent } from './components/process-service/form-node-viewer.component';
import { AppsViewComponent } from './components/process-service/apps-view.component';
import { FilesComponent } from './components/files/files.component';
import { VersionManagerDialogAdapterComponent } from './components/files/version-manager-dialog-adapter.component';
import { appRoutes } from './app.routes'; import { appRoutes } from './app.routes';
import { TaskAttachmentsComponent } from './components/process-service/task-attachments.component';
import { ProcessAttachmentsComponent } from './components/process-service/process-attachments.component';
import { DemoPermissionComponent } from './components/permissions/demo-permissions.component';
import { MonacoEditorModule } from 'ngx-monaco-editor-v2'; import { MonacoEditorModule } from 'ngx-monaco-editor-v2';
import { ContentModule } from '@alfresco/adf-content-services'; import { ContentModule } from '@alfresco/adf-content-services';
import { InsightsModule } from '@alfresco/adf-insights'; import { InsightsModule } from '@alfresco/adf-insights';
import { ProcessModule } from '@alfresco/adf-process-services'; import { ProcessModule } from '@alfresco/adf-process-services';
import { CloudLayoutComponent } from './components/cloud/cloud-layout.component';
import { AppsCloudDemoComponent } from './components/cloud/apps-cloud-demo.component';
import { TasksCloudDemoComponent } from './components/cloud/tasks-cloud-demo.component';
import { ProcessesCloudDemoComponent } from './components/cloud/processes-cloud-demo.component';
import { TaskDetailsCloudDemoComponent } from './components/cloud/task-details-cloud-demo.component';
import { CloudViewerComponent } from './components/cloud/cloud-viewer.component';
import { ProcessDetailsCloudDemoComponent } from './components/cloud/process-details-cloud-demo.component';
import { StartTaskCloudDemoComponent } from './components/cloud/start-task-cloud-demo.component';
import { StartProcessCloudDemoComponent } from './components/cloud/start-process-cloud-demo.component';
import { CloudFiltersDemoComponent } from './components/cloud/cloud-filters-demo.component';
import { FormCloudDemoComponent } from './components/app-layout/cloud/form-demo/cloud-form-demo.component';
import { environment } from '../environments/environment'; import { environment } from '../environments/environment';
import { AppCloudSharedModule } from './components/cloud/shared/cloud.shared.module';
import { DemoErrorComponent } from './components/error/demo-error.component';
import { ProcessServicesCloudModule } from '@alfresco/adf-process-services-cloud'; import { ProcessServicesCloudModule } from '@alfresco/adf-process-services-cloud';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { ProcessCloudLayoutComponent } from './components/cloud/process-cloud-layout.component';
import { CustomEditorComponent, CustomWidgetComponent } from './components/cloud/custom-form-components/custom-editor.component';
import { SearchFilterChipsComponent } from './components/search/search-filter-chips.component';
import { UserInfoComponent } from './components/app-layout/user-info/user-info.component';
import { FolderDirectiveModule } from './folder-directive';
import { ContentUserInfoModule } from './components/app-layout/user-info/content-user-info';
import { PROCESS_USER_INFO_DIRECTIVES } from './components/app-layout/user-info/process-user-info';
import { CoreAutomationService } from '../testing/automation.service'; import { CoreAutomationService } from '../testing/automation.service';
@NgModule({ @NgModule({
imports: [ imports: [
BrowserModule, BrowserModule,
environment.e2e ? NoopAnimationsModule : BrowserAnimationsModule, environment.e2e ? NoopAnimationsModule : BrowserAnimationsModule,
ReactiveFormsModule,
RouterModule.forRoot(appRoutes, { useHash: true }), RouterModule.forRoot(appRoutes, { useHash: true }),
AuthModule.forRoot({ useHash: true }), AuthModule.forRoot({ useHash: true }),
FormsModule,
HttpClientModule, HttpClientModule,
MaterialModule,
TranslateModule.forRoot(), TranslateModule.forRoot(),
CoreModule.forRoot(), CoreModule.forRoot(),
ContentModule.forRoot(), ContentModule.forRoot(),
@ -89,47 +49,9 @@ import { CoreAutomationService } from '../testing/automation.service';
ProcessServicesCloudModule.forRoot(), ProcessServicesCloudModule.forRoot(),
ExtensionsModule.forRoot(), ExtensionsModule.forRoot(),
NgChartsModule, NgChartsModule,
AppCloudSharedModule, MonacoEditorModule.forRoot()
MonacoEditorModule.forRoot(),
FolderDirectiveModule,
ShowDiagramComponent,
ContentUserInfoModule,
...PROCESS_USER_INFO_DIRECTIVES
],
declarations: [
AppComponent,
LogoutComponent,
AppLayoutComponent,
UserInfoComponent,
SearchBarComponent,
SearchResultComponent,
ProcessServiceComponent,
FormViewerComponent,
FormNodeViewerComponent,
AppsViewComponent,
FilesComponent,
FormComponent,
VersionManagerDialogAdapterComponent,
TaskAttachmentsComponent,
ProcessAttachmentsComponent,
DemoPermissionComponent,
DemoErrorComponent,
CloudLayoutComponent,
AppsCloudDemoComponent,
TasksCloudDemoComponent,
ProcessesCloudDemoComponent,
TaskDetailsCloudDemoComponent,
CloudViewerComponent,
ProcessDetailsCloudDemoComponent,
StartTaskCloudDemoComponent,
StartProcessCloudDemoComponent,
CloudFiltersDemoComponent,
FormCloudDemoComponent,
CustomEditorComponent,
CustomWidgetComponent,
ProcessCloudLayoutComponent,
SearchFilterChipsComponent
], ],
declarations: [AppComponent],
providers: [ providers: [
{ provide: AppConfigService, useClass: DebugAppConfigService }, // not use this service in production { provide: AppConfigService, useClass: DebugAppConfigService }, // not use this service in production
provideTranslations('app', 'resources') provideTranslations('app', 'resources')

71
demo-shell/src/app/app.routes.ts
View File

@ -27,7 +27,7 @@ import { FormNodeViewerComponent } from './components/process-service/form-node-
import { AppsViewComponent } from './components/process-service/apps-view.component'; import { AppsViewComponent } from './components/process-service/apps-view.component';
import { SearchResultComponent } from './components/search/search-result.component'; import { SearchResultComponent } from './components/search/search-result.component';
import { FilesComponent } from './components/files/files.component'; import { FilesComponent } from './components/files/files.component';
import { FormComponent } from './components/form/form.component'; import { AppFormComponent } from './components/form/app-form.component';
import { DemoPermissionComponent } from './components/permissions/demo-permissions.component'; import { DemoPermissionComponent } from './components/permissions/demo-permissions.component';
import { AppComponent } from './app.component'; import { AppComponent } from './app.component';
import { AppsCloudDemoComponent } from './components/cloud/apps-cloud-demo.component'; import { AppsCloudDemoComponent } from './components/cloud/apps-cloud-demo.component';
@ -42,14 +42,20 @@ import { ProcessDetailsCloudDemoComponent } from './components/cloud/process-det
import { FormCloudDemoComponent } from './components/app-layout/cloud/form-demo/cloud-form-demo.component'; import { FormCloudDemoComponent } from './components/app-layout/cloud/form-demo/cloud-form-demo.component';
import { DemoErrorComponent } from './components/error/demo-error.component'; import { DemoErrorComponent } from './components/error/demo-error.component';
import { ProcessCloudLayoutComponent } from './components/cloud/process-cloud-layout.component'; import { ProcessCloudLayoutComponent } from './components/cloud/process-cloud-layout.component';
import { SearchFilterChipsComponent } from './components/search/search-filter-chips.component'; import { AppSearchFilterChipsComponent } from './components/search/search-filter-chips.component';
import { FileViewComponent } from './components/file-view/file-view.component';
import { SettingsComponent } from './components/settings/settings.component';
import { AppLoginComponent } from './components/login/login.component';
import { TaskListDemoComponent } from './components/task-list-demo/task-list-demo.component';
import { ProcessListDemoComponent } from './components/process-list-demo/process-list-demo.component';
import { AppCardViewComponent } from './components/card-view/card-view.component';
export const appRoutes: Routes = [ export const appRoutes: Routes = [
{ path: 'login', loadChildren: () => import('./components/login/login.module').then(m => m.AppLoginModule) }, { path: 'login', component: AppLoginComponent },
{ path: 'logout', component: LogoutComponent }, { path: 'logout', component: LogoutComponent },
{ {
path: 'settings', path: 'settings',
loadChildren: () => import('./components/settings/settings.module').then(m => m.AppSettingsModule) component: SettingsComponent
}, },
{ {
path: 'files/:nodeId/view', path: 'files/:nodeId/view',
@ -57,7 +63,12 @@ export const appRoutes: Routes = [
canActivate: [AuthGuardEcm], canActivate: [AuthGuardEcm],
canActivateChild: [AuthGuardEcm], canActivateChild: [AuthGuardEcm],
outlet: 'overlay', outlet: 'overlay',
loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule) children: [
{
path: '',
component: FileViewComponent
}
]
}, },
{ {
path: 'files/:nodeId/:versionId/view', path: 'files/:nodeId/:versionId/view',
@ -65,14 +76,24 @@ export const appRoutes: Routes = [
canActivate: [AuthGuardEcm], canActivate: [AuthGuardEcm],
canActivateChild: [AuthGuardEcm], canActivateChild: [AuthGuardEcm],
outlet: 'overlay', outlet: 'overlay',
loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule) children: [
{
path: '',
component: FileViewComponent
}
]
}, },
{ {
path: 'preview/blob', path: 'preview/blob',
component: AppComponent, component: AppComponent,
outlet: 'overlay', outlet: 'overlay',
pathMatch: 'full', pathMatch: 'full',
loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule) children: [
{
path: '',
component: FileViewComponent
}
]
}, },
{ {
path: '', path: '',
@ -86,7 +107,12 @@ export const appRoutes: Routes = [
}, },
{ {
path: 'card-view', path: 'card-view',
loadChildren: () => import('./components/card-view/card-view.module').then(m => m.AppCardViewModule) children: [
{
path: '',
component: AppCardViewComponent
}
]
}, },
{ {
path: '', path: '',
@ -146,14 +172,13 @@ export const appRoutes: Routes = [
path: 'process-details/:processInstanceId', path: 'process-details/:processInstanceId',
component: ProcessDetailsCloudDemoComponent component: ProcessDetailsCloudDemoComponent
} }
] ]
} }
] ]
}, },
{ {
path: 'settings-layout', path: 'settings-layout',
loadChildren: () => import('./components/settings/settings.module').then(m => m.AppSettingsModule) component: SettingsComponent
}, },
{ {
path: 'files', path: 'files',
@ -177,7 +202,7 @@ export const appRoutes: Routes = [
}, },
{ {
path: 'search-filter-chips', path: 'search-filter-chips',
component: SearchFilterChipsComponent, component: AppSearchFilterChipsComponent,
canActivate: [AuthGuardEcm] canActivate: [AuthGuardEcm]
}, },
{ {
@ -245,16 +270,34 @@ export const appRoutes: Routes = [
canActivate: [AuthGuardEcm] canActivate: [AuthGuardEcm]
}, },
{ path: 'form-cloud', component: FormCloudDemoComponent }, { path: 'form-cloud', component: FormCloudDemoComponent },
{ path: 'form', component: FormComponent }, { path: 'form', component: AppFormComponent },
{ {
path: 'task-list', path: 'task-list',
canActivate: [AuthGuardBpm], canActivate: [AuthGuardBpm],
loadChildren: () => import('./components/task-list-demo/task-list.module').then(m => m.AppTaskListModule) children: [
{
path: '',
component: TaskListDemoComponent
},
{
path: ':id',
component: TaskListDemoComponent
}
]
}, },
{ {
path: 'process-list', path: 'process-list',
canActivate: [AuthGuardBpm], canActivate: [AuthGuardBpm],
loadChildren: () => import('./components/process-list-demo/process-list.module').then(m => m.AppProcessListModule) children: [
{
path: '',
component: ProcessListDemoComponent
},
{
path: ':id',
component: ProcessListDemoComponent
}
]
}, },
{ {
path: 'error/no-authorization', path: 'error/no-authorization',

8
demo-shell/src/app/components/app-layout/app-layout.component.html
View File

@ -40,7 +40,7 @@
<ng-container *ngFor="let link of links"> <ng-container *ngFor="let link of links">
<ng-container *ngIf="link.children"> <ng-container *ngIf="link.children">
<mat-list-item (click)="trigger.openMenu()" [attr.data-automation-id]="link.title | translate" class="app-sidenav-link"> <mat-list-item (click)="trigger.openMenu()" [attr.data-automation-id]="link.title | translate" class="app-sidenav-link">
<mat-icon matListIcon>{{link.icon}}</mat-icon> <mat-icon matListItemIcon>{{link.icon}}</mat-icon>
<span matLine>{{ link.title | translate }}</span> <span matLine>{{ link.title | translate }}</span>
<mat-icon class="app-sidenav-link__expand-button" [matMenuTriggerData]="{links: link.children}" <mat-icon class="app-sidenav-link__expand-button" [matMenuTriggerData]="{links: link.children}"
rippleTrigger mat-icon-button #trigger="matMenuTrigger" rippleTrigger mat-icon-button #trigger="matMenuTrigger"
@ -52,14 +52,14 @@
<mat-list-item [routerLink]="link.href" <mat-list-item [routerLink]="link.href"
routerLinkActive="app-sidenav-link--active" [routerLinkActiveOptions]="{ exact: true }" routerLinkActive="app-sidenav-link--active" [routerLinkActiveOptions]="{ exact: true }"
[attr.data-automation-id]="link.title | translate" class="app-sidenav-link"> [attr.data-automation-id]="link.title | translate" class="app-sidenav-link">
<mat-icon matListIcon >{{link.icon}}</mat-icon> <mat-icon matListItemIcon >{{link.icon}}</mat-icon>
<span matLine>{{link.title | translate }}</span> <span matLine>{{link.title | translate }}</span>
</mat-list-item> </mat-list-item>
</ng-container> </ng-container>
</ng-container> </ng-container>
<mat-list-item adf-logout [enableRedirect]="enableRedirect" redirectUri="/logout" class="app-sidenav-link" data-automation-id="Logout" > <mat-list-item adf-logout [enableRedirect]="enableRedirect" redirectUri="/logout" class="app-sidenav-link" data-automation-id="Logout" >
<mat-icon matListIcon>exit_to_app</mat-icon> <mat-icon matListItemIcon>exit_to_app</mat-icon>
<span matLine>Logout</span> <span matLine>Logout</span>
</mat-list-item> </mat-list-item>
</mat-nav-list> </mat-nav-list>
@ -84,7 +84,7 @@
[routerLink]="link.href" [routerLink]="link.href"
[routerLinkActiveOptions]="{ exact: true }"> [routerLinkActiveOptions]="{ exact: true }">
<mat-icon matListIcon>{{link.icon}}</mat-icon> <mat-icon matListItemIcon>{{link.icon}}</mat-icon>
{{ link.title | translate }} {{ link.title | translate }}
</button> </button>
</ng-template> </ng-template>

63
demo-shell/src/app/components/app-layout/app-layout.component.ts
View File

@ -16,9 +16,50 @@
*/ */
import { Component, ViewEncapsulation } from '@angular/core'; import { Component, ViewEncapsulation } from '@angular/core';
import { AlfrescoApiService } from '@alfresco/adf-core'; import {
AlfrescoApiService,
AvatarComponent,
HeaderLayoutComponent,
LogoutDirective,
SidenavLayoutComponent,
SidenavLayoutContentDirective,
SidenavLayoutHeaderDirective,
SidenavLayoutNavigationDirective
} from '@alfresco/adf-core';
import { SearchBarComponent } from '../search/search-bar.component';
import { UserInfoComponent } from './user-info/user-info.component';
import { MatMenuModule } from '@angular/material/menu';
import { MatListModule } from '@angular/material/list';
import { TranslateModule } from '@ngx-translate/core';
import { MatIconModule } from '@angular/material/icon';
import { MatLineModule } from '@angular/material/core';
import { CommonModule } from '@angular/common';
import { RouterLink, RouterLinkActive, RouterOutlet } from '@angular/router';
import { FileUploadingDialogComponent } from '@alfresco/adf-content-services';
@Component({ @Component({
standalone: true,
imports: [
CommonModule,
SidenavLayoutComponent,
SidenavLayoutHeaderDirective,
HeaderLayoutComponent,
SearchBarComponent,
UserInfoComponent,
AvatarComponent,
MatMenuModule,
SidenavLayoutNavigationDirective,
MatListModule,
TranslateModule,
MatIconModule,
MatLineModule,
RouterLink,
RouterLinkActive,
LogoutDirective,
SidenavLayoutContentDirective,
RouterOutlet,
FileUploadingDialogComponent
],
templateUrl: './app-layout.component.html', templateUrl: './app-layout.component.html',
styleUrls: ['./app-layout.component.scss'], styleUrls: ['./app-layout.component.scss'],
host: { class: 'app-layout' }, host: { class: 'app-layout' },
@ -31,16 +72,24 @@ export class AppLayoutComponent {
{ href: '/card-view', icon: 'view_headline', title: 'CardView' }, { href: '/card-view', icon: 'view_headline', title: 'CardView' },
{ href: '/task-list', icon: 'assignment', title: 'Task List' }, { href: '/task-list', icon: 'assignment', title: 'Task List' },
{ {
href: '/cloud', icon: 'cloud', title: 'Process Cloud', children: [ href: '/cloud',
icon: 'cloud',
title: 'Process Cloud',
children: [
{ href: '/cloud/', icon: 'cloud', title: 'Home' }, { href: '/cloud/', icon: 'cloud', title: 'Home' },
{ href: '/form-cloud', icon: 'poll', title: 'Form' } { href: '/form-cloud', icon: 'poll', title: 'Form' }
] ]
}, },
{ href: '/activiti', icon: 'device_hub', title: 'Process Services', children: [ {
{ href: '/activiti', icon: 'vpn_key', title: 'App' }, href: '/activiti',
{ href: '/process-list', icon: 'assignment', title: 'Process List' }, icon: 'device_hub',
{ href: '/form', icon: 'poll', title: 'Form' } title: 'Process Services',
]}, children: [
{ href: '/activiti', icon: 'vpn_key', title: 'App' },
{ href: '/process-list', icon: 'assignment', title: 'Process List' },
{ href: '/form', icon: 'poll', title: 'Form' }
]
},
{ href: '/login', icon: 'vpn_key', title: 'Login' }, { href: '/login', icon: 'vpn_key', title: 'Login' },
{ href: '/settings-layout', icon: 'settings', title: 'Settings' } { href: '/settings-layout', icon: 'settings', title: 'Settings' }
]; ];

2
demo-shell/src/app/components/app-layout/cloud/form-demo/cloud-form-demo.component.html
View File

@ -10,7 +10,7 @@
</adf-cloud-form> </adf-cloud-form>
</div> </div>
<div class="app-console" #console> <div class="app-console">
<h3>Error log:</h3> <h3>Error log:</h3>
<p *ngFor="let error of errorFields">Error {{ error.name }} {{error.validationSummary.message | translate}}</p> <p *ngFor="let error of errorFields">Error {{ error.name }} {{error.validationSummary.message | translate}}</p>
</div> </div>

6
demo-shell/src/app/components/app-layout/cloud/form-demo/cloud-form-demo.component.scss
View File

@ -33,9 +33,9 @@
} }
.app-form-editor-buttons { .app-form-editor-buttons {
& > #{$mat-raised-button} { display: flex;
margin-right: 5px; flex-direction: row;
} column-gap: 4px;
} }
.app-upload-config-button { .app-upload-config-button {

11
demo-shell/src/app/components/app-layout/cloud/form-demo/cloud-form-demo.component.ts
View File

@ -17,13 +17,22 @@
import { Component, OnDestroy, OnInit } from '@angular/core'; import { Component, OnDestroy, OnInit } from '@angular/core';
import { FormFieldModel, FormModel, FormRenderingService, NotificationService } from '@alfresco/adf-core'; import { FormFieldModel, FormModel, FormRenderingService, NotificationService } from '@alfresco/adf-core';
import { CloudFormRenderingService, FormCloudService } from '@alfresco/adf-process-services-cloud'; import { CloudFormRenderingService, FormCloudModule, FormCloudService } from '@alfresco/adf-process-services-cloud';
import { Subscription } from 'rxjs'; import { Subscription } from 'rxjs';
import { CustomEditorComponent, CustomWidgetComponent } from '../../../cloud/custom-form-components/custom-editor.component'; import { CustomEditorComponent, CustomWidgetComponent } from '../../../cloud/custom-form-components/custom-editor.component';
import { CoreAutomationService } from '../../../../../testing/automation.service'; 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 { TranslateModule } from '@ngx-translate/core';
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
@Component({ @Component({
templateUrl: './cloud-form-demo.component.html', templateUrl: './cloud-form-demo.component.html',
standalone: true,
imports: [CommonModule, MatTabsModule, FormCloudModule, MonacoEditorModule, TranslateModule, FormsModule, MatButtonModule, MatIconModule],
styleUrls: ['./cloud-form-demo.component.scss'], styleUrls: ['./cloud-form-demo.component.scss'],
providers: [{ provide: FormRenderingService, useClass: CloudFormRenderingService }] providers: [{ provide: FormRenderingService, useClass: CloudFormRenderingService }]
}) })

6
demo-shell/src/app/components/app-layout/user-info/content-user-info/content-user-info.component.html
View File

@ -41,8 +41,7 @@
<mat-menu #menu="matMenu" id="user-profile-lists" [xPosition]="menuPositionX" [yPosition]="menuPositionY" <mat-menu #menu="matMenu" id="user-profile-lists" [xPosition]="menuPositionX" [yPosition]="menuPositionY"
[overlapTrigger]="false" class="adf-userinfo-menu"> [overlapTrigger]="false" class="adf-userinfo-menu">
<mat-card appearance="outlined" *ngIf="mode === userInfoMode.CONTENT" class="adf-userinfo-card adf-content-userinfo-card"> <mat-card appearance="outlined" *ngIf="mode === userInfoMode.CONTENT" class="adf-userinfo-card adf-content-userinfo-card">
<mat-card-header class="adf-userinfo-card-header" <mat-card-header class="adf-userinfo-card-header" [style.background-image]="'url(' + ecmBackgroundImage + ')'">
[style.background-image]="'url(' + ecmBackgroundImage + ')'">
<div *ngIf="ecmUser.avatarId; else initialTemplate" <div *ngIf="ecmUser.avatarId; else initialTemplate"
class="adf-userinfo-profile-container adf-hide-small"> class="adf-userinfo-profile-container adf-hide-small">
<img class="adf-userinfo-profile-picture" id="ecm-user-detail-image" <img class="adf-userinfo-profile-picture" id="ecm-user-detail-image"
@ -61,8 +60,7 @@
<h2 id="ecm-full-name" <h2 id="ecm-full-name"
class="adf-userinfo__detail-title">{{ecmUser | fullName}}</h2> class="adf-userinfo__detail-title">{{ecmUser | fullName}}</h2>
<span id="ecm-email"> {{ecmUser.email}} </span> <span id="ecm-email"> {{ecmUser.email}} </span>
<a href="#/profile"> <a href="#/profile">{{ 'USER_PROFILE.LABELS.MY_PROFILE' | translate }}</a>
{{ 'USER_PROFILE.LABELS.MY_PROFILE' | translate }}</a>
</div> </div>
<div class="adf-userinfo-detail"> <div class="adf-userinfo-detail">
<span class="adf-userinfo__secondary-info" id="ecm-job-title-label"> <span class="adf-userinfo__secondary-info" id="ecm-job-title-label">

282
demo-shell/src/app/components/app-layout/user-info/content-user-info/content-user-info.component.spec.ts
View File

@ -1,282 +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 { IdentityUserModel, InitialUsernamePipe, UserInfoMode } from '@alfresco/adf-core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { MatMenuModule } from '@angular/material/menu';
import { By, DomSanitizer } from '@angular/platform-browser';
import { fakeEcmUser, ContentTestingModule } from '@alfresco/adf-content-services';
import { ContentUserInfoComponent } from './content-user-info.component';
const fakeEcmEditedUser = {
id: 'fake-id',
firstName: null,
lastName: 'fake-last-name',
description: 'i am a fake user for test',
avatarId: 'fake-avatar-id',
email: 'fakeEcm@ecmUser.com',
skypeId: 'fake-skype-id',
googleId: 'fake-googleId-id',
instantMessageId: 'fake-instantMessageId-id',
company: null,
jobTitle: 'test job',
location: 'fake location',
mobile: '000000000',
telephone: '11111111',
statusUpdatedAt: 'fake-date',
userStatus: 'active',
enabled: true,
emailNotificationsEnabled: true
};
export const fakeEcmUserNoImage = {
id: 'fake-id',
firstName: 'fake-first-name',
lastName: 'fake-last-name',
description: 'i am a fake user for test',
avatarId: null,
email: 'fakeEcm@ecmUser.com',
skypeId: 'fake-skype-id',
googleId: 'fake-googleId-id',
instantMessageId: 'fake-instantMessageId-id',
company: null,
jobTitle: null,
location: 'fake location',
mobile: '000000000',
telephone: '11111111',
statusUpdatedAt: 'fake-date',
userStatus: 'active',
enabled: true,
emailNotificationsEnabled: true
};
class FakeSanitizer extends DomSanitizer {
constructor() {
super();
}
sanitize(html) {
return html;
}
bypassSecurityTrustHtml(value: string): any {
return value;
}
bypassSecurityTrustStyle(): any {
return null;
}
bypassSecurityTrustScript(): any {
return null;
}
bypassSecurityTrustUrl(): any {
return null;
}
bypassSecurityTrustResourceUrl(): any {
return null;
}
}
describe('ContentUserInfoComponent', () => {
const profilePictureUrl = 'alfresco-logo.svg';
let component: ContentUserInfoComponent;
let fixture: ComponentFixture<ContentUserInfoComponent>;
let element: HTMLElement;
const identityUserMock = { firstName: 'fake-identity-first-name', lastName: 'fake-identity-last-name', email: 'fakeIdentity@email.com' };
const identityUserWithOutLastNameMock = { firstName: 'fake-identity-first-name', lastName: null, email: 'fakeIdentity@email.com' };
const openUserInfo = () => {
fixture.detectChanges();
const imageButton = element.querySelector<HTMLButtonElement>('#logged-user-img');
imageButton.click();
fixture.detectChanges();
};
const whenFixtureReady = async () => {
fixture.detectChanges();
await fixture.whenStable();
fixture.detectChanges();
};
beforeEach(() => {
TestBed.configureTestingModule({
imports: [ContentTestingModule, MatMenuModule]
});
fixture = TestBed.createComponent(ContentUserInfoComponent);
component = fixture.componentInstance;
element = fixture.nativeElement;
spyOn(window, 'requestAnimationFrame').and.returnValue(1);
});
afterEach(() => {
fixture.destroy();
});
it('should not show any image if the user is not logged in', () => {
expect(element.querySelector('#userinfo_container')).toBeDefined();
expect(element.querySelector('#logged-user-img')).toBeNull();
});
it('should NOT have users immediately after ngOnInit', () => {
expect(element.querySelector('#userinfo_container')).toBeDefined();
expect(element.querySelector('#ecm_username')).toBeNull();
expect(element.querySelector('#user-profile-lists')).toBeNull();
});
describe('when user is logged on ecm', () => {
beforeEach(() => {
component.ecmUser = fakeEcmUser as any;
component.isLoggedIn = true;
});
describe('ui', () => {
it('should show ecm only last name when user first name is null ', async () => {
component.ecmUser = fakeEcmEditedUser as any;
await whenFixtureReady();
openUserInfo();
expect(element.querySelector('#userinfo_container')).toBeDefined();
const ecmUsername = fixture.debugElement.query(By.css('#ecm-username'));
expect(ecmUsername).toBeDefined();
expect(ecmUsername).not.toBeNull();
expect(ecmUsername.nativeElement.textContent).not.toContain('fake-ecm-first-name');
expect(ecmUsername.nativeElement.textContent).not.toContain('null');
});
it('should show the username when showName attribute is true', async () => {
await whenFixtureReady();
expect(component.showName).toBeTruthy();
expect(element.querySelector('#adf-userinfo-ecm-name-display')).not.toBeNull();
});
it('should hide the username when showName attribute is false', async () => {
component.showName = false;
await whenFixtureReady();
expect(element.querySelector('#adf-userinfo-ecm-name-display')).toBeNull();
});
it('should have the defined class to show the name on the right side', async () => {
await whenFixtureReady();
expect(element.querySelector('#userinfo_container').classList).toContain('adf-userinfo-name-right');
});
it('should not have the defined class to show the name on the left side', async () => {
component.namePosition = 'left';
await whenFixtureReady();
expect(element.querySelector('#userinfo_container').classList).not.toContain('adf-userinfo-name-right');
});
describe('and has image', () => {
beforeEach(async () => {
component.ecmUser = fakeEcmUser as any;
component.isLoggedIn = true;
spyOn(component, 'getEcmAvatar').and.returnValue(profilePictureUrl);
await whenFixtureReady();
});
it('should get the ecm current user image', async () => {
openUserInfo();
const loggedImage = fixture.debugElement.query(By.css('#logged-user-img'));
expect(element.querySelector('#userinfo_container')).not.toBeNull();
expect(loggedImage).not.toBeNull();
expect(loggedImage.properties.src).toContain(profilePictureUrl);
});
it('should display the current user image if user has avatarId', () => {
openUserInfo();
const loggedImage = fixture.debugElement.query(By.css('#logged-user-img'));
expect(component.ecmUser).toBeDefined();
expect(component.ecmUser.avatarId).toBe('fake-avatar-id');
expect(element.querySelector('#userinfo_container')).not.toBeNull();
expect(loggedImage).not.toBeNull();
expect(loggedImage.properties.src).toContain(profilePictureUrl);
});
it('should get the ecm user information', async () => {
openUserInfo();
const ecmImage = fixture.debugElement.query(By.css('#ecm-user-detail-image'));
const ecmFullName = fixture.debugElement.query(By.css('#ecm-full-name'));
const ecmJobTitle = fixture.debugElement.query(By.css('#ecm-job-title-label'));
expect(element.querySelector('#userinfo_container')).not.toBeNull();
expect(fixture.debugElement.query(By.css('#ecm-username'))).not.toBeNull();
expect(ecmImage).not.toBeNull();
expect(ecmImage.properties.src).toContain(profilePictureUrl);
expect(ecmFullName.nativeElement.textContent).toContain('fake-ecm-first-name fake-ecm-last-name');
expect(ecmJobTitle.nativeElement.textContent).toContain('USER_PROFILE.LABELS.ECM.JOB_TITLE');
});
});
describe('and has no image', () => {
beforeEach(async () => {
component.ecmUser = fakeEcmUserNoImage as any;
component.isLoggedIn = true;
await whenFixtureReady();
});
it('should show N/A when the job title is null', () => {
const imageButton = element.querySelector<HTMLButtonElement>('[data-automation-id="user-initials-image"]');
imageButton.click();
fixture.detectChanges();
expect(element.querySelector('#userinfo_container')).not.toBeNull();
const ecmJobTitle = fixture.debugElement.query(By.css('#ecm-job-title'));
expect(ecmJobTitle).not.toBeNull();
expect(ecmJobTitle).not.toBeNull();
expect(ecmJobTitle.nativeElement.textContent).toContain('N/A');
});
it('should display the current user Initials if the user dose not have avatarId', () => {
fixture.detectChanges();
const pipe = new InitialUsernamePipe(new FakeSanitizer());
const expected = pipe.transform({
firstName: 'Wilbur',
lastName: 'Adams',
email: 'wilbur@app.com'
});
expect(expected).toBe('<div data-automation-id="user-initials-image" class="">WA</div>');
expect(component.ecmUser).toBeDefined();
expect(component.ecmUser.avatarId).toBeNull();
});
});
});
describe('when identity user is logged in', () => {
beforeEach(() => {
component.ecmUser = fakeEcmUser as any;
component.identityUser = identityUserMock as unknown as IdentityUserModel;
component.isLoggedIn = true;
component.mode = UserInfoMode.CONTENT_SSO;
});
it('should not show initials if the user have avatar and provider is ECM', async () => {
component.identityUser = identityUserWithOutLastNameMock as unknown as IdentityUserModel;
await whenFixtureReady();
expect(element.querySelector('.adf-userinfo-pic')).toBeNull();
expect(element.querySelector('.adf-userinfo-profile-image')).toBeDefined();
expect(element.querySelector('.adf-userinfo-profile-image')).not.toBeNull();
});
});
});
});

10
demo-shell/src/app/components/app-layout/user-info/content-user-info/content-user-info.component.ts
View File

@ -15,14 +15,20 @@
* limitations under the License. * limitations under the License.
*/ */
import { IdentityUserModel, UserInfoMode } from '@alfresco/adf-core'; import { FullNamePipe, IdentityUserModel, InitialUsernamePipe, UserInfoMode } from '@alfresco/adf-core';
import { Component, Input, OnDestroy, ViewChild, ViewEncapsulation } from '@angular/core'; 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 { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { EcmUserModel, PeopleContentService } from '@alfresco/adf-content-services'; import { EcmUserModel, PeopleContentService } from '@alfresco/adf-content-services';
import { CommonModule } from '@angular/common';
import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
import { TranslateModule } from '@ngx-translate/core';
@Component({ @Component({
selector: 'adf-content-user-info', selector: 'adf-content-user-info',
standalone: true,
imports: [CommonModule, FullNamePipe, MatMenuModule, MatButtonModule, InitialUsernamePipe, MatCardModule, TranslateModule],
templateUrl: './content-user-info.component.html', templateUrl: './content-user-info.component.html',
styleUrls: ['./content-user-info.component.scss'], styleUrls: ['./content-user-info.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None

43
demo-shell/src/app/components/app-layout/user-info/content-user-info/content-user-info.module.ts
View File

@ -1,43 +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 { CommonModule } from '@angular/common';
import { ContentUserInfoComponent } from './content-user-info.component';
import { TranslateModule } from '@ngx-translate/core';
import { FullNamePipe, InitialUsernamePipe, PipeModule } from '@alfresco/adf-core';
import { MatButtonModule } from '@angular/material/button';
import { MatMenuModule } from '@angular/material/menu';
import { MatTabsModule } from '@angular/material/tabs';
import { MatCardModule } from '@angular/material/card';
@NgModule({
declarations: [ContentUserInfoComponent],
imports: [
CommonModule,
MatButtonModule,
MatMenuModule,
MatTabsModule,
MatCardModule,
TranslateModule,
PipeModule,
InitialUsernamePipe,
FullNamePipe
],
exports: [ContentUserInfoComponent]
})
export class ContentUserInfoModule {}

2
demo-shell/src/app/components/app-layout/user-info/content-user-info/public-api.ts
View File

@ -16,5 +16,3 @@
*/ */
export * from './content-user-info.component'; export * from './content-user-info.component';
export * from './content-user-info.module';

3
demo-shell/src/app/components/app-layout/user-info/process-user-info/public-api.ts
View File

@ -15,7 +15,4 @@
* limitations under the License. * limitations under the License.
*/ */
import { ProcessUserInfoComponent } from './process-user-info.component';
export * from './process-user-info.component'; export * from './process-user-info.component';
export const PROCESS_USER_INFO_DIRECTIVES = [ProcessUserInfoComponent] as const;

14
demo-shell/src/app/components/app-layout/user-info/user-info.component.ts
View File

@ -17,14 +17,26 @@
import { EcmUserModel, PeopleContentService } from '@alfresco/adf-content-services'; import { EcmUserModel, PeopleContentService } from '@alfresco/adf-content-services';
import { PeopleProcessService } from '@alfresco/adf-process-services'; import { PeopleProcessService } from '@alfresco/adf-process-services';
import { AuthenticationService, BasicAlfrescoAuthService, IdentityUserModel, IdentityUserService, UserInfoMode } from '@alfresco/adf-core'; import {
AuthenticationService,
BasicAlfrescoAuthService,
IdentityUserInfoComponent,
IdentityUserModel,
IdentityUserService,
UserInfoMode
} from '@alfresco/adf-core';
import { Component, OnInit, Input } from '@angular/core'; import { Component, OnInit, Input } from '@angular/core';
import { MenuPositionX, MenuPositionY } from '@angular/material/menu'; import { MenuPositionX, MenuPositionY } from '@angular/material/menu';
import { Observable, of } from 'rxjs'; import { Observable, of } from 'rxjs';
import { CommonModule } from '@angular/common';
import { UserRepresentation } from '@alfresco/js-api'; import { UserRepresentation } from '@alfresco/js-api';
import { ContentUserInfoComponent } from './content-user-info';
import { ProcessUserInfoComponent } from './process-user-info';
@Component({ @Component({
selector: 'app-shell-user-info', selector: 'app-shell-user-info',
standalone: true,
imports: [CommonModule, ContentUserInfoComponent, IdentityUserInfoComponent, ProcessUserInfoComponent],
templateUrl: './user-info.component.html' templateUrl: './user-info.component.html'
}) })
export class UserInfoComponent implements OnInit { export class UserInfoComponent implements OnInit {

10
demo-shell/src/app/components/card-view/card-view.component.ts
View File

@ -29,16 +29,22 @@ import {
CardViewMapItemModel, CardViewMapItemModel,
UpdateNotification, UpdateNotification,
DecimalNumberPipe, DecimalNumberPipe,
CardViewArrayItemModel CardViewArrayItemModel,
CardViewComponent
} from '@alfresco/adf-core'; } from '@alfresco/adf-core';
import { of, Subject } from 'rxjs'; import { of, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { CommonModule } from '@angular/common';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatButtonModule } from '@angular/material/button';
@Component({ @Component({
standalone: true,
imports: [CommonModule, MatSlideToggleModule, MatButtonModule, CardViewComponent],
templateUrl: './card-view.component.html', templateUrl: './card-view.component.html',
styleUrls: ['./card-view.component.scss'] styleUrls: ['./card-view.component.scss']
}) })
export class CardViewComponent implements OnInit, OnDestroy { export class AppCardViewComponent implements OnInit, OnDestroy {
isEditable = true; isEditable = true;
properties: any; properties: any;
logs: string[]; logs: string[];

39
demo-shell/src/app/components/card-view/card-view.module.ts
View File

@ -1,39 +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 { CardViewComponent } from './card-view.component';
import { Routes, RouterModule } from '@angular/router';
import { CommonModule } from '@angular/common';
import { CoreModule } from '@alfresco/adf-core';
const routes: Routes = [
{
path: '',
component: CardViewComponent
}
];
@NgModule({
imports: [
CommonModule,
CoreModule,
RouterModule.forChild(routes)
],
declarations: [CardViewComponent]
})
export class AppCardViewModule {}

10
demo-shell/src/app/components/cloud/apps-cloud-demo.component.ts
View File

@ -18,18 +18,18 @@
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { CloudLayoutService } from './services/cloud-layout.service'; import { CloudLayoutService } from './services/cloud-layout.service';
import { AppListCloudModule } from '@alfresco/adf-process-services-cloud';
@Component({ @Component({
standalone: true,
imports: [AppListCloudModule],
templateUrl: './apps-cloud-demo.component.html' templateUrl: './apps-cloud-demo.component.html'
}) })
export class AppsCloudDemoComponent { export class AppsCloudDemoComponent {
constructor(private router: Router, private cloudLayoutService: CloudLayoutService) {}
constructor(private router: Router, private cloudLayoutService: CloudLayoutService) {
}
onAppClick(app) { onAppClick(app) {
this.cloudLayoutService.setCurrentTaskFilterParam({key: 'my-tasks'}); this.cloudLayoutService.setCurrentTaskFilterParam({ key: 'my-tasks' });
this.router.navigate([`/cloud/${app.name}`]); this.router.navigate([`/cloud/${app.name}`]);
} }
} }

15
demo-shell/src/app/components/cloud/cloud-filters-demo.component.ts
View File

@ -20,15 +20,18 @@ import { Observable } from 'rxjs';
import { CloudLayoutService } from './services/cloud-layout.service'; import { CloudLayoutService } from './services/cloud-layout.service';
import { Router, ActivatedRoute } from '@angular/router'; import { Router, ActivatedRoute } from '@angular/router';
import { CloudProcessFiltersService } from './services/cloud-process-filters.service'; import { CloudProcessFiltersService } from './services/cloud-process-filters.service';
import { ProcessFilterCloudModel } from '@alfresco/adf-process-services-cloud'; import { ProcessFilterCloudModel, ProcessFiltersCloudModule, TaskFiltersCloudModule } from '@alfresco/adf-process-services-cloud';
import { CommonModule } from '@angular/common';
import { MatExpansionModule } from '@angular/material/expansion';
@Component({ @Component({
selector: 'app-cloud-filters-demo', selector: 'app-cloud-filters-demo',
standalone: true,
imports: [CommonModule, MatExpansionModule, TaskFiltersCloudModule, ProcessFiltersCloudModule],
templateUrl: './cloud-filters-demo.component.html', templateUrl: './cloud-filters-demo.component.html',
styleUrls: ['./cloud-filters-demo.component.scss'], styleUrls: ['./cloud-filters-demo.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })
export class CloudFiltersDemoComponent implements OnInit { export class CloudFiltersDemoComponent implements OnInit {
@Input() @Input()
appName: string; appName: string;
@ -67,17 +70,17 @@ export class CloudFiltersDemoComponent implements OnInit {
onTaskFilterSelected(filter) { onTaskFilterSelected(filter) {
if (filter) { if (filter) {
this.router.navigate([`/cloud/${this.appName}/tasks/`], {queryParams: filter}); this.router.navigate([`/cloud/${this.appName}/tasks/`], { queryParams: filter });
} }
} }
onProcessFilterSelected(filter: ProcessFilterCloudModel) { onProcessFilterSelected(filter: ProcessFilterCloudModel) {
if (filter) { if (filter) {
const {appName} = this; const { appName } = this;
const {id} = filter; const { id } = filter;
const queryParams = this.cloudProcessFiltersService.writeQueryParams(filter, appName, id); const queryParams = this.cloudProcessFiltersService.writeQueryParams(filter, appName, id);
this.router.navigate([`/cloud/${appName}/processes/`], {queryParams}); this.router.navigate([`/cloud/${appName}/processes/`], { queryParams });
} }
} }

32
demo-shell/src/app/components/cloud/cloud-layout.component.ts
View File

@ -16,11 +16,41 @@
*/ */
import { Component, OnInit, ViewEncapsulation } from '@angular/core'; import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router'; import { Router, ActivatedRoute, RouterOutlet } from '@angular/router';
import { CloudLayoutService } from './services/cloud-layout.service'; import { CloudLayoutService } from './services/cloud-layout.service';
import { CommonModule } from '@angular/common';
import { MatTabsModule } from '@angular/material/tabs';
import {
SidebarActionMenuComponent,
SidenavLayoutComponent,
SidenavLayoutContentDirective,
SidenavLayoutHeaderDirective,
SidenavLayoutNavigationDirective
} from '@alfresco/adf-core';
import { TranslateModule } from '@ngx-translate/core';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { CloudFiltersDemoComponent } from './cloud-filters-demo.component';
import { CloudSettingsComponent } from './shared/cloud-settings.component';
@Component({ @Component({
selector: 'app-cloud-layout', selector: 'app-cloud-layout',
standalone: true,
imports: [
CommonModule,
MatTabsModule,
SidenavLayoutComponent,
TranslateModule,
SidenavLayoutHeaderDirective,
SidenavLayoutNavigationDirective,
SidebarActionMenuComponent,
MatIconModule,
MatMenuModule,
SidenavLayoutContentDirective,
RouterOutlet,
CloudFiltersDemoComponent,
CloudSettingsComponent
],
templateUrl: './cloud-layout.component.html', templateUrl: './cloud-layout.component.html',
styleUrls: ['./cloud-layout.component.scss'], styleUrls: ['./cloud-layout.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None

3
demo-shell/src/app/components/cloud/cloud-viewer.component.html
View File

@ -1,3 +1,2 @@
<adf-alfresco-viewer <adf-alfresco-viewer [nodeId]="nodeId">
[nodeId]="nodeId">
</adf-alfresco-viewer> </adf-alfresco-viewer>

7
demo-shell/src/app/components/cloud/cloud-viewer.component.ts
View File

@ -17,17 +17,18 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Params } from '@angular/router'; import { ActivatedRoute, Params } from '@angular/router';
import { AlfrescoViewerComponent } from '@alfresco/adf-content-services';
@Component({ @Component({
selector: 'app-cloud-viewer', selector: 'app-cloud-viewer',
standalone: true,
imports: [AlfrescoViewerComponent],
templateUrl: './cloud-viewer.component.html' templateUrl: './cloud-viewer.component.html'
}) })
export class CloudViewerComponent implements OnInit { export class CloudViewerComponent implements OnInit {
nodeId: string; nodeId: string;
constructor(private route: ActivatedRoute) { constructor(private route: ActivatedRoute) {}
}
ngOnInit() { ngOnInit() {
this.route.params.subscribe((params: Params) => { this.route.params.subscribe((params: Params) => {

45
demo-shell/src/app/components/cloud/custom-form-components/custom-editor.component.ts
View File

@ -16,16 +16,18 @@
*/ */
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { FormService, WidgetComponent } from '@alfresco/adf-core'; import { ErrorWidgetComponent, FormService, WidgetComponent } from '@alfresco/adf-core';
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 { FormsModule } from '@angular/forms';
/* eslint-disable @angular-eslint/component-selector */ /* eslint-disable @angular-eslint/component-selector */
@Component({ @Component({
selector: 'custom-editor-widget', selector: 'custom-editor-widget',
template: ` standalone: true,
<div style="color: green"> template: ` <div style="color: green">ADF version of custom form widget</div> `
ADF version of custom form widget
</div>
`
}) })
export class CustomEditorComponent extends WidgetComponent { export class CustomEditorComponent extends WidgetComponent {
constructor() { constructor() {
@ -35,32 +37,35 @@ export class CustomEditorComponent extends WidgetComponent {
@Component({ @Component({
selector: 'app-sample-widget', selector: 'app-sample-widget',
standalone: true,
imports: [CommonModule, MatFormFieldModule, MatInputModule, TranslateModule, FormsModule, ErrorWidgetComponent],
template: ` template: `
<div style="color: red"> <div style="color: red">
<p *ngIf="field.readOnly || readOnly"> <p *ngIf="field.readOnly || readOnly">
<label class="adf-label" [attr.for]="field.id">{{field.name | translate }}<span *ngIf="isRequired()">*</span></label> <label class="adf-label" [attr.for]="field.id">{{ field.name | translate }}<span *ngIf="isRequired()">*</span></label>
<span>{{field.value}}</span> <span>{{ field.value }}</span>
</p> </p>
<mat-form-field *ngIf="!(field.readOnly || readOnly)"> <mat-form-field *ngIf="!(field.readOnly || readOnly)">
<label class="adf-label" [attr.for]="field.id">{{field.name | translate }}<span *ngIf="isRequired()">*</span></label> <label class="adf-label" [attr.for]="field.id">{{ field.name | translate }}<span *ngIf="isRequired()">*</span></label>
<input matInput <input
class="adf-input" matInput
type="text" class="adf-input"
[id]="field.id" type="text"
[required]="isRequired()" [id]="field.id"
[value]="field.value" [required]="isRequired()"
[(ngModel)]="field.value" [value]="field.value"
(ngModelChange)="onFieldChanged(field)"> [(ngModel)]="field.value"
<mat-hint>{{field.placeholder}}</mat-hint> (ngModelChange)="onFieldChanged(field)"
/>
<mat-hint>{{ field.placeholder }}</mat-hint>
</mat-form-field> </mat-form-field>
<error-widget [error]="field.validationSummary"></error-widget> <error-widget [error]="field.validationSummary"></error-widget>
<error-widget *ngIf="isInvalidFieldRequired()" required="{{ 'FORM.FIELD.REQUIRED' | translate }}"></error-widget> <error-widget *ngIf="isInvalidFieldRequired()" required="{{ 'FORM.FIELD.REQUIRED' | translate }}"></error-widget>
</div> </div>
` `
}) })
export class CustomWidgetComponent extends WidgetComponent implements OnInit { export class CustomWidgetComponent extends WidgetComponent implements OnInit {
constructor(public formService: FormService) { constructor(public formService: FormService) {
super(formService); super(formService);
} }

8
demo-shell/src/app/components/cloud/process-cloud-layout.component.ts
View File

@ -19,15 +19,15 @@ import { Component } from '@angular/core';
import { FormRenderingService } from '@alfresco/adf-core'; import { FormRenderingService } from '@alfresco/adf-core';
import { CloudFormRenderingService } from '@alfresco/adf-process-services-cloud'; import { CloudFormRenderingService } from '@alfresco/adf-process-services-cloud';
import { CustomEditorComponent, CustomWidgetComponent } from './custom-form-components/custom-editor.component'; import { CustomEditorComponent, CustomWidgetComponent } from './custom-form-components/custom-editor.component';
import { RouterOutlet } from '@angular/router';
@Component({ @Component({
template: `<router-outlet></router-outlet>`, template: `<router-outlet></router-outlet>`,
providers: [ standalone: true,
{ provide: FormRenderingService, useClass: CloudFormRenderingService } imports: [RouterOutlet],
] providers: [{ provide: FormRenderingService, useClass: CloudFormRenderingService }]
}) })
export class ProcessCloudLayoutComponent { export class ProcessCloudLayoutComponent {
constructor(private formRenderingService: FormRenderingService) { constructor(private formRenderingService: FormRenderingService) {
this.formRenderingService.register({ this.formRenderingService.register({
'custom-editor': () => CustomEditorComponent, 'custom-editor': () => CustomEditorComponent,

6
demo-shell/src/app/components/cloud/process-details-cloud-demo.component.ts
View File

@ -17,15 +17,19 @@
import { Component, ViewEncapsulation } from '@angular/core'; import { Component, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router'; import { ActivatedRoute, Router } from '@angular/router';
import { MatIconModule } from '@angular/material/icon';
import { MatButtonModule } from '@angular/material/button';
import { ProcessHeaderCloudModule, TaskListCloudModule } from '@alfresco/adf-process-services-cloud';
@Component({ @Component({
selector: 'app-process-details-cloud-demo', selector: 'app-process-details-cloud-demo',
standalone: true,
imports: [MatIconModule, MatButtonModule, TaskListCloudModule, ProcessHeaderCloudModule],
templateUrl: './process-details-cloud-demo.component.html', templateUrl: './process-details-cloud-demo.component.html',
styleUrls: ['./process-details-cloud-demo.component.scss'], styleUrls: ['./process-details-cloud-demo.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })
export class ProcessDetailsCloudDemoComponent { export class ProcessDetailsCloudDemoComponent {
processInstanceId: string; processInstanceId: string;
appName: string; appName: string;

42
demo-shell/src/app/components/cloud/processes-cloud-demo.component.ts
View File

@ -21,18 +21,23 @@ import {
PROCESS_FILTER_ACTION_SAVE, PROCESS_FILTER_ACTION_SAVE,
PROCESS_FILTER_ACTION_SAVE_AS, PROCESS_FILTER_ACTION_SAVE_AS,
ProcessFilterAction, ProcessFilterAction,
ProcessFilterCloudModel ProcessFilterCloudModel,
ProcessFiltersCloudModule,
ProcessListCloudModule
} from '@alfresco/adf-process-services-cloud'; } from '@alfresco/adf-process-services-cloud';
import { ActivatedRoute, Router } from '@angular/router'; import { ActivatedRoute, Router } from '@angular/router';
import { DataCellEvent, UserPreferencesService } from '@alfresco/adf-core'; import { DataCellEvent, PaginationComponent, UserPreferencesService } from '@alfresco/adf-core';
import { CloudLayoutService, CloudServiceSettings } from './services/cloud-layout.service'; import { CloudLayoutService, CloudServiceSettings } from './services/cloud-layout.service';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { Pagination } from '@alfresco/js-api'; import { Pagination } from '@alfresco/js-api';
import { CloudProcessFiltersService } from './services/cloud-process-filters.service'; import { CloudProcessFiltersService } from './services/cloud-process-filters.service';
import { CommonModule } from '@angular/common';
@Component({ @Component({
selector: 'app-processes-cloud-demo', selector: 'app-processes-cloud-demo',
standalone: true,
imports: [CommonModule, ProcessFiltersCloudModule, ProcessListCloudModule, PaginationComponent],
templateUrl: './processes-cloud-demo.component.html', templateUrl: './processes-cloud-demo.component.html',
styleUrls: ['./processes-cloud-demo.component.scss'], styleUrls: ['./processes-cloud-demo.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
@ -50,8 +55,8 @@ export class ProcessesCloudDemoComponent implements OnInit, OnDestroy {
actionMenu: boolean; actionMenu: boolean;
contextMenu: boolean; contextMenu: boolean;
actions: any[] = []; actions: any[] = [];
selectedAction: { id: number; name: string; actionType: string}; selectedAction: { id: number; name: string; actionType: string };
selectedContextAction: { id: number; name: string; actionType: string}; selectedContextAction: { id: number; name: string; actionType: string };
filterProperties: string[]; filterProperties: string[];
filterSortProperties: string[]; filterSortProperties: string[];
@ -69,8 +74,8 @@ export class ProcessesCloudDemoComponent implements OnInit, OnDestroy {
private router: Router, private router: Router,
private cloudLayoutService: CloudLayoutService, private cloudLayoutService: CloudLayoutService,
private cloudProcessFiltersService: CloudProcessFiltersService, private cloudProcessFiltersService: CloudProcessFiltersService,
private userPreference: UserPreferencesService) { private userPreference: UserPreferencesService
} ) {}
ngOnInit() { ngOnInit() {
this.filterProperties = this.cloudProcessFiltersService.filterProperties; this.filterProperties = this.cloudProcessFiltersService.filterProperties;
@ -87,9 +92,7 @@ export class ProcessesCloudDemoComponent implements OnInit, OnDestroy {
this.loadFilter(model); this.loadFilter(model);
}); });
this.cloudLayoutService.settings$ this.cloudLayoutService.settings$.pipe(takeUntil(this.onDestroy$)).subscribe((settings) => this.setCurrentSettings(settings));
.pipe(takeUntil(this.onDestroy$))
.subscribe(settings => this.setCurrentSettings(settings));
this.performContextActions(); this.performContextActions();
} }
@ -129,7 +132,7 @@ export class ProcessesCloudDemoComponent implements OnInit, OnDestroy {
...this.cloudProcessFiltersService.writeQueryParams(filter, this.appName, filter.id), ...this.cloudProcessFiltersService.writeQueryParams(filter, this.appName, filter.id),
filterId: filter.id filterId: filter.id
}; };
this.router.navigate([`/cloud/${this.appName}/processes/`], {queryParams}); this.router.navigate([`/cloud/${this.appName}/processes/`], { queryParams });
} }
onProcessFilterAction(filterAction: ProcessFilterAction) { onProcessFilterAction(filterAction: ProcessFilterAction) {
@ -155,33 +158,30 @@ export class ProcessesCloudDemoComponent implements OnInit, OnDestroy {
onShowRowContextMenu(event: DataCellEvent) { onShowRowContextMenu(event: DataCellEvent) {
event.value.actions = this.actions.map((action) => ({ event.value.actions = this.actions.map((action) => ({
data: event.value.row['obj'], data: event.value.row['obj'],
model: action, model: action,
subject: this.performAction$ subject: this.performAction$
})); }));
} }
onExecuteRowAction(row: any) { onExecuteRowAction(row: any) {
const value = row.value.row['obj'].entry; const value = row.value.row['obj'].entry;
const action = row.value.action; const action = row.value.action;
this.selectedAction = {id: value.id, name: value.name, actionType: action.title}; this.selectedAction = { id: value.id, name: value.name, actionType: action.title };
} }
performContextActions() { performContextActions() {
this.performAction$ this.performAction$.pipe(takeUntil(this.onDestroy$)).subscribe((action: any) => {
.pipe(takeUntil(this.onDestroy$))
.subscribe((action: any) => {
if (action) { if (action) {
this.onExecuteContextAction(action); this.onExecuteContextAction(action);
} }
}); });
} }
onExecuteContextAction(contextAction: any) { onExecuteContextAction(contextAction: any) {
const value = contextAction.data.entry; const value = contextAction.data.entry;
const action = contextAction.model; const action = contextAction.model;
this.selectedContextAction = {id: value.id, name: value.name, actionType: action.title}; this.selectedContextAction = { id: value.id, name: value.name, actionType: action.title };
} }
private loadFilter(model: ProcessFilterCloudModel) { private loadFilter(model: ProcessFilterCloudModel) {

34
demo-shell/src/app/components/cloud/shared/cloud-settings.component.ts
View File

@ -19,10 +19,33 @@ import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { ActionMenuModel, CloudLayoutService } from '../services/cloud-layout.service'; import { ActionMenuModel, CloudLayoutService } from '../services/cloud-layout.service';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { UntypedFormControl, UntypedFormGroup } from '@angular/forms'; import { FormsModule, ReactiveFormsModule, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatSelectModule } from '@angular/material/select';
import { MatInputModule } from '@angular/material/input';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatButtonModule } from '@angular/material/button';
import { MatChipsModule } from '@angular/material/chips';
import { MatIconModule } from '@angular/material/icon';
@Component({ @Component({
selector: 'app-cloud-settings', selector: 'app-cloud-settings',
standalone: true,
imports: [
CommonModule,
MatSlideToggleModule,
MatFormFieldModule,
MatSelectModule,
FormsModule,
MatInputModule,
ReactiveFormsModule,
MatCheckboxModule,
MatButtonModule,
MatChipsModule,
MatIconModule
],
templateUrl: './cloud-settings.component.html', templateUrl: './cloud-settings.component.html',
styleUrls: ['./cloud-settings.component.scss'], styleUrls: ['./cloud-settings.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
@ -51,15 +74,12 @@ export class CloudSettingsComponent implements OnInit, OnDestroy {
icon: new UntypedFormControl(''), icon: new UntypedFormControl(''),
visible: new UntypedFormControl(true), visible: new UntypedFormControl(true),
disabled: new UntypedFormControl(false) disabled: new UntypedFormControl(false)
}); });
constructor(private cloudLayoutService: CloudLayoutService) { } constructor(private cloudLayoutService: CloudLayoutService) {}
ngOnInit() { ngOnInit() {
this.cloudLayoutService this.cloudLayoutService.settings$.pipe(takeUntil(this.onDestroy$)).subscribe((settings) => this.setCurrentSettings(settings));
.settings$
.pipe(takeUntil(this.onDestroy$))
.subscribe(settings => this.setCurrentSettings(settings));
} }
ngOnDestroy() { ngOnDestroy() {

40
demo-shell/src/app/components/cloud/shared/cloud.shared.module.ts
View File

@ -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 { CommonModule } from '@angular/common';
import { CloudSettingsComponent } from './cloud-settings.component';
import { MatDialogModule } from '@angular/material/dialog';
import { MatInputModule } from '@angular/material/input';
import { MatSelectModule } from '@angular/material/select';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { CoreModule } from '@alfresco/adf-core';
@NgModule({
imports: [
CommonModule,
CoreModule,
MatDialogModule,
MatInputModule,
MatSelectModule,
MatSlideToggleModule
],
declarations: [ CloudSettingsComponent ],
exports: [ CommonModule, CloudSettingsComponent]
})
export class AppCloudSharedModule {}

24
demo-shell/src/app/components/cloud/start-process-cloud-demo.component.ts
View File

@ -20,28 +20,28 @@ import { ActivatedRoute, Router } from '@angular/router';
import { NotificationService, AppConfigService, FormRenderingService } from '@alfresco/adf-core'; import { NotificationService, AppConfigService, FormRenderingService } from '@alfresco/adf-core';
import { CloudLayoutService } from './services/cloud-layout.service'; import { CloudLayoutService } from './services/cloud-layout.service';
import { PreviewService } from '../../services/preview.service'; import { PreviewService } from '../../services/preview.service';
import { CloudFormRenderingService } from '@alfresco/adf-process-services-cloud'; import { CloudFormRenderingService, StartProcessCloudModule } from '@alfresco/adf-process-services-cloud';
@Component({ @Component({
standalone: true,
imports: [StartProcessCloudModule],
templateUrl: './start-process-cloud-demo.component.html', templateUrl: './start-process-cloud-demo.component.html',
providers: [ providers: [{ provide: FormRenderingService, useClass: CloudFormRenderingService }]
{ provide: FormRenderingService, useClass: CloudFormRenderingService }
]
}) })
export class StartProcessCloudDemoComponent implements OnInit { export class StartProcessCloudDemoComponent implements OnInit {
appName; appName;
processName: string; processName: string;
formValues: any; formValues: any;
variables: any; variables: any;
constructor(private appConfig: AppConfigService, constructor(
private cloudLayoutService: CloudLayoutService, private appConfig: AppConfigService,
private route: ActivatedRoute, private cloudLayoutService: CloudLayoutService,
private previewService: PreviewService, private route: ActivatedRoute,
private notificationService: NotificationService, private previewService: PreviewService,
private router: Router) { private notificationService: NotificationService,
} private router: Router
) {}
ngOnInit() { ngOnInit() {
this.route.parent.params.subscribe((params) => { this.route.parent.params.subscribe((params) => {

8
demo-shell/src/app/components/cloud/start-task-cloud-demo.component.ts
View File

@ -19,20 +19,22 @@ import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router'; import { ActivatedRoute, Router } from '@angular/router';
import { NotificationService } from '@alfresco/adf-core'; import { NotificationService } from '@alfresco/adf-core';
import { CloudLayoutService } from './services/cloud-layout.service'; import { CloudLayoutService } from './services/cloud-layout.service';
import { StartTaskCloudModule } from '@alfresco/adf-process-services-cloud';
@Component({ @Component({
standalone: true,
imports: [StartTaskCloudModule],
templateUrl: './start-task-cloud-demo.component.html' templateUrl: './start-task-cloud-demo.component.html'
}) })
export class StartTaskCloudDemoComponent implements OnInit { export class StartTaskCloudDemoComponent implements OnInit {
appName; appName;
constructor( constructor(
private cloudLayoutService: CloudLayoutService, private cloudLayoutService: CloudLayoutService,
private route: ActivatedRoute, private route: ActivatedRoute,
private notificationService: NotificationService, private notificationService: NotificationService,
private router: Router) { private router: Router
} ) {}
ngOnInit() { ngOnInit() {
this.route.parent.params.subscribe((params) => { this.route.parent.params.subscribe((params) => {

8
demo-shell/src/app/components/cloud/task-details-cloud-demo.component.ts
View File

@ -18,17 +18,18 @@
import { Component, ViewChild, ViewEncapsulation } from '@angular/core'; import { Component, ViewChild, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router'; import { ActivatedRoute, Router } from '@angular/router';
import { NotificationService } from '@alfresco/adf-core'; import { NotificationService } from '@alfresco/adf-core';
import { TaskHeaderCloudComponent } from '@alfresco/adf-process-services-cloud'; import { TaskFormModule, TaskHeaderCloudComponent, TaskHeaderCloudModule } from '@alfresco/adf-process-services-cloud';
import { PreviewService } from '../../services/preview.service'; import { PreviewService } from '../../services/preview.service';
@Component({ @Component({
selector: 'app-task-details-cloud-demo', selector: 'app-task-details-cloud-demo',
standalone: true,
imports: [TaskFormModule, TaskHeaderCloudModule],
templateUrl: './task-details-cloud-demo.component.html', templateUrl: './task-details-cloud-demo.component.html',
styleUrls: ['./task-details-cloud-demo.component.scss'], styleUrls: ['./task-details-cloud-demo.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })
export class TaskDetailsCloudDemoComponent { export class TaskDetailsCloudDemoComponent {
@ViewChild('taskHeader', { static: true }) @ViewChild('taskHeader', { static: true })
taskHeader: TaskHeaderCloudComponent; taskHeader: TaskHeaderCloudComponent;
@ -40,14 +41,13 @@ export class TaskDetailsCloudDemoComponent {
private router: Router, private router: Router,
private notificationService: NotificationService, private notificationService: NotificationService,
private previewService: PreviewService private previewService: PreviewService
) { ) {
this.route.params.subscribe((params) => { this.route.params.subscribe((params) => {
this.taskId = params.taskId; this.taskId = params.taskId;
}); });
this.route.parent.params.subscribe((params) => { this.route.parent.params.subscribe((params) => {
this.appName = params.appName; this.appName = params.appName;
}); });
} }
isTaskValid(): boolean { isTaskValid(): boolean {

41
demo-shell/src/app/components/cloud/tasks-cloud-demo.component.ts
View File

@ -18,14 +18,17 @@
import { Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { Component, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { import {
TaskFilterCloudModel, TaskFilterCloudModel,
TaskFiltersCloudModule,
TaskListCloudComponent, TaskListCloudComponent,
TaskListCloudModule,
TaskListCloudSortingModel TaskListCloudSortingModel
} from '@alfresco/adf-process-services-cloud'; } from '@alfresco/adf-process-services-cloud';
import { AppConfigService, DataCellEvent, UserPreferencesService } from '@alfresco/adf-core'; import { AppConfigService, DataCellEvent, PaginationComponent, UserPreferencesService } from '@alfresco/adf-core';
import { ActivatedRoute, Router } from '@angular/router'; import { ActivatedRoute, Router } from '@angular/router';
import { CloudLayoutService } from './services/cloud-layout.service'; import { CloudLayoutService } from './services/cloud-layout.service';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { CommonModule } from '@angular/common';
const ACTION_SAVE_AS = 'saveAs'; const ACTION_SAVE_AS = 'saveAs';
const ACTION_DELETE = 'delete'; const ACTION_DELETE = 'delete';
@ -33,6 +36,8 @@ const TASK_FILTER_PROPERTY_KEYS = 'adf-edit-task-filter';
@Component({ @Component({
selector: 'app-tasks-cloud-demo', selector: 'app-tasks-cloud-demo',
standalone: true,
imports: [CommonModule, TaskFiltersCloudModule, TaskListCloudModule, PaginationComponent],
templateUrl: './tasks-cloud-demo.component.html', templateUrl: './tasks-cloud-demo.component.html',
styleUrls: ['./tasks-cloud-demo.component.scss'], styleUrls: ['./tasks-cloud-demo.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
@ -49,7 +54,7 @@ export class TasksCloudDemoComponent implements OnInit, OnDestroy {
sortArray: TaskListCloudSortingModel[]; sortArray: TaskListCloudSortingModel[];
editedFilter: TaskFilterCloudModel; editedFilter: TaskFilterCloudModel;
taskFilterProperties: any = { filterProperties: [], sortProperties: [], actions: [] }; taskFilterProperties: any = { filterProperties: [], sortProperties: [], actions: [] };
filterId; filterId;
multiselect: boolean; multiselect: boolean;
@ -57,8 +62,8 @@ export class TasksCloudDemoComponent implements OnInit, OnDestroy {
actionMenu: boolean; actionMenu: boolean;
contextMenu: boolean; contextMenu: boolean;
actions: any[] = []; actions: any[] = [];
selectedAction: { id: number; name: string; actionType: string}; selectedAction: { id: number; name: string; actionType: string };
selectedContextAction: { id: number; name: string; actionType: string}; selectedContextAction: { id: number; name: string; actionType: string };
testingMode: boolean; testingMode: boolean;
selectionMode: string; selectionMode: string;
taskDetailsRedirection: boolean; taskDetailsRedirection: boolean;
@ -71,8 +76,8 @@ export class TasksCloudDemoComponent implements OnInit, OnDestroy {
private route: ActivatedRoute, private route: ActivatedRoute,
private router: Router, private router: Router,
private userPreference: UserPreferencesService, private userPreference: UserPreferencesService,
private appConfig: AppConfigService) { private appConfig: AppConfigService
) {
const properties = this.appConfig.get<Array<any>>(TASK_FILTER_PROPERTY_KEYS); const properties = this.appConfig.get<Array<any>>(TASK_FILTER_PROPERTY_KEYS);
if (properties) { if (properties) {
this.taskFilterProperties = properties; this.taskFilterProperties = properties;
@ -91,9 +96,7 @@ export class TasksCloudDemoComponent implements OnInit, OnDestroy {
this.filterId = params.id; this.filterId = params.id;
}); });
this.cloudLayoutService.settings$ this.cloudLayoutService.settings$.pipe(takeUntil(this.onDestroy$)).subscribe((settings) => this.setCurrentSettings(settings));
.pipe(takeUntil(this.onDestroy$))
.subscribe(settings => this.setCurrentSettings(settings));
this.performContextActions(); this.performContextActions();
} }
@ -139,7 +142,6 @@ export class TasksCloudDemoComponent implements OnInit, OnDestroy {
} }
onTaskFilterAction(filterAction: any) { onTaskFilterAction(filterAction: any) {
if (filterAction.actionType === ACTION_DELETE) { if (filterAction.actionType === ACTION_DELETE) {
this.cloudLayoutService.setCurrentTaskFilterParam({ index: 0 }); this.cloudLayoutService.setCurrentTaskFilterParam({ index: 0 });
} else { } else {
@ -157,32 +159,29 @@ export class TasksCloudDemoComponent implements OnInit, OnDestroy {
onShowRowContextMenu(event: DataCellEvent) { onShowRowContextMenu(event: DataCellEvent) {
event.value.actions = this.actions.map((action) => ({ event.value.actions = this.actions.map((action) => ({
data: event.value.row['obj'], data: event.value.row['obj'],
model: action, model: action,
subject: this.performAction$ subject: this.performAction$
})); }));
} }
onExecuteRowAction(row: any) { onExecuteRowAction(row: any) {
const value = row.value.row['obj'].entry; const value = row.value.row['obj'].entry;
const action = row.value.action; const action = row.value.action;
this.selectedAction = {id: value.id, name: value.name, actionType: action.title}; this.selectedAction = { id: value.id, name: value.name, actionType: action.title };
} }
performContextActions() { performContextActions() {
this.performAction$ this.performAction$.pipe(takeUntil(this.onDestroy$)).subscribe((action: any) => {
.pipe(takeUntil(this.onDestroy$))
.subscribe((action: any) => {
if (action) { if (action) {
this.onExecuteContextAction(action); this.onExecuteContextAction(action);
} }
}); });
} }
onExecuteContextAction(contextAction: any) { onExecuteContextAction(contextAction: any) {
const value = contextAction.data.entry; const value = contextAction.data.entry;
const action = contextAction.model; const action = contextAction.model;
this.selectedContextAction = {id: value.id, name: value.name, actionType: action.title}; this.selectedContextAction = { id: value.id, name: value.name, actionType: action.title };
} }
} }

9
demo-shell/src/app/components/error/demo-error.component.ts
View File

@ -17,17 +17,19 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Params, Router } from '@angular/router'; import { ActivatedRoute, Params, Router } from '@angular/router';
import { ErrorContentComponent } from '@alfresco/adf-core';
import { MatButtonModule } from '@angular/material/button';
@Component({ @Component({
selector: 'app-demo-error', selector: 'app-demo-error',
standalone: true,
imports: [ErrorContentComponent, MatButtonModule],
templateUrl: './demo-error.component.html' templateUrl: './demo-error.component.html'
}) })
export class DemoErrorComponent implements OnInit { export class DemoErrorComponent implements OnInit {
errorCode: string = ''; errorCode: string = '';
constructor(private route: ActivatedRoute, private router: Router) { constructor(private route: ActivatedRoute, private router: Router) {}
}
ngOnInit() { ngOnInit() {
if (this.route) { if (this.route) {
@ -42,5 +44,4 @@ export class DemoErrorComponent implements OnInit {
onReturnButton() { onReturnButton() {
this.router.navigate(['/']); this.router.navigate(['/']);
} }
} }

30
demo-shell/src/app/components/file-view/file-view.component.ts
View File

@ -17,18 +17,44 @@
import { Component, OnInit, ViewEncapsulation } from '@angular/core'; import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute, PRIMARY_OUTLET, Router } from '@angular/router'; import { ActivatedRoute, PRIMARY_OUTLET, Router } from '@angular/router';
import { NotificationService } from '@alfresco/adf-core'; import { InfoDrawerComponent, InfoDrawerTabComponent, NotificationService, ViewerComponent } from '@alfresco/adf-core';
import { import {
AlfrescoViewerComponent,
AllowableOperationsEnum, AllowableOperationsEnum,
ContentMetadataComponent,
ContentService, ContentService,
FileUploadErrorEvent, FileUploadErrorEvent,
NodeCommentsComponent,
NodesApiService, NodesApiService,
PermissionsEnum PermissionsEnum,
VersionManagerComponent
} from '@alfresco/adf-content-services'; } from '@alfresco/adf-content-services';
import { PreviewService } from '../../services/preview.service'; import { PreviewService } from '../../services/preview.service';
import { CommonModule } from '@angular/common';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatButtonModule } from '@angular/material/button';
import { MatInputModule } from '@angular/material/input';
import { FormsModule } from '@angular/forms';
@Component({ @Component({
selector: 'app-file-view', selector: 'app-file-view',
standalone: true,
imports: [
CommonModule,
AlfrescoViewerComponent,
ViewerComponent,
NodeCommentsComponent,
ContentMetadataComponent,
MatSlideToggleModule,
MatFormFieldModule,
MatButtonModule,
MatInputModule,
FormsModule,
VersionManagerComponent,
InfoDrawerTabComponent,
InfoDrawerComponent
],
templateUrl: './file-view.component.html', templateUrl: './file-view.component.html',
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })

49
demo-shell/src/app/components/file-view/file-view.module.ts
View File

@ -1,49 +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 { CommonModule } from '@angular/common';
import { Routes, RouterModule } from '@angular/router';
import { CoreModule, InfoDrawerModule } from '@alfresco/adf-core';
import { ContentModule, ContentDirectiveModule, VersionManagerModule, ContentMetadataModule } from '@alfresco/adf-content-services';
import { FileViewComponent } from './file-view.component';
const routes: Routes = [
{
path: '',
component: FileViewComponent
}
];
@NgModule({
imports: [
CommonModule,
RouterModule.forChild(routes),
CoreModule,
ContentModule,
InfoDrawerModule,
ContentModule,
ContentDirectiveModule,
ContentMetadataModule,
VersionManagerModule
],
declarations: [FileViewComponent],
exports: [FileViewComponent]
})
export class FileViewModule {
}

84
demo-shell/src/app/components/files/files.component.ts
View File

@ -31,7 +31,23 @@ import {
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { ActivatedRoute, Params, Router } from '@angular/router'; import { ActivatedRoute, Params, Router } from '@angular/router';
import { NodeEntry, NodePaging, Pagination, Node, SearchEntry } from '@alfresco/js-api'; import { NodeEntry, NodePaging, Pagination, Node, SearchEntry } from '@alfresco/js-api';
import { NotificationService, UserPreferencesService, PaginationComponent, ShowHeaderMode, FormRenderingService } from '@alfresco/adf-core'; import {
NotificationService,
UserPreferencesService,
PaginationComponent,
ShowHeaderMode,
FormRenderingService,
ToolbarTitleComponent,
ToolbarComponent,
ToolbarDividerComponent,
DataColumnComponent,
HighlightPipe,
DataColumnListComponent,
CustomEmptyContentTemplateDirective,
InfoDrawerTabComponent,
InfoDrawerComponent,
InfoDrawerLayoutComponent
} from '@alfresco/adf-core';
import { import {
ContentService, ContentService,
FolderCreatedEvent, FolderCreatedEvent,
@ -42,18 +58,82 @@ import {
FilterSearch, FilterSearch,
DialogAspectListService, DialogAspectListService,
FileUploadEvent, FileUploadEvent,
NodesApiService NodesApiService,
UploadDragAreaComponent,
CheckAllowableOperationDirective,
BreadcrumbComponent,
DropdownBreadcrumbComponent,
NodeDownloadDirective,
NodeDeleteDirective,
NodeLockDirective,
ContentActionListComponent,
ContentActionComponent,
ContentMetadataComponent,
VersionManagerComponent,
UploadButtonComponent
} from '@alfresco/adf-content-services'; } from '@alfresco/adf-content-services';
import { ProcessFormRenderingService } from '@alfresco/adf-process-services'; import { ProcessFormRenderingService } from '@alfresco/adf-process-services';
import { VersionManagerDialogAdapterComponent } from './version-manager-dialog-adapter.component'; import { VersionManagerDialogAdapterComponent } from './version-manager-dialog-adapter.component';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { PreviewService } from '../../services/preview.service'; import { PreviewService } from '../../services/preview.service';
import { takeUntil, debounceTime, scan } from 'rxjs/operators'; import { takeUntil, debounceTime, scan } from 'rxjs/operators';
import { CommonModule } from '@angular/common';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { FolderCreateDirective } from '../../folder-directive';
import { MatMenuModule } from '@angular/material/menu';
import { TranslateModule } from '@ngx-translate/core';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { FormsModule } from '@angular/forms';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatSelectModule } from '@angular/material/select';
const DEFAULT_FOLDER_TO_SHOW = '-my-'; const DEFAULT_FOLDER_TO_SHOW = '-my-';
@Component({ @Component({
selector: 'app-files-component', selector: 'app-files-component',
standalone: true,
imports: [
CommonModule,
UploadDragAreaComponent,
MatButtonModule,
MatIconModule,
CheckAllowableOperationDirective,
ToolbarTitleComponent,
ToolbarComponent,
BreadcrumbComponent,
DropdownBreadcrumbComponent,
DocumentListComponent,
FolderCreateDirective,
NodeDownloadDirective,
NodeDeleteDirective,
ToolbarDividerComponent,
MatMenuModule,
TranslateModule,
DataColumnComponent,
NodeLockDirective,
ContentActionListComponent,
ContentActionComponent,
PaginationComponent,
ContentMetadataComponent,
VersionManagerComponent,
MatSlideToggleModule,
FormsModule,
MatFormFieldModule,
MatInputModule,
UploadButtonComponent,
MatCheckboxModule,
MatSelectModule,
HighlightPipe,
DataColumnListComponent,
CustomEmptyContentTemplateDirective,
VersionManagerDialogAdapterComponent,
InfoDrawerTabComponent,
InfoDrawerComponent,
InfoDrawerLayoutComponent
],
templateUrl: './files.component.html', templateUrl: './files.component.html',
styleUrls: ['./files.component.scss'], styleUrls: ['./files.component.scss'],
encapsulation: ViewEncapsulation.None, encapsulation: ViewEncapsulation.None,

10
demo-shell/src/app/components/files/version-manager-dialog-adapter.component.ts
View File

@ -16,14 +16,20 @@
*/ */
import { Component, Inject, ViewEncapsulation } from '@angular/core'; import { Component, Inject, ViewEncapsulation } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
import { Node } from '@alfresco/js-api'; import { Node } from '@alfresco/js-api';
import { PreviewService } from '../../services/preview.service'; import { PreviewService } from '../../services/preview.service';
import { NotificationService } from '@alfresco/adf-core'; import { NotificationService } from '@alfresco/adf-core';
import { FileUploadErrorEvent } from '@alfresco/adf-content-services'; import { FileUploadErrorEvent, VersionListComponent, VersionManagerComponent } from '@alfresco/adf-content-services';
import { CommonModule } from '@angular/common';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
@Component({ @Component({
templateUrl: './version-manager-dialog-adapter.component.html', templateUrl: './version-manager-dialog-adapter.component.html',
standalone: true,
imports: [CommonModule, MatDialogModule, MatSlideToggleModule, FormsModule, VersionManagerComponent, VersionListComponent, MatButtonModule],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })
export class VersionManagerDialogAdapterComponent { export class VersionManagerDialogAdapterComponent {

2
demo-shell/src/app/components/form/form.component.html → demo-shell/src/app/components/form/app-form.component.html
View File

@ -1,4 +1,4 @@
<div class="main-content"> <div class="app-main-content">
<mat-tab-group [animationDuration]="'0'"> <mat-tab-group [animationDuration]="'0'">
<mat-tab label="Form"> <mat-tab label="Form">

7
demo-shell/src/app/components/form/form.component.scss → demo-shell/src/app/components/form/app-form.component.scss
View File

@ -2,10 +2,6 @@
padding: 10px; padding: 10px;
} }
.app-main-content {
padding: 0 15px;
}
.app-card-view { .app-card-view {
width: 30%; width: 30%;
display: inline-block; display: inline-block;
@ -31,7 +27,8 @@
} }
} }
.main-content { .app-main-content {
padding: 0 15px;
.adf-form-config-editor { .adf-form-config-editor {
height: 500px; height: 500px;

17
demo-shell/src/app/components/form/form.component.ts → demo-shell/src/app/components/form/app-form.component.ts
View File

@ -17,23 +17,32 @@
import { Component, inject, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core'; import { Component, inject, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { FormModel, FormFieldModel, FormService, FormOutcomeEvent, NotificationService, FormRenderingService } from '@alfresco/adf-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 { InMemoryFormService } from '../../services/in-memory-form.service';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { CoreAutomationService } from '../../../testing/automation.service'; 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({ @Component({
selector: 'app-form', selector: 'app-form',
templateUrl: './form.component.html', standalone: true,
styleUrls: ['./form.component.scss'], imports: [CommonModule, MatTabsModule, FormComponent, MonacoEditorModule, MatButtonModule, FormsModule, TranslateModule, MatIconModule],
templateUrl: './app-form.component.html',
styleUrls: ['./app-form.component.scss'],
providers: [ providers: [
{ provide: FormService, useClass: InMemoryFormService }, { provide: FormService, useClass: InMemoryFormService },
{ provide: FormRenderingService, useClass: ProcessFormRenderingService } { provide: FormRenderingService, useClass: ProcessFormRenderingService }
], ],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })
export class FormComponent implements OnInit, OnDestroy { export class AppFormComponent implements OnInit, OnDestroy {
private formService = inject(FormService); private formService = inject(FormService);
private notificationService = inject(NotificationService); private notificationService = inject(NotificationService);
private automationService = inject(CoreAutomationService); private automationService = inject(CoreAutomationService);

8
demo-shell/src/app/components/login/login.component.ts
View File

@ -16,12 +16,16 @@
*/ */
import { Component, ViewEncapsulation } from '@angular/core'; 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({ @Component({
selector: 'app-login', selector: 'app-login',
standalone: true,
imports: [MatIconModule, LoginComponent, AppConfigPipe, RouterLink],
templateUrl: './login.component.html', templateUrl: './login.component.html',
styleUrls: ['./login.component.scss'], styleUrls: ['./login.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })
export class LoginComponent { export class AppLoginComponent {}
}

41
demo-shell/src/app/components/login/login.module.ts
View File

@ -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 {}

3
demo-shell/src/app/components/logout/logout.component.ts
View File

@ -16,9 +16,12 @@
*/ */
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
@Component({ @Component({
selector: 'app-logout', selector: 'app-logout',
standalone: true,
imports: [MatButtonModule],
templateUrl: './logout.component.html', templateUrl: './logout.component.html',
styleUrls: ['./logout.component.scss'] styleUrls: ['./logout.component.scss']
}) })

7
demo-shell/src/app/components/permissions/demo-permissions.component.ts
View File

@ -17,18 +17,19 @@
import { Component, OnInit, Optional } from '@angular/core'; import { Component, OnInit, Optional } from '@angular/core';
import { ActivatedRoute, Params } from '@angular/router'; import { ActivatedRoute, Params } from '@angular/router';
import { PermissionListComponent } from '@alfresco/adf-content-services';
@Component({ @Component({
selector: 'app-permissions', selector: 'app-permissions',
standalone: true,
imports: [PermissionListComponent],
templateUrl: './demo-permissions.component.html', templateUrl: './demo-permissions.component.html',
styleUrls: ['./demo-permissions.component.scss'] styleUrls: ['./demo-permissions.component.scss']
}) })
export class DemoPermissionComponent implements OnInit { export class DemoPermissionComponent implements OnInit {
nodeId: string; nodeId: string;
constructor(@Optional() private route: ActivatedRoute) { constructor(@Optional() private route: ActivatedRoute) {}
}
ngOnInit() { ngOnInit() {
if (this.route) { if (this.route) {

22
demo-shell/src/app/components/process-list-demo/process-list-demo.component.ts
View File

@ -16,15 +16,35 @@
*/ */
import { Component, OnInit, OnDestroy } from '@angular/core'; 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 { ActivatedRoute, Params } from '@angular/router';
import { debounceTime, takeUntil } from 'rxjs/operators'; import { debounceTime, takeUntil } from 'rxjs/operators';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { ProcessInstanceQueryRepresentationSort, ProcessInstanceQueryRepresentationState } from '@alfresco/js-api'; 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; const DEFAULT_SIZE = 20;
@Component({ @Component({
standalone: true,
imports: [
CommonModule,
ReactiveFormsModule,
MatFormFieldModule,
MatInputModule,
MatSelectModule,
MatButtonModule,
ProcessInstanceListComponent,
DataColumnListComponent,
DataColumnComponent,
PaginationComponent
],
templateUrl: './process-list-demo.component.html', templateUrl: './process-list-demo.component.html',
styleUrls: [`./process-list-demo.component.scss`] styleUrls: [`./process-list-demo.component.scss`]
}) })

40
demo-shell/src/app/components/process-list-demo/process-list.module.ts
View File

@ -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 {}

3
demo-shell/src/app/components/process-service/apps-view.component.ts
View File

@ -18,9 +18,12 @@
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { AppDefinitionRepresentation } from '@alfresco/js-api'; import { AppDefinitionRepresentation } from '@alfresco/js-api';
import { AppsListComponent } from '@alfresco/adf-process-services';
@Component({ @Component({
selector: 'app-process-list-view', selector: 'app-process-list-view',
standalone: true,
imports: [AppsListComponent],
templateUrl: './apps-view.component.html' templateUrl: './apps-view.component.html'
}) })
export class AppsViewComponent { export class AppsViewComponent {

9
demo-shell/src/app/components/process-service/form-node-viewer.component.ts
View File

@ -17,23 +17,24 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router'; import { ActivatedRoute } from '@angular/router';
import { FormComponent } from '@alfresco/adf-process-services';
import { CommonModule } from '@angular/common';
@Component({ @Component({
selector: 'app-form-node-viewer', selector: 'app-form-node-viewer',
standalone: true,
imports: [CommonModule, FormComponent],
templateUrl: './form-node-viewer.component.html', templateUrl: './form-node-viewer.component.html',
styleUrls: ['./form-node-viewer.component.css'] styleUrls: ['./form-node-viewer.component.css']
}) })
export class FormNodeViewerComponent implements OnInit { export class FormNodeViewerComponent implements OnInit {
nodeId: string; nodeId: string;
constructor(private route: ActivatedRoute) { constructor(private route: ActivatedRoute) {}
}
ngOnInit() { ngOnInit() {
this.route.params.subscribe((params) => { this.route.params.subscribe((params) => {
this.nodeId = params['id']; this.nodeId = params['id'];
}); });
} }
} }

8
demo-shell/src/app/components/process-service/form-viewer.component.ts
View File

@ -17,18 +17,20 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Params } from '@angular/router'; import { ActivatedRoute, Params } from '@angular/router';
import { CommonModule } from '@angular/common';
import { FormComponent } from '@alfresco/adf-process-services';
@Component({ @Component({
selector: 'app-form-viewer', selector: 'app-form-viewer',
standalone: true,
imports: [CommonModule, FormComponent],
templateUrl: './form-viewer.component.html', templateUrl: './form-viewer.component.html',
styleUrls: ['./form-viewer.component.css'] styleUrls: ['./form-viewer.component.css']
}) })
export class FormViewerComponent implements OnInit { export class FormViewerComponent implements OnInit {
taskId: string; taskId: string;
constructor(private route: ActivatedRoute) { constructor(private route: ActivatedRoute) {}
}
ngOnInit() { ngOnInit() {
this.route.params.subscribe((params: Params) => { this.route.params.subscribe((params: Params) => {

21
demo-shell/src/app/components/process-service/process-attachments.component.ts
View File

@ -16,15 +16,32 @@
*/ */
import { Component, inject, Input, OnChanges, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { Component, inject, Input, OnChanges, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { ProcessAttachmentListComponent, ProcessService, ProcessUploadService } from '@alfresco/adf-process-services'; import {
import { UploadService } from '@alfresco/adf-content-services'; CreateProcessAttachmentComponent,
ProcessAttachmentListComponent,
ProcessService,
ProcessUploadService
} from '@alfresco/adf-process-services';
import { UploadDragAreaComponent, UploadService } from '@alfresco/adf-content-services';
import { PreviewService } from '../../services/preview.service'; import { PreviewService } from '../../services/preview.service';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { ProcessInstanceRepresentation } from '@alfresco/js-api'; import { ProcessInstanceRepresentation } from '@alfresco/js-api';
import { CommonModule } from '@angular/common';
import { EmptyListComponent } from '@alfresco/adf-core';
import { TranslateModule } from '@ngx-translate/core';
@Component({ @Component({
selector: 'app-process-attachments', selector: 'app-process-attachments',
standalone: true,
imports: [
CommonModule,
UploadDragAreaComponent,
ProcessAttachmentListComponent,
EmptyListComponent,
TranslateModule,
CreateProcessAttachmentComponent
],
templateUrl: './process-attachments.component.html', templateUrl: './process-attachments.component.html',
styleUrls: ['./process-attachments.component.css'], styleUrls: ['./process-attachments.component.css'],
providers: [{ provide: UploadService, useClass: ProcessUploadService }], providers: [{ provide: UploadService, useClass: ProcessUploadService }],

4
demo-shell/src/app/components/process-service/process-service.component.html
View File

@ -20,9 +20,7 @@
(success)="onSuccessTaskFilterList()" #activitiFilter> (success)="onSuccessTaskFilterList()" #activitiFilter>
</adf-task-filters> </adf-task-filters>
</div> </div>
<div <div *ngIf="taskFilter && !isStartTaskMode()" class="app-grid-item app-tasks-list">
class="app-grid-item app-tasks-list"
*ngIf="taskFilter && !isStartTaskMode()">
<adf-tasklist <adf-tasklist
[appId]="taskFilter?.appId" [appId]="taskFilter?.appId"
[presetColumn]="presetColumn" [presetColumn]="presetColumn"

40
demo-shell/src/app/components/process-service/process-service.component.ts
View File

@ -28,7 +28,8 @@ import {
UserPreferenceValues, UserPreferenceValues,
AlfrescoApiService, AlfrescoApiService,
UserPreferencesService, UserPreferencesService,
NotificationService NotificationService,
SidebarActionMenuComponent
} from '@alfresco/adf-core'; } from '@alfresco/adf-core';
import { import {
ProcessFiltersComponent, ProcessFiltersComponent,
@ -40,12 +41,23 @@ import {
ProcessFormRenderingService, ProcessFormRenderingService,
APP_LIST_LAYOUT_LIST, APP_LIST_LAYOUT_LIST,
ValidateDynamicTableRowEvent, ValidateDynamicTableRowEvent,
DynamicTableRow DynamicTableRow,
TaskDetailsComponent,
TaskAuditDirective,
StartTaskComponent,
ProcessInstanceDetailsComponent,
ProcessAuditDirective
} from '@alfresco/adf-process-services'; } from '@alfresco/adf-process-services';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { PreviewService } from '../../services/preview.service'; import { PreviewService } from '../../services/preview.service';
import { Location } from '@angular/common'; import { CommonModule, Location } from '@angular/common';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { MatTabsModule } from '@angular/material/tabs';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { TaskAttachmentsComponent } from './task-attachments.component';
import { MatButtonModule } from '@angular/material/button';
import { ProcessAttachmentsComponent } from './process-attachments.component';
const currentProcessIdNew = '__NEW__'; const currentProcessIdNew = '__NEW__';
const currentTaskIdNew = '__NEW__'; const currentTaskIdNew = '__NEW__';
@ -56,6 +68,28 @@ const REPORT_ROUTE = 2;
@Component({ @Component({
selector: 'app-process-service', selector: 'app-process-service',
standalone: true,
imports: [
CommonModule,
MatTabsModule,
SidebarActionMenuComponent,
MatIconModule,
MatMenuModule,
TaskFiltersComponent,
TaskListComponent,
PaginationComponent,
TaskDetailsComponent,
TaskAuditDirective,
TaskAttachmentsComponent,
StartTaskComponent,
ProcessFiltersComponent,
ProcessInstanceListComponent,
ProcessInstanceDetailsComponent,
ProcessAuditDirective,
MatButtonModule,
ProcessAttachmentsComponent,
StartProcessInstanceComponent
],
templateUrl: './process-service.component.html', templateUrl: './process-service.component.html',
styleUrls: ['./process-service.component.scss'], styleUrls: ['./process-service.component.scss'],
encapsulation: ViewEncapsulation.None, encapsulation: ViewEncapsulation.None,

9
demo-shell/src/app/components/process-service/task-attachments.component.ts
View File

@ -16,15 +16,20 @@
*/ */
import { Component, inject, Input, OnChanges, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; import { Component, inject, Input, OnChanges, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { TaskAttachmentListComponent, TaskListService, TaskUploadService } from '@alfresco/adf-process-services'; import { AttachmentComponent, TaskAttachmentListComponent, TaskListService, TaskUploadService } from '@alfresco/adf-process-services';
import { UploadService } from '@alfresco/adf-content-services'; import { UploadDragAreaComponent, UploadService } from '@alfresco/adf-content-services';
import { PreviewService } from '../../services/preview.service'; import { PreviewService } from '../../services/preview.service';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { TaskRepresentation } from '@alfresco/js-api'; import { TaskRepresentation } from '@alfresco/js-api';
import { CommonModule } from '@angular/common';
import { EmptyListComponent } from '@alfresco/adf-core';
import { TranslateModule } from '@ngx-translate/core';
@Component({ @Component({
selector: 'app-task-attachments', selector: 'app-task-attachments',
standalone: true,
imports: [CommonModule, UploadDragAreaComponent, TaskAttachmentListComponent, EmptyListComponent, TranslateModule, AttachmentComponent],
templateUrl: './task-attachments.component.html', templateUrl: './task-attachments.component.html',
styleUrls: ['./task-attachments.component.css'], styleUrls: ['./task-attachments.component.css'],
encapsulation: ViewEncapsulation.None, encapsulation: ViewEncapsulation.None,

4
demo-shell/src/app/components/search/search-bar.component.ts
View File

@ -19,9 +19,13 @@ import { Component } from '@angular/core';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { NodeEntry } from '@alfresco/js-api'; import { NodeEntry } from '@alfresco/js-api';
import { PreviewService } from '../../services/preview.service'; import { PreviewService } from '../../services/preview.service';
import { CommonModule } from '@angular/common';
import { SearchControlComponent } from '@alfresco/adf-content-services';
@Component({ @Component({
selector: 'app-search-bar', selector: 'app-search-bar',
standalone: true,
imports: [CommonModule, SearchControlComponent],
templateUrl: './search-bar.component.html', templateUrl: './search-bar.component.html',
styleUrls: ['./search-bar.component.scss'] styleUrls: ['./search-bar.component.scss']
}) })

29
demo-shell/src/app/components/search/search-filter-chips.component.ts
View File

@ -18,18 +18,43 @@
import { Component, OnDestroy, OnInit } from '@angular/core'; import { Component, OnDestroy, OnInit } from '@angular/core';
import { ActivatedRoute, Params, Router } from '@angular/router'; import { ActivatedRoute, Params, Router } from '@angular/router';
import { Pagination, ResultSetPaging } from '@alfresco/js-api'; import { Pagination, ResultSetPaging } from '@alfresco/js-api';
import { SearchConfiguration, SearchQueryBuilderService, SearchService } from '@alfresco/adf-content-services'; import {
ResetSearchDirective,
SearchConfiguration,
SearchFilterChipsComponent,
SearchFormComponent,
SearchQueryBuilderService,
SearchService,
SearchSortingPickerComponent
} from '@alfresco/adf-content-services';
import { ShowHeaderMode, UserPreferencesService } from '@alfresco/adf-core'; import { ShowHeaderMode, UserPreferencesService } from '@alfresco/adf-core';
import { combineLatest, Subject } from 'rxjs'; import { combineLatest, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { CommonModule } from '@angular/common';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatDividerModule } from '@angular/material/divider';
import { MatIconModule } from '@angular/material/icon';
import { FilesComponent } from '../files/files.component';
@Component({ @Component({
selector: 'app-search-filter-chips', selector: 'app-search-filter-chips',
standalone: true,
imports: [
CommonModule,
MatProgressBarModule,
SearchFormComponent,
MatDividerModule,
MatIconModule,
ResetSearchDirective,
SearchSortingPickerComponent,
FilesComponent,
SearchFilterChipsComponent
],
templateUrl: './search-filter-chips.component.html', templateUrl: './search-filter-chips.component.html',
styleUrls: ['./search-filter-chips.component.scss'], styleUrls: ['./search-filter-chips.component.scss'],
providers: [SearchService] providers: [SearchService]
}) })
export class SearchFilterChipsComponent implements OnInit, OnDestroy { export class AppSearchFilterChipsComponent implements OnInit, OnDestroy {
queryParamName = 'q'; queryParamName = 'q';
searchedWord = ''; searchedWord = '';
data: ResultSetPaging; data: ResultSetPaging;

76
demo-shell/src/app/components/search/search-result.component.ts
View File

@ -18,19 +18,39 @@
import { Component, OnDestroy, OnInit } from '@angular/core'; import { Component, OnDestroy, OnInit } from '@angular/core';
import { ActivatedRoute, Params, Router } from '@angular/router'; import { ActivatedRoute, Params, Router } from '@angular/router';
import { Pagination, ResultSetPaging } from '@alfresco/js-api'; import { Pagination, ResultSetPaging } from '@alfresco/js-api';
import { SearchForm, SearchQueryBuilderService, SearchService } from '@alfresco/adf-content-services'; import {
SearchChipListComponent,
SearchFilterComponent,
SearchForm,
SearchQueryBuilderService,
SearchService,
SearchSortingPickerComponent
} from '@alfresco/adf-content-services';
import { ShowHeaderMode, UserPreferencesService } from '@alfresco/adf-core'; import { ShowHeaderMode, UserPreferencesService } from '@alfresco/adf-core';
import { combineLatest, Subject } from 'rxjs'; import { combineLatest, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { CommonModule } from '@angular/common';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatButtonModule } from '@angular/material/button';
import { FilesComponent } from '../files/files.component';
@Component({ @Component({
selector: 'app-search-result-component', selector: 'app-search-result-component',
standalone: true,
imports: [
CommonModule,
SearchChipListComponent,
SearchFilterComponent,
MatProgressBarModule,
SearchSortingPickerComponent,
MatButtonModule,
FilesComponent
],
templateUrl: './search-result.component.html', templateUrl: './search-result.component.html',
styleUrls: ['./search-result.component.scss'], styleUrls: ['./search-result.component.scss'],
providers: [SearchService] providers: [SearchService]
}) })
export class SearchResultComponent implements OnInit, OnDestroy { export class SearchResultComponent implements OnInit, OnDestroy {
queryParamName = 'q'; queryParamName = 'q';
searchedWord = ''; searchedWord = '';
data: ResultSetPaging; data: ResultSetPaging;
@ -43,10 +63,12 @@ export class SearchResultComponent implements OnInit, OnDestroy {
private onDestroy$ = new Subject<boolean>(); private onDestroy$ = new Subject<boolean>();
constructor(public router: Router, constructor(
private preferences: UserPreferencesService, public router: Router,
private queryBuilder: SearchQueryBuilderService, private preferences: UserPreferencesService,
private route: ActivatedRoute) { private queryBuilder: SearchQueryBuilderService,
private route: ActivatedRoute
) {
combineLatest([this.route.params, this.queryBuilder.configUpdated]) combineLatest([this.route.params, this.queryBuilder.configUpdated])
.pipe(takeUntil(this.onDestroy$)) .pipe(takeUntil(this.onDestroy$))
.subscribe(([params, searchConfig]) => { .subscribe(([params, searchConfig]) => {
@ -55,7 +77,7 @@ export class SearchResultComponent implements OnInit, OnDestroy {
if (query) { if (query) {
this.queryBuilder.userQuery = query; this.queryBuilder.userQuery = query;
} }
}); });
queryBuilder.paging = { queryBuilder.paging = {
maxItems: this.preferences.paginationSize, maxItems: this.preferences.paginationSize,
@ -68,21 +90,17 @@ export class SearchResultComponent implements OnInit, OnDestroy {
this.sorting = this.getSorting(); this.sorting = this.getSorting();
this.queryBuilder.updated this.queryBuilder.updated.pipe(takeUntil(this.onDestroy$)).subscribe(() => {
.pipe(takeUntil(this.onDestroy$)) this.sorting = this.getSorting();
.subscribe(() => { this.isLoading = true;
this.sorting = this.getSorting(); });
this.isLoading = true;
});
this.queryBuilder.executed this.queryBuilder.executed.pipe(takeUntil(this.onDestroy$)).subscribe((resultSetPaging: ResultSetPaging) => {
.pipe(takeUntil(this.onDestroy$)) this.queryBuilder.paging.skipCount = 0;
.subscribe((resultSetPaging: ResultSetPaging) => {
this.queryBuilder.paging.skipCount = 0;
this.onSearchResultLoaded(resultSetPaging); this.onSearchResultLoaded(resultSetPaging);
this.isLoading = false; this.isLoading = false;
}); });
if (this.route) { if (this.route) {
this.route.params.forEach((params: Params) => { this.route.params.forEach((params: Params) => {
@ -91,18 +109,20 @@ export class SearchResultComponent implements OnInit, OnDestroy {
this.queryBuilder.update(); this.queryBuilder.update();
} else { } else {
this.queryBuilder.userQuery = null; this.queryBuilder.userQuery = null;
this.queryBuilder.executed.next(new ResultSetPaging({ this.queryBuilder.executed.next(
list: { new ResultSetPaging({
pagination: { totalItems: 0 }, list: {
entries: [] pagination: { totalItems: 0 },
} entries: []
})); }
})
);
} }
}); });
} }
} }
private formatSearchQuery(userInput: string, fields = ['cm:name']) { private formatSearchQuery(userInput: string, fields = ['cm:name']) {
if (!userInput) { if (!userInput) {
return null; return null;
} }
@ -142,6 +162,6 @@ export class SearchResultComponent implements OnInit, OnDestroy {
} }
switchLayout() { switchLayout() {
this.router.navigate(['search-filter-chips', { q: this.searchedWord }] ); this.router.navigate(['search-filter-chips', { q: this.searchedWord }]);
} }
} }

29
demo-shell/src/app/components/settings/host-settings.component.ts
View File

@ -16,16 +16,33 @@
*/ */
import { Component, EventEmitter, Output, ViewEncapsulation, OnInit, Input } from '@angular/core'; 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 { AppConfigService, AppConfigValues, StorageService, AlfrescoApiService, AuthenticationService } from '@alfresco/adf-core';
import { ENTER } from '@angular/cdk/keycodes'; 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)://.*[^/]$'; export const HOST_REGEX = '^(http|https)://.*[^/]$';
@Component({ @Component({
providers: [{ provide: MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: { floatLabel: 'always' } }], providers: [{ provide: MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: { floatLabel: 'always' } }],
selector: 'adf-host-settings', selector: 'adf-host-settings',
standalone: true,
imports: [
CommonModule,
ReactiveFormsModule,
MatFormFieldModule,
MatSelectModule,
MatRadioModule,
MatInputModule,
MatSlideToggleModule,
MatButtonModule
],
templateUrl: 'host-settings.component.html', templateUrl: 'host-settings.component.html',
host: { class: 'adf-host-settings' }, host: { class: 'adf-host-settings' },
styleUrls: ['./host-settings.component.scss'], styleUrls: ['./host-settings.component.scss'],
@ -161,7 +178,10 @@ export class HostSettingsComponent implements OnInit {
} }
private createIdentityFormControl(): UntypedFormControl { private createIdentityFormControl(): UntypedFormControl {
return new UntypedFormControl(this.appConfig.get<string>(AppConfigValues.IDENTITY_HOST), [Validators.required, Validators.pattern(HOST_REGEX)]); return new UntypedFormControl(this.appConfig.get<string>(AppConfigValues.IDENTITY_HOST), [
Validators.required,
Validators.pattern(HOST_REGEX)
]);
} }
private createECMFormControl(): UntypedFormControl { private createECMFormControl(): UntypedFormControl {
@ -203,7 +223,7 @@ export class HostSettingsComponent implements OnInit {
} }
private saveOAuthValues(values: any) { 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(','); values.oauthConfig.publicUrls = values.oauthConfig.publicUrls.split(',');
} }
@ -278,5 +298,4 @@ export class HostSettingsComponent implements OnInit {
get oauthConfig(): UntypedFormControl { get oauthConfig(): UntypedFormControl {
return this.form.get('oauthConfig') as UntypedFormControl; return this.form.get('oauthConfig') as UntypedFormControl;
} }
} }

4
demo-shell/src/app/components/settings/settings.component.ts
View File

@ -17,9 +17,13 @@
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { CommonModule } from '@angular/common';
import { HostSettingsComponent } from './host-settings.component';
@Component({ @Component({
selector: 'app-settings', selector: 'app-settings',
standalone: true,
imports: [CommonModule, HostSettingsComponent],
templateUrl: './settings.component.html' templateUrl: './settings.component.html'
}) })
export class SettingsComponent { export class SettingsComponent {

46
demo-shell/src/app/components/settings/settings.module.ts
View File

@ -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 {}

16
demo-shell/src/app/components/task-list-demo/task-list-demo.component.html
View File

@ -3,9 +3,7 @@
<form [formGroup]="taskListForm"> <form [formGroup]="taskListForm">
<mat-form-field> <mat-form-field>
<mat-label>App Id</mat-label> <mat-label>App Id</mat-label>
<input <input matInput [formControl]="taskAppId" data-automation-id="appId input">
matInput
[formControl]="taskAppId" data-automation-id="appId input">
<mat-error *ngIf="taskAppId.hasError('pattern')"> <mat-error *ngIf="taskAppId.hasError('pattern')">
App ID must be a number App ID must be a number
</mat-error> </mat-error>
@ -13,16 +11,12 @@
<mat-form-field> <mat-form-field>
<mat-label>Task Name</mat-label> <mat-label>Task Name</mat-label>
<input <input matInput [formControl]="taskName" data-automation-id="task name">
matInput
[formControl]="taskName" data-automation-id="task name">
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
<mat-label>Task Id</mat-label> <mat-label>Task Id</mat-label>
<input <input matInput [formControl]="taskId" data-automation-id="task id">
matInput
[formControl]="taskId" data-automation-id="task id">
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field>
@ -182,8 +176,6 @@
</data-columns> </data-columns>
</adf-tasklist> </adf-tasklist>
<adf-pagination <adf-pagination [target]="taskList"></adf-pagination>
[target]="taskList">
</adf-pagination>
</div> </div>

68
demo-shell/src/app/components/task-list-demo/task-list-demo.component.ts
View File

@ -16,20 +16,43 @@
*/ */
import { Component, OnInit, OnDestroy } from '@angular/core'; 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 { ActivatedRoute, Params } from '@angular/router';
import { debounceTime, takeUntil } from 'rxjs/operators'; import { debounceTime, takeUntil } from 'rxjs/operators';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { set } from 'date-fns'; 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; const DEFAULT_SIZE = 20;
@Component({ @Component({
selector: 'app-task-list-demo', 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', templateUrl: './task-list-demo.component.html',
styleUrls: [`./task-list-demo.component.scss`] styleUrls: [`./task-list-demo.component.scss`]
}) })
export class TaskListDemoComponent implements OnInit, OnDestroy { export class TaskListDemoComponent implements OnInit, OnDestroy {
taskListForm: UntypedFormGroup; taskListForm: UntypedFormGroup;
@ -54,33 +77,31 @@ export class TaskListDemoComponent implements OnInit, OnDestroy {
includeProcessInstance: boolean; includeProcessInstance: boolean;
assignmentOptions = [ assignmentOptions = [
{value: 'assignee', title: 'Assignee'}, { value: 'assignee', title: 'Assignee' },
{value: 'candidate', title: 'Candidate'} { value: 'candidate', title: 'Candidate' }
]; ];
includeProcessInstanceOptions = [ includeProcessInstanceOptions = [
{value: 'include', title: 'Include'}, { value: 'include', title: 'Include' },
{value: 'exclude', title: 'Exclude'} { value: 'exclude', title: 'Exclude' }
]; ];
stateOptions = [ stateOptions = [
{value: 'all', title: 'All'}, { value: 'all', title: 'All' },
{value: 'active', title: 'Active'}, { value: 'active', title: 'Active' },
{value: 'completed', title: 'Completed'} { value: 'completed', title: 'Completed' }
]; ];
sortOptions = [ sortOptions = [
{value: 'created-asc', title: 'Created (asc)'}, { value: 'created-asc', title: 'Created (asc)' },
{value: 'created-desc', title: 'Created (desc)'}, { value: 'created-desc', title: 'Created (desc)' },
{value: 'due-asc', title: 'Due (asc)'}, { value: 'due-asc', title: 'Due (asc)' },
{value: 'due-desc', title: 'Due (desc)'} { value: 'due-desc', title: 'Due (desc)' }
]; ];
private onDestroy$ = new Subject<boolean>(); private onDestroy$ = new Subject<boolean>();
constructor(private route: ActivatedRoute, constructor(private route: ActivatedRoute, private formBuilder: UntypedFormBuilder) {}
private formBuilder: UntypedFormBuilder) {
}
ngOnInit() { ngOnInit() {
if (this.route) { if (this.route) {
@ -120,16 +141,11 @@ export class TaskListDemoComponent implements OnInit, OnDestroy {
taskIncludeProcessInstance: new UntypedFormControl() taskIncludeProcessInstance: new UntypedFormControl()
}); });
this.taskListForm.valueChanges this.taskListForm.valueChanges.pipe(debounceTime(500), takeUntil(this.onDestroy$)).subscribe((taskFilter) => {
.pipe( if (this.isFormValid()) {
debounceTime(500), this.filterTasks(taskFilter);
takeUntil(this.onDestroy$) }
) });
.subscribe(taskFilter => {
if (this.isFormValid()) {
this.filterTasks(taskFilter);
}
});
} }
filterTasks(taskFilter: any) { filterTasks(taskFilter: any) {

40
demo-shell/src/app/components/task-list-demo/task-list.module.ts
View File

@ -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 {}

3
demo-shell/src/app/folder-directive/folder-create.directive.ts
View File

@ -26,7 +26,8 @@ const DEFAULT_FOLDER_PARENT_ID = '-my-';
const DIALOG_WIDTH: number = 400; const DIALOG_WIDTH: number = 400;
@Directive({ @Directive({
selector: '[adf-create-folder]' selector: '[adf-create-folder]',
standalone: true
}) })
export class FolderCreateDirective { export class FolderCreateDirective {
/** Parent folder where the new folder will be located after creation. */ /** Parent folder where the new folder will be located after creation. */

29
demo-shell/src/app/folder-directive/folder-directive.module.ts
View File

@ -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 {}

2
demo-shell/src/app/folder-directive/index.ts
View File

@ -16,5 +16,3 @@
*/ */
export * from './folder-create.directive'; export * from './folder-create.directive';
export * from './folder-directive.module';

63
demo-shell/src/app/material.module.ts
View File

@ -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 {
}

113
docs/README.md
View File

@ -264,61 +264,60 @@ for more information about installing and using the source code.
### Components ### Components
| Name | Description | Source link | | 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 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 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) | | [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) | | [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 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. | | | [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) | |
| 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) |
| [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 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 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 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 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) |
| [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) |
| [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) |
| [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) |
| [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) |
| [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) |
| [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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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 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) |
| [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) |
| [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 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/tag-list.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/tag-node-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) |
| [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 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) |
| [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 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 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) | | [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 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 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 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 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 ### Directives
@ -348,8 +347,7 @@ for more information about installing and using the source code.
| Name | Description | Source link | | 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. | | | [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) | |
| 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) | | [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) | | [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 | | 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) | | [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. | | | [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) | |
| 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 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) | | [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) | | [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) |

135
docs/content-services/components/alfresco-viewer.component.md
View File

@ -4,12 +4,12 @@ Added: 6.0.0
Status: Active 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. Displays content from an ACS repository.
See it live: [Viewer Quickstart](https://embed.plnkr.co/iTuG1lFIXfsP95l6bDW6/)
## Contents ## Contents
- [Basic usage](#basic-usage) - [Basic usage](#basic-usage)
@ -30,6 +30,12 @@ See it live: [Viewer Quickstart](https://embed.plnkr.co/iTuG1lFIXfsP95l6bDW6/)
## Basic usage ## Basic usage
Use the following standalone component import:
```typescript
import { AlfrescoViewerComponent } from '@alfresco/adf-content-services';
```
Using with node id: Using with node id:
```html ```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 ID portion and use it with the `sharedLinkId` property rather than using the whole
URL with `urlFile`. 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. 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 ## Class members
### Properties ### Properties
| Name | Type | Default value | Description | | Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- | |----------------------|-----------------------|---------------|-----------------------------------------------------------------------------------------------------------------------------|
| allowDownload | `boolean` | true | Toggles downloading. | | allowDownload | `boolean` | true | Toggles downloading. |
| allowFullScreen | `boolean` | true | Toggles the 'Full Screen' feature. | | allowFullScreen | `boolean` | true | Toggles the 'Full Screen' feature. |
| allowGoBack | `boolean` | true | Allows `back` navigation. | | allowGoBack | `boolean` | true | Allows `back` navigation. |
| closeButtonPosition | `CloseButtonPosition` | `left` | Set close button position right/left. | | closeButtonPosition | `CloseButtonPosition` | `left` | Set close button position right/left. |
| hideInfoButton | `boolean` | false | Toggles Info button. | | hideInfoButton | `boolean` | false | Toggles Info button. |
| allowLeftSidebar | `boolean` | false | Allow the left the sidebar. | | 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. | | 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. | | allowPrint | `boolean` | false | Toggles printing. |
| allowRightSidebar | `boolean` | false | Allow the right sidebar. | | allowRightSidebar | `boolean` | false | Allow the right sidebar. |
| canNavigateBefore | `boolean` | true | Toggles the "before" ("&lt;") button. Requires `allowNavigate` to be enabled. | | canNavigateBefore | `boolean` | true | Toggles the "before" ("&lt;") button. Requires `allowNavigate` to be enabled. |
| canNavigateNext | `boolean` | true | Toggles the next (">") 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. | | 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. | | 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. | | 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). | | sharedLinkId | `string` | null | Shared link id (to display shared file). |
| showLeftSidebar | `boolean` | false | Toggles left sidebar visibility. Requires `allowLeftSidebar` to be set to `true`. | | 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`. | | showRightSidebar | `boolean` | false | Toggles right sidebar visibility. Requires `allowRightSidebar` to be set to `true`. |
| showToolbar | `boolean` | true | Hide or show the toolbar | | showToolbar | `boolean` | true | Hide or show the toolbar |
| showViewer | `boolean` | true | Hide or show the viewer | | showViewer | `boolean` | true | Hide or show the viewer |
| sidebarLeftTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | The template for the left sidebar. The template context contains the loaded node data. | | sidebarLeftTemplate | `TemplateRef<any>` | null | The template for the left sidebar. The template context contains the loaded node data. |
| sidebarRightTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | The template for the right sidebar. The template context contains the loaded node data. | | sidebarRightTemplate | `TemplateRef<any>` | 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. | | versionId | `string` | null | Version Id of the file to load. |
### Events ### Events
| Name | Type | Description | | Name | Type | Description |
| ---- | ---- | ----------- | |-------------------|---------------------------------------------|-------------------------------------------------------------|
| invalidSharedLink | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the shared link used is not valid. | | invalidSharedLink | `EventEmitter<any>` | Emitted when the shared link used is not valid. |
| navigateBefore | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<KeyboardEvent \| MouseEvent>` | Emitted when user clicks 'Navigate Before' ("&lt;") button. | | navigateBefore | `EventEmitter<KeyboardEvent \| MouseEvent>` | Emitted when user clicks 'Navigate Before' ("&lt;") button. |
| navigateNext | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<KeyboardEvent \| MouseEvent>` | Emitted when user clicks 'Navigate Next' (">") button. | | navigateNext | `EventEmitter<KeyboardEvent \| MouseEvent>` | Emitted when user clicks 'Navigate Next' (">") button. |
| showViewerChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the viewer close | | showViewerChange | `EventEmitter<boolean>` | Emitted when the viewer close |
## Keyboard shortcuts ## Keyboard shortcuts
| Name | Description | | Name | Description |
| ---- | ----------- | |--------|---------------------------------------|
| Esc | Close the viewer (overlay mode only). | | Esc | Close the viewer (overlay mode only). |
| Left | Invoke 'Navigate before' action. | | Left | Invoke 'Navigate before' action. |
| Right | Invoke 'Navigate next' action. | | Right | Invoke 'Navigate next' action. |
| Ctrl+F | Activate full-screen mode. | | Ctrl+F | Activate full-screen mode. |
## Details ## Details
### Integrating with the Document List component ### Integrating with the Document List component
Below is the most simple integration of the Viewer and Integrating Viewer and [Document List](./document-list.component.md) components within your custom component:
[Document List](../../content-services/components/document-list.component.md) components within your custom component:
```html ```html
<adf-document-list <adf-document-list
@ -147,7 +154,7 @@ export class OverlayViewerComponent {
### Supported file formats ### Supported file formats
The [Alfresco Viewer component](viewer.component.md) consists of separate Views that handle particular file types or type families based on either a file extension or a mime type: The viewer component consists of separate Views that handle particular file types or type families based on either a file extension or a mime type:
- PDF View - PDF View
- application/pdf - application/pdf
@ -199,13 +206,12 @@ For the full list of supported types please refer to: [File types that support p
Configure your webpack-enabled application with the PDF.js library as follows. Configure your webpack-enabled application with the PDF.js library as follows.
1. Install pdfjs-dist - Install pdfjs-dist
```sh ```sh
npm install pdfjs-dist npm install pdfjs-dist
``` ```
- Update `vendors.ts` by appending the following code. This will enable the viewer component
2. Update `vendors.ts` by appending the following code. This will enable the [Alfresco Viewer component](viewer.component.md)
and compatibility mode for all browsers. It will also configure the web worker for the PDF.js 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: library to render PDF files in the background:
@ -217,7 +223,7 @@ pdfjsLib.PDFJS.workerSrc = './pdf.worker.js';
require('pdfjs-dist/web/pdf_viewer.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 ```js
new CopyWebpackPlugin([ new CopyWebpackPlugin([
@ -233,12 +239,12 @@ new CopyWebpackPlugin([
#### Internal extension mechanism #### Internal extension mechanism
The Viewer supports dynamically-loaded viewer preview extensions, to know more about it [Preview Extension component](../../extensions/components/preview-extension.component.md). This The Viewer supports dynamically-loaded viewer preview extensions, to know more about it [Preview Extension component](../../extensions/components/preview-extension.component.md).
#### Code extension mechanism] #### Code extension mechanism
You can define your own custom handler to override supported file formats or handle other file formats that are not yet supported by You can define your own custom handler to override supported file formats or handle other file formats that are not yet supported by
the [Alfresco Viewer component](viewer.component.md). Below is an example that shows how to use the `adf-viewer-extension` the component. Below is an example that shows how to use the `adf-viewer-extension`
to handle 3D data files: to handle 3D data files:
```html ```html
@ -256,7 +262,7 @@ to handle 3D data files:
</adf-alfresco-viewer> </adf-alfresco-viewer>
``` ```
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: 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 ### 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. explained in the sections below.
#### Custom toolbar #### Custom toolbar
@ -329,7 +335,7 @@ The result should look like this:
#### Custom sidebar #### 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. 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 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 { export class CustomThumbnailsComponent {
@Input() pdfViewer: any; @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`. 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. Note: For the pdf viewer the value has to be within the range of 25 - 1000.
"adf-alfresco-viewer": { ```json
"pdf-viewer-scaling": 150 {
"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`. 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": { ```json
"image-viewer-scaling": 150 {
"adf-alfresco-viewer": {
"image-viewer-scaling": 150
}
} }
```
By default the viewer's zoom scaling is set to 100%. By default the viewer's zoom scaling is set to 100%.
@ -465,7 +477,6 @@ true.
```html ```html
<adf-alfresco-viewer [allowPrint]="true"> <adf-alfresco-viewer [allowPrint]="true">
...
</adf-alfresco-viewer> </adf-alfresco-viewer>
``` ```

2
docs/content-services/components/tag-actions.component.md
View File

@ -5,7 +5,7 @@ Status: Active
Last reviewed: 2018-11-19 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. Shows available actions for tags.

2
docs/content-services/components/tag-list.component.md
View File

@ -5,7 +5,7 @@ Status: Active
Last reviewed: 2018-11-14 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. Shows tags for an item.

2
docs/content-services/components/tag-node-list.component.md
View File

@ -5,7 +5,7 @@ Status: Active
Last reviewed: 2018-11-19 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. Shows tags for a node.

44
docs/core/components/viewer.component.md
View File

@ -5,10 +5,12 @@ Status: Active
Last reviewed: 2023-01-30 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. 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 ## Contents
- [Basic usage](#basic-usage) - [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. Configure your webpack-enabled application with the PDF.js library as follows.
1. Install pdfjs-dist - Install pdfjs-dist
```sh ```sh
npm install pdfjs-dist 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 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: 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'); 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 ```js
new CopyWebpackPlugin([ 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`. 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. Note: For the pdf viewer the value has to be within the range of 25 - 1000.
"adf-viewer": { ```json
"pdf-viewer-scaling": 150 {
"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`. 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": { ```json
"image-viewer-scaling": 150 {
"adf-viewer": {
"image-viewer-scaling": 150
}
} }
```
By default the viewer's zoom scaling is set to 100%. 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`. In order to configure this feature, add the following code in `app.config.json`.
``` ```json
"viewer": { {
"enableDownloadPrompt": true, "viewer": {
"enableDownloadPromptReminder": true, "enableDownloadPrompt": true,
"downloadPromptDelay": 50, "enableDownloadPromptReminder": true,
"downloadPromptReminderDelay": 30 "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 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. 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. `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 ## See also

9
lib/content-services/src/lib/aspect-list/aspect-list-dialog.component.ts
View File

@ -16,11 +16,18 @@
*/ */
import { Component, Inject, OnInit, ViewEncapsulation } from '@angular/core'; 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 { 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({ @Component({
selector: 'adf-aspect-list-dialog', selector: 'adf-aspect-list-dialog',
standalone: true,
imports: [CommonModule, MatDialogModule, TranslateModule, MatButtonModule, AspectListComponent, AutoFocusDirective],
templateUrl: './aspect-list-dialog.component.html', templateUrl: './aspect-list-dialog.component.html',
styleUrls: ['./aspect-list-dialog.component.scss'], styleUrls: ['./aspect-list-dialog.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None

2
lib/content-services/src/lib/aspect-list/aspect-list.component.spec.ts
View File

@ -119,7 +119,7 @@ describe('AspectListComponent', () => {
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [ContentTestingModule], imports: [ContentTestingModule, AspectListComponent],
providers: [AspectListService] providers: [AspectListService]
}); });
}); });

10
lib/content-services/src/lib/aspect-list/aspect-list.component.ts
View File

@ -20,10 +20,18 @@ import { NodesApiService } from '../common/services/nodes-api.service';
import { Observable, Subject, zip } from 'rxjs'; import { Observable, Subject, zip } from 'rxjs';
import { concatMap, map, takeUntil, tap } from 'rxjs/operators'; import { concatMap, map, takeUntil, tap } from 'rxjs/operators';
import { AspectListService } from './services/aspect-list.service'; 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 { 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({ @Component({
selector: 'adf-aspect-list', selector: 'adf-aspect-list',
standalone: true,
imports: [CommonModule, MatExpansionModule, MatCheckboxModule, MatTableModule, TranslateModule, MatProgressSpinnerModule],
templateUrl: './aspect-list.component.html', templateUrl: './aspect-list.component.html',
styleUrls: ['./aspect-list.component.scss'], styleUrls: ['./aspect-list.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None

29
lib/content-services/src/lib/aspect-list/aspect-list.module.ts
View File

@ -15,34 +15,15 @@
* limitations under the License. * limitations under the License.
*/ */
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { AspectListComponent } from './aspect-list.component'; 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 { 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({ @NgModule({
imports: [ imports: [...ASPECT_LIST_DIRECTIVES],
CommonModule, exports: [...ASPECT_LIST_DIRECTIVES]
MatTableModule,
MatExpansionModule,
MatCheckboxModule,
PipeModule,
TranslateModule,
MatDialogModule,
MatButtonModule,
MatProgressSpinnerModule,
ContentDirectiveModule
],
exports: [AspectListComponent, AspectListDialogComponent],
declarations: [AspectListComponent, AspectListDialogComponent]
}) })
export class AspectListModule {} export class AspectListModule {}

6
lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts
View File

@ -21,8 +21,8 @@ import { forkJoin, Observable, of, Subject, zip } from 'rxjs';
import { import {
AppConfigService, AppConfigService,
CardViewBaseItemModel, CardViewBaseItemModel,
CardViewComponent,
CardViewItem, CardViewItem,
CardViewModule,
NotificationService, NotificationService,
TranslationService, TranslationService,
UpdateNotification UpdateNotification
@ -68,12 +68,12 @@ enum DefaultPanels {
MatButtonModule, MatButtonModule,
TranslateModule, TranslateModule,
MatIconModule, MatIconModule,
CardViewModule,
MatChipsModule, MatChipsModule,
CategoriesManagementComponent, CategoriesManagementComponent,
DynamicExtensionComponent, DynamicExtensionComponent,
MatProgressBarModule, MatProgressBarModule,
TagsCreatorComponent TagsCreatorComponent,
CardViewComponent
], ],
templateUrl: './content-metadata.component.html', templateUrl: './content-metadata.component.html',
styleUrls: ['./content-metadata.component.scss'], styleUrls: ['./content-metadata.component.scss'],

3
lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.html
View File

@ -44,8 +44,7 @@
{{ 'SEARCH.SEARCH_HEADER.TITLE' | translate }} {{ 'SEARCH.SEARCH_HEADER.TITLE' | translate }}
</button> </button>
<div class="adf-content-node-selector-search-panel-container"> <div class="adf-content-node-selector-search-panel-container">
<adf-search-panel *ngIf="searchPanelExpanded"> <adf-search-panel *ngIf="searchPanelExpanded"></adf-search-panel>
</adf-search-panel>
<div class="adf-content-node-selector-document-list-container"> <div class="adf-content-node-selector-document-list-container">
<adf-toolbar> <adf-toolbar>
<adf-toolbar-title> <adf-toolbar-title>

47
lib/content-services/src/lib/content-node-selector/content-node-selector-panel/content-node-selector-panel.component.ts
View File

@ -23,10 +23,15 @@ import {
InfinitePaginationComponent, InfinitePaginationComponent,
PaginatedComponent, PaginatedComponent,
DataSorting, DataSorting,
ShowHeaderMode ShowHeaderMode,
ToolbarTitleComponent,
ToolbarComponent,
DataColumnListComponent,
DataColumnComponent,
CustomEmptyContentTemplateDirective
} from '@alfresco/adf-core'; } from '@alfresco/adf-core';
import { NodesApiService, UploadService, FileUploadCompleteEvent, FileUploadDeleteEvent, SitesService } from '../../common'; 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 { Node, NodePaging, Pagination, SiteEntry, SitePaging, NodeEntry, SearchRequest, RequestScope } from '@alfresco/js-api';
import { DocumentListComponent } from '../../document-list/components/document-list.component'; import { DocumentListComponent } from '../../document-list/components/document-list.component';
import { RowFilter } from '../../document-list/data/row-filter.model'; 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 { NodeEntryEvent } from '../../document-list/components/node.event';
import { debounceTime, takeUntil } from 'rxjs/operators'; import { debounceTime, takeUntil } from 'rxjs/operators';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { SearchQueryBuilderService } from '../../search';
import { ContentNodeSelectorPanelService } from './content-node-selector-panel.service'; 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; export type ValidationFunction = (entry: Node) => boolean;
@ -45,6 +62,30 @@ export const defaultValidation = () => true;
@Component({ @Component({
selector: 'adf-content-node-selector-panel', 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', templateUrl: './content-node-selector-panel.component.html',
styleUrls: ['./content-node-selector-panel.component.scss'], styleUrls: ['./content-node-selector-panel.component.scss'],
encapsulation: ViewEncapsulation.None, encapsulation: ViewEncapsulation.None,

5
lib/content-services/src/lib/content-node-selector/content-node-selector.component.spec.ts
View File

@ -15,7 +15,7 @@
* limitations under the License. * 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 { CUSTOM_ELEMENTS_SCHEMA, EventEmitter } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ContentNodeSelectorComponent } from './content-node-selector.component'; import { ContentNodeSelectorComponent } from './content-node-selector.component';
@ -28,7 +28,6 @@ import { of } from 'rxjs';
import { ContentTestingModule } from '../testing/content.testing.module'; import { ContentTestingModule } from '../testing/content.testing.module';
import { DocumentListService } from '../document-list/services/document-list.service'; import { DocumentListService } from '../document-list/services/document-list.service';
import { DocumentListComponent } from '../document-list/components/document-list.component'; 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 { ContentNodeSelectorPanelComponent } from './content-node-selector-panel/content-node-selector-panel.component';
import { NodeAction } from '../document-list/models/node-action.enum'; import { NodeAction } from '../document-list/models/node-action.enum';
import { SitesService } from '../common/services/sites.service'; import { SitesService } from '../common/services/sites.service';
@ -60,7 +59,7 @@ describe('ContentNodeSelectorComponent', () => {
}; };
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [ContentTestingModule, MatDialogModule, UploadModule], imports: [ContentTestingModule, ContentNodeSelectorComponent],
providers: [ providers: [
{ provide: MAT_DIALOG_DATA, useValue: data }, { provide: MAT_DIALOG_DATA, useValue: data },
{ {

33
lib/content-services/src/lib/content-node-selector/content-node-selector.component.ts
View File

@ -16,8 +16,8 @@
*/ */
import { Component, Inject, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core'; import { Component, Inject, OnDestroy, 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 { TranslationService, NotificationService } from '@alfresco/adf-core'; import { TranslationService, NotificationService, ToolbarTitleComponent, ToolbarComponent, EmptyListComponent } from '@alfresco/adf-core';
import { Node } from '@alfresco/js-api'; import { Node } from '@alfresco/js-api';
import { AllowableOperationsEnum } from '../common/models/allowable-operations.enum'; import { AllowableOperationsEnum } from '../common/models/allowable-operations.enum';
import { ContentService } from '../common/services/content.service'; 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 { OverlayContainer } from '@angular/cdk/overlay';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; 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({ @Component({
selector: 'adf-content-node-selector', 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', templateUrl: './content-node-selector.component.html',
styleUrls: ['./content-node-selector.component.scss'], styleUrls: ['./content-node-selector.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None

37
lib/content-services/src/lib/content-node-selector/content-node-selector.module.ts
View File

@ -15,39 +15,22 @@
* limitations under the License. * limitations under the License.
*/ */
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core'; 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 { ContentNodeSelectorPanelComponent } from './content-node-selector-panel/content-node-selector-panel.component';
import { ContentNodeSelectorComponent } from './content-node-selector.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 { 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'; 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({ @NgModule({
imports: [ imports: [...CONTENT_NODE_SELECTOR_DIRECTIVES],
FormsModule, exports: [...CONTENT_NODE_SELECTOR_DIRECTIVES]
ReactiveFormsModule,
CoreModule,
CommonModule,
MaterialModule,
DropdownSitesComponent,
...BREADCRUMB_DIRECTIVES,
SearchModule,
DocumentListModule,
NameLocationCellComponent,
CONTENT_DIRECTIVES,
...CONTENT_UPLOAD_DIRECTIVES
],
exports: [ContentNodeSelectorPanelComponent, NameLocationCellComponent, ContentNodeSelectorComponent],
declarations: [ContentNodeSelectorPanelComponent, ContentNodeSelectorComponent],
providers: [SearchQueryBuilderService]
}) })
export class ContentNodeSelectorModule {} export class ContentNodeSelectorModule {}

6
lib/content-services/src/lib/content-node-share/content-node-share.dialog.ts
View File

@ -23,7 +23,7 @@ import { Subject } from 'rxjs';
import { ContentService } from '../common/services/content.service'; import { ContentService } from '../common/services/content.service';
import { SharedLinksApiService } from './services/shared-links-api.service'; import { SharedLinksApiService } from './services/shared-links-api.service';
import { SharedLinkBodyCreate } from '@alfresco/js-api'; 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 { ContentNodeShareSettings } from './content-node-share.settings';
import { RenditionService } from '../common/services/rendition.service'; import { RenditionService } from '../common/services/rendition.service';
import { format, add, endOfDay, isBefore } from 'date-fns'; import { format, add, endOfDay, isBefore } from 'date-fns';
@ -53,8 +53,8 @@ interface SharedDialogFormProps {
MatFormFieldModule, MatFormFieldModule,
MatDatepickerModule, MatDatepickerModule,
MatInputModule, MatInputModule,
ClipboardModule, MatButtonModule,
MatButtonModule ClipboardDirective
], ],
templateUrl: './content-node-share.dialog.html', templateUrl: './content-node-share.dialog.html',
styleUrls: ['./content-node-share.dialog.scss'], styleUrls: ['./content-node-share.dialog.scss'],

4
lib/content-services/src/lib/content-type/content-type-dialog.component.html
View File

@ -1,7 +1,7 @@
<div class="adf-content-type-dialog"> <div class="adf-content-type-dialog">
<h2 mat-dialog-title class="adf-content-type-dialog-title" data-automation-id="content-type-dialog-title">{{title | <h2 mat-dialog-title class="adf-content-type-dialog-title" data-automation-id="content-type-dialog-title">{{title |
translate}}</h2> translate}}</h2>
<mat-dialog-content class="mat-typography" class="adf-content-type-dialog-content" <mat-dialog-content class="mat-typography adf-content-type-dialog-content"
data-automation-id="content-type-dialog-content"> data-automation-id="content-type-dialog-content">
<h4 data-automation-id="content-type-dialog-description">{{description | translate}}</h4> <h4 data-automation-id="content-type-dialog-description">{{description | translate}}</h4>
<p data-automation-id="content-type-dialog-confirm-message">{{confirmMessage | translate}}</p> <p data-automation-id="content-type-dialog-confirm-message">{{confirmMessage | translate}}</p>
@ -39,7 +39,7 @@
<button mat-button mat-dialog-close <button mat-button mat-dialog-close
id="content-type-dialog-actions-cancel">{{'CORE.METADATA.CONTENT_TYPE.DIALOG.CANCEL' | translate }}</button> id="content-type-dialog-actions-cancel">{{'CORE.METADATA.CONTENT_TYPE.DIALOG.CANCEL' | translate }}</button>
<button mat-button class="adf-content-type-dialog-apply-button" id="content-type-dialog-apply-button" <button mat-button class="adf-content-type-dialog-apply-button" id="content-type-dialog-apply-button"
[mat-dialog-close]="true" cdkFocusInitial (click)="onApply()">{{'CORE.METADATA.CONTENT_TYPE.DIALOG.APPLY' | [mat-dialog-close]="true" (click)="onApply()">{{'CORE.METADATA.CONTENT_TYPE.DIALOG.APPLY' |
translate}}</button> translate}}</button>
</mat-dialog-actions> </mat-dialog-actions>
</div> </div>

22
lib/content-services/src/lib/content-type/content-type-dialog.component.ts
View File

@ -17,18 +17,24 @@
import { TypeEntry } from '@alfresco/js-api'; import { TypeEntry } from '@alfresco/js-api';
import { Component, Inject, OnInit, ViewEncapsulation } from '@angular/core'; 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 { ContentTypeDialogComponentData } from './content-type-metadata.interface';
import { ContentTypeService } from './content-type.service'; 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({ @Component({
selector: 'adf-content-type-dialog', selector: 'adf-content-type-dialog',
standalone: true,
imports: [CommonModule, MatDialogModule, TranslateModule, MatExpansionModule, MatTableModule, MatButtonModule],
templateUrl: './content-type-dialog.component.html', templateUrl: './content-type-dialog.component.html',
styleUrls: ['./content-type-dialog.component.scss'], styleUrls: ['./content-type-dialog.component.scss'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })
export class ContentTypeDialogComponent implements OnInit { export class ContentTypeDialogComponent implements OnInit {
title: string; title: string;
description: string; description: string;
nodeType: string; nodeType: string;
@ -39,9 +45,11 @@ export class ContentTypeDialogComponent implements OnInit {
propertyColumns: string[] = ['name', 'title', 'dataType']; propertyColumns: string[] = ['name', 'title', 'dataType'];
constructor(private dialog: MatDialogRef<ContentTypeDialogComponent>, constructor(
@Inject(MAT_DIALOG_DATA) public data: ContentTypeDialogComponentData, private dialog: MatDialogRef<ContentTypeDialogComponent>,
private contentTypeService: ContentTypeService) { @Inject(MAT_DIALOG_DATA) public data: ContentTypeDialogComponentData,
private contentTypeService: ContentTypeService
) {
this.title = data.title; this.title = data.title;
this.description = data.description; this.description = data.description;
this.confirmMessage = data.confirmMessage; this.confirmMessage = data.confirmMessage;
@ -49,7 +57,9 @@ export class ContentTypeDialogComponent implements OnInit {
this.contentTypeService.getContentTypeByPrefix(this.nodeType).subscribe((contentTypeEntry) => { this.contentTypeService.getContentTypeByPrefix(this.nodeType).subscribe((contentTypeEntry) => {
this.currentContentType = 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)
);
}); });
} }

45
lib/content-services/src/lib/content-type/content-type.module.ts
View File

@ -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 { }

2
lib/content-services/src/lib/content-type/index.ts
View File

@ -18,5 +18,3 @@
export * from './content-type.service'; export * from './content-type.service';
export * from './content-type-metadata.interface'; export * from './content-type-metadata.interface';
export * from './content-type-dialog.component'; export * from './content-type-dialog.component';
export * from './content-type.module';

73
lib/content-services/src/lib/content.module.ts
View File

@ -15,81 +15,75 @@
* limitations under the License. * limitations under the License.
*/ */
import { CommonModule } from '@angular/common';
import { NgModule, ModuleWithProviders, APP_INITIALIZER } from '@angular/core'; import { NgModule, ModuleWithProviders, APP_INITIALIZER } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { provideTranslations } from '@alfresco/adf-core';
import { CoreModule, SearchTextModule, provideTranslations } from '@alfresco/adf-core'; import { MatDatetimepickerModule, MatNativeDatetimeModule } from '@mat-datetimepicker/core';
import { MaterialModule } from './material.module';
import { CONTENT_TAG_DIRECTIVES } from './tag/tag.module'; import { CONTENT_TAG_DIRECTIVES } from './tag/tag.module';
import { DocumentListModule } from './document-list/document-list.module'; import { DOCUMENT_LIST_DIRECTIVES } from './document-list/document-list.module';
import { SearchModule } from './search/search.module'; import { CONTENT_SEARCH_DIRECTIVES } from './search/search.module';
import { BREADCRUMB_DIRECTIVES } from './breadcrumb/breadcrumb.module'; import { BREADCRUMB_DIRECTIVES } from './breadcrumb/breadcrumb.module';
import { CONTENT_VERSION_DIRECTIVES } from './version-manager/version-manager.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_NODE_SHARE_DIRECTIVES } from './content-node-share/content-node-share.module';
import { CONTENT_DIRECTIVES } from './directives/content-directive.module'; import { CONTENT_DIRECTIVES } from './directives/content-directive.module';
import { CONTENT_DIALOG_DIRECTIVES } from './dialogs/dialog.module'; import { CONTENT_DIALOG_DIRECTIVES } from './dialogs/dialog.module';
import { CONTENT_METADATA_DIRECTIVES } from './content-metadata/content-metadata.module'; import { CONTENT_METADATA_DIRECTIVES } from './content-metadata/content-metadata.module';
import { CONTENT_PERMISSION_MANAGER_DIRECTIVES } from './permission-manager/permission-manager.module'; import { CONTENT_PERMISSION_MANAGER_DIRECTIVES } from './permission-manager/permission-manager.module';
import { ContentTypeModule } from './content-type/content-type.module'; import { ASPECT_LIST_DIRECTIVES } from './aspect-list/aspect-list.module';
import { AspectListModule } from './aspect-list/aspect-list.module';
import { versionCompatibilityFactory } from './version-compatibility/version-compatibility-factory'; import { versionCompatibilityFactory } from './version-compatibility/version-compatibility-factory';
import { VersionCompatibilityService } from './version-compatibility/version-compatibility.service'; import { VersionCompatibilityService } from './version-compatibility/version-compatibility.service';
import { CONTENT_PIPES } from './pipes/content-pipe.module'; 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 { contentAuthLoaderFactory } from './auth-loader/content-auth-loader-factory';
import { ContentAuthLoaderService } from './auth-loader/content-auth-loader.service'; 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 { CategoriesManagementComponent } from './category';
import { TreeComponent } from './tree'; import { TreeComponent } from './tree';
import { NewVersionUploaderDialogComponent } from './new-version-uploader'; import { NewVersionUploaderDialogComponent } from './new-version-uploader';
import { VersionCompatibilityDirective } from './version-compatibility'; import { VersionCompatibilityDirective } from './version-compatibility';
import { CONTENT_UPLOAD_DIRECTIVES } from './upload'; import { CONTENT_UPLOAD_DIRECTIVES } from './upload';
import { TreeViewComponent } from './tree-view'; 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({ @NgModule({
imports: [ imports: [
...CONTENT_PIPES,
CoreModule,
...CONTENT_TAG_DIRECTIVES,
CommonModule,
FormsModule,
ReactiveFormsModule,
...CONTENT_DIALOG_DIRECTIVES,
SearchModule,
DocumentListModule,
...CONTENT_UPLOAD_DIRECTIVES,
MaterialModule, MaterialModule,
DropdownSitesComponent, MatDatetimepickerModule,
MatNativeDatetimeModule,
...CONTENT_PIPES,
...CONTENT_TAG_DIRECTIVES,
...CONTENT_DIALOG_DIRECTIVES,
...CONTENT_SEARCH_DIRECTIVES,
...DOCUMENT_LIST_DIRECTIVES,
...CONTENT_UPLOAD_DIRECTIVES,
...BREADCRUMB_DIRECTIVES, ...BREADCRUMB_DIRECTIVES,
ContentNodeSelectorModule, ...CONTENT_NODE_SELECTOR_DIRECTIVES,
...CONTENT_NODE_SHARE_DIRECTIVES, ...CONTENT_NODE_SHARE_DIRECTIVES,
...CONTENT_METADATA_DIRECTIVES, ...CONTENT_METADATA_DIRECTIVES,
...CONTENT_DIRECTIVES, ...CONTENT_DIRECTIVES,
...CONTENT_PERMISSION_MANAGER_DIRECTIVES, ...CONTENT_PERMISSION_MANAGER_DIRECTIVES,
...CONTENT_VERSION_DIRECTIVES, ...CONTENT_VERSION_DIRECTIVES,
TreeViewComponent, TreeViewComponent,
ContentTypeModule, ContentTypeDialogComponent,
AspectListModule, ...ASPECT_LIST_DIRECTIVES,
VersionCompatibilityDirective, VersionCompatibilityDirective,
NodeCommentsModule, NodeCommentsComponent,
TreeComponent, TreeComponent,
SearchTextModule, AlfrescoViewerComponent,
AlfrescoViewerModule,
CategoriesManagementComponent, CategoriesManagementComponent,
NewVersionUploaderDialogComponent NewVersionUploaderDialogComponent
], ],
providers: [provideTranslations('adf-content-services', 'assets/adf-content-services')], providers: [provideTranslations('adf-content-services', 'assets/adf-content-services')],
exports: [ exports: [
MaterialModule,
...CONTENT_PIPES, ...CONTENT_PIPES,
...CONTENT_TAG_DIRECTIVES, ...CONTENT_TAG_DIRECTIVES,
DocumentListModule, ...DOCUMENT_LIST_DIRECTIVES,
...CONTENT_UPLOAD_DIRECTIVES, ...CONTENT_UPLOAD_DIRECTIVES,
SearchModule, ...CONTENT_SEARCH_DIRECTIVES,
DropdownSitesComponent,
...BREADCRUMB_DIRECTIVES, ...BREADCRUMB_DIRECTIVES,
ContentNodeSelectorModule, ...CONTENT_NODE_SELECTOR_DIRECTIVES,
...CONTENT_NODE_SHARE_DIRECTIVES, ...CONTENT_NODE_SHARE_DIRECTIVES,
...CONTENT_METADATA_DIRECTIVES, ...CONTENT_METADATA_DIRECTIVES,
...CONTENT_DIALOG_DIRECTIVES, ...CONTENT_DIALOG_DIRECTIVES,
@ -97,13 +91,12 @@ import { TreeViewComponent } from './tree-view';
...CONTENT_PERMISSION_MANAGER_DIRECTIVES, ...CONTENT_PERMISSION_MANAGER_DIRECTIVES,
...CONTENT_VERSION_DIRECTIVES, ...CONTENT_VERSION_DIRECTIVES,
TreeViewComponent, TreeViewComponent,
AspectListModule, ...ASPECT_LIST_DIRECTIVES,
ContentTypeModule, ContentTypeDialogComponent,
VersionCompatibilityDirective, VersionCompatibilityDirective,
NodeCommentsModule, NodeCommentsComponent,
TreeComponent, TreeComponent,
SearchTextModule, AlfrescoViewerComponent,
AlfrescoViewerModule,
CategoriesManagementComponent, CategoriesManagementComponent,
NewVersionUploaderDialogComponent NewVersionUploaderDialogComponent
] ]
@ -131,6 +124,10 @@ export class ContentModule {
}; };
} }
/**
* @deprecated use `ContentModule` instead
* @returns ModuleWithProviders<ContentModule>
*/
static forChild(): ModuleWithProviders<ContentModule> { static forChild(): ModuleWithProviders<ContentModule> {
return { return {
ngModule: ContentModule ngModule: ContentModule

3
lib/content-services/src/lib/directives/check-allowable-operation.directive.spec.ts
View File

@ -20,7 +20,6 @@ import { ContentService } from '../common/services/content.service';
import { CheckAllowableOperationDirective } from './check-allowable-operation.directive'; import { CheckAllowableOperationDirective } from './check-allowable-operation.directive';
import { TestBed } from '@angular/core/testing'; import { TestBed } from '@angular/core/testing';
import { NodeAllowableOperationSubject } from '../interfaces/node-allowable-operation-subject.interface'; import { NodeAllowableOperationSubject } from '../interfaces/node-allowable-operation-subject.interface';
import { ContentDirectiveModule } from './content-directive.module';
import { RedirectAuthService } from '@alfresco/adf-core'; import { RedirectAuthService } from '@alfresco/adf-core';
import { EMPTY, of } from 'rxjs'; import { EMPTY, of } from 'rxjs';
import { HttpClientTestingModule } from '@angular/common/http/testing'; import { HttpClientTestingModule } from '@angular/common/http/testing';
@ -38,7 +37,7 @@ describe('CheckAllowableOperationDirective', () => {
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [ContentDirectiveModule, HttpClientTestingModule], imports: [HttpClientTestingModule],
providers: [{ provide: RedirectAuthService, useValue: { onLogin: EMPTY, onTokenReceived: of() } }] providers: [{ provide: RedirectAuthService, useValue: { onLogin: EMPTY, onTokenReceived: of() } }]
}); });
changeDetectorMock = { detectChanges: () => {} } as ChangeDetectorRef; changeDetectorMock = { detectChanges: () => {} } as ChangeDetectorRef;

3
lib/content-services/src/lib/directives/library-membership.directive.spec.ts
View File

@ -20,7 +20,6 @@ import { LibraryMembershipDirective } from './library-membership.directive';
import { SimpleChange } from '@angular/core'; import { SimpleChange } from '@angular/core';
import { of, throwError, Subject } from 'rxjs'; import { of, throwError, Subject } from 'rxjs';
import { AlfrescoApiService, AlfrescoApiServiceMock } from '@alfresco/adf-core'; import { AlfrescoApiService, AlfrescoApiServiceMock } from '@alfresco/adf-core';
import { ContentDirectiveModule } from './content-directive.module';
import { SitesService } from '../common/services/sites.service'; import { SitesService } from '../common/services/sites.service';
import { HttpClientTestingModule } from '@angular/common/http/testing'; import { HttpClientTestingModule } from '@angular/common/http/testing';
@ -38,7 +37,7 @@ describe('LibraryMembershipDirective', () => {
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [HttpClientTestingModule, ContentDirectiveModule], imports: [HttpClientTestingModule],
providers: [SitesService, { provide: AlfrescoApiService, useClass: AlfrescoApiServiceMock }] providers: [SitesService, { provide: AlfrescoApiService, useClass: AlfrescoApiServiceMock }]
}); });

17
lib/content-services/src/lib/directives/node-delete.directive.spec.ts
View File

@ -19,13 +19,15 @@ import { Component, DebugElement, ViewChild } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser'; import { By } from '@angular/platform-browser';
import { NodeDeleteDirective } from './node-delete.directive'; import { NodeDeleteDirective } from './node-delete.directive';
import { ContentDirectiveModule } from './content-directive.module';
import { HttpClientTestingModule } from '@angular/common/http/testing'; import { HttpClientTestingModule } from '@angular/common/http/testing';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import { RedirectAuthService, TranslationMock, TranslationService } from '@alfresco/adf-core'; import { RedirectAuthService, TranslationMock, TranslationService } from '@alfresco/adf-core';
import { EMPTY, of } from 'rxjs'; import { EMPTY, of } from 'rxjs';
import { CheckAllowableOperationDirective } from './check-allowable-operation.directive';
@Component({ @Component({
standalone: true,
imports: [NodeDeleteDirective],
template: `<div id="delete-component" [adf-delete]="selection" (delete)="onDelete()"></div>` template: `<div id="delete-component" [adf-delete]="selection" (delete)="onDelete()"></div>`
}) })
class TestComponent { class TestComponent {
@ -38,10 +40,12 @@ class TestComponent {
} }
@Component({ @Component({
template: `<div id="delete-component" [adf-check-allowable-operation]="selection" [adf-delete]="selection" (delete)="onDelete($event)"></div>` standalone: true,
imports: [NodeDeleteDirective, CheckAllowableOperationDirective],
template: `<div id="delete-component" [adf-check-allowable-operation]="'delete'" [adf-delete]="selection" (delete)="onDelete($event)"></div>`
}) })
class TestWithPermissionsComponent { class TestWithPermissionsComponent {
selection = []; selection: any[] = [];
@ViewChild(NodeDeleteDirective, { static: true }) @ViewChild(NodeDeleteDirective, { static: true })
deleteDirective: NodeDeleteDirective; deleteDirective: NodeDeleteDirective;
@ -50,6 +54,8 @@ class TestWithPermissionsComponent {
} }
@Component({ @Component({
standalone: true,
imports: [NodeDeleteDirective],
template: ` delete permanent template: ` delete permanent
<div id="delete-permanent" [adf-delete]="selection" [permanent]="permanent" (delete)="onDelete($event)"></div>` <div id="delete-permanent" [adf-delete]="selection" [permanent]="permanent" (delete)="onDelete($event)"></div>`
}) })
@ -79,12 +85,11 @@ describe('NodeDeleteDirective', () => {
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [ContentDirectiveModule, HttpClientTestingModule, TranslateModule.forRoot()], imports: [HttpClientTestingModule, TranslateModule.forRoot(), TestComponent, TestWithPermissionsComponent, TestDeletePermanentComponent],
providers: [ providers: [
{ provide: TranslationService, useClass: TranslationMock }, { provide: TranslationService, useClass: TranslationMock },
{ provide: RedirectAuthService, useValue: { onLogin: EMPTY, onTokenReceived: of() } } { provide: RedirectAuthService, useValue: { onLogin: EMPTY, onTokenReceived: of() } }
], ]
declarations: [TestComponent, TestWithPermissionsComponent, TestDeletePermanentComponent]
}); });
fixture = TestBed.createComponent(TestComponent); fixture = TestBed.createComponent(TestComponent);
fixtureWithPermissions = TestBed.createComponent(TestWithPermissionsComponent); fixtureWithPermissions = TestBed.createComponent(TestWithPermissionsComponent);

18
lib/content-services/src/lib/directives/node-download.directive.spec.ts
View File

@ -21,18 +21,20 @@ import { MatDialog, MatDialogModule } from '@angular/material/dialog';
import { Component, DebugElement, ViewChild } from '@angular/core'; import { Component, DebugElement, ViewChild } from '@angular/core';
import { AlfrescoApiService, AlfrescoApiServiceMock } from '@alfresco/adf-core'; import { AlfrescoApiService, AlfrescoApiServiceMock } from '@alfresco/adf-core';
import { NodeDownloadDirective } from './node-download.directive'; import { NodeDownloadDirective } from './node-download.directive';
import { ContentDirectiveModule } from '@alfresco/adf-content-services';
import { HttpClientTestingModule } from '@angular/common/http/testing'; import { HttpClientTestingModule } from '@angular/common/http/testing';
import { ContentApi } from '@alfresco/js-api';
@Component({ @Component({
standalone: true,
imports: [NodeDownloadDirective],
template: '<div [adfNodeDownload]="selection" [version]="version"></div>' template: '<div [adfNodeDownload]="selection" [version]="version"></div>'
}) })
class TestComponent { class TestComponent {
@ViewChild(NodeDownloadDirective, { static: true }) @ViewChild(NodeDownloadDirective, { static: true })
downloadDirective: NodeDownloadDirective; downloadDirective: NodeDownloadDirective;
selection; selection: any[];
version; version: any;
} }
describe('NodeDownloadDirective', () => { describe('NodeDownloadDirective', () => {
@ -41,8 +43,9 @@ describe('NodeDownloadDirective', () => {
let element: DebugElement; let element: DebugElement;
let dialog: MatDialog; let dialog: MatDialog;
let apiService: AlfrescoApiService; let apiService: AlfrescoApiService;
let contentService; let contentService: ContentApi;
let dialogSpy; let dialogSpy: jasmine.Spy;
const mockOauth2Auth: any = { const mockOauth2Auth: any = {
oauth2Auth: { oauth2Auth: {
callCustomApi: () => Promise.resolve() callCustomApi: () => Promise.resolve()
@ -53,8 +56,7 @@ describe('NodeDownloadDirective', () => {
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [ContentDirectiveModule, HttpClientTestingModule, MatDialogModule], imports: [HttpClientTestingModule, MatDialogModule, TestComponent],
declarations: [TestComponent],
providers: [{ provide: AlfrescoApiService, useClass: AlfrescoApiServiceMock }] providers: [{ provide: AlfrescoApiService, useClass: AlfrescoApiServiceMock }]
}); });
fixture = TestBed.createComponent(TestComponent); fixture = TestBed.createComponent(TestComponent);
@ -62,7 +64,7 @@ describe('NodeDownloadDirective', () => {
element = fixture.debugElement.query(By.directive(NodeDownloadDirective)); element = fixture.debugElement.query(By.directive(NodeDownloadDirective));
dialog = TestBed.inject(MatDialog); dialog = TestBed.inject(MatDialog);
apiService = TestBed.inject(AlfrescoApiService); apiService = TestBed.inject(AlfrescoApiService);
contentService = component.downloadDirective['contentApi']; contentService = component.downloadDirective.contentApi;
dialogSpy = spyOn(dialog, 'open'); dialogSpy = spyOn(dialog, 'open');
}); });

29
lib/content-services/src/lib/directives/node-restore.directive.spec.ts
View File

@ -20,15 +20,17 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser'; import { By } from '@angular/platform-browser';
import { NodeRestoreDirective } from './node-restore.directive'; import { NodeRestoreDirective } from './node-restore.directive';
import { TranslationMock, TranslationService } from '@alfresco/adf-core'; import { TranslationMock, TranslationService } from '@alfresco/adf-core';
import { ContentDirectiveModule } from './content-directive.module';
import { HttpClientTestingModule } from '@angular/common/http/testing'; import { HttpClientTestingModule } from '@angular/common/http/testing';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import { TrashcanApi } from '@alfresco/js-api';
@Component({ @Component({
standalone: true,
imports: [NodeRestoreDirective],
template: ` <div [adf-restore]="selection" (restore)="doneSpy()"></div>` template: ` <div [adf-restore]="selection" (restore)="doneSpy()"></div>`
}) })
class TestComponent { class TestComponent {
selection = []; selection: any[] = [];
doneSpy = jasmine.createSpy('doneSpy'); doneSpy = jasmine.createSpy('doneSpy');
} }
@ -37,25 +39,24 @@ describe('NodeRestoreDirective', () => {
let fixture: ComponentFixture<TestComponent>; let fixture: ComponentFixture<TestComponent>;
let element: DebugElement; let element: DebugElement;
let component: TestComponent; let component: TestComponent;
let trashcanApi; let trashcanApi: TrashcanApi;
let directiveInstance; let directiveInstance: NodeRestoreDirective;
let restoreNodeSpy: any; let restoreNodeSpy: any;
let translationService: TranslationService; let translationService: TranslationService;
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [ContentDirectiveModule, HttpClientTestingModule, TranslateModule.forRoot()], imports: [HttpClientTestingModule, TranslateModule.forRoot(), TestComponent],
providers: [{ provide: TranslationService, useClass: TranslationMock }], providers: [{ provide: TranslationService, useClass: TranslationMock }]
declarations: [TestComponent]
}); });
fixture = TestBed.createComponent(TestComponent); fixture = TestBed.createComponent(TestComponent);
component = fixture.componentInstance; component = fixture.componentInstance;
element = fixture.debugElement.query(By.directive(NodeRestoreDirective)); element = fixture.debugElement.query(By.directive(NodeRestoreDirective));
directiveInstance = element.injector.get(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( spyOn(trashcanApi, 'listDeletedNodes').and.returnValue(
Promise.resolve({ Promise.resolve({
list: { entries: [] } 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) => { it('should emit event on finish', (done) => {
spyOn(element.nativeElement, 'dispatchEvent'); spyOn(element.nativeElement, 'dispatchEvent');

10
lib/content-services/src/lib/document-list/components/content-action/content-action-list.component.ts
View File

@ -15,21 +15,19 @@
* limitations under the License. * limitations under the License.
*/ */
/* eslint-disable @angular-eslint/component-selector */ /* eslint-disable @angular-eslint/component-selector */
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { ContentActionModel } from './../../models/content-action.model'; import { ContentActionModel } from './../../models/content-action.model';
import { DocumentListComponent } from './../document-list.component'; import { DocumentListComponent } from './../document-list.component';
@Component({ @Component({
selector: 'content-actions', selector: 'content-actions',
template: '' template: '',
standalone: true
}) })
export class ContentActionListComponent { export class ContentActionListComponent {
constructor(private documentList: DocumentListComponent) {}
constructor(private documentList: DocumentListComponent) {
}
/** /**
* Registers action handler within the parent document list component. * Registers action handler within the parent document list component.

13
lib/content-services/src/lib/document-list/components/content-action/content-action.component.ts
View File

@ -15,7 +15,7 @@
* limitations under the License. * 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'; import { Component, EventEmitter, Input, OnInit, Output, OnChanges, SimpleChanges, OnDestroy } from '@angular/core';
@ -28,14 +28,11 @@ import { Subscription } from 'rxjs';
@Component({ @Component({
selector: 'content-action', selector: 'content-action',
standalone: true,
template: '', template: '',
providers: [ providers: [DocumentActionsService, FolderActionsService]
DocumentActionsService,
FolderActionsService
]
}) })
export class ContentActionComponent implements OnInit, OnChanges, OnDestroy { export class ContentActionComponent implements OnInit, OnChanges, OnDestroy {
/** The title of the action as shown in the menu. */ /** The title of the action as shown in the menu. */
@Input() @Input()
title: string = 'Action'; title: string = 'Action';
@ -98,8 +95,8 @@ export class ContentActionComponent implements OnInit, OnChanges, OnDestroy {
constructor( constructor(
private list: ContentActionListComponent, private list: ContentActionListComponent,
private documentActions: DocumentActionsService, private documentActions: DocumentActionsService,
private folderActions: FolderActionsService) { private folderActions: FolderActionsService
} ) {}
ngOnInit() { ngOnInit() {
if (this.target === ContentActionTarget.All) { if (this.target === ContentActionTarget.All) {

18
lib/content-services/src/lib/document-list/components/document-list.component.spec.ts
View File

@ -18,11 +18,11 @@
import { import {
AppConfigService, AppConfigService,
AuthenticationService, AuthenticationService,
CustomLoadingContentTemplateDirective,
DataColumn, DataColumn,
DataColumnComponent, DataColumnComponent,
DataColumnListComponent, DataColumnListComponent,
DataTableComponent, DataTableComponent,
DataTableModule,
ObjectDataTableAdapter, ObjectDataTableAdapter,
ShowHeaderMode, ShowHeaderMode,
ThumbnailService ThumbnailService
@ -56,13 +56,13 @@ import { ImageResolver } from '../data/image-resolver.model';
import { RowFilter } from '../data/row-filter.model'; import { RowFilter } from '../data/row-filter.model';
import { ShareDataRow } from '../data/share-data-row.model'; import { ShareDataRow } from '../data/share-data-row.model';
import { ShareDataTableAdapter } from '../data/share-datatable-adapter'; import { ShareDataTableAdapter } from '../data/share-datatable-adapter';
import { DocumentListModule } from '../document-list.module';
import { ContentActionModel } from '../models/content-action.model'; import { ContentActionModel } from '../models/content-action.model';
import { DocumentLoaderNode } from '../models/document-folder.model'; import { DocumentLoaderNode } from '../models/document-folder.model';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { FileAutoDownloadComponent } from './file-auto-download/file-auto-download.component'; import { FileAutoDownloadComponent } from './file-auto-download/file-auto-download.component';
import { DocumentListComponent } from './document-list.component'; import { DocumentListComponent } from './document-list.component';
import { CustomResourcesService, DocumentListService } from '../public-api'; import { CustomResourcesService, DocumentListService } from '../public-api';
import { CommonModule } from '@angular/common';
const mockDialog = { const mockDialog = {
open: jasmine.createSpy('open') open: jasmine.createSpy('open')
@ -87,7 +87,7 @@ describe('DocumentList', () => {
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [ContentTestingModule], imports: [ContentTestingModule, DocumentListComponent],
schemas: [CUSTOM_ELEMENTS_SCHEMA], schemas: [CUSTOM_ELEMENTS_SCHEMA],
providers: [{ provide: MatDialog, useValue: mockDialog }] providers: [{ provide: MatDialog, useValue: mockDialog }]
}); });
@ -109,7 +109,7 @@ describe('DocumentList', () => {
spyFolder = spyOn(documentListService, 'getFolder').and.returnValue(of({ list: {} })); spyFolder = spyOn(documentListService, 'getFolder').and.returnValue(of({ list: {} }));
spyFolderNode = spyOn(documentListService, 'getFolderNode').and.returnValue(of(new NodeEntry({ entry: new Node() }))); 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.ngOnInit();
documentList.currentFolderId = 'no-node'; documentList.currentFolderId = 'no-node';
@ -1608,6 +1608,9 @@ describe('DocumentList', () => {
}); });
it('should display fileAutoDownload dialog if node size exceeds appConfig.viewer.fileAutoDownloadSizeThresholdInMB', async () => { 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 = {
...appConfigService.config, ...appConfigService.config,
viewer: { viewer: {
@ -1630,7 +1633,7 @@ describe('DocumentList', () => {
fixture.detectChanges(); fixture.detectChanges();
await fixture.whenStable(); await fixture.whenStable();
expect(mockDialog.open).toHaveBeenCalledWith(FileAutoDownloadComponent, { disableClose: true, data: node }); expect(dialog.open).toHaveBeenCalledWith(FileAutoDownloadComponent, { disableClose: true, data: node });
}); });
describe('Preselect nodes', () => { describe('Preselect nodes', () => {
@ -1870,6 +1873,8 @@ describe('DocumentList', () => {
}); });
@Component({ @Component({
standalone: true,
imports: [CommonModule, DocumentListComponent, CustomLoadingContentTemplateDirective],
template: ` template: `
<adf-document-list #customDocumentList> <adf-document-list #customDocumentList>
<adf-custom-loading-content-template> <adf-custom-loading-content-template>
@ -1896,8 +1901,7 @@ describe('DocumentListComponent rendering', () => {
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
declarations: [CustomTemplateComponent], imports: [ContentTestingModule, CustomTemplateComponent]
imports: [ContentTestingModule, DataTableModule, DocumentListModule]
}); });
fixture = TestBed.createComponent(CustomTemplateComponent); fixture = TestBed.createComponent(CustomTemplateComponent);
component = fixture.componentInstance; component = fixture.componentInstance;

26
lib/content-services/src/lib/document-list/components/document-list.component.ts
View File

@ -21,6 +21,7 @@
import { import {
AlfrescoApiService, AlfrescoApiService,
AppConfigService, AppConfigService,
ColumnsSelectorComponent,
CustomEmptyContentTemplateDirective, CustomEmptyContentTemplateDirective,
CustomLoadingContentTemplateDirective, CustomLoadingContentTemplateDirective,
CustomNoPermissionTemplateDirective, CustomNoPermissionTemplateDirective,
@ -33,6 +34,11 @@ import {
DataTableComponent, DataTableComponent,
DataTableSchema, DataTableSchema,
DataTableService, DataTableService,
EmptyListComponent,
LoadingContentTemplateDirective,
MainMenuDataTableTemplateDirective,
NoContentTemplateDirective,
NoPermissionTemplateDirective,
PaginatedComponent, PaginatedComponent,
PaginationModel, PaginationModel,
RequestPaginationModel, RequestPaginationModel,
@ -75,11 +81,31 @@ import { LockService } from '../services/lock.service';
import { ADF_DOCUMENT_PARENT_COMPONENT } from './document-list.token'; import { ADF_DOCUMENT_PARENT_COMPONENT } from './document-list.token';
import { FileAutoDownloadComponent } from './file-auto-download/file-auto-download.component'; import { FileAutoDownloadComponent } from './file-auto-download/file-auto-download.component';
import { NodeEntityEvent, NodeEntryEvent } from './node.event'; 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; const BYTES_TO_MB_CONVERSION_VALUE = 1048576;
@Component({ @Component({
selector: 'adf-document-list', selector: 'adf-document-list',
standalone: true,
imports: [
CommonModule,
DataTableComponent,
FilterHeaderComponent,
NoContentTemplateDirective,
EmptyListComponent,
TranslateModule,
NoPermissionTemplateDirective,
MatIconModule,
LoadingContentTemplateDirective,
MatProgressSpinnerModule,
MainMenuDataTableTemplateDirective,
ColumnsSelectorComponent
],
templateUrl: './document-list.component.html', templateUrl: './document-list.component.html',
styleUrls: ['./document-list.component.scss'], styleUrls: ['./document-list.component.scss'],
providers: [ providers: [

12
lib/content-services/src/lib/document-list/components/file-auto-download/file-auto-download.component.spec.ts
View File

@ -23,7 +23,7 @@ import { By } from '@angular/platform-browser';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import { TranslationMock, TranslationService } from '@alfresco/adf-core'; import { TranslationMock, TranslationService } from '@alfresco/adf-core';
import { MatButtonModule } from '@angular/material/button'; import { MatButtonModule } from '@angular/material/button';
import { NodeDownloadDirective } from '../../../directives'; import { NodeDownloadDirective } from '../../../directives/node-download.directive';
import { HttpClientTestingModule } from '@angular/common/http/testing'; import { HttpClientTestingModule } from '@angular/common/http/testing';
const mockDialog = { const mockDialog = {
@ -37,8 +37,14 @@ describe('FileAutoDownloadComponent', () => {
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [HttpClientTestingModule, TranslateModule.forRoot(), MatDialogModule, MatButtonModule, NodeDownloadDirective], imports: [
declarations: [FileAutoDownloadComponent], HttpClientTestingModule,
TranslateModule.forRoot(),
MatDialogModule,
MatButtonModule,
NodeDownloadDirective,
FileAutoDownloadComponent
],
providers: [ providers: [
{ provide: MatDialogRef, useValue: mockDialog }, { provide: MatDialogRef, useValue: mockDialog },
{ provide: MAT_DIALOG_DATA, useValue: null }, { provide: MAT_DIALOG_DATA, useValue: null },

12
lib/content-services/src/lib/document-list/components/file-auto-download/file-auto-download.component.ts
View File

@ -16,12 +16,18 @@
*/ */
import { Component, Inject } from '@angular/core'; 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 { 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({ @Component({
selector: 'adf-file-auto-download', selector: 'adf-file-auto-download',
templateUrl: './file-auto-download.component.html' standalone: true,
imports: [CommonModule, MatDialogModule, TranslateModule, MatButtonModule, NodeDownloadDirective],
templateUrl: './file-auto-download.component.html'
}) })
export class FileAutoDownloadComponent { export class FileAutoDownloadComponent {
constructor(@Inject(MAT_DIALOG_DATA) public node: NodeEntry) {} constructor(@Inject(MAT_DIALOG_DATA) public node: NodeEntry) {}

2
lib/content-services/src/lib/document-list/components/filter-header/filter-header.component.spec.ts
View File

@ -48,7 +48,7 @@ describe('FilterHeaderComponent', () => {
beforeEach(() => { beforeEach(() => {
TestBed.configureTestingModule({ TestBed.configureTestingModule({
imports: [ContentTestingModule], imports: [ContentTestingModule, FilterHeaderComponent],
providers: [ providers: [
{ provide: ADF_DOCUMENT_PARENT_COMPONENT, useExisting: DocumentListComponent }, { provide: ADF_DOCUMENT_PARENT_COMPONENT, useExisting: DocumentListComponent },
{ provide: SearchService, useValue: searchMock }, { provide: SearchService, useValue: searchMock },

6
lib/content-services/src/lib/document-list/components/filter-header/filter-header.component.ts
View File

@ -16,15 +16,19 @@
*/ */
import { Component, Inject, OnInit, OnChanges, SimpleChanges, Input, Output, EventEmitter, OnDestroy } from '@angular/core'; 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 { SearchHeaderQueryBuilderService } from '../../../search/services/search-header-query-builder.service';
import { FilterSearch } from './../../../search/models/filter-search.interface'; import { FilterSearch } from './../../../search/models/filter-search.interface';
import { Subject } from 'rxjs'; import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
import { ADF_DOCUMENT_PARENT_COMPONENT } from '../document-list.token'; 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({ @Component({
selector: 'adf-filter-header', selector: 'adf-filter-header',
standalone: true,
imports: [CommonModule, HeaderFilterTemplateDirective, SearchFilterContainerComponent],
templateUrl: './filter-header.component.html' templateUrl: './filter-header.component.html'
}) })
export class FilterHeaderComponent implements OnInit, OnChanges, OnDestroy { export class FilterHeaderComponent implements OnInit, OnChanges, OnDestroy {

Some files were not shown because too many files have changed in this diff Show More