mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[AAE-14061] Fix spinner disappearing too early in task lists (#8577)
This commit is contained in:
@@ -4,7 +4,7 @@
|
||||
[rows]="rows"
|
||||
[columns]="columns"
|
||||
[data]="dataAdapter"
|
||||
[loading]="isLoading"
|
||||
[loading]="isLoading$ | async"
|
||||
[sorting]="formattedSorting"
|
||||
[multiselect]="multiselect"
|
||||
[selectionMode]="selectionMode"
|
||||
|
@@ -24,7 +24,7 @@ import {
|
||||
} from '@alfresco/adf-core';
|
||||
import { taskPresetsCloudDefaultModel } from '../models/task-preset-cloud.model';
|
||||
import { TaskQueryCloudRequestModel } from '../../../models/filter-cloud-model';
|
||||
import { BehaviorSubject, Subject } from 'rxjs';
|
||||
import { BehaviorSubject, Observable, Subject } from 'rxjs';
|
||||
import { TaskListCloudSortingModel } from '../../../models/task-list-sorting.model';
|
||||
import { map, take, takeUntil } from 'rxjs/operators';
|
||||
import { TaskCloudService } from '../../services/task-cloud.service';
|
||||
@@ -119,7 +119,6 @@ export abstract class BaseTaskListCloudComponent<T = unknown> extends DataTableS
|
||||
size: number;
|
||||
skipCount: number = 0;
|
||||
currentInstanceId: any;
|
||||
isLoading = true;
|
||||
selectedInstances: any[];
|
||||
formattedSorting: any[];
|
||||
dataAdapter: ObjectDataTableAdapter | undefined;
|
||||
@@ -129,6 +128,9 @@ export abstract class BaseTaskListCloudComponent<T = unknown> extends DataTableS
|
||||
|
||||
private onDestroy$ = new Subject<boolean>();
|
||||
|
||||
protected abstract isLoading$: Observable<boolean>;
|
||||
protected isLoadingPreferences$ = new BehaviorSubject<boolean>(true);
|
||||
|
||||
constructor(appConfigService: AppConfigService,
|
||||
private taskCloudService: TaskCloudService,
|
||||
private userPreferences: UserPreferencesService,
|
||||
@@ -169,7 +171,7 @@ export abstract class BaseTaskListCloudComponent<T = unknown> extends DataTableS
|
||||
}
|
||||
|
||||
private retrieveTasksPreferences(): void {
|
||||
this.isLoading = true;
|
||||
this.isLoadingPreferences$.next(true);
|
||||
this.cloudPreferenceService.getPreferences(this.appName).pipe(
|
||||
take(1),
|
||||
map((preferences => {
|
||||
@@ -199,10 +201,10 @@ export abstract class BaseTaskListCloudComponent<T = unknown> extends DataTableS
|
||||
|
||||
this.createDatatableSchema();
|
||||
this.createColumns();
|
||||
this.isLoading = false;
|
||||
this.isLoadingPreferences$.next(false);
|
||||
}, (error) => {
|
||||
this.error.emit(error);
|
||||
this.isLoading = false;
|
||||
this.isLoadingPreferences$.next(false);
|
||||
});
|
||||
}
|
||||
|
||||
|
@@ -128,9 +128,7 @@ describe('ServiceTaskListCloudComponent', () => {
|
||||
it('should display empty content when process list is empty', () => {
|
||||
const emptyList = { list: { entries: [] } };
|
||||
spyOn(serviceTaskListCloudService, 'getServiceTaskByRequest').and.returnValue(of(emptyList));
|
||||
|
||||
fixture.detectChanges();
|
||||
expect(component.isLoading).toBe(false);
|
||||
|
||||
const loadingContent = fixture.debugElement.query(By.css('mat-progress-spinner'));
|
||||
expect(loadingContent).toBeFalsy();
|
||||
@@ -144,12 +142,9 @@ describe('ServiceTaskListCloudComponent', () => {
|
||||
const appName = new SimpleChange(null, 'FAKE-APP-NAME', true);
|
||||
|
||||
fixture.detectChanges();
|
||||
expect(component.isLoading).toBe(false);
|
||||
|
||||
component.ngOnChanges({ appName });
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(component.isLoading).toBe(false);
|
||||
const loadingContent = fixture.debugElement.query(By.css('mat-progress-spinner'));
|
||||
expect(loadingContent).toBeFalsy();
|
||||
|
||||
|
@@ -23,9 +23,9 @@ import { ServiceTaskQueryCloudRequestModel } from '../models/service-task-cloud.
|
||||
import { BaseTaskListCloudComponent } from './base-task-list-cloud.component';
|
||||
import { ServiceTaskListCloudService } from '../services/service-task-list-cloud.service';
|
||||
import { TaskCloudService } from '../../services/task-cloud.service';
|
||||
import { Subject, combineLatest } from 'rxjs';
|
||||
import { Subject, combineLatest, BehaviorSubject } from 'rxjs';
|
||||
import { PreferenceCloudServiceInterface, TASK_LIST_PREFERENCES_SERVICE_TOKEN } from '../../../services/public-api';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { map, takeUntil } from 'rxjs/operators';
|
||||
|
||||
const PRESET_KEY = 'adf-cloud-service-task-list.presets';
|
||||
|
||||
@@ -41,6 +41,14 @@ export class ServiceTaskListCloudComponent extends BaseTaskListCloudComponent im
|
||||
|
||||
private onDestroyServiceTaskList$ = new Subject<boolean>();
|
||||
|
||||
private isReloadingSubject$ = new BehaviorSubject<boolean>(false);
|
||||
isLoading$ = combineLatest([
|
||||
this.isLoadingPreferences$,
|
||||
this.isReloadingSubject$
|
||||
]).pipe(
|
||||
map(([isLoadingPreferences, isReloading]) => isLoadingPreferences || isReloading)
|
||||
);
|
||||
|
||||
constructor(private serviceTaskListCloudService: ServiceTaskListCloudService,
|
||||
appConfigService: AppConfigService,
|
||||
taskCloudService: TaskCloudService,
|
||||
@@ -56,6 +64,8 @@ export class ServiceTaskListCloudComponent extends BaseTaskListCloudComponent im
|
||||
}
|
||||
|
||||
reload() {
|
||||
this.isReloadingSubject$.next(true);
|
||||
|
||||
this.requestNode = this.createRequestNode();
|
||||
|
||||
if (this.requestNode.appName || this.requestNode.appName === '') {
|
||||
@@ -70,9 +80,10 @@ export class ServiceTaskListCloudComponent extends BaseTaskListCloudComponent im
|
||||
this.rows = tasks.list.entries;
|
||||
this.success.emit(tasks);
|
||||
this.pagination.next(tasks.list.pagination);
|
||||
this.isReloadingSubject$.next(false);
|
||||
}, (error) => {
|
||||
this.error.emit(error);
|
||||
this.isLoading = false;
|
||||
this.isReloadingSubject$.next(false);
|
||||
});
|
||||
} else {
|
||||
this.rows = [];
|
||||
|
@@ -168,7 +168,6 @@ describe('TaskListCloudComponent', () => {
|
||||
const emptyList = { list: { entries: [] } };
|
||||
spyOn(taskListCloudService, 'getTaskByRequest').and.returnValue(of(emptyList));
|
||||
fixture.detectChanges();
|
||||
expect(component.isLoading).toBe(false);
|
||||
|
||||
const appName = new SimpleChange(null, 'FAKE-APP-NAME', true);
|
||||
component.ngOnChanges({ appName });
|
||||
@@ -186,12 +185,9 @@ describe('TaskListCloudComponent', () => {
|
||||
const appName = new SimpleChange(null, 'FAKE-APP-NAME', true);
|
||||
|
||||
fixture.detectChanges();
|
||||
expect(component.isLoading).toBe(false);
|
||||
|
||||
component.ngOnChanges({ appName });
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(component.isLoading).toBe(false);
|
||||
const loadingContent = fixture.debugElement.query(By.css('mat-progress-spinner'));
|
||||
expect(loadingContent).toBeFalsy();
|
||||
|
||||
|
@@ -23,8 +23,8 @@ import { TaskCloudService } from '../../services/task-cloud.service';
|
||||
import { TASK_LIST_CLOUD_TOKEN, TASK_LIST_PREFERENCES_SERVICE_TOKEN } from '../../../services/cloud-token.service';
|
||||
import { PreferenceCloudServiceInterface } from '../../../services/preference-cloud.interface';
|
||||
import { TaskListCloudServiceInterface } from '../../../services/task-list-cloud.service.interface';
|
||||
import { Subject, of } from 'rxjs';
|
||||
import { switchMap, takeUntil, tap } from 'rxjs/operators';
|
||||
import { Subject, of, BehaviorSubject, combineLatest } from 'rxjs';
|
||||
import { map, switchMap, takeUntil, tap } from 'rxjs/operators';
|
||||
import { VariableMapperService } from '../../../services/variable-mapper.sevice';
|
||||
import { ProcessListDataColumnCustomData } from '../../../models/data-column-custom-data';
|
||||
import { TaskCloudModel } from '../../../models/task-cloud.model';
|
||||
@@ -150,6 +150,14 @@ export class TaskListCloudComponent extends BaseTaskListCloudComponent<ProcessLi
|
||||
rows: TaskInstanceCloudListViewModel[] = [];
|
||||
dataAdapter: TasksListDatatableAdapter | undefined;
|
||||
|
||||
private isReloadingSubject$ = new BehaviorSubject<boolean>(false);
|
||||
isLoading$ = combineLatest([
|
||||
this.isLoadingPreferences$,
|
||||
this.isReloadingSubject$
|
||||
]).pipe(
|
||||
map(([isLoadingPreferences, isReloading]) => isLoadingPreferences || isReloading)
|
||||
);
|
||||
|
||||
constructor(@Inject(TASK_LIST_CLOUD_TOKEN) public taskListCloudService: TaskListCloudServiceInterface,
|
||||
appConfigService: AppConfigService,
|
||||
taskCloudService: TaskCloudService,
|
||||
@@ -166,7 +174,7 @@ export class TaskListCloudComponent extends BaseTaskListCloudComponent<ProcessLi
|
||||
}
|
||||
|
||||
reload() {
|
||||
this.isLoading = true;
|
||||
this.isReloadingSubject$.next(true);
|
||||
|
||||
this.isColumnSchemaCreated$.pipe(
|
||||
switchMap(() => of(this.createRequestNode())),
|
||||
@@ -187,11 +195,11 @@ export class TaskListCloudComponent extends BaseTaskListCloudComponent<ProcessLi
|
||||
this.dataAdapter = new TasksListDatatableAdapter(this.rows, this.columns);
|
||||
|
||||
this.success.emit(tasks);
|
||||
this.isLoading = false;
|
||||
this.isReloadingSubject$.next(false);
|
||||
this.pagination.next(tasks.list.pagination);
|
||||
}, (error) => {
|
||||
this.error.emit(error);
|
||||
this.isLoading = false;
|
||||
this.isReloadingSubject$.next(false);
|
||||
});
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user