Refactor commit message generation to support back navigation and improve file selection flow

Author: robertpiosik

apps/editor/src/commands/generate-commit-message-command/generate-commit-message-command.ts

@@ -7,6 +7,7 @@ import { display_token_count } from '../../utils/display-token-count'
 import { get_commit_message_config } from './utils/get-commit-message-config'
 import { build_commit_message_prompt } from './utils/build-commit-message-prompt'
 import { generate_commit_message_with_api } from './utils/generate-commit-message-with-api'
+import { ModelProvidersManager } from '@/services/model-providers-manager'
 
 export const generate_commit_message_command = (
   context: vscode.ExtensionContext
@@ -31,73 +32,128 @@ export const generate_commit_message_command = (
     source_control: vscode.SourceControl | undefined,
     should_commit: boolean
   ) => {
-    const data = await get_prompt_data(source_control)
-    if (!data) return
-    const { repository, was_empty_stage, message_prompt } = data
+    let files_staged_by_action = false
+    const api_providers_manager = new ModelProvidersManager(context)
 
-    const api_config_data = await get_commit_message_config(context)
+    while (true) {
+      const data = await get_prompt_data(source_control)
+      if (!data) return
+      const { repository, message_prompt } = data
+      let { was_empty_stage } = data
 
-    if (!api_config_data) {
       if (was_empty_stage) {
-        await vscode.commands.executeCommand('git.unstageAll')
+        files_staged_by_action = true
+      } else if (files_staged_by_action) {
+        was_empty_stage = true
       }
-      return
-    }
 
-    const commit_message = await generate_commit_message_with_api({
-      endpoint_url: api_config_data.endpoint_url,
-      provider: api_config_data.provider,
-      config: api_config_data.config,
-      message: message_prompt
-    })
-
-    if (commit_message) {
-      if (should_commit) {
-        const edited_message = await new Promise<string | undefined>(
-          (resolve) => {
-            const input_box = vscode.window.createInputBox()
-            input_box.value = commit_message
-            input_box.title = 'Commit Message'
-            input_box.prompt = 'Review the commit message.'
-
-            const close_button = {
-              iconPath: new vscode.ThemeIcon('close'),
-              tooltip: 'Close'
-            }
+      const default_config =
+        await api_providers_manager.get_default_commit_messages_config()
+      const has_default_config = !!default_config
+
+      const api_config_data = await get_commit_message_config(
+        context,
+        was_empty_stage
+      )
 
-            input_box.buttons = [close_button]
+      if (api_config_data === 'back') {
+        if (was_empty_stage) {
+          await vscode.commands.executeCommand('git.unstageAll')
+          files_staged_by_action = false
+          continue
+        }
+        return
+      }
 
-            input_box.onDidTriggerButton((button) => {
-              if (button == close_button) {
-                input_box.hide()
+      if (!api_config_data) {
+        if (was_empty_stage) {
+          await vscode.commands.executeCommand('git.unstageAll')
+        }
+        return
+      }
+
+      const commit_message = await generate_commit_message_with_api({
+        endpoint_url: api_config_data.endpoint_url,
+        provider: api_config_data.provider,
+        config: api_config_data.config,
+        message: message_prompt
+      })
+
+      if (commit_message) {
+        if (should_commit) {
+          const edited_message = await new Promise<string | 'back' | undefined>(
+            (resolve) => {
+              const input_box = vscode.window.createInputBox()
+              input_box.value = commit_message
+              input_box.title = 'Commit Message'
+              input_box.prompt = 'Review the commit message.'
+
+              if (has_default_config && !files_staged_by_action) {
+                input_box.buttons = [
+                  {
+                    iconPath: new vscode.ThemeIcon('close'),
+                    tooltip: 'Close'
+                  }
+                ]
+              } else {
+                input_box.buttons = [vscode.QuickInputButtons.Back]
               }
-            })
 
-            input_box.onDidAccept(() => {
-              resolve(input_box.value)
-              input_box.hide()
-            })
+              let is_resolved = false
+
+              input_box.onDidTriggerButton((button) => {
+                if (
+                  button === vscode.QuickInputButtons.Back ||
+                  button.tooltip == 'Close'
+                ) {
+                  is_resolved = true
+                  resolve('back')
+                  input_box.hide()
+                }
+              })
+
+              input_box.onDidAccept(() => {
+                is_resolved = true
+                resolve(input_box.value)
+                input_box.hide()
+              })
 
-            input_box.onDidHide(() => {
-              resolve(undefined)
-              input_box.dispose()
-            })
+              input_box.onDidHide(() => {
+                if (!is_resolved) {
+                  resolve('back')
+                }
+                input_box.dispose()
+              })
 
-            input_box.show()
+              input_box.show()
+            }
+          )
+
+          if (edited_message === 'back') {
+            if (has_default_config) {
+              if (files_staged_by_action) {
+                await vscode.commands.executeCommand('git.unstageAll')
+              } else {
+                return
+              }
+            }
+            continue
           }
-        )
 
-        if (edited_message) {
-          repository.inputBox.value = edited_message
-          await vscode.commands.executeCommand('git.commit', repository)
-        } else if (was_empty_stage) {
-          await vscode.commands.executeCommand('git.unstageAll')
+          if (edited_message) {
+            repository.inputBox.value = edited_message
+            await vscode.commands.executeCommand('git.commit', repository)
+          } else if (was_empty_stage) {
+            await vscode.commands.executeCommand('git.unstageAll')
+          }
+        } else {
+          repository.inputBox.value = commit_message
         }
-      } else {
-        repository.inputBox.value = commit_message
+      } else if (was_empty_stage) {
+        await vscode.commands.executeCommand('git.unstageAll')
       }
-    } else if (was_empty_stage) {
-      await vscode.commands.executeCommand('git.unstageAll')
+
+      break
     }
   }
 

apps/editor/src/commands/generate-commit-message-command/utils/get-commit-message-config.ts

@@ -18,14 +18,19 @@ export interface CommitMessageConfig {
 }
 
 export const get_commit_message_config = async (
-  context: vscode.ExtensionContext
-): Promise<{
-  config: CommitMessageConfig
-  provider: any
-  endpoint_url: string
-} | null> => {
+  context: vscode.ExtensionContext,
+  show_back_button: boolean = true
+): Promise<
+  | {
+      config: CommitMessageConfig
+      provider: any
+      endpoint_url: string
+    }
+  | 'back'
+  | null
+> => {
   const api_providers_manager = new ModelProvidersManager(context)
-  let commit_message_config: CommitMessageConfig | null | undefined =
+  let commit_message_config: CommitMessageConfig | null | undefined | 'back' =
     await api_providers_manager.get_default_commit_messages_config()
 
   if (!commit_message_config) {
@@ -114,12 +119,18 @@ export const get_commit_message_config = async (
       }
 
       const quick_pick = vscode.window.createQuickPick()
-      const close_button = {
-        iconPath: new vscode.ThemeIcon('close'),
-        tooltip: 'Close'
+
+      if (show_back_button) {
+        quick_pick.buttons = [vscode.QuickInputButtons.Back]
+      } else {
+        quick_pick.buttons = [
+          {
+            iconPath: new vscode.ThemeIcon('close'),
+            tooltip: 'Close'
+          }
+        ]
       }
 
-      quick_pick.buttons = [close_button]
       quick_pick.items = create_items()
       quick_pick.title = 'Configurations'
       quick_pick.placeholder = 'Select configuration'
@@ -139,10 +150,13 @@ export const get_commit_message_config = async (
       }
 
       commit_message_config = await new Promise<
-        CommitMessageConfig | undefined
+        CommitMessageConfig | 'back' | undefined
       >((resolve) => {
         quick_pick.onDidTriggerButton((button) => {
-          if (button == close_button) {
+          if (button === vscode.QuickInputButtons.Back) {
+            quick_pick.hide()
+            resolve('back')
+          } else if (button.tooltip === 'Close') {
             quick_pick.hide()
             resolve(undefined)
           }
@@ -175,7 +189,7 @@ export const get_commit_message_config = async (
         quick_pick.onDidHide(() => {
           quick_pick.dispose()
           if (quick_pick.selectedItems.length == 0) {
-            resolve(undefined)
+            resolve('back')
           }
         })
 
@@ -184,6 +198,10 @@ export const get_commit_message_config = async (
     }
   }
 
+  if (commit_message_config === 'back') {
+    return 'back'
+  }
+
   if (!commit_message_config) {
     return null
   }

apps/editor/src/utils/git-repository-utils.ts

@@ -2,6 +2,7 @@ import * as vscode from 'vscode'
 import { execSync } from 'child_process'
 import { dictionary } from '@shared/constants/dictionary'
 import * as path from 'path'
+import { natural_sort } from './natural-sort'
 
 type GitRepository = {
   rootUri: vscode.Uri
@@ -111,10 +112,44 @@ export const prepare_staged_changes = async (
       }
     })
 
-    const selected = await vscode.window.showQuickPick(items, {
-      canPickMany: true,
-      title: 'Unstaged Files',
-      placeHolder: 'Select files to commit'
+    items.sort((a, b) => {
+      const label_diff = natural_sort(a.label, b.label)
+      if (label_diff != 0) return label_diff
+      return natural_sort(a.description || '', b.description || '')
+    })
+
+    const selected = await new Promise<any[] | undefined>((resolve) => {
+      const quick_pick = vscode.window.createQuickPick<any>()
+      quick_pick.items = items
+      quick_pick.selectedItems = items
+      quick_pick.canSelectMany = true
+      quick_pick.title = 'Unstaged Files'
+      quick_pick.placeholder = 'Select files to commit'
+      quick_pick.buttons = [
+        {
+          iconPath: new vscode.ThemeIcon('close'),
+          tooltip: 'Close'
+        }
+      ]
+
+      quick_pick.onDidTriggerButton((button) => {
+        if (button.tooltip == 'Close') {
+          resolve(undefined)
+          quick_pick.hide()
+        }
+      })
+
+      quick_pick.onDidAccept(() => {
+        resolve(Array.from(quick_pick.selectedItems))
+        quick_pick.hide()
+      })
+
+      quick_pick.onDidHide(() => {
+        resolve(undefined)
+        quick_pick.dispose()
+      })
+
+      quick_pick.show()
     })
 
     if (!selected || selected.length == 0) {