Feat/ai/explain

src/snyk/common/constants/commands.ts

@@ -25,6 +25,7 @@ export const SNYK_WORKSPACE_SCAN_COMMAND = 'snyk.workspace.scan';
 export const SNYK_TRUST_WORKSPACE_FOLDERS_COMMAND = 'snyk.trustWorkspaceFolders';
 export const SNYK_GET_ACTIVE_USER = 'snyk.getActiveUser';
 export const SNYK_CODE_FIX_DIFFS_COMMAND = 'snyk.code.fixDiffs';
+export const SNYK_CODE_GENERATE_AI_EXPLANATION = 'snyk.generateAIExplanation';
 export const SNYK_CODE_SUBMIT_FIX_FEEDBACK = 'snyk.code.submitFixFeedback';
 export const SNYK_FEATURE_FLAG_COMMAND = 'snyk.getFeatureFlagStatus';
 export const SNYK_CLEAR_CACHE_COMMAND = 'snyk.clearCache';

src/snyk/snykCode/views/suggestion/codeSuggestionWebviewProvider.ts

@@ -10,6 +10,7 @@
   SNYK_IGNORE_ISSUE_COMMAND,
   SNYK_OPEN_BROWSER_COMMAND,
   SNYK_OPEN_LOCAL_COMMAND,
+  SNYK_CODE_GENERATE_AI_EXPLANATION
 } from '../../../common/constants/commands';
 import { SNYK_VIEW_SUGGESTION_CODE } from '../../../common/constants/views';
 import { ErrorHandler } from '../../../common/error/errorHandler';
@@ -304,6 +305,79 @@
           }
           break;
         }
+        case 'generateVulnerabilityExplanation': {
+          this.logger.info('case generateVulnerabilityExplanation');
+          console.log("case generateVulnerabilityExplanation");
+          const { suggestion } = message.args;
+          const filePath = suggestion.filePath;
+          const folderPath = this.getWorkspaceFolderPath(filePath);
+          const relativePath = relative(folderPath, filePath);
+
+          const issueId = suggestion.id;
+
+          const fileContent = readFileSync(filePath, 'utf8');
+
+          const ruleKey = suggestion.rule;
+          const ruleMessage = suggestion.message;
+
+          let derivationLineNumbers: Set<number> = new Set<number>();
+          for (const markerLocation of suggestion.markers!) {
+            for (const markerPos of markerLocation.pos) {
+              const lines = markerPos.rows;
+              for (const line of lines) {
+                derivationLineNumbers.add(line + 1);
+              }
+            }
+            markerLocation.pos
+          }
+          console.log("derivation lines: ", ...derivationLineNumbers);
+
+          let derivationLines: string[] = [];
+          let fileLines: string[] = fileContent.split("\n");
+          for (const derivationLineNumber of derivationLineNumbers) {
+            derivationLines.push(fileLines.at(derivationLineNumber - 1)!);
+          }
+          let derivation = derivationLines.join(",");
+          derivation = derivation.replace(/\t/g, "  ");
+          console.log("derivation: ", derivation);
+
+          var explanation: string = ""
+          explanation = await vscode.commands.executeCommand(
+            SNYK_CODE_GENERATE_AI_EXPLANATION,
+            derivation,
+            ruleKey,
+            ruleMessage,
+          );
+          console.log("got vulnerability explanation: ", explanation);
+
+          void this.postSuggestMessage({ type: 'setVulnerabilityExplanation', args: { explanation: explanation } });
+
+          break;
+        }
+        case 'generateFixExplanation': {
+          this.logger.info('case generateFixExplanation');
+          console.log("case generateFixExplanation");
+          const { suggestion } = message.args;
+          const filePath = suggestion.filePath;
+          const folderPath = this.getWorkspaceFolderPath(filePath);
+          const relativePath = relative(folderPath, filePath);
+
+          const issueId = suggestion.id;
+
+          const fileContent = readFileSync(filePath, 'utf8');
+
+          // const ruleKey = suggestion.rule;
+          // const ruleMessage = suggestion.message;
+          var explanation: string = ""
+          explanation = await vscode.commands.executeCommand(
+            SNYK_CODE_GENERATE_AI_EXPLANATION,
+            folderPath,
+            relativePath,
+            issueId,
+          );
+          console.log("got fix explanation: ", explanation);
+          break;
+        }
 
         default: {
           throw new Error('Unknown message type');

src/snyk/snykCode/views/suggestion/codeSuggestionWebviewScriptLS.ts

@@ -83,6 +83,34 @@ declare const acquireVsCodeApi: any;
     };
   };
 
