Merge branch 'ide' of gitlab.com:gitlab-org/gitlab-ce into ide

app/assets/javascripts/api.js

@@ -96,14 +96,18 @@ const Api = {
       .done(projects => callback(projects));
   },
 
-  commitMultiple(id, data, callback) {
+  commitMultiple(id, data, callback, token) {
     // see https://docs.gitlab.com/ce/api/commits.html#create-a-commit-with-multiple-files-and-actions
     const url = Api.buildUrl(Api.commitPath)
       .replace(':id', id);
     return $.ajax({
       url,
+      headers: {
+        'PRIVATE_TOKEN': token,
+      },
       type: 'POST',
-      data: data,
+      contentType: "application/json; charset=utf-8",
+      data: JSON.stringify(data),
       dataType: 'json',
     })
       .done(commitData => callback(commitData))

app/assets/javascripts/repo/index.js

@@ -21,6 +21,8 @@ function initRepo() {
   Store.service.refsUrl = repo.dataset.refsUrl;
   Store.currentBranch = $("button.dropdown-menu-toggle").attr('data-ref');
   Store.checkIsCommitable();
+  Store.projectId = repo.dataset.projectId;
+  Store.tempPrivateToken = repo.dataset.tempToken;
 
   new Vue({
     el: repo,

app/assets/javascripts/repo/repo_commit_section.vue

 <script>
 import Vue from 'vue';
 import Store from './repo_store';
+import Api from '../api'
 
 const RepoCommitSection = {
   data: () => Store,
@@ -8,11 +9,6 @@ const RepoCommitSection = {
   methods: {
     makeCommit() {
       // see https://docs.gitlab.com/ce/api/commits.html#create-a-commit-with-multiple-files-and-actions
-      // branch  string
-      // commit_message  string
-      // actions[]
-      // author_email
-      // author_name
       const branch = $("button.dropdown-menu-toggle").attr('data-ref');
       const commitMessage = this.commitMessage;
       const actions = this.changedFiles.map(f => {
@@ -28,7 +24,18 @@ const RepoCommitSection = {
         commit_message: commitMessage,
         actions: actions,
       }
-      console.log(branch, commitMessage, actions);
+      Store.submitCommitsLoading = true;
+      Api.commitMultiple(Store.projectId, payload, (data) => {
+        Store.submitCommitsLoading = false;
+        Flash(`Your changes have been committed. Commit ${data.short_id} with ${data.stats.additions} additions, ${data.stats.deletions} deletions.`, 'notice');
+        console.log('this.changedFiles', this.changedFiles);
+        console.log('this.files', this.files);
+        this.changedFiles = [];
+        this.openedFiles = [];
+        this.commitMessage = '';
+        this.editMode = false;
+        $('html, body').animate({ scrollTop: 0 }, 'fast');
+      }, Store.tempPrivateToken);
     }
   },
 
@@ -104,7 +111,10 @@ export default RepoCommitSection;
         </div>
       </div>
       <div class="col-md-offset-4 col-md-4">
-        <button type="submit" :disabled="!commitMessage" class="btn btn-success" @click.prevent="makeCommit">Commit {{changedFiles.length}} Files</button>
+        <button type="submit" :disabled="!commitMessage || submitCommitsLoading" class="btn btn-success" @click.prevent="makeCommit">
+          <i class="fa fa-spinner fa-spin" v-if="submitCommitsLoading"></i>
+          <span>Commit {{changedFiles.length}} Files</span>
+        </button>
       </div>
     </fieldset>
   </form>

app/assets/javascripts/repo/repo_helper.js

@@ -73,17 +73,15 @@ const RepoHelper = {
   },
 
   getNewMergedList(inDirectory, currentList, newList) {
-    if (!inDirectory) return newList;
-
+    const newListSorted = newList.sort(this.compareFilesCaseInsensitive);
+    if (!inDirectory) return newListSorted;
     const indexOfFile = currentList.findIndex(file => file.url === inDirectory.url);
-
-    if (!indexOfFile) return newList;
-
-    return RepoHelper.mergeNewListToOldList(newList, currentList, inDirectory, indexOfFile);
+    if (!indexOfFile) return newListSorted;
+    return RepoHelper.mergeNewListToOldList(newListSorted, currentList, inDirectory, indexOfFile);
   },
 
   mergeNewListToOldList(newList, oldList, inDirectory, indexOfFile) {
-    newList.forEach((newFile) => {
+    newList.reverse().forEach((newFile) => {
       const fileIndex = indexOfFile + 1;
       const file = newFile;
       file.level = inDirectory.level + 1;
@@ -93,6 +91,17 @@ const RepoHelper = {
     return oldList;
   },
 
+  compareFilesCaseInsensitive(a,b) {
+    const aName = a.name.toLowerCase();
+    const bName = b.name.toLowerCase();
+    if(a.level > 0) return 0;
+    if (aName < bName)
+      return -1;
+    if (aName > bName)
+      return 1;
+    return 0;
+  },
+
   getContent(treeOrFile, cb) {
     let file = treeOrFile;
     // const loadingData = RepoHelper.setLoading(true);

app/assets/javascripts/repo/repo_store.js

@@ -10,6 +10,7 @@ const RepoStore = {
   editMode: false,
   isTree: false,
   prevURL: '',
+  projectId: '',
   projectName: '',
   trees: [],
   blobs: [],
@@ -21,6 +22,8 @@ const RepoStore = {
   defaultTabSize: 100,
   minTabSize: 30,
   tabsOverflow: 41,
+  tempPrivateToken: '',
+  submitCommitsLoading: false,
   activeFile: {
     active: true,
     binary: false,

app/views/projects/tree/_tree_content.html.haml

-#repo{ data: { url: repo_url(@project), 'project-name' => @project.name, refs_url: refs_namespace_project_path(@project.namespace, @project, format: "json"), project_url: namespace_project_path(@project.namespace, @project) } }
+#repo{ data: { url: repo_url(@project), 'project-name' => @project.name, refs_url: refs_namespace_project_path(@project.namespace, @project, format: "json"), project_url: namespace_project_path(@project.namespace, @project), project_id: @project.id, temp_token: @current_user.private_token } }
 
 - if can_edit_tree?
   = render 'projects/blob/upload', title: _('Upload New File'), placeholder: _('Upload New File'), button_title: _('Upload file'), form_path: project_create_blob_path(@project, @id), method: :post