Better commit workflow

After click on the COMMIT button the entire commit form is blocked instead just the button

Author: mapaiva

app/frontend/modules/content.js

@@ -266,24 +266,27 @@
           if (commitMessage) {
             let selectedFiles = [];
 
-            event.target.setAttribute('disabled', true);
+            event.target.parentNode.setAttribute('disabled', true);
 
             this.commitChanges.forEach(function (file) {
               if (file.checked) {
                 selectedFiles.push(file.path);
               }
             });
 
+            this.isCreatingCommit = true;
+
             if (selectedFiles.length > 0) {
 
               GIT.add(selectedRepository.path, {
                 files: selectedFiles,
                 callback: function (error) {
 
                   if (error) {
-                    alert(`${MSGS['Error adding files. Error:']} ${error.message}`);
+                    event.target.parentNode.removeAttribute('disabled');
+                    this.isCreatingCommit = false;
 
-                    event.target.removeAttribute('disabled');
+                    alert(`${MSGS['Error adding files. Error:']} ${error.message}`);
                   } else {
 
                     GIT.commit(selectedRepository.path, {
@@ -299,15 +302,17 @@
                           this.setCommitDescription(null);
                         }
 
-                        event.target.removeAttribute('disabled');
+                        event.target.parentNode.removeAttribute('disabled');
+                        this.isCreatingCommit = false;
                       }.bind(this)
                     });
 
                   }
                 }.bind(this)
               });
             } else {
-              event.target.removeAttribute('disabled');
+              event.target.parentNode.removeAttribute('disabled');
+              this.isCreatingCommit = false;
             }
           }
         };

app/frontend/view/content/pieContent.html

@@ -80,7 +80,9 @@ <h3><span class="octicon octicon-diff"></span> {{ MSGS["Commit changes"] }}</h3>
         <textarea ng-model="commitDescription"
           placeholder="{{ MSGS['Give a description to the commit. Tell more about your changes...'] }}"></textarea>
       </div>
-      <button type="button" class="featured" ng-click="appCtrl.commitSelectedChanges(commitMessage, commitDescription, $event)"><span class="octicon octicon-cloud-upload"></span> {{ MSGS.COMMIT }}</button>
+      <button type="button" class="featured" ng-click="appCtrl.commitSelectedChanges(commitMessage, commitDescription, $event)">
+        <span class="octicon octicon-cloud-upload"></span> {{ appCtrl.isCreatingCommit ? MSGS["CREATING COMMIT..."] : MSGS.COMMIT }}
+      </button>
     </form>
 
     <nav ng-scroll="appCtrl.loadMoreCommits($event)" ng-hide="appCtrl.showNoMatchFilterMessage">

language/en.json

@@ -18,6 +18,7 @@
   "Add local git projects to GitPie": "Add local git projects to GitPie",
   "Search repositories": "Search repositories",
   "COMMIT": "COMMIT",
+  "CREATING COMMIT...": "CREATING COMMIT...",
   "Clone URL": "Clone URL",
   "cloned": "cloned",
   "with success": "with success",

language/pt-BR.json

@@ -18,6 +18,7 @@
   "Add local git projects to GitPie": "Adicionar projetos git locais ao GitPie",
   "Search repositories": "Procurar repositórios",
   "COMMIT": "COMMIT",
+  "CREATING COMMIT...": "CRIANDO COMMIT...",
   "Clone URL": "URL de clone",
   "cloned": "clonado",
   "with success": "com sucesso",

resources/sass/all.scss

@@ -116,6 +116,11 @@
     opacity: 0.6 !important;
   }
 
+  [disabled] {
+    opacity: 0.6 !important;
+    pointer-events: none;
+  }
+
   input[type="button"] {
     @extend button;
   }