--- a/pylib/mozreview/mozreview/static/mozreview/css/review.less
+++ b/pylib/mozreview/mozreview/static/mozreview/css/review.less
@@ -25,16 +25,25 @@
 
 #draft-banner {
   #field_changedescription,
   p {
     display: none;
   }
 }
 
+.banner-status-flag {
+  display: inline-block;
+  margin-right: 6px;
+}
+
+#mr-review-flag {
+  display: inline-block;
+}
+
 #discard-banner {
   #btn-review-request-reopen,
   #field_changedescription,
   p {
     display: none;
   }
 }
 

--- a/pylib/mozreview/mozreview/static/mozreview/js/review_flag.js
+++ b/pylib/mozreview/mozreview/static/mozreview/js/review_flag.js
@@ -16,17 +16,17 @@ MRReviewFlag.View = Backbone.View.extend
   /**
    * These are the possible states that will be shown in the dropdown,
    * in order. These are also the values that will be stored in the
    * extraData field.
    */
   states: [' ', 'r?', 'r+', 'r-'],
 
   template: _.template([
-      '<label for="mr-review-flag">Review state:</label> ',
+      '<label for="mr-review-flag" hidden>Review state:</label> ',
       '<select id="mr-review-flag">',
       '<% _(states).each(function(state) { %>',
       '  <option <% if (state === val) { %> selected <% } %> >',
       '    <%= state %>',
       '  </option>',
       '<% }); %>',
       '</select>'
   ].join('')),
@@ -48,17 +48,17 @@ MRReviewFlag.View = Backbone.View.extend
     this.listenTo(this.model, 'change:extraData', _.bind(this.render, this));
   },
 
   /**
   *  Under some circumstances a model save will replace the comment textarea
   *  with a 'Add text' link. This is a hack to circumvent that problem.
   *  See bug 1273954.
   */
-  save: function(){
+  save: function() {
     this.model.save({
       attrs: ['extra_data.' + this.key],
       success: function() {
         if (RB.ReviewDialogView._instance) {
           setTimeout(function() { RB.ReviewDialogView._instance._bodyTopView.openEditor(); }, 0);
         }
       }
     });
@@ -71,16 +71,17 @@ MRReviewFlag.View = Backbone.View.extend
     if (userReviewFlag.length == 1) {
       lastKnownFlag = $('#user-review-flag').data('reviewer-flag');
     }
 
     this.$el.html(this.template({
       states: this.states,
       val: this.model.get('extraData')[this.key] || lastKnownFlag
     }));
+
     return this;
   },
 
   updateReviewState: function() {
     var val = this.$el.find('#mr-review-flag').val();
     // We have to send the 'clear the flag' as a non empty string because
     // the api endpoint will ignore it otherwise.
     if (val === '') {
@@ -92,16 +93,32 @@ MRReviewFlag.View = Backbone.View.extend
 });
 
 
 MRReviewFlag.Extension = RB.Extension.extend({
   initialize: function() {
     _super(this).initialize.call(this);
     $(document).on('mozreview_ready', _.bind(function() {
       if (!MozReview.isParent) {
-        new RB.ReviewDialogHook({
+        new RB.DraftDialogHook({
           extension: this,
           viewType: MRReviewFlag.View
         });
+        $(document).trigger('mozreview_review_flag_ready');
       }
     }, this));
   }
 });
+
+
+RB.DraftDialogHook = RB.ExtensionHook.extend({
+  hookPoint: new RB.ExtensionHookPoint(),
+
+  defaults: _.defaults({
+    viewType: null
+  }, RB.ExtensionHook.prototype.defaults),
+
+  setUpHook: function() {
+    console.assert(this.get('viewType'),
+                   'DraftDialogHook instance does not have a ' +
+                   '"viewType" attribute set.');
+  }
+});