fix: handle APPLIED_LOCALLY state better in cloud fix ui (#2642)

Author: MaxKless

libs/shared/cloud-fix-webview/.storybook/stories/nx-cloud-fix.stories.ts

@@ -164,6 +164,21 @@ export const Applied: Story = {
   },
 };
 
+export const AppliedLocally: Story = {
+  args: {
+    details: {
+      ...mockDetails,
+      runGroup: {
+        ...mockDetails.runGroup,
+        aiFix: {
+          ...mockDetails.runGroup.aiFix!,
+          userAction: 'APPLIED_LOCALLY',
+        },
+      },
+    },
+  },
+};
+
 export const Ignored: Story = {
   args: {
     details: {
@@ -178,6 +193,22 @@ export const Ignored: Story = {
     },
   },
 };
+export const UncommittedChanges: Story = {
+  args: {
+    details: {
+      ...mockDetails,
+      runGroup: {
+        ...mockDetails.runGroup,
+        aiFix: {
+          ...mockDetails.runGroup.aiFix!,
+          userAction: 'NONE',
+        },
+      },
+      hasUncommittedChanges: true,
+    },
+    onApplyLocally: (...args) => console.log('onApplyLocally', args),
+  },
+};
 
 export const VerificationFailed: Story = {
   args: {

libs/shared/cloud-fix-webview/src/nx-cloud-fix-component.stories.ts

@@ -202,7 +202,11 @@ export class NxCloudFixComponent extends EditorContext(LitElement) {
   }
 
   private handleApplyLocally() {
-    if (this.details && this.onApplyLocally) {
+    if (
+      this.details &&
+      this.onApplyLocally &&
+      !this.details?.hasUncommittedChanges
+    ) {
       this.onApplyLocally(this.details);
     }
   }
@@ -356,6 +360,29 @@ export class NxCloudFixComponent extends EditorContext(LitElement) {
       `;
     }
 
+    if (aiFix.userAction === 'APPLIED_LOCALLY') {
+      return html`
+        <div
+          class="border-border bg-background relative m-0 border p-6 text-center"
+        >
+          <div
+            class="mx-auto mb-4 flex h-16 w-16 flex-col items-center justify-center"
+          >
+            <icon-element
+              icon="git-branch"
+              class="text-success leading-none"
+            ></icon-element>
+          </div>
+          <h2 class="text-foreground m-0 mb-2 text-lg font-semibold">
+            Fix Applied Locally
+          </h2>
+          <p class="text-foreground m-0 text-sm opacity-80">
+            The suggested changes have been applied locally.
+          </p>
+        </div>
+      `;
+    }
+
     const showActions = true;
 
     return html`

libs/shared/cloud-fix-webview/src/nx-cloud-fix-component.ts

@@ -57,7 +57,11 @@ export type AITaskFixStatus =
   | 'FAILED'
   | 'NOT_EXECUTABLE';
 
-export type AITaskFixUserAction = 'NONE' | 'APPLIED' | 'REJECTED';
+export type AITaskFixUserAction =
+  | 'NONE'
+  | 'APPLIED'
+  | 'REJECTED'
+  | 'APPLIED_LOCALLY';
 
 export type AITaskFixUserActionOrigin =
   | 'NX_CLOUD_APP'

libs/shared/types/src/lib/cloud-info.ts

@@ -77,6 +77,14 @@ export class NxCloudFixTreeItem
           'check',
           new ThemeColor('notebookStatusSuccessIcon.foreground'),
         );
+      } else if (userAction === 'APPLIED_LOCALLY') {
+        this.contextValue += '-appliedLocally';
+        this.label =
+          'The suggested changes have been applied to your local branch';
+        this.iconPath = new ThemeIcon(
+          'git-branch',
+          new ThemeColor('notebookStatusSuccessIcon.foreground'),
+        );
       } else if (userAction === 'REJECTED') {
         this.contextValue += '-rejected';
         this.label = 'Fix rejected by user';