[NIFI-13830] - Wait for canvas to complete loading before attempting to restore view or center (#9342)

* [NIFI-13830] - Wait for canvas to complete loading before attempting to restore view or center

* When restoring viewport or handling selection, only take action if the processgroup has changed

This closes #9342
This commit is contained in:
Rob Fellows 2024-10-09 12:29:15 -04:00 committed by GitHub
parent 0b85dd696e
commit 6eab0a5f44
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 20 additions and 8 deletions

View File

@ -43,6 +43,7 @@ import {
loadConnectionSuccess, loadConnectionSuccess,
loadInputPortSuccess, loadInputPortSuccess,
loadProcessGroup, loadProcessGroup,
loadProcessGroupComplete,
loadProcessGroupSuccess, loadProcessGroupSuccess,
loadProcessorSuccess, loadProcessorSuccess,
loadRemoteProcessGroupSuccess, loadRemoteProcessGroupSuccess,
@ -273,6 +274,10 @@ export const flowReducer = createReducer(
draftState.status = 'success' as const; draftState.status = 'success' as const;
}); });
}), }),
on(loadProcessGroupComplete, (state) => ({
...state,
status: 'complete' as const
})),
on(loadConnectionSuccess, (state, { response }) => { on(loadConnectionSuccess, (state, { response }) => {
return produce(state, (draftState) => { return produce(state, (draftState) => {
const proposedConnection = response.connection; const proposedConnection = response.connection;

View File

@ -642,7 +642,7 @@ export interface FlowState {
versionSaving: boolean; versionSaving: boolean;
changeVersionRequest: FlowUpdateRequestEntity | null; changeVersionRequest: FlowUpdateRequestEntity | null;
copiedSnippet: CopiedSnippet | null; copiedSnippet: CopiedSnippet | null;
status: 'pending' | 'loading' | 'success'; status: 'pending' | 'loading' | 'success' | 'complete';
} }
export interface RunOnceRequest { export interface RunOnceRequest {

View File

@ -44,6 +44,7 @@ import {
selectCurrentProcessGroupId, selectCurrentProcessGroupId,
selectEditedCurrentProcessGroup, selectEditedCurrentProcessGroup,
selectFlowAnalysisOpen, selectFlowAnalysisOpen,
selectFlowLoadingStatus,
selectFunnel, selectFunnel,
selectInputPort, selectInputPort,
selectLabel, selectLabel,
@ -59,7 +60,7 @@ import {
selectViewStatusHistoryComponent, selectViewStatusHistoryComponent,
selectViewStatusHistoryCurrentProcessGroup selectViewStatusHistoryCurrentProcessGroup
} from '../../state/flow/flow.selectors'; } from '../../state/flow/flow.selectors';
import { filter, map, NEVER, switchMap, take } from 'rxjs'; import { distinctUntilChanged, filter, map, NEVER, switchMap, take } from 'rxjs';
import { restoreViewport } from '../../state/transform/transform.actions'; import { restoreViewport } from '../../state/transform/transform.actions';
import { initialState } from '../../state/flow/flow.reducer'; import { initialState } from '../../state/flow/flow.reducer';
import { CanvasContextMenu } from '../../service/canvas-context-menu.service'; import { CanvasContextMenu } from '../../service/canvas-context-menu.service';
@ -129,9 +130,11 @@ export class Canvas implements OnInit, OnDestroy {
// handle process group loading and viewport restoration // handle process group loading and viewport restoration
this.store this.store
.select(selectCurrentProcessGroupId) .select(selectFlowLoadingStatus)
.pipe( .pipe(
filter((processGroupId) => processGroupId != initialState.id), filter((status) => status === 'complete'),
switchMap(() => this.store.select(selectCurrentProcessGroupId)),
distinctUntilChanged(),
switchMap(() => this.store.select(selectProcessGroupRoute)), switchMap(() => this.store.select(selectProcessGroupRoute)),
filter((processGroupRoute) => processGroupRoute != null), filter((processGroupRoute) => processGroupRoute != null),
concatLatestFrom(() => this.store.select(selectSkipTransform)), concatLatestFrom(() => this.store.select(selectSkipTransform)),
@ -147,9 +150,11 @@ export class Canvas implements OnInit, OnDestroy {
// handle single component selection // handle single component selection
this.store this.store
.select(selectCurrentProcessGroupId) .select(selectFlowLoadingStatus)
.pipe( .pipe(
filter((processGroupId) => processGroupId != initialState.id), filter((status) => status === 'complete'),
switchMap(() => this.store.select(selectCurrentProcessGroupId)),
distinctUntilChanged(),
switchMap(() => this.store.select(selectSingleSelectedComponent)), switchMap(() => this.store.select(selectSingleSelectedComponent)),
filter((selectedComponent) => selectedComponent != null), filter((selectedComponent) => selectedComponent != null),
concatLatestFrom(() => [ concatLatestFrom(() => [
@ -168,9 +173,11 @@ export class Canvas implements OnInit, OnDestroy {
// handle bulk component selection // handle bulk component selection
this.store this.store
.select(selectCurrentProcessGroupId) .select(selectFlowLoadingStatus)
.pipe( .pipe(
filter((processGroupId) => processGroupId != initialState.id), filter((status) => status === 'complete'),
switchMap(() => this.store.select(selectCurrentProcessGroupId)),
distinctUntilChanged(),
switchMap(() => this.store.select(selectBulkSelectedComponentIds)), switchMap(() => this.store.select(selectBulkSelectedComponentIds)),
filter((ids) => ids.length > 0), filter((ids) => ids.length > 0),
concatLatestFrom(() => [ concatLatestFrom(() => [