Merge pull request #6918 from opf/fix/table-reloading

Fix reloading wp-table on global query resource

[ci skip]
pull/6921/head
Oliver Günther 6 years ago committed by GitHub
commit 3149ad6bec
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 4
      frontend/src/app/components/modals/save-modal/save-query.modal.ts
  2. 4
      frontend/src/app/components/modals/share-modal/query-sharing-form.component.ts
  3. 4
      frontend/src/app/components/modals/share-modal/query-sharing.modal.ts
  4. 8
      frontend/src/app/components/op-context-menu/handlers/op-settings-dropdown-menu.directive.ts
  5. 14
      frontend/src/app/components/states.service.ts
  6. 2
      frontend/src/app/components/wp-fast-table/state/wp-table-columns.service.ts
  7. 2
      frontend/src/app/components/wp-fast-table/state/wp-table-group-by.service.ts
  8. 4
      frontend/src/app/components/wp-fast-table/state/wp-table-sort-by.service.ts
  9. 10
      frontend/src/app/components/wp-list/wp-list.service.ts
  10. 14
      frontend/src/app/components/wp-list/wp-states-initialization.service.ts
  11. 4
      frontend/src/app/components/wp-table/configuration-modal/tabs/highlighting-tab.component.ts
  12. 4
      frontend/src/app/components/wp-table/table-state/table-state.ts
  13. 7
      frontend/src/app/modules/calendar/wp-calendar/wp-calendar.component.ts
  14. 6
      frontend/src/app/modules/work_packages/routing/wp-set/wp-set.component.ts

