NIFI-12950: Updating front end to use the uiOnly flag where possible (#8565)

* NIFI-12950:
- Updating front end to use the uiOnly flag where possible.

* NIFI-12950:
- Addressing review feedback.

This closes #8565

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/service/controller-service.service.ts

@@ -53,7 +53,10 @@ export class ControllerServiceService implements ControllerServiceCreator, Prope
     }
 
     getControllerService(id: string): Observable<any> {
-        return this.httpClient.get(`${ControllerServiceService.API}/controller-services/${id}`);
+        const uiOnly: any = { uiOnly: true };
+        return this.httpClient.get(`${ControllerServiceService.API}/controller-services/${id}`, {
+            params: uiOnly
+        });
     }
 
     createControllerService(createControllerService: CreateControllerServiceRequest): Observable<any> {

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/service/flow.service.ts

@@ -54,13 +54,15 @@ export class FlowService implements PropertyDescriptorRetriever {
     ) {}
 
     getFlow(processGroupId = 'root'): Observable<any> {
-        // TODO - support uiOnly... this would mean that we need to load the entire resource prior to editing
+        const uiOnly: any = { uiOnly: true };
-        return this.httpClient.get(`${FlowService.API}/flow/process-groups/${processGroupId}`);
+        return this.httpClient.get(`${FlowService.API}/flow/process-groups/${processGroupId}`, {
+            params: uiOnly
+        });
     }
 
     getProcessGroupStatus(processGroupId = 'root', recursive = false): Observable<any> {
         return this.httpClient.get(`${FlowService.API}/flow/process-groups/${processGroupId}/status`, {
-            params: { recursive: recursive }
+            params: { recursive }
         });
     }
 

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/state/controller-services/controller-services.effects.ts

@@ -40,7 +40,6 @@ import {
     selectStatus
 } from './controller-services.selectors';
 import { ControllerServiceService } from '../../service/controller-service.service';
-import { FlowService } from '../../service/flow.service';
 import { EnableControllerService } from '../../../../ui/common/controller-service/enable-controller-service/enable-controller-service.component';
 import { DisableControllerService } from '../../../../ui/common/controller-service/disable-controller-service/disable-controller-service.component';
 import { PropertyTableHelperService } from '../../../../service/property-table-helper.service';
@@ -56,7 +55,6 @@ export class ControllerServicesEffects {
         private store: Store<NiFiState>,
         private client: Client,
         private controllerServiceService: ControllerServiceService,
-        private flowService: FlowService,
         private errorHelper: ErrorHelper,
         private dialog: MatDialog,
         private router: Router,

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/state/flow/flow.effects.ts

@@ -20,6 +20,7 @@ import { FlowService } from '../../service/flow.service';
 import { Actions, concatLatestFrom, createEffect, ofType } from '@ngrx/effects';
 import * as FlowActions from './flow.actions';
 import * as StatusHistoryActions from '../../../../state/status-history/status-history.actions';
+import * as ErrorActions from '../../../../state/error/error.actions';
 import {
     asyncScheduler,
     catchError,
@@ -98,6 +99,7 @@ import { ImportFromRegistry } from '../../ui/canvas/items/flow/import-from-regis
 import { selectCurrentUser } from '../../../../state/current-user/current-user.selectors';
 import { NoRegistryClientsDialog } from '../../ui/common/no-registry-clients-dialog/no-registry-clients-dialog.component';
 import { EditRemoteProcessGroup } from '../../ui/canvas/items/remote-process-group/edit-remote-process-group/edit-remote-process-group.component';
+import { HttpErrorResponse } from '@angular/common/http';
 
 @Injectable()
 export class FlowEffects {
@@ -1069,6 +1071,33 @@ export class FlowEffects {
             this.actions$.pipe(
                 ofType(FlowActions.openEditProcessorDialog),
                 map((action) => action.request),
+                switchMap((request) =>
+                    from(this.flowService.getProcessor(request.entity.id)).pipe(
+                        map((entity) => {
+                            return {
+                                ...request,
+                                entity
+                            };
+                        }),
+                        tap({
+                            error: (errorResponse: HttpErrorResponse) => {
+                                this.store.dispatch(
+                                    FlowActions.selectComponents({
+                                        request: {
+                                            components: [
+                                                {
+                                                    id: request.entity.id,
+                                                    componentType: request.type
+                                                }
+                                            ]
+                                        }
+                                    })
+                                );
+                                this.store.dispatch(ErrorActions.snackBarError({ error: errorResponse.error }));
+                            }
+                        })
+                    )
+                ),
                 concatLatestFrom(() => [
                     this.store.select(selectCurrentParameterContext),
                     this.store.select(selectCurrentProcessGroupId)

nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/service/controller-service-state.service.ts

@@ -37,7 +37,10 @@ export class ControllerServiceStateService {
     ) {}
 
     getControllerService(id: string): Observable<any> {
-        return this.httpClient.get(`${ControllerServiceStateService.API}/controller-services/${id}`);
+        const uiOnly: any = { uiOnly: true };
+        return this.httpClient.get(`${ControllerServiceStateService.API}/controller-services/${id}`, {
+            params: uiOnly
+        });
     }
 
     setEnable(controllerService: ControllerServiceEntity, enabled: boolean): Observable<any> {