Added progress display for apply

Author: kevinwang5658

src/commands/apply/index.ts

@@ -1,8 +1,10 @@
 import { Args, Command, Flags } from '@oclif/core'
+import { ResourceOperation } from 'codify-schemas';
 import path from 'node:path';
 
-import { DefaultReporter } from '../../ui/reporters/default-reporter.js';
+import { ApplyOrchestrator } from '../../orchestrators/apply.js';
 import { PlanOrchestrator } from '../../orchestrators/plan.js';
+import { DefaultReporter } from '../../ui/reporters/default-reporter.js';
 
 export default class Apply extends Command {
   static args = {
@@ -40,15 +42,25 @@ export default class Apply extends Command {
 
     const resolvedPath = path.resolve(flags.path ?? '.');
 
-    const { plan } = await PlanOrchestrator.run(resolvedPath);
-    reporter.displayPlan(plan);
+    const planResult = await PlanOrchestrator.run(resolvedPath, false);
+
+    // Short circuit and exit if every change is NOOP
+    if (planResult.plan.every((p) => p.operation === ResourceOperation.NOOP)) {
+      console.log('No changes necessary. Exiting');
+      await planResult.pluginCollection.destroy();
+      return;
+    }
+
+    reporter.displayPlan(planResult.plan);
 
     const confirm = await reporter.promptApplyConfirmation()
 
     if (!confirm) {
       return this.exit(0);
     }
 
+    await ApplyOrchestrator.run(planResult);
+
     // this.exit(0);
 
   }

src/events/context.ts

@@ -23,7 +23,7 @@ export enum SubProcessName {
   INITIALIZE_PLUGINS = 'initialize_plugins',
   VALIDATE = 'validate',
   GENERATE_PLAN = 'generate_plan',
-  APPLY_RESOURCE = 'apply_resource',
+  APPLYING_RESOURCE = 'apply_resource',
 }
 
 export const ctx = new class {
@@ -68,12 +68,12 @@ export const ctx = new class {
     this.emitter.emit(Event.PROCESS_FINISH, name);
   }
 
-  subprocessStarted(name: string) {
-    this.emitter.emit(Event.SUB_PROCESS_START, name);
+  subprocessStarted(name: string, additionalName?: string) {
+    this.emitter.emit(Event.SUB_PROCESS_START, name, additionalName);
   }
 
-  subprocessFinished(name: string) {
-    this.emitter.emit(Event.SUB_PROCESS_FINISH, name);
+  subprocessFinished(name: string, additionalName?: string) {
+    this.emitter.emit(Event.SUB_PROCESS_FINISH, name, additionalName);
   }
 
   async subprocess<T>(name: string, run: () => Promise<T>): Promise<T> {

src/orchestrators/apply.ts

@@ -1,19 +1,17 @@
 import { ResourceOperation } from 'codify-schemas';
 
-import { PlanOrchestrator } from './plan.js';
+import { ctx, ProcessName } from '../events/context.js';
+import { PlanOrchestratorResponse } from './plan.js';
 
 export const ApplyOrchestrator = {
-  async run(rootDirectory: string): Promise<void> {
-    const { plan, pluginCollection } = await PlanOrchestrator.run(rootDirectory, false);
+  async run(planResult: PlanOrchestratorResponse): Promise<void> {
+    const { plan, pluginCollection } = planResult;
+    const filteredPlan = plan
+      .filter((p) => p.operation !== ResourceOperation.NOOP)
 
-    // Short circuit and exit if every change is NOOP
-    if (plan.every((p) => p.operation === ResourceOperation.NOOP)) {
-      console.log('No changes necessary. Exiting');
-      await pluginCollection.destroy();
-      return;
-    }
-
-    await pluginCollection.apply(plan);
+    ctx.processStarted(ProcessName.APPLY);
+    await pluginCollection.apply(filteredPlan);
     await pluginCollection.destroy();
+    ctx.processFinished(ProcessName.APPLY);
   },
 };

src/orchestrators/plan.ts

@@ -5,14 +5,14 @@ import { ctx, ProcessName, SubProcessName } from '../events/context.js';
 import { Parser } from '../parser/index.js';
 import { PluginCollection } from '../plugins/plugin-collection.js';
 
-interface PlanOchestratorResponse {
+export interface PlanOrchestratorResponse {
   plan: PlanResponseData[],
   pluginCollection: PluginCollection;
   project: Project;
 }
 
 export const PlanOrchestrator = {
-  async run(path: string, destroyPlugins = true): Promise<PlanOchestratorResponse> {
+  async run(path: string, destroyPlugins = true): Promise<PlanOrchestratorResponse> {
     ctx.processStarted(ProcessName.PLAN)
 
     ctx.subprocessStarted(SubProcessName.PARSE);

src/plugins/plugin-collection.ts

@@ -1,6 +1,7 @@
 import { PlanResponseData, ValidateResponseData } from 'codify-schemas';
 
 import { Project } from '../entities/project.js';
+import { ctx, SubProcessName } from '../events/context.js';
 import { groupBy } from '../utils/index.js';
 import { Plugin } from './plugin.js';
 import { PluginResolver } from './resolver.js';
@@ -62,12 +63,16 @@ export class PluginCollection {
 
   async apply(planResponseData: PlanResponseData[]): Promise<void> {
     for (const { planId, resourceType } of planResponseData) {
+      ctx.subprocessStarted(SubProcessName.APPLYING_RESOURCE, resourceType);
+
       const pluginName = this.resourceToPluginMapping.get(resourceType);
       if (!pluginName) {
         throw new Error(`Internal error: unable to determine plugin for apply: ${resourceType}`);
       }
 
       await this.plugins.get(pluginName)!.apply(planId);
+
+      ctx.subprocessFinished(SubProcessName.APPLYING_RESOURCE, resourceType);
     }
   }
 

src/ui/reporters/default-reporter.tsx

@@ -9,9 +9,9 @@ import { ProgressState, ProgressStatus } from '../components/progress/progress-d
 import { DisplayPlanStateTransition, RenderEvent, RenderState, Reporter } from './reporter.js';
 
 const ProgressLabelMapping = {
-  [ProcessName.APPLY]: 'Codify plan',
+  [ProcessName.APPLY]: 'Codify apply',
   [ProcessName.PLAN]: 'Codify plan',
-  [SubProcessName.APPLY_RESOURCE]: 'Applying resource',
+  [SubProcessName.APPLYING_RESOURCE]: 'Applying resource',
   [SubProcessName.GENERATE_PLAN]: 'Refresh states and generating plan',
   [SubProcessName.INITIALIZE_PLUGINS]: 'Initializing plugins',
   [SubProcessName.PARSE]: 'Parsing configs',
@@ -29,8 +29,8 @@ export class DefaultReporter implements Reporter {
     ctx.on(Event.OUTPUT, (args) => this.log(args));
     ctx.on(Event.PROCESS_START, (name) => this.onProcessStartEvent(name))
     ctx.on(Event.PROCESS_FINISH, (name) => this.onProcessFinishEvent(name))
-    ctx.on(Event.SUB_PROCESS_START, (name) => this.onSubprocessStartEvent(name));
-    ctx.on(Event.SUB_PROCESS_FINISH, (name) => this.onSubprocessFinishEvent(name))
+    ctx.on(Event.SUB_PROCESS_START, (name, additionalName) => this.onSubprocessStartEvent(name, additionalName));
+    ctx.on(Event.SUB_PROCESS_FINISH, (name, additionalName) => this.onSubprocessFinishEvent(name, additionalName))
   }
 
   displayPlan(plan: PlanResponseData[]): void {
@@ -58,9 +58,10 @@ export class DefaultReporter implements Reporter {
       this.renderEmitter.emit(RenderEvent.STATE_TRANSITION, {
         nextState: RenderState.APPLYING,
       });
+
+      this.log('Do you want to apply the above changes? -> "Yes"')
     }
 
-    this.log(`Do you want to apply the above changes? -> ${continueApply ? '"Yes"' : '"No"'}`)
     return continueApply;
   }
 
@@ -92,25 +93,31 @@ export class DefaultReporter implements Reporter {
 
   }
 
-  private onSubprocessStartEvent(name: SubProcessName): void {
-    const label = ProgressLabelMapping[name];
+  private onSubprocessStartEvent(name: SubProcessName, additionalName?: string): void {
+    const label = ProgressLabelMapping[name] + (additionalName
+        ? ' ' + additionalName
+        : ''
+    );
 
     this.progressState?.subProgresses?.push({
       label,
-      name,
+      name: name + additionalName,
       status: ProgressStatus.IN_PROGRESS,
     });
 
     this.log(`${label} started`)
     this.renderEmitter.emit(RenderEvent.PROGRESS_UPDATE, this.progressState);
   }
 
-  private onSubprocessFinishEvent(name: SubProcessName): void {
-    const label = ProgressLabelMapping[name];
+  private onSubprocessFinishEvent(name: SubProcessName, additionalName?: string): void {
+    const label = ProgressLabelMapping[name] + (additionalName
+        ? ' ' + additionalName
+        : ''
+    );
 
     const subProgress = this.progressState
       ?.subProgresses
-      ?.find((p) => p.name === name);
+      ?.find((p) => p.name === name + additionalName);
 
     if (!subProgress) {
       return;