@ -37,6 +37,7 @@ import {OpModalLocalsToken} from "core-components/op-modals/op-modal.service";
import {OpModalLocalsMap} from "core-components/op-modals/op-modal.types"; import {OpModalLocalsMap} from "core-components/op-modals/op-modal.types";
import {QuerySharingChange} from "core-components/modals/share-modal/query-sharing-form.component"; import {QuerySharingChange} from "core-components/modals/share-modal/query-sharing-form.component";
import {I18nService} from "core-app/modules/common/i18n/i18n.service"; import {I18nService} from "core-app/modules/common/i18n/i18n.service";
import {TableState} from "core-components/wp-table/table-state/table-state";
@Component({ @Component({
templateUrl: './save-query.modal.html' templateUrl: './save-query.modal.html'
@ -64,6 +65,7 @@ export class SaveQueryModal extends OpModalComponent {
@Inject(OpModalLocalsToken) public locals:OpModalLocalsMap, @Inject(OpModalLocalsToken) public locals:OpModalLocalsMap,
readonly I18n:I18nService, readonly I18n:I18nService,
readonly states:States, readonly states:States,
readonly tableState:TableState,
readonly wpListService:WorkPackagesListService, readonly wpListService:WorkPackagesListService,
readonly wpNotificationsService:WorkPackageNotificationService, readonly wpNotificationsService:WorkPackageNotificationService,
readonly cdRef:ChangeDetectorRef, readonly cdRef:ChangeDetectorRef,
@ -90,7 +92,7 @@ export class SaveQueryModal extends OpModalComponent {
} }
this.isBusy = true; this.isBusy = true;
const query = this.states.query.resource.value!; const query = this.tableState.query.value!;
query.public = this.isPublic; query.public = this.isPublic;
this.wpListService this.wpListService

@ -2,6 +2,7 @@ import {States} from '../../states.service';
import {AuthorisationService} from 'core-app/modules/common/model-auth/model-auth.service'; import {AuthorisationService} from 'core-app/modules/common/model-auth/model-auth.service';
import {Component, EventEmitter, Input, Output} from "@angular/core"; import {Component, EventEmitter, Input, Output} from "@angular/core";
import {I18nService} from "core-app/modules/common/i18n/i18n.service"; import {I18nService} from "core-app/modules/common/i18n/i18n.service";
import {TableState} from "core-components/wp-table/table-state/table-state";
export interface QuerySharingChange { export interface QuerySharingChange {
isStarred:boolean; isStarred:boolean;
@ -24,6 +25,7 @@ export class QuerySharingForm {
}; };
constructor(readonly states:States, constructor(readonly states:States,
readonly tableState:TableState,
readonly authorisationService:AuthorisationService, readonly authorisationService:AuthorisationService,
readonly I18n:I18nService) { readonly I18n:I18nService) {
} }
@ -35,7 +37,7 @@ export class QuerySharingForm {
} }
public get canPublish() { public get canPublish() {
const form = this.states.query.form.value!; const form = this.tableState.queryForm.value!;
return this.authorisationService.can('query', 'updateImmediately') return this.authorisationService.can('query', 'updateImmediately')
&& form.schema.public.writable; && form.schema.public.writable;

@ -37,6 +37,7 @@ import {OpModalLocalsToken} from "core-components/op-modals/op-modal.service";
import {OpModalLocalsMap} from "core-components/op-modals/op-modal.types"; import {OpModalLocalsMap} from "core-components/op-modals/op-modal.types";
import {QuerySharingChange} from "core-components/modals/share-modal/query-sharing-form.component"; import {QuerySharingChange} from "core-components/modals/share-modal/query-sharing-form.component";
import {I18nService} from "core-app/modules/common/i18n/i18n.service"; import {I18nService} from "core-app/modules/common/i18n/i18n.service";
import {TableState} from "core-components/wp-table/table-state/table-state";
@Component({ @Component({
templateUrl: './query-sharing.modal.html' templateUrl: './query-sharing.modal.html'
@ -62,6 +63,7 @@ export class QuerySharingModal extends OpModalComponent implements OnInit {
@Inject(OpModalLocalsToken) public locals:OpModalLocalsMap, @Inject(OpModalLocalsToken) public locals:OpModalLocalsMap,
readonly I18n:I18nService, readonly I18n:I18nService,
readonly states:States, readonly states:States,
readonly tableState:TableState,
readonly cdRef:ChangeDetectorRef, readonly cdRef:ChangeDetectorRef,
readonly wpListService:WorkPackagesListService, readonly wpListService:WorkPackagesListService,
readonly wpNotificationsService:WorkPackageNotificationService, readonly wpNotificationsService:WorkPackageNotificationService,
@ -72,7 +74,7 @@ export class QuerySharingModal extends OpModalComponent implements OnInit {
ngOnInit() { ngOnInit() {
super.ngOnInit(); super.ngOnInit();
this.query = this.states.query.resource.value!; this.query = this.tableState.query.value!;
this.isStarred = this.query.starred; this.isStarred = this.query.starred;
this.isPublic = this.query.public; this.isPublic = this.query.public;

@ -46,6 +46,7 @@ import {
selectableTitleIdentifier, selectableTitleIdentifier,
triggerEditingEvent triggerEditingEvent
} from "core-components/wp-query-select/wp-query-selectable-title.component"; } from "core-components/wp-query-select/wp-query-selectable-title.component";
import {TableState} from "core-components/wp-table/table-state/table-state";
@Directive({ @Directive({
selector: '[opSettingsContextMenu]' selector: '[opSettingsContextMenu]'
@ -62,6 +63,7 @@ export class OpSettingsMenuDirective extends OpContextMenuTrigger implements OnD
readonly wpListService:WorkPackagesListService, readonly wpListService:WorkPackagesListService,
readonly authorisationService:AuthorisationService, readonly authorisationService:AuthorisationService,
readonly states:States, readonly states:States,
readonly tableState:TableState,
readonly I18n:I18nService) { readonly I18n:I18nService) {
super(elementRef, opContextMenu); super(elementRef, opContextMenu);
@ -74,7 +76,7 @@ export class OpSettingsMenuDirective extends OpContextMenuTrigger implements OnD
ngAfterViewInit():void { ngAfterViewInit():void {
super.ngAfterViewInit(); super.ngAfterViewInit();
this.states.query.resource.values$() this.tableState.query.values$()
.pipe( .pipe(
takeUntil(componentDestroyed(this)) takeUntil(componentDestroyed(this))
) )
@ -82,9 +84,9 @@ export class OpSettingsMenuDirective extends OpContextMenuTrigger implements OnD
this.query = queryUpdate; this.query = queryUpdate;
}); });
this.loadingPromise = this.states.query.form.valuesPromise(); this.loadingPromise = this.tableState.queryForm.valuesPromise();
this.states.query.form.values$() this.tableState.queryForm.values$()
.pipe( .pipe(
takeUntil(componentDestroyed(this)) takeUntil(componentDestroyed(this))
) )

@ -45,7 +45,7 @@ export class States extends StatesGroup {
users = multiInput<UserResource>(); users = multiInput<UserResource>();
// Work Package query states // Work Package query states
query = new QueryStates(); queries = new QueryAvailableDataStates();
// Current focused work package (e.g, row preselected for details button) // Current focused work package (e.g, row preselected for details button)
focusedWorkPackage:InputState<WPFocusState> = input<WPFocusState>(); focusedWorkPackage:InputState<WPFocusState> = input<WPFocusState>();
@ -61,18 +61,6 @@ export class States extends StatesGroup {
} }
} }
export class QueryStates {
// the query associated with the table
resource = input<QueryResource>();
// the query form associated with the table
form = input<QueryFormResource>();
// Keep available data
available = new QueryAvailableDataStates();
}
export class QueryAvailableDataStates { export class QueryAvailableDataStates {
// Available columns // Available columns
columns = input<QueryColumn[]>(); columns = input<QueryColumn[]>();

@ -240,7 +240,7 @@ export class WorkPackageTableColumnsService extends WorkPackageTableBaseService<
// Get the available state // Get the available state
protected get availableState() { protected get availableState() {
return this.states.query.available.columns; return this.states.queries.columns;
} }
/** /**

@ -101,7 +101,7 @@ export class WorkPackageTableGroupByService extends WorkPackageTableBaseService<
} }
protected get availableState() { protected get availableState() {
return this.states.query.available.groupBy; return this.states.queries.groupBy;
} }
public get current():QueryGroupByResource|undefined { public get current():QueryGroupByResource|undefined {

@ -60,7 +60,7 @@ export class WorkPackageTableSortByService extends WorkPackageTableBaseService<W
} }
public onReadyWithAvailable():Observable<null> { public onReadyWithAvailable():Observable<null> {
return combine(this.state, this.states.query.available.sortBy) return combine(this.state, this.states.queries.sortBy)
.values$() .values$()
.pipe( .pipe(
mapTo(null) mapTo(null)
@ -141,7 +141,7 @@ export class WorkPackageTableSortByService extends WorkPackageTableBaseService<W
} }
private get availableState() { private get availableState() {
return this.states.query.available.sortBy; return this.states.queries.sortBy;
} }
public get currentSortBys():QuerySortByResource[] { public get currentSortBys():QuerySortByResource[] {

@ -230,7 +230,7 @@ export class WorkPackagesListService {
* After the update, the new query is reloaded (e.g. for the work packages) * After the update, the new query is reloaded (e.g. for the work packages)
*/ */
public create(query:QueryResource, name:string):Promise<QueryResource> { public create(query:QueryResource, name:string):Promise<QueryResource> {
let form = this.states.query.form.value!; let form = this.tableState.queryForm.value!;
query.name = name; query.name = name;
@ -280,7 +280,7 @@ export class WorkPackagesListService {
public save(query?:QueryResource) { public save(query?:QueryResource) {
query = query || this.currentQuery; query = query || this.currentQuery;
let form = this.states.query.form.value!; let form = this.tableState.queryForm.value!;
let promise = this.QueryDm.update(query, form); let promise = this.QueryDm.update(query, form);
@ -302,7 +302,7 @@ export class WorkPackagesListService {
let promise = this.QueryDm.toggleStarred(query); let promise = this.QueryDm.toggleStarred(query);
promise.then((query:QueryResource) => { promise.then((query:QueryResource) => {
this.states.query.resource.putValue(query); this.tableState.query.putValue(query);
this.NotificationsService.addSuccess(this.I18n.t('js.notice_successful_update')); this.NotificationsService.addSuccess(this.I18n.t('js.notice_successful_update'));
@ -317,7 +317,7 @@ export class WorkPackagesListService {
} }
private conditionallyLoadForm(query:QueryResource):void { private conditionallyLoadForm(query:QueryResource):void {
let currentForm = this.states.query.form.value; let currentForm = this.tableState.queryForm.value;
if (!currentForm || query.$links.update.$href !== currentForm.$href) { if (!currentForm || query.$links.update.$href !== currentForm.$href) {
setTimeout(() => this.loadForm(query), 0); setTimeout(() => this.loadForm(query), 0);
@ -351,7 +351,7 @@ export class WorkPackagesListService {
} }
public get currentQuery() { public get currentQuery() {
return this.states.query.resource.value!; return this.tableState.query.value!;
} }
private handleQueryLoadingError(error:ErrorResource, queryProps:any, queryId?:number, projectIdentifier?:string):Promise<QueryResource> { private handleQueryLoadingError(error:ErrorResource, queryProps:any, queryId?:number, projectIdentifier?:string):Promise<QueryResource> {

@ -52,7 +52,7 @@ export class WorkPackageStatesInitializationService {
this.clearStates(); this.clearStates();
// Update the (global) wp query states // Update the (global) wp query states
this.states.query.resource.putValue(query); this.tableState.query.putValue(query);
this.initializeFromQuery(query, results); this.initializeFromQuery(query, results);
// Update the (local) table states // Update the (local) table states
@ -76,11 +76,11 @@ export class WorkPackageStatesInitializationService {
}); });
this.wpTableFilters.initializeFilters(query, schema); this.wpTableFilters.initializeFilters(query, schema);
this.states.query.form.putValue(form); this.tableState.queryForm.putValue(form);
this.states.query.available.columns.putValue(schema.columns.allowedValues); this.states.queries.columns.putValue(schema.columns.allowedValues);
this.states.query.available.sortBy.putValue(schema.sortBy.allowedValues); this.states.queries.sortBy.putValue(schema.sortBy.allowedValues);
this.states.query.available.groupBy.putValue(schema.groupBy.allowedValues); this.states.queries.groupBy.putValue(schema.groupBy.allowedValues);
} }
public updateTableState(query:QueryResource, results:WorkPackageCollectionResource) { public updateTableState(query:QueryResource, results:WorkPackageCollectionResource) {
@ -110,7 +110,7 @@ export class WorkPackageStatesInitializationService {
} }
public updateChecksum(query:QueryResource, results:WorkPackageCollectionResource) { public updateChecksum(query:QueryResource, results:WorkPackageCollectionResource) {
this.wpListChecksumService.updateIfDifferent(this.states.query.resource.value!, this.wpTablePagination.current); this.wpListChecksumService.updateIfDifferent(this.tableState.query.value!, this.wpTablePagination.current);
this.authorisationService.initModelAuth('work_packages', results.$links); this.authorisationService.initModelAuth('work_packages', results.$links);
} }
@ -158,6 +158,6 @@ export class WorkPackageStatesInitializationService {
this.tableState.rendered.clear(reason); this.tableState.rendered.clear(reason);
// Needed for reinitialization of WpSetComponent // Needed for reinitialization of WpSetComponent
this.states.query.resource.clear(); this.tableState.query.clear();
} }
} }

@ -8,6 +8,7 @@ import {HalResource} from "core-app/modules/hal/resources/hal-resource";
import {States} from "core-app/components/states.service"; import {States} from "core-app/components/states.service";
import {WorkPackageTableHighlight} from "core-components/wp-fast-table/wp-table-highlight"; import {WorkPackageTableHighlight} from "core-components/wp-fast-table/wp-table-highlight";
import {BannersService} from "core-app/modules/common/enterprise/banners.service"; import {BannersService} from "core-app/modules/common/enterprise/banners.service";
import {TableState} from "core-components/wp-table/table-state/table-state";
@Component({ @Component({
templateUrl: './highlighting-tab.component.html' templateUrl: './highlighting-tab.component.html'
@ -44,6 +45,7 @@ export class WpTableConfigurationHighlightingTab implements TabComponent {
constructor(readonly injector:Injector, constructor(readonly injector:Injector,
readonly I18n:I18nService, readonly I18n:I18nService,
readonly states:States, readonly states:States,
readonly tableState:TableState,
readonly Banners:BannersService, readonly Banners:BannersService,
readonly wpTableHighlight:WorkPackageTableHighlightingService) { readonly wpTableHighlight:WorkPackageTableHighlightingService) {
} }
@ -117,7 +119,7 @@ export class WpTableConfigurationHighlightingTab implements TabComponent {
} }
public get availableHighlightedAttributes():HalResource[] { public get availableHighlightedAttributes():HalResource[] {
const schema = this.states.query.form.value!.schema; const schema = this.tableState.queryForm.value!.schema;
return schema.highlightedAttributes.allowedValues; return schema.highlightedAttributes.allowedValues;
} }

@ -22,6 +22,7 @@ import {
import {WorkPackageResource} from 'core-app/modules/hal/resources/work-package-resource'; import {WorkPackageResource} from 'core-app/modules/hal/resources/work-package-resource';
import {HighlightingMode} from "core-components/wp-fast-table/builders/highlighting/highlighting-mode.const"; import {HighlightingMode} from "core-components/wp-fast-table/builders/highlighting/highlighting-mode.const";
import {WorkPackageTableHighlight} from "core-components/wp-fast-table/wp-table-highlight"; import {WorkPackageTableHighlight} from "core-components/wp-fast-table/wp-table-highlight";
import {QueryFormResource} from "core-app/modules/hal/resources/query-form-resource";
@Injectable() @Injectable()
export class TableState extends StatesGroup { export class TableState extends StatesGroup {
@ -35,6 +36,9 @@ export class TableState extends StatesGroup {
// The query that results in this table state // The query that results in this table state
query:InputState<QueryResource> = input<QueryResource>(); query:InputState<QueryResource> = input<QueryResource>();
// the query form associated with the table
queryForm = input<QueryFormResource>();
// the results associated with the table // the results associated with the table
results = input<WorkPackageCollectionResource>(); results = input<WorkPackageCollectionResource>();
// Set of work package IDs in strict order of appearance // Set of work package IDs in strict order of appearance

@ -58,7 +58,7 @@ export class WorkPackagesCalendarController implements OnInit, OnDestroy {
let startDate = (calendarView.start as Moment).format('YYYY-MM-DD'); let startDate = (calendarView.start as Moment).format('YYYY-MM-DD');
let endDate = (calendarView.end as Moment).format('YYYY-MM-DD'); let endDate = (calendarView.end as Moment).format('YYYY-MM-DD');
if (!this.wpTableFilters.currentState && this.states.query.resource.value) { if (!this.wpTableFilters.currentState && this.tableState.query.value) {
// nothing to do // nothing to do
} else if (!this.wpTableFilters.currentState) { } else if (!this.wpTableFilters.currentState) {
let queryProps = this.defaultQueryProps(startDate, endDate); let queryProps = this.defaultQueryProps(startDate, endDate);
@ -107,12 +107,11 @@ export class WorkPackagesCalendarController implements OnInit, OnDestroy {
} }
private setCalendarsDate() { private setCalendarsDate() {
if (!this.states.query.resource.value) { const query = this.tableState.query.value;
if (!query) {
return; return;
} }
let query = this.states.query.resource.value;
let datesIntervalFilter = _.find(query.filters || [], {'id': 'datesInterval'}) as any; let datesIntervalFilter = _.find(query.filters || [], {'id': 'datesInterval'}) as any;
let calendarDate:any = null; let calendarDate:any = null;

@ -115,7 +115,7 @@ export class WorkPackagesSetComponent implements OnInit, OnDestroy {
this.tableState.ready.fireOnStateChange(this.wpTablePagination.state, this.tableState.ready.fireOnStateChange(this.wpTablePagination.state,
'Query loaded').values$().pipe( 'Query loaded').values$().pipe(
untilComponentDestroyed(this), untilComponentDestroyed(this),
withLatestFrom(this.states.query.resource.values$()) withLatestFrom(this.tableState.query.values$())
).subscribe(([pagination, query]) => { ).subscribe(([pagination, query]) => {
if (this.wpListChecksumService.isQueryOutdated(query, pagination)) { if (this.wpListChecksumService.isQueryOutdated(query, pagination)) {
this.wpListChecksumService.update(query, pagination); this.wpListChecksumService.update(query, pagination);
@ -134,7 +134,7 @@ export class WorkPackagesSetComponent implements OnInit, OnDestroy {
} }
setupChangeObserver(service:WorkPackageQueryStateService, firstPage:boolean = false) { setupChangeObserver(service:WorkPackageQueryStateService, firstPage:boolean = false) {
const queryState = this.states.query.resource; const queryState = this.tableState.query;
this.tableState.ready.fireOnStateChange(service.state, 'Query loaded').values$().pipe( this.tableState.ready.fireOnStateChange(service.state, 'Query loaded').values$().pipe(
untilComponentDestroyed(this), untilComponentDestroyed(this),
@ -142,7 +142,7 @@ export class WorkPackagesSetComponent implements OnInit, OnDestroy {
).subscribe(() => { ).subscribe(() => {
const newQuery = queryState.value!; const newQuery = queryState.value!;
const triggerUpdate = service.applyToQuery(newQuery); const triggerUpdate = service.applyToQuery(newQuery);
this.states.query.resource.putValue(newQuery); this.tableState.query.putValue(newQuery);
// Update the current checksum // Update the current checksum
this.wpListChecksumService.updateIfDifferent(newQuery, this.wpTablePagination.current); this.wpListChecksumService.updateIfDifferent(newQuery, this.wpTablePagination.current);

Loading…
Cancel
Save