feat: show the diff file list

Author: zhangmo8

package.json

@@ -38,20 +38,27 @@
   ],
   "contributes": {
     "viewsContainers": {
-      "panel": [
+      "activitybar": [
         {
           "id": "git-panel",
           "title": "Git Panel",
+          "icon": "$(git-commit)"
+        }
+      ],
+      "panel": [
+        {
+          "id": "git-panel",
+          "title": "GitPanel",
           "icon": "res/icon.png"
         }
       ]
     },
     "views": {
       "git-panel": [
         {
+          "type": "webview",
           "id": "git-panel.history",
           "name": "Git Panel",
-          "type": "webview",
           "icon": "$(repo-forked)",
           "contextualTitle": "History"
         },
@@ -65,31 +72,31 @@
     },
     "commands": [
       {
-        "category": "Git Panel",
+        "category": "GitPanel",
         "command": "git-panel.history",
         "title": "History",
         "icon": "$(history)"
       },
       {
-        "category": "Git Panel",
+        "category": "GitPanel",
         "command": "git-panel.history.filter",
         "title": "Git History Filter",
         "icon": "$(filter)"
       },
       {
-        "category": "Git Panel",
+        "category": "GitPanel",
         "command": "git-panel.history.clear",
         "title": "Clear Selection",
         "icon": "$(clear-all)"
       },
       {
-        "category": "Git Panel",
+        "category": "GitPanel",
         "command": "git-panel.history.refresh",
         "title": "Refresh History",
         "icon": "$(refresh)"
       },
       {
-        "category": "Git Panel",
+        "category": "GitPanel",
         "command": "git-panel.history.switch.branch",
         "title": "Select Branch",
         "icon": "$(git-branch)"
@@ -121,8 +128,8 @@
     }
   },
   "scripts": {
-    "build": "vite build && tsup src/index.ts --external vscode",
-    "dev": "nr build --watch",
+    "build": "cross-env NODE_ENV=production vite build && tsup src/index.ts --external vscode",
+    "dev": "concurrently \"vite\" \"cross-env NODE_ENV=development tsup src/index.ts --external vscode --watch\"",
     "prepare": "nr update",
     "update": "vscode-ext-gen --output src/generated/meta.ts",
     "lint": "eslint .",
@@ -147,6 +154,8 @@
     "@vue/tsconfig": "^0.7.0",
     "bumpp": "^9.5.1",
     "concurrently": "^9.1.2",
+    "cross-env": "^7.0.3",
+    "dayjs": "^1.11.13",
     "eslint": "^9.9.0",
     "esno": "^4.7.0",
     "pnpm": "^9.7.1",

pnpm-lock.yaml

@@ -0,0 +1,11 @@
+// webview to vscode channel
+export const WEBVIEW_CHANNEL = {
+  GET_HISTORY: 'get-history',
+  SHOW_COMMIT_DETAILS: 'show-commit-details',
+} as const
+
+// vscode to webview channel
+export const CHANNEL = {
+  HISTORY: 'history',
+  HISTORY_LOADED: 'history-loaded',
+}

src/channel/constant.ts

@@ -1,14 +1,18 @@
 import simpleGit from 'simple-git'
-import type { LogResult, SimpleGit } from 'simple-git'
 import * as vscode from 'vscode'
 
+import type { SimpleGit } from 'simple-git'
+import type { ExtendedLogResult } from './types'
+
+export * from './types'
+
 export class GitService {
-  private git: SimpleGit
   private readonly rootRepoPath = vscode.workspace.workspaceFolders![0].uri.fsPath
+  private _git: SimpleGit
 
   constructor() {
     try {
-      this.git = simpleGit(this.rootRepoPath, {
+      this._git = simpleGit(this.rootRepoPath, {
         binary: 'git',
         maxConcurrentProcesses: 10,
       })
@@ -18,9 +22,40 @@ export class GitService {
     }
   }
 
-  async getHistory(): Promise<LogResult> {
+  get git(): SimpleGit {
+    return this._git
+  }
+
+  async getHistory(): Promise<ExtendedLogResult> {
     try {
-      return await this.git.log([])
+      const logResult = await this.git.log(['--max-count=100']) as ExtendedLogResult
+
+      // Get stats for each commit
+      for (const commit of logResult.all) {
+        try {
+          const stats = await this.git.raw(['show', '--stat', '--format=', commit.hash])
+          const lines = stats.trim().split('\n')
+          const lastLine = lines[lines.length - 1]
+
+          if (lastLine && lastLine.includes('changed')) {
+            const filesMatch = lastLine.match(/(\d+) files? changed/)
+            const addMatch = lastLine.match(/(\d+) insertions?\(\+\)/)
+            const delMatch = lastLine.match(/(\d+) deletions?\(-\)/)
+
+            commit.stats = {
+              files: filesMatch ? Number.parseInt(filesMatch[1]) : 0,
+              additions: addMatch ? Number.parseInt(addMatch[1]) : 0,
+              deletions: delMatch ? Number.parseInt(delMatch[1]) : 0,
+            }
+          }
+        }
+        catch (error) {
+          console.warn(`Failed to get stats for commit ${commit.hash}:`, error)
+          commit.stats = { files: 0, additions: 0, deletions: 0 }
+        }
+      }
+
+      return logResult
     }
     catch (error) {
       console.error('Error getting git history:', error)

src/git/index.ts

@@ -0,0 +1,25 @@
+import type { ListLogLine, LogResult } from 'simple-git'
+
+export interface Commit extends ListLogLine {
+  hash: string
+  authorName: string
+  authorEmail: string
+  message: string
+  body: string
+  date: string
+  stats?: {
+    files: number
+    additions: number
+    deletions: number
+  }
+}
+
+export interface CommitStats {
+  files: number
+  additions: number
+  deletions: number
+}
+
+export interface ExtendedLogResult extends LogResult {
+  all: Array<LogResult['all'][0] & { stats?: CommitStats }>
+}

src/git/types.ts

@@ -1,16 +1,30 @@
-import { defineExtension } from 'reactive-vscode'
 import * as vscode from 'vscode'
 
 import { GitPanelViewProvider } from './views/webview'
+import { GitChangesProvider } from './views/diff'
+import { GitService } from './git'
+import { DiffViewService } from './views/diff/DiffViewService'
 
 import { logger } from './utils'
 
 export function activate(context: vscode.ExtensionContext) {
   logger.info('Git Panel Activated')
-  const provider = new GitPanelViewProvider(vscode.Uri.file(__dirname), context)
+
+  const gitService = new GitService()
+  const diffViewService = DiffViewService.initialize(gitService)
+
+  const provider = new GitPanelViewProvider(vscode.Uri.file(__dirname), context, gitService)
   vscode.window.registerWebviewViewProvider(GitPanelViewProvider.viewType, provider)
-}
 
-export function deactivate() {
-  // Clean up resources
+  const gitChangesProvider = new GitChangesProvider()
+  vscode.window.createTreeView('git-panel.changes', {
+    treeDataProvider: gitChangesProvider,
+    showCollapseAll: true,
+  })
+
+  context.subscriptions.push({
+    dispose: () => {
+      diffViewService.dispose()
+    },
+  })
 }