diff --git a/lib/process-services/src/lib/process-list/components/start-process.component.html b/lib/process-services/src/lib/process-list/components/start-process.component.html
index fc7cc0c1e4..fdba0a79c0 100644
--- a/lib/process-services/src/lib/process-list/components/start-process.component.html
+++ b/lib/process-services/src/lib/process-list/components/start-process.component.html
@@ -14,7 +14,7 @@
+ [attr.data-automation-id]="'adf-start-process-apps-option-' + application.name">
{{ application.name }}
@@ -38,13 +38,18 @@
{{ processDef.name }}
-
+
+
+
+
+
+
diff --git a/lib/process-services/src/lib/process-list/components/start-process.component.scss b/lib/process-services/src/lib/process-list/components/start-process.component.scss
index 49e5be1581..fa69c869cc 100644
--- a/lib/process-services/src/lib/process-list/components/start-process.component.scss
+++ b/lib/process-services/src/lib/process-list/components/start-process.component.scss
@@ -33,6 +33,11 @@
right: -14px;
top: 0;
}
+ mat-spinner {
+ position: absolute;
+ right: -1px;
+ top: 0;
+ }
}
&-start-form-container {
.mat-card {
diff --git a/lib/process-services/src/lib/process-list/components/start-process.component.spec.ts b/lib/process-services/src/lib/process-list/components/start-process.component.spec.ts
index 623a2c55b1..637a5936fc 100644
--- a/lib/process-services/src/lib/process-list/components/start-process.component.spec.ts
+++ b/lib/process-services/src/lib/process-list/components/start-process.component.spec.ts
@@ -686,5 +686,65 @@ describe('StartFormComponent', () => {
const appsSelector = fixture.nativeElement.querySelector('[data-automation-id="adf-start-process-apps-drop-down"]');
expect(appsSelector).toBeNull();
});
+
+ it('Should be able to disable process name and definitions inputs if there is no application selected by default', () => {
+ component.appId = 12345;
+ const change = new SimpleChange(null, 12345, true);
+ component.ngOnChanges({ 'appId': change });
+ fixture.detectChanges();
+ expect(getDeployedApplicationsSpy).toHaveBeenCalled();
+ expect(component.applications.length).toEqual(6);
+ expect(component.selectedApplication).toBeUndefined();
+
+ const processDefinitionSelectInput = fixture.nativeElement.querySelector('#processDefinitionName');
+ const processNameInput = fixture.nativeElement.querySelector('#processName');
+
+ expect(processDefinitionSelectInput.disabled).toEqual(true);
+ expect(processNameInput.disabled).toEqual(true);
+ });
+
+ it('Should be able to enable process name and definitions inputs if the application selected by given appId', () => {
+ component.appId = 2;
+ const change = new SimpleChange(null, 2, true);
+ component.ngOnChanges({ 'appId': change });
+ fixture.detectChanges();
+ expect(getDeployedApplicationsSpy).toHaveBeenCalled();
+ expect(component.applications.length).toEqual(6);
+ expect(component.selectedApplication.id).toEqual(component.appId);
+
+ const processDefinitionSelectInput = fixture.nativeElement.querySelector('#processDefinitionName');
+ const processNameInput = fixture.nativeElement.querySelector('#processName');
+
+ expect(processDefinitionSelectInput.disabled).toEqual(false);
+ expect(processNameInput.disabled).toEqual(false);
+ });
+
+ it('Should be able to enable process name and definitions inputs when the application selected from the apps drop-down', () => {
+ component.appId = 12345;
+ const change = new SimpleChange(null, 12345, true);
+ component.ngOnChanges({ 'appId': change });
+ fixture.detectChanges();
+ expect(getDeployedApplicationsSpy).toHaveBeenCalled();
+ expect(component.applications.length).toEqual(6);
+ expect(component.selectedApplication).toBeUndefined();
+
+ const appsSelectElement = fixture.nativeElement.querySelector('[data-automation-id="adf-start-process-apps-drop-down"]');
+ const processDefinitionSelectInput = fixture.nativeElement.querySelector('#processDefinitionName');
+ const processNameInput = fixture.nativeElement.querySelector('#processName');
+
+ expect(processDefinitionSelectInput.disabled).toEqual(true);
+ expect(processNameInput.disabled).toEqual(true);
+
+ appsSelectElement.click();
+ fixture.detectChanges();
+ const sortOptions = document.querySelector('[data-automation-id="adf-start-process-apps-option-App2"]');
+ sortOptions.dispatchEvent(new Event('click'));
+ fixture.detectChanges();
+ expect(component.selectedApplication.id).toBe(2);
+ expect(component.selectedApplication.name).toBe('App2');
+
+ expect(processDefinitionSelectInput.disabled).toEqual(false);
+ expect(processNameInput.disabled).toEqual(false);
+ });
});
});
diff --git a/lib/process-services/src/lib/process-list/components/start-process.component.ts b/lib/process-services/src/lib/process-list/components/start-process.component.ts
index 6af624e874..795e4ab6c9 100644
--- a/lib/process-services/src/lib/process-list/components/start-process.component.ts
+++ b/lib/process-services/src/lib/process-list/components/start-process.component.ts
@@ -123,7 +123,7 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
alfrescoRepositoryName: string;
applications: AppDefinitionRepresentationModel[] = [];
selectedApplication: AppDefinitionRepresentationModel;
-
+ isProcessDefinitionsLoading = true;
private onDestroy$ = new Subject();
constructor(private activitiProcess: ProcessService,
private activitiContentService: ActivitiContentService,
@@ -217,6 +217,7 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
}
loadProcessDefinitions(appId: any): void {
+ this.isProcessDefinitionsLoading = true;
this.resetSelectedProcessDefinition();
this.resetErrorMessage();
@@ -245,9 +246,11 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
this.selectedProcessDef = filteredProcessDefinitions.currentProcessDef;
this.processDefinitionInput.setValue(this.selectedProcessDef ? this.selectedProcessDef.name : '');
this.processDefinitionSelection.emit(this.selectedProcessDef);
+ this.isProcessDefinitionsLoading = false;
},
() => {
this.errorMessageId = 'ADF_PROCESS_LIST.START_PROCESS.ERROR.LOAD_PROCESS_DEFS';
+ this.isProcessDefinitionsLoading = false;
});
}
@@ -260,6 +263,7 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
if (filteredProcessDef) {
this.selectedProcessDef = filteredProcessDef;
this.processDefinitionInput.setValue(this.selectedProcessDef ? this.selectedProcessDef.name : '');
+ this.processDefinitionSelection.emit(this.selectedProcessDef);
}
}
}
@@ -288,6 +292,7 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
this.applications = filteredApps.applications;
this.selectedApplication = filteredApps.currentApplication;
this.applicationSelection.emit(this.selectedApplication);
+ this.toggleProcessNameAndDefinitionsDropdown();
this.loadProcessDefinitions(this.selectedApplication ? this.selectedApplication.id : null);
},
err => {
@@ -300,9 +305,14 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
onAppSelectionChange(selectedApplication: any) {
this.selectedApplication = selectedApplication.value;
this.applicationSelection.emit(this.selectedApplication);
+ this.toggleProcessNameAndDefinitionsDropdown();
this.loadProcessDefinitions(this.selectedApplication.id);
}
+ private isAppSelected(): boolean {
+ return !!(this.selectedApplication && this.selectedApplication.id);
+ }
+
private removeDefaultApps(apps: AppDefinitionRepresentationModel []): AppDefinitionRepresentationModel[] {
return apps.filter((app) => app.id);
@@ -425,6 +435,20 @@ export class StartProcessInstanceComponent implements OnChanges, OnInit, OnDestr
return this.processNameInput;
}
+ get processDefinitionController(): AbstractControl {
+ return this.processDefinitionInput;
+ }
+
+ private toggleProcessNameAndDefinitionsDropdown() {
+ if (!this.isAppSelected()) {
+ this.processDefinitionController.disable();
+ this.nameController.disable();
+ } else {
+ this.processDefinitionController.enable();
+ this.nameController.enable();
+ }
+ }
+
processDefinitionSelectionChanged(processDefinition) {
this.selectedProcessDef = processDefinition;
this.processDefinitionSelection.emit(this.selectedProcessDef);