Merge branch 'master' into 'ee-38869-datetime'

# Conflicts:
#   app/assets/javascripts/merge_request_tabs.js

app/assets/javascripts/contextual_sidebar.js

@@ -9,7 +9,7 @@ export default class ContextualSidebar {
   }
 
   initDomElements() {
-    this.$page = $('.page-with-sidebar');
+    this.$page = $('.layout-page');
     this.$sidebar = $('.nav-sidebar');
     this.$innerScroll = $('.nav-sidebar-inner-scroll', this.$sidebar);
     this.$overlay = $('.mobile-overlay');

app/assets/javascripts/dispatcher.js

@@ -15,7 +15,7 @@ import GroupLabelSubscription from './group_label_subscription';
 import BuildArtifacts from './build_artifacts';
 import CILintEditor from './ci_lint_editor';
 import groupsSelect from './groups_select';
-/* global Search */
+import Search from './search';
 /* global Admin */
 import NamespaceSelect from './namespace_select';
 import NewCommitForm from './new_commit_form';
@@ -25,7 +25,7 @@ import projectAvatar from './project_avatar';
 import Compare from './compare';
 import initCompareAutocomplete from './compare_autocomplete';
 /* global PathLocks */
-/* global ProjectFindFile */
+import ProjectFindFile from './project_find_file';
 import ProjectNew from './project_new';
 import projectImport from './project_import';
 import Labels from './labels';
@@ -96,6 +96,7 @@ import DueDateSelectors from './due_date_select';
 import Diff from './diff';
 import ProjectLabelSubscription from './project_label_subscription';
 import ProjectVariables from './project_variables';
+import SearchAutocomplete from './search_autocomplete';
 
 // EE-only
 import ApproversSelect from './approvers_select';
@@ -777,7 +778,7 @@ import initGroupAnalytics from './init_group_analytics';
     Dispatcher.prototype.initSearch = function() {
       // Only when search form is present
       if ($('.search').length) {
-        return new gl.SearchAutocomplete();
+        return new SearchAutocomplete();
       }
     };
 

app/assets/javascripts/issuable_bulk_update_sidebar.js

@@ -21,7 +21,7 @@ export default class IssuableBulkUpdateSidebar {
   }
 
   initDomElements() {
-    this.$page = $('.page-with-sidebar');
+    this.$page = $('.layout-page');
     this.$sidebar = $('.right-sidebar');
     this.$sidebarInnerContainer = this.$sidebar.find('.issuable-sidebar');
     this.$bulkEditCancelBtn = $('.js-bulk-update-menu-hide');

app/assets/javascripts/main.js

@@ -60,15 +60,10 @@ import './notifications_dropdown';
 import './notifications_form';
 import './pager';
 import './preview_markdown';
-import './project_find_file';
 import './project_import';
 import './projects_dropdown';
-import './projects_list';
-import './syntax_highlight';
 import './render_gfm';
 import './right_sidebar';
-import './search';
-import './search_autocomplete';
 import initBreadcrumbs from './breadcrumb';
 
 // EE-only scripts
@@ -134,7 +129,7 @@ $(function () {
   });
 
   if (bootstrapBreakpoint === 'xs') {
-    const $rightSidebar = $('aside.right-sidebar, .page-with-sidebar');
+    const $rightSidebar = $('aside.right-sidebar, .layout-page');
 
     $rightSidebar
       .removeClass('right-sidebar-expanded')
@@ -194,7 +189,7 @@ $(function () {
     trigger: 'focus',
     // set the viewport to the main content, excluding the navigation bar, so
     // the navigation can't overlap the popover
-    viewport: '.page-with-sidebar'
+    viewport: '.layout-page'
   });
   $('.trigger-submit').on('change', function () {
     return $(this).parents('form').submit();

app/assets/javascripts/merge_conflicts/merge_conflicts_bundle.js

@@ -10,6 +10,7 @@ import './mixins/line_conflict_actions';
 import './components/diff_file_editor';
 import './components/inline_conflict_lines';
 import './components/parallel_conflict_lines';
+import syntaxHighlight from '../syntax_highlight';
 
 $(() => {
   const INTERACTIVE_RESOLVE_MODE = 'interactive';
@@ -53,7 +54,7 @@ $(() => {
           mergeConflictsStore.setLoadingState(false);
 
           this.$nextTick(() => {
-            $('.js-syntax-highlight').syntaxHighlight();
+            syntaxHighlight($('.js-syntax-highlight'));
           });
         });
     },

app/assets/javascripts/render_gfm.js

 import renderMath from './render_math';
 import renderMermaid from './render_mermaid';
+import syntaxHighlight from './syntax_highlight';
 
 // Render Gitlab flavoured Markdown
 //
 // Delegates to syntax highlight and render math & mermaid diagrams.
 //
 $.fn.renderGFM = function renderGFM() {
-  this.find('.js-syntax-highlight').syntaxHighlight();
+  syntaxHighlight(this.find('.js-syntax-highlight'));
   renderMath(this.find('.js-render-math'));
   renderMermaid(this.find('.js-render-mermaid'));
   return this;

app/assets/javascripts/repo/components/repo_preview.vue

 <script>
 /* global LineHighlighter */
 import { mapGetters } from 'vuex';
+import syntaxHighlight from '../../syntax_highlight';
 
 export default {
   computed: {
@@ -13,7 +14,7 @@ export default {
   },
   methods: {
     highlightFile() {
-      $(this.$el).find('.file-content').syntaxHighlight();
+      syntaxHighlight($(this.$el).find('.file-content'));
     },
   },
   mounted() {

app/assets/javascripts/right_sidebar.js

@@ -42,11 +42,11 @@ import Cookies from 'js-cookie';
       if ($thisIcon.hasClass('fa-angle-double-right')) {
         $allGutterToggleIcons.removeClass('fa-angle-double-right').addClass('fa-angle-double-left');
         $('aside.right-sidebar').removeClass('right-sidebar-expanded').addClass('right-sidebar-collapsed');
-        $('.page-with-sidebar').removeClass('right-sidebar-expanded').addClass('right-sidebar-collapsed');
+        $('.layout-page').removeClass('right-sidebar-expanded').addClass('right-sidebar-collapsed');
       } else {
         $allGutterToggleIcons.removeClass('fa-angle-double-left').addClass('fa-angle-double-right');
         $('aside.right-sidebar').removeClass('right-sidebar-collapsed').addClass('right-sidebar-expanded');
-        $('.page-with-sidebar').removeClass('right-sidebar-collapsed').addClass('right-sidebar-expanded');
+        $('.layout-page').removeClass('right-sidebar-collapsed').addClass('right-sidebar-expanded');
 
         if (gl.lazyLoader) gl.lazyLoader.loadCheck();
       }
@@ -173,7 +173,7 @@ import Cookies from 'js-cookie';
 
     Sidebar.prototype.setCollapseAfterUpdate = function($block) {
       $block.addClass('collapse-after-update');
-      return $('.page-with-sidebar').addClass('with-overlay');
+      return $('.layout-page').addClass('with-overlay');
     };
 
     Sidebar.prototype.onSidebarDropdownHidden = function(e) {
@@ -187,7 +187,7 @@ import Cookies from 'js-cookie';
     Sidebar.prototype.sidebarDropdownHidden = function($block) {
       if ($block.hasClass('collapse-after-update')) {
         $block.removeClass('collapse-after-update');
-        $('.page-with-sidebar').removeClass('with-overlay');
+        $('.layout-page').removeClass('with-overlay');
         return this.toggleSidebar('hide');
       }
     };

app/assets/javascripts/search.js

-/* eslint-disable func-names, space-before-function-paren, wrap-iife, no-var, one-var, one-var-declaration-per-line, object-shorthand, prefer-arrow-callback, comma-dangle, prefer-template, quotes, no-else-return, max-len */
 import Flash from './flash';
 import Api from './api';
 
-(function() {
-  this.Search = (function() {
-    function Search() {
-      var $groupDropdown, $projectDropdown;
-      $groupDropdown = $('.js-search-group-dropdown');
-      $projectDropdown = $('.js-search-project-dropdown');
-      this.groupId = $groupDropdown.data('group-id');
-      this.eventListeners();
-      $groupDropdown.glDropdown({
-        selectable: true,
-        filterable: true,
-        fieldName: 'group_id',
-        search: {
-          fields: ['full_name']
-        },
-        data: function(term, callback) {
-          return Api.groups(term, {}, function(data) {
+export default class Search {
+  constructor() {
+    const $groupDropdown = $('.js-search-group-dropdown');
+    const $projectDropdown = $('.js-search-project-dropdown');
+
+    this.searchInput = '.js-search-input';
+    this.searchClear = '.js-search-clear';
+
+    this.groupId = $groupDropdown.data('group-id');
+    this.eventListeners();
+
+    $groupDropdown.glDropdown({
+      selectable: true,
+      filterable: true,
+      fieldName: 'group_id',
+      search: {
+        fields: ['full_name'],
+      },
+      data(term, callback) {
+        return Api.groups(term, {}, (data) => {
+          data.unshift({
+            full_name: 'Any',
+          });
+          data.splice(1, 0, 'divider');
+          return callback(data);
+        });
+      },
+      id(obj) {
+        return obj.id;
+      },
+      text(obj) {
+        return obj.full_name;
+      },
+      toggleLabel(obj) {
+        return `${($groupDropdown.data('default-label'))} ${obj.full_name}`;
+      },
+      clicked: () => Search.submitSearch(),
+    });
+
+    $projectDropdown.glDropdown({
+      selectable: true,
+      filterable: true,
+      fieldName: 'project_id',
+      search: {
+        fields: ['name'],
+      },
+      data: (term, callback) => {
+        this.getProjectsData(term)
+          .then((data) => {
             data.unshift({
-              full_name: 'Any'
+              name_with_namespace: 'Any',
             });
             data.splice(1, 0, 'divider');
-            return callback(data);
-          });
-        },
-        id: function(obj) {
-          return obj.id;
-        },
-        text: function(obj) {
-          return obj.full_name;
-        },
-        toggleLabel: function(obj) {
-          return ($groupDropdown.data('default-label')) + " " + obj.full_name;
-        },
-        clicked: (function(_this) {
-          return function() {
-            return _this.submitSearch();
-          };
-        })(this)
-      });
-      $projectDropdown.glDropdown({
-        selectable: true,
-        filterable: true,
-        fieldName: 'project_id',
-        search: {
-          fields: ['name']
-        },
-        data: (term, callback) => {
-          this.getProjectsData(term)
-            .then((data) => {
-              data.unshift({
-                name_with_namespace: 'Any'
-              });
-              data.splice(1, 0, 'divider');
 
-              return data;
-            })
-            .then(data => callback(data))
-            .catch(() => new Flash('Error fetching projects'));
-        },
-        id: function(obj) {
-          return obj.id;
-        },
-        text: function(obj) {
-          return obj.name_with_namespace;
-        },
-        toggleLabel: function(obj) {
-          return ($projectDropdown.data('default-label')) + " " + obj.name_with_namespace;
-        },
-        clicked: (function(_this) {
-          return function() {
-            return _this.submitSearch();
-          };
-        })(this)
-      });
-    }
+            return data;
+          })
+          .then(data => callback(data))
+          .catch(() => new Flash('Error fetching projects'));
+      },
+      id(obj) {
+        return obj.id;
+      },
+      text(obj) {
+        return obj.name_with_namespace;
+      },
+      toggleLabel(obj) {
+        return `${($projectDropdown.data('default-label'))} ${obj.name_with_namespace}`;
+      },
+      clicked: () => Search.submitSearch(),
+    });
+  }
 
-    Search.prototype.eventListeners = function() {
-      $(document).off('keyup', '.js-search-input').on('keyup', '.js-search-input', this.searchKeyUp);
-      return $(document).off('click', '.js-search-clear').on('click', '.js-search-clear', this.clearSearchField);
-    };
+  eventListeners() {
+    $(document)
+      .off('keyup', this.searchInput)
+      .on('keyup', this.searchInput, this.searchKeyUp);
+    $(document)
+      .off('click', this.searchClear)
+      .on('click', this.searchClear, this.clearSearchField);
+  }
 
-    Search.prototype.submitSearch = function() {
-      return $('.js-search-form').submit();
-    };
+  static submitSearch() {
+    return $('.js-search-form').submit();
+  }
 
-    Search.prototype.searchKeyUp = function() {
-      var $input;
-      $input = $(this);
-      if ($input.val() === '') {
-        return $('.js-search-clear').addClass('hidden');
-      } else {
-        return $('.js-search-clear').removeClass('hidden');
-      }
-    };
-
-    Search.prototype.clearSearchField = function() {
-      return $('.js-search-input').val('').trigger('keyup').focus();
-    };
+  searchKeyUp() {
+    const $input = $(this);
+    if ($input.val() === '') {
+      $('.js-search-clear').addClass('hidden');
+    } else {
+      $('.js-search-clear').removeClass('hidden');
+    }
+  }
 
-    Search.prototype.getProjectsData = function(term) {
-      return new Promise((resolve) => {
-        if (this.groupId) {
-          Api.groupProjects(this.groupId, term, resolve);
-        } else {
-          Api.projects(term, {
-            order_by: 'id',
-          }, resolve);
-        }
-      });
-    };
+  clearSearchField() {
+    return $(this.searchInput).val('').trigger('keyup').focus();
+  }
 
-    return Search;
-  })();
-}).call(window);
+  getProjectsData(term) {
+    return new Promise((resolve) => {
+      if (this.groupId) {
+        Api.groupProjects(this.groupId, term, resolve);
+      } else {
+        Api.projects(term, {
+          order_by: 'id',
+        }, resolve);
+      }
+    });
+  }
+}

app/assets/javascripts/single_file_diff.js

@@ -2,6 +2,7 @@
 
 import FilesCommentButton from './files_comment_button';
 import imageDiffHelper from './image_diff/helpers/index';
+import syntaxHighlight from './syntax_highlight';
 
 const WRAPPER = '<div class="diff-content"></div>';
 const LOADING_HTML = '<i class="fa fa-spinner fa-spin"></i>';
@@ -64,7 +65,7 @@ export default class SingleFileDiff {
         _this.loadingContent.hide();
         if (data.html) {
           _this.content = $(data.html);
-          _this.content.syntaxHighlight();
+          syntaxHighlight(_this.content);
         } else {
           _this.hasError = true;
           _this.content = $(ERROR_HTML);

app/assets/javascripts/syntax_highlight.js

@@ -10,17 +10,15 @@
 //   <div class="js-syntax-highlight"></div>
 //
 
-$.fn.syntaxHighlight = function() {
-  var $children;
-
-  if ($(this).hasClass('js-syntax-highlight')) {
+export default function syntaxHighlight(el) {
+  if ($(el).hasClass('js-syntax-highlight')) {
     // Given the element itself, apply highlighting
-    return $(this).addClass(gon.user_color_scheme);
+    return $(el).addClass(gon.user_color_scheme);
   } else {
     // Given a parent element, recurse to any of its applicable children
-    $children = $(this).find('.js-syntax-highlight');
+    const $children = $(el).find('.js-syntax-highlight');
     if ($children.length) {
-      return $children.syntaxHighlight();
+      return syntaxHighlight($children);
     }
   }
-};
+}

app/assets/stylesheets/framework/dropdowns.scss

@@ -143,20 +143,48 @@
   }
 }
 
+@mixin dropdown-item-hover {
+  background-color: $dropdown-item-hover-bg;
+  color: $gl-text-color;
+  outline: 0;
+
+  // make sure the text color is not overriden
+  &.text-danger {
+    color: $brand-danger;
+  }
+
+  .avatar {
+    border-color: $white-light;
+  }
+}
+
 @mixin dropdown-link {
+  background: transparent;
+  border: 0;
+  border-radius: 0;
+  box-shadow: none;
   display: block;
+  font-weight: $gl-font-weight-normal;
   position: relative;
-  padding: 5px 8px;
+  padding: 8px 16px;
   color: $gl-text-color;
-  line-height: initial;
-  border-radius: 2px;
-  white-space: nowrap;
+  line-height: normal;
+  white-space: normal;
   overflow: hidden;
+  text-align: left;
+  width: 100%;
+
+  // make sure the text color is not overriden
+  &.text-danger {
+    color: $brand-danger;
+  }
 
   &:hover,
+  &:active,
   &:focus,
   &.is-focused {
-    background-color: $dropdown-link-hover-bg;
+    @include dropdown-item-hover;
+
     text-decoration: none;
 
     .badge {
@@ -166,6 +194,13 @@
 
   &.dropdown-menu-user-link {
     line-height: 16px;
+    padding-top: 10px;
+    padding-bottom: 7px;
+    white-space: nowrap;
+
+    .dropdown-menu-user-username {
+      display: block;
+    }
   }
 
   .icon-play {
@@ -187,8 +222,8 @@
   z-index: 300;
   min-width: 240px;
   max-width: 500px;
-  margin-top: 2px;
-  margin-bottom: 2px;
+  margin-top: $dropdown-vertical-offset;
+  margin-bottom: 24px;
   font-size: 14px;
   font-weight: $gl-font-weight-normal;
   padding: 8px 0;
@@ -197,6 +232,10 @@
   border-radius: $border-radius-base;
   box-shadow: 0 2px 4px $dropdown-shadow-color;
 
+  &.dropdown-open-top {
+    margin-bottom: $dropdown-vertical-offset;
+  }
+
   &.dropdown-open-left {
     right: 0;
     left: auto;
@@ -227,16 +266,27 @@
   }
 
   li {
+    display: block;
     text-align: left;
     list-style: none;
-    padding: 0 10px;
+    padding: 0 1px;
+
+    a,
+    button,
+    .menu-item {
+      @include dropdown-link;
+    }
   }
 
   .divider {
     height: 1px;
-    margin: 6px 10px;
+    margin: 6px 0;
     padding: 0;
     background-color: $dropdown-divider-color;
+
+    &:hover {
+      background-color: $dropdown-divider-color;
+    }
   }
 
   .separator {
@@ -247,10 +297,6 @@
     background-color: $dropdown-divider-color;
   }
 
-  a {
-    @include dropdown-link;
-  }
-
   .dropdown-menu-empty-item a {
     &:hover,
     &:focus {
@@ -262,7 +308,7 @@
     color: $gl-text-color-secondary;
     font-size: 13px;
     line-height: 22px;
-    padding: 0 16px;
+    padding: 8px 16px;
   }
 
   &.capitalize-header .dropdown-header {
@@ -277,7 +323,7 @@
 
   .separator + .dropdown-header,
   .separator + .dropdown-bold-header {
-    padding-top: 2px;
+    padding-top: 10px;
   }
 
   .unclickable {
@@ -298,48 +344,28 @@
   }
 
   .dropdown-menu li {
-    padding: $gl-btn-padding;
     cursor: pointer;
 
+    &.droplab-item-active button {
+      @include dropdown-item-hover;
+    }
+
     > a,
     > button {
       display: flex;
       margin: 0;
-      padding: 0;
-      border-radius: 0;
       text-overflow: inherit;
-      background-color: inherit;
-      color: inherit;
-      border: inherit;
       text-align: left;
 
-      &:hover,
-      &:focus {
-        background-color: inherit;
-        color: inherit;
-      }
-
       &.btn .fa:not(:last-child) {
         margin-left: 5px;
       }
     }
 
-    &:hover,
-    &:focus {
-      background-color: $dropdown-hover-color;
-      color: $white-light;
-    }
-
     &.droplab-item-selected i {
       visibility: visible;
     }
 
-    &.divider {
-      margin: 0 8px;
-      padding: 0;
-      border-top: $gray-darkest;
-    }
-
     .icon {
       visibility: hidden;
     }
@@ -431,11 +457,6 @@
   }
 }
 
-.dropdown-menu-user-link {
-  padding-top: 10px;
-  padding-bottom: 7px;
-}
-
 .dropdown-menu-user-full-name {
   display: block;
   font-weight: $gl-font-weight-normal;
@@ -464,41 +485,44 @@
 .dropdown-menu-align-right {
   left: auto;
   right: 0;
-  margin-top: -5px;
 }
 
 .dropdown-menu-selectable {
-  a {
-    padding-left: 26px;
-    position: relative;
+  li {
+    a {
+      padding: 8px 40px;
+      position: relative;
+
+      &.is-indeterminate,
+      &.is-active {
+        color: $gl-text-color;
+
+        &::before {
+          position: absolute;
+          left: 16px;
+          top: 16px;
+          transform: translateY(-50%);
+          font: normal normal normal 14px/1 FontAwesome;
+          font-size: inherit;
+          text-rendering: auto;
+          -webkit-font-smoothing: antialiased;
+          -moz-osx-font-smoothing: grayscale;
+        }
 
-    &.is-indeterminate,
-    &.is-active {
-      font-weight: $gl-font-weight-bold;
-      color: $gl-text-color;
-
-      &::before {
-        position: absolute;
-        left: 6px;
-        top: 50%;
-        transform: translateY(-50%);
-        font: normal normal normal 14px/1 FontAwesome;
-        font-size: inherit;
-        text-rendering: auto;
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
+        &.dropdown-menu-user-link {
+          &::before {
+            top: 50%;
+          }
+        }
       }
-    }
 
-    &.is-indeterminate::before {
-      content: "\f068";
-    }
+      &.is-indeterminate::before {
+        content: "\f068";
+      }
 
-    &.is-active::before {
-      content: "\f00c";
-      position: absolute;
-      top: 50%;
-      transform: translateY(-50%);
+      &.is-active::before {
+        content: "\f00c";
+      }
     }
   }
 }
@@ -735,136 +759,6 @@
   }
 }
 
-@mixin dropdown-item-hover {
-  background-color: $dropdown-item-hover-bg;
-  color: $gl-text-color;
-}
-
-// TODO: change global style and remove mixin
-@mixin new-style-dropdown($selector: '') {
-  #{$selector}.dropdown-menu,
-  #{$selector}.dropdown-menu-nav {
-    margin-bottom: 24px;
-
-    &.dropdown-open-top {
-      margin-bottom: $dropdown-vertical-offset;
-    }
-
-    li {
-      display: block;
-      padding: 0 1px;
-
-      &:hover {
-        background-color: transparent;
-      }
-
-      &.divider {
-        margin: 6px 0;
-
-        &:hover {
-          background-color: $dropdown-divider-color;
-        }
-      }
-
-      &.dropdown-header {
-        padding: 8px 16px;
-      }
-
-      &.droplab-item-active button {
-        @include dropdown-item-hover;
-      }
-
-      a,
-      button,
-      .menu-item {
-        margin-bottom: 0;
-        border-radius: 0;
-        box-shadow: none;
-        padding: 8px 16px;
-        text-align: left;
-        white-space: normal;
-        width: 100%;
-        font-weight: $gl-font-weight-normal;
-        line-height: normal;
-
-        &.dropdown-menu-user-link {
-          white-space: nowrap;
-
-          .dropdown-menu-user-username {
-            display: block;
-          }
-        }
-
-        // make sure the text color is not overriden
-        &.text-danger {
-          color: $brand-danger;
-        }
-
-        &.is-focused,
-        &:hover,
-        &:active,
-        &:focus {
-          @include dropdown-item-hover;
-
-          background-color: $dropdown-item-hover-bg;
-          color: $gl-text-color;
-
-          // make sure the text color is not overriden
-          &.text-danger {
-            color: $brand-danger;
-          }
-        }
-
-        &.is-active {
-          font-weight: inherit;
-
-          &::before {
-            top: 16px;
-          }
-
-          &.dropdown-menu-user-link::before {
-            top: 50%;
-            transform: translateY(-50%);
-          }
-        }
-      }
-
-      &.dropdown-menu-empty-item a {
-        &:hover,
-        &:focus {
-          background-color: transparent;
-        }
-      }
-    }
-
-    &.dropdown-menu-selectable {
-      li {
-        a {
-          padding: 8px 40px;
-
-          &.is-indeterminate::before,
-          &.is-active::before {
-            left: 16px;
-          }
-        }
-      }
-    }
-  }
-
-  #{$selector}.dropdown-menu-align-right {
-    margin-top: 2px;
-  }
-
-  .open {
-    #{$selector}.dropdown-menu,
-    #{$selector}.dropdown-menu-nav {
-      @media (max-width: $screen-xs-max) {
-        max-width: 100%;
-      }
-    }
-  }
-}
-
 @media (max-width: $screen-xs-max) {
   .navbar-gitlab {
     li.header-projects,
@@ -891,9 +785,6 @@
   }
 }
 
-@include new-style-dropdown('.breadcrumbs-list .dropdown ');
-@include new-style-dropdown('.js-namespace-select + ');
-
 header.header-content .dropdown-menu.projects-dropdown-menu {
   padding: 0;
 }
@@ -1031,35 +922,6 @@ header.header-content .dropdown-menu.projects-dropdown-menu {
   }
 }
 
-.new-epic-dropdown {
-  .dropdown-menu {
-    padding-left: $gl-padding-top;
-    padding-right: $gl-padding-top;
-  }
-
-  .form-control {
-    width: 100%;
-  }
-
-  .btn-save {
-    display: flex;
-    margin-top: $gl-btn-padding;
-  }
-}
-
-.empty-state .new-epic-dropdown {
-  display: inline-flex;
-
-  .btn-save {
-    margin-left: 0;
-    margin-bottom: 0;
-  }
-
-  .btn-new {
-    margin: 0;
-  }
-}
-
 .dropdown-content-faded-mask {
   position: relative;
 

app/assets/stylesheets/framework/filters.scss

@@ -50,8 +50,6 @@
 }
 
 .filtered-search-wrapper {
-  @include new-style-dropdown;
-
   display: -webkit-flex;
   display: flex;
 
@@ -165,16 +163,6 @@
   }
 }
 
-.droplab-dropdown li.filtered-search-token {
-  padding: 0;
-
-  &:hover,
-  &:focus {
-    background-color: inherit;
-    color: inherit;
-  }
-}
-
 .filtered-search-term {
   .name {
     background-color: inherit;
@@ -336,21 +324,12 @@
 
 .filtered-search-history-dropdown-content {
   max-height: none;
-}
-
-.filtered-search-history-dropdown-item,
-.filtered-search-history-clear-button {
-  @include dropdown-link;
-
-  overflow: hidden;
-  width: 100%;
-  margin: 0.5em 0;
 
-  background-color: transparent;
-  border: 0;
-  text-align: left;
-  white-space: nowrap;
-  text-overflow: ellipsis;
+  .filtered-search-history-dropdown-item,
+  .filtered-search-history-clear-button {
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
 }
 
 .filtered-search-history-dropdown-token {
@@ -402,24 +381,9 @@
   }
 }
 
-%filter-dropdown-item-btn-hover {
-  text-decoration: none;
-  outline: 0;
-
-  .avatar {
-    border-color: $white-light;
-  }
-}
-
 .droplab-dropdown .dropdown-menu .filter-dropdown-item {
   .btn {
-    border: 0;
-    width: 100%;
-    text-align: left;
-    padding: 8px 16px;
     text-overflow: ellipsis;
-    overflow: hidden;
-    border-radius: 0;
 
     .fa {
       width: 15px;
@@ -433,11 +397,6 @@
       width: 17px;
       height: 17px;
     }
-
-    &:hover,
-    &:focus {
-      @extend %filter-dropdown-item-btn-hover;
-    }
   }
 
   .dropdown-light-content {
@@ -458,17 +417,9 @@
       word-break: break-all;
     }
   }
-
-  &.droplab-item-active .btn {
-    @extend %filter-dropdown-item-btn-hover;
-  }
 }
 
 .filter-dropdown-loading {
   padding: 8px 16px;
   text-align: center;
 }
-
-.issues-details-filters {
-  @include new-style-dropdown;
-}

app/assets/stylesheets/framework/header.scss

-.content-wrapper.page-with-new-nav {
-  margin-top: $header-height;
-}
-
 .navbar-gitlab {
-  @include new-style-dropdown;
-
   &.navbar-gitlab {
     padding: 0 16px;
     z-index: 1000;

app/assets/stylesheets/framework/layout.scss

@@ -24,6 +24,7 @@ body {
 }
 
 .content-wrapper {
+  margin-top: $header-height;
   padding-bottom: 100px;
 }
 
@@ -105,11 +106,11 @@ body {
   }
 }
 
-.page-with-sidebar > .content-wrapper {
+.layout-page > .content-wrapper {
   min-height: calc(100vh - #{$header-height});
 }
 
-.with-performance-bar .page-with-sidebar {
+.with-performance-bar .layout-page {
   margin-top: $header-height + $performance-bar-height;
 }
 

app/assets/stylesheets/framework/lists.scss

@@ -132,8 +132,6 @@ ul.content-list {
     }
 
     .controls {
-      @include new-style-dropdown;
-
       float: right;
 
       > .control-text {

app/assets/stylesheets/framework/secondary-navigation-elements.scss

@@ -86,8 +86,6 @@
   }
 
   .nav-controls {
-    @include new-style-dropdown;
-
     display: inline-block;
     float: right;
     text-align: right;

app/assets/stylesheets/framework/sidebar.scss

@@ -144,10 +144,6 @@
   }
 }
 
-.issuable-sidebar {
-  @include new-style-dropdown;
-}
-
 .pikaday-container {
   .pika-single {
     margin-top: 2px;

app/assets/stylesheets/framework/typography.scss

@@ -343,8 +343,6 @@ a > code {
   @extend .ref-name;
 }
 
-@include new-style-dropdown('.git-revision-dropdown');
-
 /**
  * Apply Markdown typography
  *

app/assets/stylesheets/pages/boards.scss

@@ -482,7 +482,7 @@
   border-top: 1px solid $border-color;
 }
 
-.page-with-contextual-sidebar.page-with-sidebar .issue-boards-sidebar {
+.page-with-contextual-sidebar.layout-page .issue-boards-sidebar {
   .issuable-sidebar-header {
     position: relative;
   }
@@ -699,8 +699,6 @@
 }
 
 .boards-switcher {
-  @include new-style-dropdown;
-
   padding-right: 10px;
 }
 

app/assets/stylesheets/pages/builds.scss

@@ -323,8 +323,6 @@
   }
 
   .build-dropdown {
-    @include new-style-dropdown;
-
     margin: $gl-padding 0;
     padding: 0;
 

app/assets/stylesheets/pages/clusters.scss

@@ -13,8 +13,6 @@
   max-width: 100%;
 }
 
-@include new-style-dropdown('.clusters-dropdown ');
-
 .clusters-container {
   .nav-bar-right {
     padding: $gl-padding-top $gl-padding;

app/assets/stylesheets/pages/cycle_analytics.scss

 #cycle-analytics {
-  @include new-style-dropdown;
-
   max-width: 1000px;
   margin: 24px auto 0;
   position: relative;

app/assets/stylesheets/pages/detail_page.scss

@@ -32,8 +32,6 @@
 }
 
 .detail-page-header-actions {
-  @include new-style-dropdown;
-
   align-self: center;
   flex-shrink: 0;
   flex: 0 0 auto;

app/assets/stylesheets/pages/diff.scss

@@ -581,8 +581,6 @@
   }
 
   .commit-stat-summary {
-    @include new-style-dropdown;
-
     @media (min-width: $screen-sm-min) {
       margin-left: -$gl-padding;
       padding-left: $gl-padding;

app/assets/stylesheets/pages/editor.scss

@@ -204,8 +204,6 @@
   .gitlab-ci-yml-selector,
   .dockerfile-selector,
   .template-type-selector {
-    @include new-style-dropdown;
-
     display: inline-block;
     vertical-align: top;
     font-family: $regular_font;

app/assets/stylesheets/pages/environments.scss

@@ -12,8 +12,6 @@
 
 .environments-container {
   .ci-table {
-    @include new-style-dropdown;
-
     .deployment-column {
       > span {
         word-break: break-all;

app/assets/stylesheets/pages/issuable.scss

@@ -489,12 +489,6 @@
     }
   }
 
-  .dropdown-content {
-    a:hover {
-      color: inherit;
-    }
-  }
-
   .dropdown-menu-toggle {
     width: 100%;
     padding-top: 6px;
@@ -513,10 +507,6 @@
   }
 }
 
-.sidebar-move-issue-dropdown {
-  @include new-style-dropdown;
-}
-
 .sidebar-move-issue-confirmation-button {
   width: 100%;
 

app/assets/stylesheets/pages/issues.scss

@@ -142,8 +142,6 @@ ul.related-merge-requests > li {
 }
 
 .issue-form {
-  @include new-style-dropdown;
-
   .select2-container {
     width: 250px !important;
   }

app/assets/stylesheets/pages/labels.scss

@@ -116,8 +116,6 @@
 }
 
 .manage-labels-list {
-  @include new-style-dropdown;
-
   > li:not(.empty-message):not(.is-not-draggable) {
     background-color: $white-light;
     cursor: move;

app/assets/stylesheets/pages/members.scss

@@ -64,8 +64,6 @@
 }
 
 .member-form-control {
-  @include new-style-dropdown;
-
   @media (max-width: $screen-xs-max) {
     padding-bottom: 5px;
     margin-left: 0;
@@ -79,8 +77,6 @@
 }
 
 .member-search-form {
-  @include new-style-dropdown;
-
   position: relative;
 
   @media (min-width: $screen-sm-min) {

app/assets/stylesheets/pages/merge_requests.scss

@@ -471,8 +471,6 @@
 }
 
 .mr-source-target {
-  @include new-style-dropdown;
-
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
@@ -594,8 +592,6 @@
 }
 
 .mr-version-controls {
-  @include new-style-dropdown;
-
   position: relative;
   background: $gray-light;
   color: $gl-text-color;
@@ -818,7 +814,3 @@
     }
   }
 }
-
-.merge-request-form {
-  @include new-style-dropdown;
-}

app/assets/stylesheets/pages/note_form.scss

@@ -23,8 +23,6 @@
 .new-note,
 .note-edit-form {
   .note-form-actions {
-    @include new-style-dropdown;
-
     position: relative;
     margin: $gl-padding 0 0;
   }

app/assets/stylesheets/pages/notes.scss

@@ -490,8 +490,6 @@ ul.notes {
 }
 
 .note-actions {
-  @include new-style-dropdown;
-
   align-self: flex-start;
   flex-shrink: 0;
   display: inline-flex;

app/assets/stylesheets/pages/notifications.scss

@@ -14,7 +14,3 @@
     font-size: 18px;
   }
 }
-
-.notification-form {
-  @include new-style-dropdown;
-}

app/assets/stylesheets/pages/pipelines.scss

@@ -321,8 +321,6 @@
 
 // Pipeline visualization
 .pipeline-actions {
-  @include new-style-dropdown;
-
   border-bottom: 0;
 }
 
@@ -730,9 +728,6 @@ a.linked-pipeline-mini-item {
   }
 }
 
-@include new-style-dropdown('.big-pipeline-graph-dropdown-menu');
-@include new-style-dropdown('.mini-pipeline-graph-dropdown-menu');
-
 // dropdown content for big and mini pipeline
 .big-pipeline-graph-dropdown-menu,
 .mini-pipeline-graph-dropdown-menu {
@@ -831,7 +826,6 @@ a.linked-pipeline-mini-item {
       font-weight: normal;
       line-height: $line-height-base;
       white-space: nowrap;
-      border-radius: 3px;
 
       .ci-job-name-component {
         align-items: center;

app/assets/stylesheets/pages/projects.scss

@@ -331,8 +331,6 @@
 }
 
 .project-repo-buttons {
-  @include new-style-dropdown;
-
   .project-action-button .dropdown-menu {
     max-height: 250px;
     overflow-y: auto;
@@ -910,8 +908,6 @@ a.allowed-to-push {
 
 .new-protected-branch,
 .new-protected-tag {
-  @include new-style-dropdown;
-
   label {
     margin-top: 6px;
     font-weight: $gl-font-weight-normal;
@@ -938,8 +934,6 @@ a.allowed-to-push {
 
 .protected-branches-list,
 .protected-tags-list {
-  @include new-style-dropdown;
-
   margin-bottom: 30px;
 
   .settings-message {

app/assets/stylesheets/pages/search.scss

@@ -116,11 +116,6 @@ input[type="checkbox"]:hover {
       opacity: 0;
       display: block;
       left: -5px;
-      padding: 0;
-
-      ul {
-        padding: 10px 0;
-      }
     }
 
     .dropdown-content {
@@ -185,8 +180,6 @@ input[type="checkbox"]:hover {
 }
 
 .search-holder {
-  @include new-style-dropdown;
-
   @media (min-width: $screen-sm-min) {
     display: -webkit-flex;
     display: flex;

app/assets/stylesheets/pages/todos.scss

@@ -265,7 +265,3 @@
     font-weight: $gl-font-weight-bold;
   }
 }
-
-.todos-filters {
-  @include new-style-dropdown;
-}

app/assets/stylesheets/pages/tree.scss

 .tree-holder {
-  @include new-style-dropdown;
-
   .nav-block {
     margin: 10px 0;
 

app/controllers/admin/groups_controller.rb

 class Admin::GroupsController < Admin::ApplicationController
+  include MembersPresentation
   prepend EE::Admin::GroupsController
 
   before_action :group, only: [:edit, :update, :destroy, :project_update, :members_update]
@@ -12,8 +13,10 @@ class Admin::GroupsController < Admin::ApplicationController
 
   def show
     @group = Group.with_statistics.joins(:route).group('routes.path').find_by_full_path(params[:id])
-    @members = @group.members.order("access_level DESC").page(params[:members_page])
-    @requesters = AccessRequestsFinder.new(@group).execute(current_user)
+    @members = present_members(
+      @group.members.order("access_level DESC").page(params[:members_page]))
+    @requesters = present_members(
+      AccessRequestsFinder.new(@group).execute(current_user))
     @projects = @group.projects.with_statistics.page(params[:projects_page])
   end
 

app/controllers/admin/projects_controller.rb

 class Admin::ProjectsController < Admin::ApplicationController
+  include MembersPresentation
+
   before_action :project, only: [:show, :transfer, :repository_check]
   before_action :group, only: [:show, :transfer]
 
@@ -19,11 +21,14 @@ class Admin::ProjectsController < Admin::ApplicationController
 
   def show
     if @group
-      @group_members = @group.members.order("access_level DESC").page(params[:group_members_page])
+      @group_members = present_members(
+        @group.members.order("access_level DESC").page(params[:group_members_page]))
     end
 
-    @project_members = @project.members.page(params[:project_members_page])
-    @requesters = AccessRequestsFinder.new(@project).execute(current_user)
+    @project_members = present_members(
+      @project.members.page(params[:project_members_page]))
+    @requesters = present_members(
+      AccessRequestsFinder.new(@project).execute(current_user))
   end
 
   def transfer

app/controllers/concerns/members_presentation.rb

+module MembersPresentation
+  extend ActiveSupport::Concern
+
+  def present_members(members)
+    Gitlab::View::Presenter::Factory.new(
+      members,
+      current_user: current_user,
+      presenter_class: MembersPresenter
+    ).fabricate!
+  end
+end

app/controllers/groups/group_members_controller.rb

@@ -2,6 +2,7 @@ class Groups::GroupMembersController < Groups::ApplicationController
   prepend EE::Groups::GroupMembersController
 
   include MembershipActions
+  include MembersPresentation
   include SortingHelper
 
   # Authorize
@@ -17,15 +18,17 @@ class Groups::GroupMembersController < Groups::ApplicationController
     @members = @members.search(params[:search]) if params[:search].present?
     @members = @members.sort(@sort)
     @members = @members.page(params[:page]).per(50)
-    @members.includes(:user)
+    @members = present_members(@members.includes(:user))
 
-    @requesters = AccessRequestsFinder.new(@group).execute(current_user)
+    @requesters = present_members(
+      AccessRequestsFinder.new(@group).execute(current_user))
 
     @group_member = @group.group_members.new
   end
 
   def update
     @group_member = @group.group_members.find(params[:id])
+      .present(current_user: current_user)
 
     return render_403 unless can?(current_user, :update_group_member, @group_member)
 

app/controllers/projects/project_members_controller.rb

 class Projects::ProjectMembersController < Projects::ApplicationController
   include MembershipActions
+  include MembersPresentation
   include SortingHelper
 
   # Authorize
@@ -20,13 +21,14 @@ class Projects::ProjectMembersController < Projects::ApplicationController
       @group_links = @group_links.where(group_id: @project.invited_groups.search(params[:search]).select(:id))
     end
 
-    @project_members = @project_members.sort(@sort).page(params[:page])
-    @requesters = AccessRequestsFinder.new(@project).execute(current_user)
+    @project_members = present_members(@project_members.sort(@sort).page(params[:page]))
+    @requesters = present_members(AccessRequestsFinder.new(@project).execute(current_user))
     @project_member = @project.project_members.new
   end
 
   def update
     @project_member = @project.project_members.find(params[:id])
+      .present(current_user: current_user)
 
     return render_403 unless can?(current_user, :update_project_member, @project_member)
 

app/helpers/members_helper.rb

 module MembersHelper
-  # Returns a `<action>_<source>_member` association, e.g.:
-  # - admin_project_member, update_project_member, destroy_project_member
-  # - admin_group_member, update_group_member, destroy_group_member, override_group_member
-  def action_member_permission(action, member)
-    "#{action}_#{member.type.underscore}".to_sym
-  end
-
   def remove_member_message(member, user: nil)
     user = current_user if defined?(current_user)
 

app/models/member.rb

@@ -4,6 +4,7 @@ class Member < ActiveRecord::Base
   include Importable
   include Expirable
   include Gitlab::Access
+  include Presentable
 
   attr_accessor :raw_invite_token
   attr_accessor :skip_notification

app/presenters/group_member_presenter.rb

+class GroupMemberPresenter < MemberPresenter
+  prepend EE::GroupMemberPresenter
+
+  private
+
+  def admin_member_permission
+    :admin_group_member
+  end
+
+  def update_member_permission
+    :update_group_member
+  end
+
+  def destroy_member_permission
+    :destroy_group_member
+  end
+end

app/presenters/member_presenter.rb

+class MemberPresenter < Gitlab::View::Presenter::Delegated
+  prepend EE::MemberPresenter
+
+  presents :member
+
+  def access_level_roles
+    member.class.access_level_roles
+  end
+
+  def can_resend_invite?
+    invite? &&
+      can?(current_user, admin_member_permission, source)
+  end
+
+  def can_update?
+    can?(current_user, update_member_permission, member)
+  end
+
+  def can_remove?
+    can?(current_user, destroy_member_permission, member)
+  end
+
+  def can_approve?
+    request? && can_update?
+  end
+
+  private
+
+  def admin_member_permission
+    raise NotImplementedError
+  end
+
+  def update_member_permission
+    raise NotImplementedError
+  end
+
+  def destroy_member_permission
+    raise NotImplementedError
+  end
+end

app/presenters/members_presenter.rb

+class MembersPresenter < Gitlab::View::Presenter::Delegated
+  include Enumerable
+
+  presents :members
+
+  def to_ary
+    to_a
+  end
+
+  def each
+    members.each do |member|
+      yield member.present(current_user: current_user)
+    end
+  end
+end

app/presenters/project_member_presenter.rb

+class ProjectMemberPresenter < MemberPresenter
+  prepend EE::ProjectMemberPresenter
+
+  private
+
+  def admin_member_permission
+    :admin_project_member
+  end
+
+  def update_member_permission
+    :update_project_member
+  end
+
+  def destroy_member_permission
+    :destroy_project_member
+  end
+end

app/services/base_count_service.rb

 # Base class for services that count a single resource such as the number of
 # issues for a project.
 class BaseCountService
+  prepend ::EE::BaseCountService
+
   def relation_for_count
     raise(
       NotImplementedError,

app/services/members/approve_access_request_service.rb

@@ -35,8 +35,17 @@ module Members
     def can_update_access_requester?(access_requester, opts = {})
       access_requester && (
         opts[:force] ||
-        can?(current_user, action_member_permission(:update, access_requester), access_requester)
+        can?(current_user, update_member_permission(access_requester), access_requester)
       )
     end
+
+    def update_member_permission(member)
+      case member
+      when GroupMember
+        :update_group_member
+      when ProjectMember
+        :update_project_member
+      end
+    end
   end
 end

app/services/members/destroy_service.rb

@@ -41,7 +41,16 @@ module Members
     end
 
     def can_destroy_member?(member)
-      member && can?(current_user, action_member_permission(:destroy, member), member)
+      member && can?(current_user, destroy_member_permission(member), member)
+    end
+
+    def destroy_member_permission(member)
+      case member
+      when GroupMember
+        :destroy_group_member
+      when ProjectMember
+        :destroy_project_member
+      end
     end
   end
 end

app/views/layouts/_page.html.haml

-.page-with-sidebar{ class: page_with_sidebar_class }
+.layout-page{ class: page_with_sidebar_class }
   - if defined?(nav) && nav
     = render "layouts/nav/sidebar/#{nav}"
-  .content-wrapper.page-with-new-nav
+  .content-wrapper
     .mobile-overlay
     .alert-wrapper
       = render "layouts/header/ee_license_banner"

app/views/projects/blob/_template_selectors.html.haml

@@ -3,15 +3,15 @@
     Template
   .template-selector-dropdowns-wrap
     .template-type-selector.js-template-type-selector-wrap.hidden
-      = dropdown_tag("Choose type", options: { toggle_class: 'btn js-template-type-selector', title: "Choose a template type" } )
+      = dropdown_tag("Choose type", options: { toggle_class: 'js-template-type-selector', title: "Choose a template type" } )
     .license-selector.js-license-selector-wrap.js-template-selector-wrap.hidden
-      = dropdown_tag("Apply a license template", options: { toggle_class: 'btn js-license-selector', title: "Apply a license", filter: true, placeholder: "Filter", data: { data: licenses_for_select, project: @project.name, fullname: @project.namespace.human_name } } )
+      = dropdown_tag("Apply a license template", options: { toggle_class: 'js-license-selector', title: "Apply a license", filter: true, placeholder: "Filter", data: { data: licenses_for_select, project: @project.name, fullname: @project.namespace.human_name } } )
     .gitignore-selector.js-gitignore-selector-wrap.js-template-selector-wrap.hidden
-      = dropdown_tag("Apply a .gitignore template", options: { toggle_class: 'btn js-gitignore-selector', title: "Apply a template", filter: true, placeholder: "Filter", data: { data: gitignore_names } } )
+      = dropdown_tag("Apply a .gitignore template", options: { toggle_class: 'js-gitignore-selector', title: "Apply a template", filter: true, placeholder: "Filter", data: { data: gitignore_names } } )
     .gitlab-ci-yml-selector.js-gitlab-ci-yml-selector-wrap.js-template-selector-wrap.hidden
-      = dropdown_tag("Apply a GitLab CI Yaml template", options: { toggle_class: 'btn js-gitlab-ci-yml-selector', title: "Apply a template", filter: true, placeholder: "Filter", data: { data: gitlab_ci_ymls } } )
+      = dropdown_tag("Apply a GitLab CI Yaml template", options: { toggle_class: 'js-gitlab-ci-yml-selector', title: "Apply a template", filter: true, placeholder: "Filter", data: { data: gitlab_ci_ymls } } )
     .dockerfile-selector.js-dockerfile-selector-wrap.js-template-selector-wrap.hidden
-      = dropdown_tag("Apply a Dockerfile template", options: { toggle_class: 'btn js-dockerfile-selector', title: "Apply a template", filter: true, placeholder: "Filter", data: { data: dockerfile_names } } )
+      = dropdown_tag("Apply a Dockerfile template", options: { toggle_class: 'js-dockerfile-selector', title: "Apply a template", filter: true, placeholder: "Filter", data: { data: dockerfile_names } } )
   .template-selectors-undo-menu.hidden
     %span.text-info Template applied
     %button.btn.btn-sm.btn-info Undo

app/views/projects/branches/new.html.haml

@@ -20,7 +20,7 @@
     .col-sm-10.create-from
       .dropdown
         = hidden_field_tag :ref, default_ref
-        = button_tag type: 'button', title: default_ref, class: 'dropdown-menu-toggle wide form-control js-branch-select git-revision-dropdown-toggle', required: true, data: { toggle: 'dropdown', selected: default_ref, field_name: 'ref' } do
+        = button_tag type: 'button', title: default_ref, class: 'dropdown-menu-toggle wide js-branch-select git-revision-dropdown-toggle', required: true, data: { toggle: 'dropdown', selected: default_ref, field_name: 'ref' } do
           .text-left.dropdown-toggle-text= default_ref
           = icon('chevron-down')
         = render 'shared/ref_dropdown', dropdown_class: 'wide'

app/views/projects/environments/metrics.html.haml

@@ -15,8 +15,8 @@
 
   #prometheus-graphs{ data: { "settings-path": edit_project_service_path(@project, 'prometheus'),
     "documentation-path": help_page_path('administration/monitoring/prometheus/index.md'),
-    "empty-getting-started-svg-path": image_path('illustrations/monitoring/getting_started'),
-    "empty-loading-svg-path": image_path('illustrations/monitoring/loading'),
-    "empty-unable-to-connect-svg-path": image_path('illustrations/monitoring/unable_to_connect'),
+    "empty-getting-started-svg-path": image_path('illustrations/monitoring/getting_started.svg'),
+    "empty-loading-svg-path": image_path('illustrations/monitoring/loading.svg'),
+    "empty-unable-to-connect-svg-path": image_path('illustrations/monitoring/unable_to_connect.svg'),
     "additional-metrics": additional_metrics_project_environment_path(@project, @environment, format: :json),
     "has-metrics": "#{@environment.has_metrics?}", deployment_endpoint: project_environment_deployments_path(@project, @environment, format: :json) } }

app/views/projects/project_members/_team.html.haml

+- project = local_assigns.fetch(:project)
+- members = local_assigns.fetch(:members)
+
 .panel.panel-default
   .panel-heading.flex-project-members-panel
     %span.flex-project-title
       Members of
-      %strong
-        #{@project.name}
-    %span.badge= @project_members.total_count
-    = form_tag project_project_members_path(@project), method: :get, class: 'form-inline member-search-form flex-project-members-form'  do
+      %strong= project.name
+    %span.badge= members.total_count
+    = form_tag project_project_members_path(project), method: :get, class: 'form-inline member-search-form flex-project-members-form'  do
       .form-group
         = search_field_tag :search, params[:search], { placeholder: 'Find existing members by name', class: 'form-control', spellcheck: false }
         %button.member-search-btn{ type: "submit", "aria-label" => "Submit search" }

app/views/projects/project_members/index.html.haml

@@ -39,5 +39,5 @@
         - if @group_links.any?
           = render 'projects/project_members/groups', group_links: @group_links
 
-    = render 'projects/project_members/team', members: @project_members
+    = render 'projects/project_members/team', project: @project, members: @project_members
     = paginate @project_members, theme: "gitlab"

app/views/projects/tags/new.html.haml

@@ -20,7 +20,7 @@
     .col-sm-10.create-from
       .dropdown
         = hidden_field_tag :ref, default_ref
-        = button_tag type: 'button', title: default_ref, class: 'dropdown-menu-toggle wide form-control js-branch-select', required: true, data: { toggle: 'dropdown', selected: default_ref, field_name: 'ref' } do
+        = button_tag type: 'button', title: default_ref, class: 'dropdown-menu-toggle wide js-branch-select', required: true, data: { toggle: 'dropdown', selected: default_ref, field_name: 'ref' } do
           .text-left.dropdown-toggle-text= default_ref
         = render 'shared/ref_dropdown', dropdown_class: 'wide'
       .help-block

app/views/shared/_label.html.haml

@@ -35,7 +35,12 @@
           %li
             = link_to 'Edit', edit_label_path(label)
           %li
-            = link_to 'Delete', destroy_label_path(label), title: 'Delete', method: :delete, data: {confirm: 'Remove this label? Are you sure?'}
+            = link_to 'Delete',
+              destroy_label_path(label),
+              title: 'Delete',
+              method: :delete,
+              data: {confirm: 'Remove this label? Are you sure?'},
+              class: 'text-danger'
 
   .pull-right.hidden-xs.hidden-sm.hidden-md
     = link_to_label(label, subject: subject, type: :merge_request, css_class: 'btn btn-transparent btn-action btn-link') do

app/views/shared/members/_member.html.haml

 - show_roles = local_assigns.fetch(:show_roles, true)
 - show_controls = local_assigns.fetch(:show_controls, true)
 - force_mobile_view = local_assigns.fetch(:force_mobile_view, false)
+- member = local_assigns.fetch(:member)
 - user = local_assigns.fetch(:user, member.user)
 - source = member.source
-- can_admin_member = can?(current_user, action_member_permission(:update, member), member)
-
--# EE-only
-- can_override_member = can?(current_user, action_member_permission(:override, member), member)
 
 %li.member{ class: [dom_class(member), ("is-overriden" if member.override)], id: dom_id(member) }
   %span.list-item-name
@@ -51,21 +48,21 @@
   - if show_roles
     - current_resource = @project || @group
     .controls.member-controls
-      = render 'shared/members/ee/ldap_tag', can_override: can_override_member, visible: false
+      = render 'shared/members/ee/ldap_tag', can_override: member.can_override?, visible: false
       - if show_controls && member.source == current_resource
 
-        - if member.invite? && can?(current_user, action_member_permission(:admin, member), member.source)
+        - if member.can_resend_invite?
           = link_to icon('paper-plane'), polymorphic_path([:resend_invite, member]),
                     method: :post,
                     class: 'btn btn-default prepend-left-10 hidden-xs',
                     title: 'Resend invite'
 
-        - if user != current_user && (can_admin_member || can_override_member)
+        - if user != current_user && member.can_update?
           = form_for member, remote: true, html: { class: 'form-horizontal js-edit-member-form' } do |f|
             = f.hidden_field :access_level
             .member-form-control.dropdown.append-right-5
               %button.dropdown-menu-toggle.js-member-permissions-dropdown{ type: "button",
-                disabled: !can_admin_member,
+                disabled: member.can_override?,
                 data: { toggle: "dropdown", field_name: "#{f.object_name}[access_level]" } }
                 %span.dropdown-toggle-text
                   = member.human_access
@@ -74,24 +71,27 @@
                 = dropdown_title("Change permissions")
                 .dropdown-content
                   %ul
-                    - member.class.access_level_roles.each do |role, role_id|
+                    - member.access_level_roles.each do |role, role_id|
                       %li
                         = link_to role, "javascript:void(0)",
                           class: ("is-active" if member.access_level == role_id),
                           data: { id: role_id, el_id: dom_id(member) }
-                    = render 'shared/members/ee/revert_ldap_group_sync_option', group: @group, member: member, can_override: can_override_member
+                    = render 'shared/members/ee/revert_ldap_group_sync_option',
+                      group: @group,
+                      member: member,
+                      can_override: member.can_override?
             .prepend-left-5.clearable-input.member-form-control
-              = f.text_field :expires_at, class: 'form-control js-access-expiration-date js-member-update-control', placeholder: 'Expiration date', id: "member_expires_at_#{member.id}", disabled: !can_admin_member, data: { el_id: dom_id(member) }
+              = f.text_field :expires_at,
+                disabled: member.can_override?,
+                class: 'form-control js-access-expiration-date js-member-update-control',
+                placeholder: 'Expiration date',
+                id: "member_expires_at_#{member.id}",
+                data: { el_id: dom_id(member) }
               %i.clear-icon.js-clear-input
         - else
           %span.member-access-text= member.human_access
 
-        - if member.invite? && can?(current_user, action_member_permission(:admin, member), member.source)
-          = link_to 'Resend invite', polymorphic_path([:resend_invite, member]),
-                    method: :post,
-                    class: 'btn btn-default  prepend-left-10 visible-xs-block'
-
-        - elsif member.request? && can_admin_member
+        - if member.can_approve?
           = link_to polymorphic_path([:approve_access_request, member]),
                     method: :post,
                     class: 'btn btn-success prepend-left-10',
@@ -101,7 +101,7 @@
             - unless force_mobile_view
               = icon('check inverse', class: 'hidden-xs')
 
-        - if can?(current_user, action_member_permission(:destroy, member), member)
+        - if member.can_remove?
           - if current_user == user
             = link_to icon('sign-out', text: 'Leave'), polymorphic_path([:leave, member.source, :members]),
                       method: :delete,
@@ -117,8 +117,8 @@
                 Delete
               - unless force_mobile_view
                 = icon('trash', class: 'hidden-xs')
-        = render 'shared/members/ee/override_member_buttons', group: @group, member: member, user: user, action: :edit, can_override: can_override_member
+        = render 'shared/members/ee/override_member_buttons', group: @group, member: member, user: user, action: :edit, can_override: member.can_override?
       - else
         %span.member-access-text= member.human_access
 
-= render 'shared/members/ee/override_member_buttons', group: @group, member: member, user: user, action: :confirm, can_override: can_override_member
+= render 'shared/members/ee/override_member_buttons', group: @group, member: member, user: user, action: :confirm, can_override: member.can_override?

app/views/shared/members/_requests.html.haml

+- membership_source = local_assigns.fetch(:membership_source)
+- requesters = local_assigns.fetch(:requesters)
 - force_mobile_view = local_assigns.fetch(:force_mobile_view, false)
 
-- if requesters.any?
-  .panel.panel-default.prepend-top-default{ class: ('panel-mobile' if force_mobile_view ) }
-    .panel-heading
-      Users requesting access to
-      %strong= membership_source.name
-      %span.badge= requesters.size
-    %ul.content-list.members-list
-      = render partial: 'shared/members/member', collection: requesters, as: :member, locals: { force_mobile_view: force_mobile_view }
+- return if requesters.empty?
+
+.panel.panel-default.prepend-top-default{ class: ('panel-mobile' if force_mobile_view ) }
+  .panel-heading
+    Users requesting access to
+    %strong= membership_source.name
+    %span.badge= requesters.size
+  %ul.content-list.members-list
+    = render partial: 'shared/members/member', collection: requesters, as: :member, locals: { force_mobile_view: force_mobile_view }

app/workers/geo/base_scheduler_worker.rb

@@ -124,6 +124,8 @@ module Geo
     def schedule_jobs
       capacity = max_capacity
       num_to_schedule = [capacity - scheduled_job_ids.size, pending_resources.size].min
+      num_to_schedule = 0 if num_to_schedule < 0
+
       to_schedule = pending_resources.shift(num_to_schedule)
 
       scheduled = to_schedule.map do |args|

changelogs/unreleased-ee/4070-geo-caching-issue-count.yml

+---
+title: Issue count now refreshes quicker on geo secondary
+merge_request: 3639
+author:
+type: fixed

changelogs/unreleased-ee/4304-fix-successful-rebase.yml

+---
+title: Fix successful rebase throwing flash error message
+merge_request: 3727
+author:
+type: fixed

changelogs/unreleased-ee/4309-fix-negative-array-size.yml

+---
+title: Fix an exception in Geo scheduler workers
+merge_request: 3740
+author:
+type: fixed

changelogs/unreleased/28004-consider-refactoring-member-view-by-using-presenter.yml

+---
+title: Refactor member view using a Presenter
+merge_request: 9645
+author: TM Lee

doc/administration/auth/README.md

@@ -9,6 +9,7 @@ providers.
 
 - [LDAP](ldap.md) Includes Active Directory, Apple Open Directory, Open LDAP,
   and 389 Server
+  - **(EES/EEP)** [LDAP for GitLab EE](ldap-ee.md): LDAP additions to GitLab Enterprise Editions
 - [OmniAuth](../../integration/omniauth.md) Sign in via Twitter, GitHub, GitLab.com, Google,
   Bitbucket, Facebook, Shibboleth, Crowd, Azure and Authentiq ID
 - [CAS](../../integration/cas.md) Configure GitLab to sign in using CAS

doc/administration/index.md

@@ -32,7 +32,7 @@ Learn how to install, configure, update, and maintain your GitLab instance.
 - [Usage statistics, version check, and usage ping](../user/admin_area/settings/usage_statistics.md): Enable or disable information about your instance to be sent to GitLab, Inc.
 - [Polling](polling.md): Configure how often the GitLab UI polls for updates.
 - [GitLab Pages configuration](pages/index.md): Enable and configure GitLab Pages.
-- [GitLab Pages configuration for installations from the source](pages/source.md): Enable and configure GitLab Pages on
+- [GitLab Pages configuration for GitLab source installations](pages/source.md): Enable and configure GitLab Pages on
 [source installations](../install/installation.md#installation-from-source).
 - [Environment variables](environment_variables.md): Supported environment variables that can be used to override their defaults values in order to configure GitLab.
 - **(EES/EEP)** [Elasticsearch](../integration/elasticsearch.md): Enable Elasticsearch to empower GitLab's Advanced Global Search. Useful when you deal with a huge amount of data.
@@ -85,13 +85,13 @@ server with IMAP authentication on Ubuntu, to be used with Reply by email.
 - [Issue closing pattern](issue_closing_pattern.md): Customize how to close an issue from commit messages.
 - [Gitaly](gitaly/index.md): Configuring Gitaly, GitLab's Git repository storage service.
 - [Default labels](../user/admin_area/labels.html): Create labels that will be automatically added to every new project.
-- **(EES/EEP)** [Limit project size](../user/admin_area/settings/account_and_limit_settings.md): Set a hard limit for your repositories' size.
 
 ### Repository settings
 
 - [Repository checks](repository_checks.md): Periodic Git repository checks.
 - [Repository storage paths](repository_storage_paths.md): Manage the paths used to store repositories.
 - [Repository storage rake tasks](raketasks/storage.md): A collection of rake tasks to list and migrate existing projects and attachments associated with it from Legacy storage to Hashed storage.
+- **(EES/EEP)** [Limit repository size](../user/admin_area/settings/account_and_limit_settings.md): Set a hard limit for your repositories' size.
 
 ## Continuous Integration settings
 

doc/administration/operations/speed_up_ssh.md

 # Speed up SSH operations
 
+>
+- [Introduced](https://gitlab.com/gitlab-org/gitlab-ee/merge_requests/250) in GitLab Enterprise Edition 8.7.
+- Available in GitLab Enterprise Edition Starter.
+
 ## The problem
 
 SSH operations become slow as the number of users grows.

doc/development/fe_guide/dropdowns.md

@@ -4,15 +4,15 @@
 ## How to style a bootstrap dropdown
 1. Use the HTML structure provided by the [docs][bootstrap-dropdowns]
 1. Add a specific class to the top level `.dropdown` element
-    
-    
+
+
     ```Haml
     .dropdown.my-dropdown
       %button{ type: 'button', data: { toggle: 'dropdown' }, 'aria-haspopup': true, 'aria-expanded': false }
         %span.dropdown-toggle-text
           Toggle Dropdown
         = icon('chevron-down')
-    
+
       %ul.dropdown-menu
         %li
           %a
@@ -29,10 +29,4 @@
             item!
     ```
 
-1. Include the mixin in CSS
-
-    ```SCSS
-    @include new-style-dropdown('.my-dropdown ');
-    ```
-
 [bootstrap-dropdowns]: https://getbootstrap.com/docs/3.3/javascript/#dropdowns

doc/push_rules/push_rules.md

 # Push Rules
 
-> Available in [GitLab Enterprise Edition Starter][ee].
+> Available in [GitLab Enterprise Editions][ee].
 
 Gain additional control over pushes to your repository.
 
@@ -61,16 +61,16 @@ The following options are available.
 
 | Push rule | GitLab version | Description |
 | --------- | :------------: | ----------- |
-| Removal of tags with `git push` | 7.10 | Forbid users to remove git tags with `git push`. Tags will still be able to be deleted through the web UI. |
-| Check whether author is a GitLab user | 7.10 | Restrict commits by author (email) to existing GitLab users. |
-| Check whether committer is the current authenticated user | 10.2 | GitLab will reject any commit that was not committed by the current authenticated user |
-| Check whether commit is signed through GPG | 10.1 | Reject commit when it is not signed through GPG. Read [signing commits with GPG][signing-commits]. |
-| Prevent committing secrets to Git | 8.12 | GitLab will reject any files that are likely to contain secrets. Read [what files are forbidden](#prevent-pushing-secrets-to-the-repository). |
-| Restrict by commit message | 7.10 | Only commit messages that match this Ruby regular expression are allowed to be pushed. Leave empty to allow any commit message. |
-| Restrict by branch name | 9.3 | Only branch names that match this Ruby regular expression are allowed to be pushed. Leave empty to allow any branch name. |
-| Restrict by commit author's email | 7.10 | Only commit author's email that match this Ruby regular expression are allowed to be pushed. Leave empty to allow any email. |
-| Prohibited file names | 7.10 | Any committed filenames that match this Ruby regular expression are not allowed to be pushed. Leave empty to allow any filenames. |
-| Maximum file size | 7.12 | Pushes that contain added or updated files that exceed this file size (in MB) are rejected. Set to 0 to allow files of any size. |
+| Removal of tags with `git push` | **EES** 7.10 | Forbid users to remove git tags with `git push`. Tags will still be able to be deleted through the web UI. |
+| Check whether author is a GitLab user | **EES** 7.10 | Restrict commits by author (email) to existing GitLab users. |
+| Check whether committer is the current authenticated user | **EEP** 10.2 | GitLab will reject any commit that was not committed by the current authenticated user |
+| Check whether commit is signed through GPG | **EEP** 10.1 | Reject commit when it is not signed through GPG. Read [signing commits with GPG][signing-commits]. |
+| Prevent committing secrets to Git | **EES** 8.12 | GitLab will reject any files that are likely to contain secrets. Read [what files are forbidden](#prevent-pushing-secrets-to-the-repository). |
+| Restrict by commit message | **EES** 7.10 | Only commit messages that match this Ruby regular expression are allowed to be pushed. Leave empty to allow any commit message. |
+| Restrict by branch name | **EES** 9.3 | Only branch names that match this Ruby regular expression are allowed to be pushed. Leave empty to allow any branch name. |
+| Restrict by commit author's email | **EES** 7.10 | Only commit author's email that match this Ruby regular expression are allowed to be pushed. Leave empty to allow any email. |
+| Prohibited file names | **EES** 7.10 | Any committed filenames that match this Ruby regular expression are not allowed to be pushed. Leave empty to allow any filenames. |
+| Maximum file size | **EES** 7.12 | Pushes that contain added or updated files that exceed this file size (in MB) are rejected. Set to 0 to allow files of any size. |
 
 >**Tip:**
 You can check your regular expressions at <http://rubular.com>.

doc/user/admin_area/license.md

@@ -20,20 +20,14 @@ License admin area.
 
 Otherwise, you can:
 
-1. Navigate manually to the **Admin Area** by clicking the wrench icon in the
-   upper right corner.
+1. Navigate manually to the **Admin Area** by clicking the wrench icon in the menu bar.
 
     ![Admin area icon](img/admin_wrench.png)
 
-1. And then going to the **License** tab.
+1. And then going to the **License** tab and click on **Upload New License**.
 
     ![License admin area](img/license_admin_area.png)
 
-
->**Note:**
-If you don't see the banner mentioned above, that means that either you are not
-logged in as admin or a license is already uploaded.
-
 ---
 
 If you've received a `.gitlab-license` file, you should have already downloaded

ee/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_rebase.vue

@@ -50,30 +50,7 @@
 
         this.service.rebase()
           .then(() => {
-            simplePoll((continuePolling, stopPolling) => {
-              this.service.poll()
-                .then(res => res.json())
-                .then((res) => {
-                  if (res.rebase_in_progress) {
-                    continuePolling();
-                  } else {
-                    this.isMakingRequest = false;
-
-                    if (res.merge_error.length) {
-                      this.rebasingError = res.merge_error;
-                      Flash('Something went wrong. Please try again.');
-                    }
-
-                    eventHub.$emit('MRWidgetUpdateRequested');
-                    stopPolling();
-                  }
-                })
-                .catch(() => {
-                  this.isMakingRequest = false;
-                  Flash('Something went wrong. Please try again.');
-                  stopPolling();
-                });
-            });
+            simplePoll(this.checkRebaseStatus);
           })
           .catch((error) => {
             this.rebasingError = error.merge_error;
@@ -81,6 +58,30 @@
             Flash('Something went wrong. Please try again.');
           });
       },
+      checkRebaseStatus(continuePolling, stopPolling) {
+        this.service.poll()
+          .then(res => res.json())
+          .then((res) => {
+            if (res.rebase_in_progress) {
+              continuePolling();
+            } else {
+              this.isMakingRequest = false;
+
+              if (res.merge_error && res.merge_error.length) {
+                this.rebasingError = res.merge_error;
+                Flash('Something went wrong. Please try again.');
+              }
+
+              eventHub.$emit('MRWidgetUpdateRequested');
+              stopPolling();
+            }
+          })
+          .catch(() => {
+            this.isMakingRequest = false;
+            Flash('Something went wrong. Please try again.');
+            stopPolling();
+          });
+      },
     },
   };
 </script>

ee/app/assets/stylesheets/framework/dropdowns.scss

+.new-epic-dropdown {
+  .dropdown-menu {
+    padding-left: $gl-padding-top;
+    padding-right: $gl-padding-top;
+  }
+
+  .form-control {
+    width: 100%;
+  }
+
+  .btn-save {
+    display: flex;
+    margin-top: $gl-btn-padding;
+  }
+}
+
+.empty-state .new-epic-dropdown {
+  display: inline-flex;
+
+  .btn-save {
+    margin-left: 0;
+    margin-bottom: 0;
+  }
+
+  .btn-new {
+    margin: 0;
+  }
+}

ee/app/assets/stylesheets/pages/service_desk.scss

 .service-desk-issues {
-  .empty-state {
-    max-width: 450px;
-    text-align: center;
-  }
-
   .non-empty-state {
     text-align: left;
     padding-bottom: $gl-padding-top;
     border-bottom: 1px solid $border-color;
-
-    .service-desk-graphic {
-      margin-top: $gl-padding;
-    }
-
-    .media-body {
-      margin-top: $gl-padding-top;
-      margin-left: $gl-padding;
-    }
-  }
-
-  .turn-on-btn-container {
-    margin-top: $gl-padding-top;
   }
 }

ee/app/presenters/ee/group_member_presenter.rb

+module EE
+  module GroupMemberPresenter
+    private
+
+    def override_member_permission
+      :override_group_member
+    end
+  end
+end

ee/app/presenters/ee/member_presenter.rb

+module EE
+  module MemberPresenter
+    def can_update?
+      super || can_override?
+    end
+
+    def can_override?
+      can?(current_user, override_member_permission, member)
+    end
+
+    private
+
+    def override_member_permission
+      raise NotImplementedError
+    end
+  end
+end

ee/app/presenters/ee/project_member_presenter.rb

+module EE
+  module ProjectMemberPresenter
+    private
+
+    def override_member_permission
+      :override_project_member
+    end
+  end
+end

ee/app/services/ee/base_count_service.rb

+module EE
+  module BaseCountService
+    # geo secondary cache should expire quicker than primary, otherwise various counts
+    # could be incorrect for 2 weeks.
+    def cache_options
+      raise NotImplementedError.new unless defined?(super)
+
+      value = super
+      value[:expires_in] = 20.minutes if ::Gitlab::Geo.secondary?
+      value
+    end
+  end
+end

ee/app/views/projects/issues/_service_desk_info_content.html.haml

@@ -4,22 +4,26 @@
 - callout_selector = is_empty_state ? 'empty-state' : 'non-empty-state media'
 - svg_path = !is_empty_state ? 'shared/empty_states/icons/service_desk_callout.svg' : 'shared/empty_states/icons/service_desk_empty_state.svg'
 - can_edit_project_settings = can?(current_user, :admin_project, @project)
+- title_text = _("Use Service Desk to connect with your users (e.g. to offer customer support) through email right inside GitLab")
 
 %div{ class: "#{callout_selector}" }
-  .service-desk-graphic
+  .svg-content
     = render svg_path
 
-  .media-body
-    %h5 Use Service Desk to connect with your users (e.g. to offer customer support) through email right inside GitLab.
+  %div{ class: is_empty_state ? "text-content" : "prepend-top-10 prepend-left-default" }
+    - if is_empty_state
+      %h4= title_text
+    - else
+      %h5= title_text
 
     - if service_desk_enabled
       %p
-        Have your users email
+        = _("Have your users email")
         %code= @project.service_desk_address
 
-    %span Those emails automatically become issues (with the comments becoming the email conversation) listed here.
-    = link_to 'Read more', help_page_path('user/project/service_desk')
+    %span= _("Those emails automatically become issues (with the comments becoming the email conversation) listed here.")
+    = link_to _('Read more'), help_page_path('user/project/service_desk')
 
     - if can_edit_project_settings && !service_desk_enabled
-      .turn-on-btn-container
-        = link_to "Turn on Service Desk", edit_project_path(@project), class: 'btn btn-new btn-inverted'
+      %div{ class: is_empty_state ? "text-center" : "prepend-top-10" }
+        = link_to _("Turn on Service Desk"), edit_project_path(@project), class: 'btn btn-success'

lib/gitlab/view/presenter/factory.rb

@@ -16,7 +16,7 @@ module Gitlab
         attr_reader :subject, :attributes
 
         def presenter_class
-          "#{subject.class.name}Presenter".constantize
+          attributes.delete(:presenter_class) { "#{subject.class.name}Presenter".constantize }
         end
       end
     end

qa/qa.rb

@@ -9,6 +9,7 @@ module QA
     autoload :User, 'qa/runtime/user'
     autoload :Namespace, 'qa/runtime/namespace'
     autoload :Scenario, 'qa/runtime/scenario'
+    autoload :Browser, 'qa/runtime/browser'
   end
 
   ##
@@ -65,7 +66,6 @@ module QA
     autoload :Base, 'qa/page/base'
 
     module Main
-      autoload :Entry, 'qa/page/main/entry'
       autoload :Login, 'qa/page/main/login'
       autoload :Menu, 'qa/page/main/menu'
       autoload :OAuth, 'qa/page/main/oauth'

qa/qa/ee.rb

@@ -6,7 +6,13 @@ module QA
     module Page
       module Admin
         autoload :License, 'qa/ee/page/admin/license'
-        autoload :GeoNodes, 'qa/ee/page/admin/geo_nodes'
+
+        module Geo
+          module Nodes
+            autoload :Show, 'qa/ee/page/admin/geo/nodes/show'
+            autoload :New, 'qa/ee/page/admin/geo/nodes/new'
+          end
+        end
       end
     end
 

qa/qa/ee/page/admin/geo/nodes/new.rb

+module QA
+  module EE
+    module Page
+      module Admin
+        module Geo
+          module Nodes
+            class New < QA::Page::Base
+              def set_node_address(address)
+                fill_in 'URL', with: address
+              end
+
+              def add_node!
+                click_button 'Add Node'
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

qa/qa/ee/page/admin/geo_nodes.rb → qa/qa/ee/page/admin/geo/nodes/show.rb

@@ -2,13 +2,13 @@ module QA
   module EE
     module Page
       module Admin
-        class GeoNodes < QA::Page::Base
-          def set_node_address(address)
-            fill_in 'URL', with: address
-          end
-
-          def add_node!
-            click_button 'Add Node'
+        module Geo
+          module Nodes
+            class Show < QA::Page::Base
+              def new_node!
+                click_link 'New node'
+              end
+            end
           end
         end
       end

qa/qa/ee/scenario/geo/node.rb

@@ -6,12 +6,12 @@ module QA
           attr_accessor :address
 
           def perform
-            QA::Page::Main::Entry.act { visit_login_page }
             QA::Page::Main::Login.act { sign_in_using_credentials }
             QA::Page::Main::Menu.act { go_to_admin_area }
             QA::Page::Admin::Menu.act { go_to_geo_nodes }
+            EE::Page::Admin::Geo::Nodes::Show.act { new_node! }
 
-            EE::Page::Admin::GeoNodes.perform do |page|
+            EE::Page::Admin::Geo::Nodes::New.perform do |page|
               raise ArgumentError if @address.nil?
 
               page.set_node_address(@address)

qa/qa/ee/scenario/license/add.rb

@@ -4,7 +4,6 @@ module QA
       module License
         class Add < QA::Scenario::Template
           def perform(license)
-            QA::Page::Main::Entry.act { visit_login_page }
             QA::Page::Main::Login.act { sign_in_using_credentials }
             QA::Page::Main::Menu.act { go_to_admin_area }
             QA::Page::Admin::Menu.act { go_to_license }

qa/qa/ee/scenario/test/geo.rb

@@ -12,13 +12,7 @@ module QA
           attribute :geo_skip_setup?, '--without-setup'
 
           def perform(**args)
-            QA::Specs::Config.act { configure_capybara! }
-
             unless args[:geo_skip_setup?]
-              # TODO, Factory::License -> gitlab-org/gitlab-qa#86
-              #
-              QA::Runtime::Scenario.define(:gitlab_address, args[:geo_primary_address])
-
               Geo::Primary.act do
                 add_license
                 enable_hashed_storage
@@ -49,7 +43,9 @@ module QA
               #
               puts 'Adding GitLab EE license ...'
 
-              Scenario::License::Add.perform(ENV['EE_LICENSE'])
+              QA::Runtime::Browser.visit(:geo_primary, QA::Page::Main::Login) do
+                Scenario::License::Add.perform(ENV['EE_LICENSE'])
+              end
             end
 
             def enable_hashed_storage
@@ -57,7 +53,9 @@ module QA
               #
               puts 'Enabling hashed repository storage setting ...'
 
-              QA::Scenario::Gitlab::Admin::HashedStorage.perform(:enabled)
+              QA::Runtime::Browser.visit(:geo_primary, QA::Page::Main::Login) do
+                QA::Scenario::Gitlab::Admin::HashedStorage.perform(:enabled)
+              end
             end
 
             def add_secondary_node
@@ -65,8 +63,10 @@ module QA
               #
               puts 'Adding new Geo secondary node ...'
 
-              Scenario::Geo::Node.perform do |node|
-                node.address = QA::Runtime::Scenario.geo_secondary_address
+              QA::Runtime::Browser.visit(:geo_primary, QA::Page::Main::Login) do
+                Scenario::Geo::Node.perform do |node|
+                  node.address = QA::Runtime::Scenario.geo_secondary_address
+                end
               end
             end
 

qa/qa/ee/strategy.rb

@@ -7,18 +7,12 @@ module QA
         require 'qa/ee'
       end
 
-      ##
-      # TODO generic solution for screenshot in factories
-      #
-      # gitlab-org/gitlab-qa#86
-      #
       def perform_before_hooks
         return unless ENV['EE_LICENSE']
 
-        EE::Scenario::License::Add.perform(ENV['EE_LICENSE'])
-      rescue
-        Capybara::Screenshot.screenshot_and_save_page
-        raise
+        QA::Runtime::Browser.visit(:gitlab, QA::Page::Main::Login) do
+          EE::Scenario::License::Add.perform(ENV['EE_LICENSE'])
+        end
       end
     end
   end

qa/qa/page/base.rb

@@ -10,6 +10,18 @@ module QA
         visit current_url
       end
 
+      def wait(css = '.application', time: 60)
+        Time.now.tap do |start|
+          while Time.now - start < time
+            break if page.has_css?(css, wait: 5)
+
+            refresh
+          end
+        end
+
+        yield if block_given?
+      end
+
       def scroll_to(selector, text: nil)
         page.execute_script <<~JS
           var elements = Array.from(document.querySelectorAll('#{selector}'));
@@ -24,6 +36,10 @@ module QA
 
         page.within(selector) { yield } if block_given?
       end
+
+      def self.path
+        raise NotImplementedError
+      end
     end
   end
 end

qa/qa/page/group/new.rb

@@ -4,6 +4,7 @@ module QA
       class New < Page::Base
         def set_path(path)
           fill_in 'group_path', with: path
+          fill_in 'group_name', with: path
         end
 
         def set_description(description)