+  type GenerateFixExplanationMessage = {
+    type: 'generateFixExplanation';
+    args: {
+      suggestion: Suggestion;
+    };
+  };
+
+  type GenerateVulnerabilityExplanationMessage = {
+    type: 'generateVulnerabilityExplanation';
+    args: {
+      suggestion: Suggestion;
+    };
+  };
+
+  type SetFixExplanationMessage = {
+    type: 'setFixExplanation';
+    args: {
+      explanation: string;
+    };
+  };
+
+  type SetVulnerabilityExplanationMessage = {
+    type: 'setVulnerabilityExplanation';
+    args: {
+      explanation: string;
+    };
+  };
+
   type ApplyGitDiffMessage = {
     type: 'applyGitDiff';
     args: {
@@ -113,6 +141,10 @@ declare const acquireVsCodeApi: any;
     | SetSuggestionMessage
     | GetSuggestionMessage
     | GetAutofixDiffsMesssage
+    | GenerateFixExplanationMessage
+    | GenerateVulnerabilityExplanationMessage
+    | SetVulnerabilityExplanationMessage
+    | SetFixExplanationMessage
     | ApplyGitDiffMessage
     | SetAutofixDiffsMessage
     | SetAutofixErrorMessage;
@@ -213,12 +245,40 @@ declare const acquireVsCodeApi: any;
   const retryGenerateFixButton = document.getElementById('retry-generate-fix') as HTMLElement;
   const generateAIFixButton = document.getElementById('generate-ai-fix') as HTMLElement;
 
+  // AI Explain buttons
+  const generateVulnerabilityExplanationButton = document.getElementById('generate-vulnerability-explanation-button') as HTMLButtonElement;
+  const generateFixExplanationButton = document.getElementById('generate-fix-explanation-button') as HTMLButtonElement;
+
   const ignoreContainerElements = document.getElementsByClassName('ignore-action-container');
   if (ignoreContainerElements) {
     toggleElement(ignoreContainerElements[0] as HTMLElement, 'show');
     (ignoreContainerElements[0] as HTMLElement).style.display = suggestion?.showInlineIgnoresButton ? 'block' : 'none';
   }
 
+  function generateVulnerabilityExplanation() {
+    console.log("inside generateVulnerabilityExplanation callback");
+    if (!suggestion) {
+      return;
+    }
+    const message: GenerateVulnerabilityExplanationMessage = {
+      type: 'generateVulnerabilityExplanation',
+      args: { suggestion },
+    };
+    sendMessage(message);
+  }
+
+  function generateFixExplanation() {
+    console.log("inside generateFixExplanation callback");
+    if (!suggestion) {
+      return;
+    }
+    const message: GenerateFixExplanationMessage = {
+      type: 'generateFixExplanation',
+      args: { suggestion },
+    };
+    sendMessage(message);
+  }
+
   function generateAIFix() {
     if (!suggestion) {
       return;
@@ -261,6 +321,16 @@ declare const acquireVsCodeApi: any;
   retryGenerateFixButton?.addEventListener('click', retryGenerateAIFix);
   applyFixButton?.addEventListener('click', applyFix);
 
+  // AI Explain elements
+  generateVulnerabilityExplanationButton?.addEventListener('click', generateVulnerabilityExplanation);
+  generateFixExplanationButton?.addEventListener('click', generateFixExplanation);
+
+  // generateVulnerabilityExplanationButton: document.getElementById('generate-vulnerability-explanation-button') as HTMLElement;
+  // vulnerabilityExplainationTextSection: document.getElementById('info-vulnerability-explanation') as HTMLElement;
+  // vulnerabilityExplainationText: document.getElementById("vulnerability-explanation-text") as HTMLElement;
+
+  // generateVulnerabilityExplanationButton?.addEventListener('click', generateAIExplanation);
+
   // different AI fix states
   const fixLoadingIndicatorElem = document.getElementById('fix-loading-indicator') as HTMLElement;
   const fixWrapperElem = document.getElementById('fix-wrapper') as HTMLElement;
@@ -303,6 +373,7 @@ declare const acquireVsCodeApi: any;
       toggleElement(diffTopElem, 'hide');
       toggleElement(diffElem, 'hide');
       toggleElement(applyFixButton, 'hide');
+      // toggleElement(generateAIExplanationButton, 'hide');
       return;
     }
 
@@ -312,6 +383,7 @@ declare const acquireVsCodeApi: any;
     toggleElement(diffTopElem, 'show');
     toggleElement(diffElem, 'show');
     toggleElement(applyFixButton, 'show');
+    // toggleElement(generateAIExplanationButton, 'show');
 
     diffNumElem.innerText = suggestion.diffs.length.toString();
     diffNum2Elem.innerText = suggestion.diffs.length.toString();
@@ -413,6 +485,18 @@ declare const acquireVsCodeApi: any;
         toggleElement(fixWrapperElem, 'hide');
         toggleElement(fixErrorSectionElem, 'show');
       }
+      case 'setVulnerabilityExplanation': {
+        console.log("IN SET EXPLAIN CASE");
+        // const { explainText } = elements;
+        // explainText.innerText = JSON.parse(message.args.suggestion)["explanation"]
+        break;
+      }
+      case 'setFixExplanation': {
+        console.log("IN SET EXPLAIN CASE");
+        // const { explainText } = elements;
+        // explainText.innerText = JSON.parse(message.args.suggestion)["explanation"]
+        break;
+      }
     }
   });
 })();

src/snyk/snykCode/views/suggestion/types.ts

@@ -59,6 +59,20 @@ export type GetAutofixDiffsMesssage = {
   };
 };
 
+export type GenerateFixExplanationMessage = {
+  type: 'generateFixExplanation';
+  args: {
+    suggestion: Suggestion;
+  };
+};
+
+export type GenerateVulnerabilityExplanationMessage = {
+  type: 'generateVulnerabilityExplanation';
+  args: {
+    suggestion: Suggestion;
+  };
+};
+
 export type ApplyGitDiffMessage = {
   type: 'applyGitDiff';
   args: {
@@ -101,11 +115,29 @@ export type SetAutofixErrorMessage = {
   };
 };
 
+export type SetVulnerabilityExplanation = {
+  type: 'setVulnerabilityExplanation';
+  args: {
+    explanation: string;
+  };
+};
+
+export type SetFixExplanation = {
+  type: 'setFixExplanation';
+  args: {
+    explanation: string;
+  };
+};
+
 export type SuggestionMessage =
   | OpenLocalMessage
   | OpenBrowserMessage
   | IgnoreIssueMessage
   | GetAutofixDiffsMesssage
+  | GenerateVulnerabilityExplanationMessage
+  | GenerateFixExplanationMessage
+  | SetVulnerabilityExplanation
+  | SetFixExplanation
   | ApplyGitDiffMessage
   | SetSuggestionMessage
   | GetSuggestionMessage