Commit everything.mr-widget-temp-branch

7 files changed, 152 insertions, 12 deletions

diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js
new file mode 100644
index 00000000000..7944f2e2166
--- /dev/null
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_merged.js
@@ -0,0 +1,56 @@
+window.Vue = require('vue');
+
+module.exports = Vue.component('mr-widget-merged', {
+  name: 'MRWidgetMerged',
+  props: {
+    mr: { type: Object, required: true, default: {} },
+  },
+  template: `
+    <div class="mr-widget-body">
+      {{mr.author_id}}
+      <button @click="mr.author_id = ++mr.author_id">inner component button</button>
+    </div>
+  `
+  // template: `
+  //   <div class="mr-widget-body">
+  //     <h4>
+  //       Merged by
+  //       <a class="author_link" :href="mr.author.web_url">
+  //         <img width="16" class="avatar avatar-inline s16 " :src="mr.author.avatar_url">
+  //         <span class="author">{{mr.author.name}}</span>
+  //       </a>
+  //       <time
+  //         data-toggle="tooltip"
+  //         data-placement="top"
+  //         data-container="body"
+  //         :data-original-title='mr.mergedAt'>
+  //         {{mr.mergedAt}}
+  //       </time>
+  //     </h4>
+  //     <section>
+  //       <p>The changes were merged into {{mr.targetBranch}}</p>
+  //       <p v-if="mr.sourceBranchRemoved">The source branch has been removed.</p>
+  //       {{mr.author_id}}
+  //       {{mr.current_user.can_remove_source_branch}}
+  //       <p v-if="mr.current_user.can_remove_source_branch">
+  //         You can remove source branch now.
+  //         <a class="btn btn-default remove_source_branch">Remove Source Branch</a>
+  //       </p>
+  //     </section>
+  //     <div class="merged-buttons clearfix">
+  //       <a
+  //         class="btn btn-warning has-tooltip"
+  //         href="#modal-revert-commit"
+  //         data-toggle="modal"
+  //         data-container="body"
+  //         data-original-title="Revert this merge request in a new merge request">Revert</a>
+  //       <a
+  //         class="btn btn-default has-tooltip"
+  //         href="#modal-cherry-pick-commit"
+  //         data-toggle="modal"
+  //         data-container="body"
+  //         data-original-title="Cherry-pick this merge request in a new merge request">Cherry-pick</a>
+  //     </div>
+  //   </div>
+  // `
+});
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/widget_header.js b/app/assets/javascripts/vue_merge_request_widget/components/widget_header.js
new file mode 100644
index 00000000000..3cafdb94f3c
--- /dev/null
+++ b/app/assets/javascripts/vue_merge_request_widget/components/widget_header.js
@@ -0,0 +1,19 @@
+window.Vue = require('vue');
+
+module.exports = Vue.component('mr-widget-header', {
+  name: 'MRWidgetHeader',
+  props: {
+    targetBranch: { type: String, default: '', required: true },
+    sourceBranch: { type: String, default: '', required: true },
+  },
+  template: `
+    <div class="normal">
+      <span>Request to merge</span>
+      <span class="label-branch">{{this.sourceBranch}}</span>
+      <span>into</span>
+      <span class="label-branch">
+        <a href="#">{{this.targetBranch}}</a>
+      </span>
+    </div>
+  `
+});
diff --git a/app/assets/javascripts/vue_merge_request_widget/index.js b/app/assets/javascripts/vue_merge_request_widget/index.js
index d9eedbd88a5..595b04251ee 100644
--- a/app/assets/javascripts/vue_merge_request_widget/index.js
+++ b/app/assets/javascripts/vue_merge_request_widget/index.js
@@ -1,11 +1,39 @@
-window.Vue = require('vue');
+window.Vue           = require('vue');
+window.gl            = window.gl || {};
+window.gl.mrWidget   = window.gl.mrWidget || {};
+const Timeago        = require('timeago.js');
+gl.mrWidget.Header   = require('./components/widget_header.js');
+gl.mrWidget.Merged   = require('./components/states/mr_widget_merged.js');
+gl.mrStore           = require('./stores/merge_request_store.js');
+gl.mrWidget.timeagoInstance = new Timeago();
+
 
 $(() => new Vue({
   el: document.querySelector('.vue-merge-request-widget'),
-  data() {
-    return {}
+  name: 'MRWidget',
+  data: {
+    // mr: new gl.mrStore(gl.mrWidgetData),
+    mr: window.gl.mrWidgetData
+  },
+  components: {
+    'mr-widget-header': gl.mrWidget.Header,
+    'mr-widget-merged-state': gl.mrWidget.Merged
   },
   template: `
-    <p>HELLO ACET!</p>
+    <div class="mr-state-widget">
+
+      From main vue: {{mr.author_id}}
+
+      <mr-widget-header
+        :targetBranch="mr.targetBranch"
+        :sourceBranch="mr.sourceBranch"></mr-widget-header>
+
+      <mr-widget-merged-state
+        v-if="mr.state == 'merged'"
+        :mr="mr"></mr-widget-merged-state>
+
+      <button @click="mr.author_id = ++mr.author_id">main vue button</button>
+
+    </div>
   `,
 }));
diff --git a/app/assets/javascripts/vue_merge_request_widget/stores/merge_request_store.js b/app/assets/javascripts/vue_merge_request_widget/stores/merge_request_store.js
new file mode 100644
index 00000000000..941d101d6fb
--- /dev/null
+++ b/app/assets/javascripts/vue_merge_request_widget/stores/merge_request_store.js
@@ -0,0 +1,33 @@
+module.exports = class MergeRequestStore {
+
+  constructor(data) {
+    this.rawData = data || {};
+
+    const { state, target_branch, source_branch, author, merge_event,
+      source_branch_exists, current_user } = data;
+
+    this.state = state;
+    this.targetBranch = target_branch;
+    this.sourceBranch = source_branch;
+    this.author = author;
+    this.mergedAt = gl.mrWidget.timeagoInstance.format(merge_event.updated_at);
+    this.sourceBranchRemoved = !source_branch_exists;
+    this.currentUser = current_user;
+
+    // this.currentUserCanRemoveSourceBranch = this.canRemoveSourceBranch();
+    // this.allowedToRemoveSourceBranch = this.checkSourceBranchRemoveAbility();
+  }
+
+  // canCurrentUserMerge() {
+  //   return this.currentUser.can_merge;
+  // }
+
+  // canRemoveSourceBranch() {
+  //   return this.currentUser.can_remove_source_branch;
+  // }
+
+  // checkSourceBranchRemoveAbility() {
+  //   return this.currentUser.can_remove_source_branch && !this.sourceBranchRemoved;
+  // }
+
+}
diff --git a/app/serializers/merge_request_entity.rb b/app/serializers/merge_request_entity.rb
index cba9c987a89..cfb2803e248 100644
--- a/app/serializers/merge_request_entity.rb
+++ b/app/serializers/merge_request_entity.rb
@@ -45,5 +45,13 @@ class MergeRequestEntity < IssuableEntity
     expose :can_merge_via_cli do |merge_request|
       merge_request.can_be_merged_via_command_line_by?(request.current_user)
     end
+
+    expose :can_revert do |merge_request|
+      merge_request.can_be_reverted?(request.current_user)
+    end
+  end
+
+  expose :can_be_cherry_picked do |merge_request|
+    merge_request.can_be_cherry_picked?
   end
 end
diff --git a/app/views/layouts/_bootlint.haml b/app/views/layouts/_bootlint.haml
index 69280687a9d..e69de29bb2d 100644
--- a/app/views/layouts/_bootlint.haml
+++ b/app/views/layouts/_bootlint.haml
@@ -1,4 +0,0 @@
-:javascript
-  jQuery(document).ready(function() {
-    javascript:(function(){var s=document.createElement("script");s.onload=function(){bootlint.showLintReportForCurrentDocument([], {hasProblems: false, problemFree: false});};s.src="https://maxcdn.bootstrapcdn.com/bootlint/latest/bootlint.min.js";document.body.appendChild(s)})();
-  });
diff --git a/app/views/projects/merge_requests/widget/_show.html.haml b/app/views/projects/merge_requests/widget/_show.html.haml
index 288a8e2bad5..b6088cf7f4a 100644
--- a/app/views/projects/merge_requests/widget/_show.html.haml
+++ b/app/views/projects/merge_requests/widget/_show.html.haml
@@ -9,11 +9,8 @@
 
 .vue-merge-request-widget
 
-- content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('vue_merge_request_widget')
-
 :javascript
-  gl.mrWidgetData = #{@merge_request_json}
+  window.gl.mrWidgetData = #{@merge_request_json}
 
 :javascript
   var opts = {
@@ -45,3 +42,6 @@
   }
 
   merge_request_widget = new window.gl.MergeRequestWidget(opts);
+
+- content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('vue_merge_request_widget')