Implemented Issue 715's function (#840)

* Implemented Issue 715's function - status bar will show file change status - fix a bug all git directory treated as dirty * Implemented Issue 715's function - status bar will show file change status - fix a bug all git directory treated as dirty * fix small bug related to file changes count * only show changed git status on bottom right * Remove console.log
railsware · Oct 31, 2016 · 70ded6f · 70ded6f
1 parent 04b4c62
commit 70ded6f
Show file tree

Hide file tree

Showing 4 changed files with 65 additions and 2 deletions.
diff --git a/src/plugins/GitWatcher.ts b/src/plugins/GitWatcher.ts
@@ -56,7 +56,7 @@ class GitWatcher extends EventEmitter {
     private async updateGitData() {
 
         executeCommand("git", ["status", "-b", "--porcelain"], this.directory).then(changes => {
-            const status: VcsStatus = changes.length ? "dirty" : "clean";
+            const status: VcsStatus = (changes.split("\n").length > 2) ? "dirty" : "clean";
             let head: string = changes.split(" ")[1];
             let push: string = "0";
             let pull: string = "0";
@@ -86,18 +86,55 @@ class GitWatcher extends EventEmitter {
                 }
             }
 
+            let fileChanges = linesToFileChanges(changes);
+
             const data: VcsData = {
                 kind: "repository",
                 branch: head,
                 push: push,
                 pull: pull,
                 status: status,
+                changes: fileChanges,
             };
 
             this.emit(GIT_WATCHER_EVENT_NAME, data);
         });
     }
 }
+function linesToFileChanges(lines: string): FileChanges {
+  let stagedChanges = new Map<string, number>([["+", 0], ["~", 0], ["-", 0], ["!", 0]]);
+  let unstagedChanges = new Map<string, number>([["+", 0], ["~", 0], ["-", 0], ["!", 0]]);
+  lines.split("\n").slice(1).forEach((line) => {
+    switch (line[0]) {
+      case "A": stagedChanges.set("+", stagedChanges.get("+") + 1); break;
+      case "M":
+      case "R":
+      case "C": stagedChanges.set("~", stagedChanges.get("~") + 1); break;
+      case "D": stagedChanges.set("-", stagedChanges.get("-") + 1); break;
+      case "U": stagedChanges.set("!", stagedChanges.get("!") + 1); break;
+      default: break;
+    }
+
+    switch (line[1]) {
+      case "?":
+      case "A": unstagedChanges.set("+", stagedChanges.get("+") + 1); break;
+      case "M": unstagedChanges.set("~", stagedChanges.get("~") + 1); break;
+      case "D": unstagedChanges.set("-", stagedChanges.get("-") + 1); break;
+      case "U": unstagedChanges.set("!", stagedChanges.get("!") + 1); break;
+      default: break;
+    }
+  });
+  let stagedResult: string = [...stagedChanges]
+    .filter((pair) => (pair[1] !== 0))
+    .map(([key, v]) => (key + String(v) + " "))
+    .reduce((left, right) => (left + right), "");
+  let unstagedResult: string = [...unstagedChanges]
+    .filter((pair) => (pair[1] !== 0))
+    .map(([key, v]) => key + String(v) + " ")
+    .reduce((left, right) => left + right, "");
+  return {stagedChanges: stagedResult, unstagedChanges: unstagedResult};
+}
+
 
 interface WatchesValue {
     listeners: Set<Session>;

diff --git a/src/views/StatusBarComponent.tsx b/src/views/StatusBarComponent.tsx
@@ -15,6 +15,18 @@ const VcsDataComponent = ({data}: { data: VcsData }) => {
         return (
             <div style={css.statusBar.vcsData}>
                 <div style={css.statusBar.status(data.status)}>
+                    {(data.status === "dirty") ?
+                      (<span>
+                        <span style={css.statusBar.stagedFileChanges}>
+                          {data.changes.stagedChanges}
+                        </span>
+                        {(data.changes.stagedChanges === "") ? "" : "| "}
+                        <span style={css.statusBar.unstagedFileChanges}>
+                          {data.changes.unstagedChanges}
+                        </span>
+                      </span>) :
+                      undefined
+                    }
                     <span style={css.statusBar.icon} dangerouslySetInnerHTML={{__html: fontAwesome.longArrowDown}}/>
                     {data.pull}
                     <span style={css.statusBar.icon} dangerouslySetInnerHTML={{__html: fontAwesome.longArrowUp}}/>

diff --git a/src/views/css/main.ts b/src/views/css/main.ts
@@ -254,6 +254,8 @@ export const statusBar = {
         marginRight: 10,
     },
     icon: Object.assign({}, icon, {marginRight: 5, marginLeft: 5}),
+    stagedFileChanges: {color: colors.green},
+    unstagedFileChanges: {color: colors.red},
     status: (status: VcsStatus) => {
         return {
             color: status === "dirty" ? colors.blue : colors.white,

diff --git a/typings/Interfaces.d.ts b/typings/Interfaces.d.ts
@@ -24,7 +24,19 @@ interface PartialRowColumn {
 
 type VcsStatus = "dirty" | "clean";
 
-type VcsData = { kind: "repository", branch: string, push: string, pull: string; status: VcsStatus; } | { kind: "not-repository"; }
+type VcsData = {
+  kind: "repository",
+  branch: string,
+  push: string,
+  pull: string,
+  changes: FileChanges,
+  status: VcsStatus;
+} | { kind: "not-repository"; }
+
+interface FileChanges {
+  stagedChanges: string;
+  unstagedChanges: string;
+}
 
 interface Margins {
     top: number;