Merge branch 'master' into '18471-restrict-tag-pushes-protected-tags'

# Conflicts:
#   spec/lib/gitlab/import_export/all_models.yml

.gitignore

@@ -30,6 +30,7 @@ eslint-report.html
 /config/unicorn.rb
 /config/secrets.yml
 /config/sidekiq.yml
+/config/registry.key
 /coverage/*
 /coverage-javascript/
 /db/*.sqlite3

GITALY_SERVER_VERSION

-0.5.0
+0.6.0

Gemfile

@@ -144,6 +144,9 @@ gem 'sidekiq-cron', '~> 0.4.4'
 gem 'redis-namespace', '~> 1.5.2'
 gem 'sidekiq-limit_fetch', '~> 3.4'
+# Cron Parser
+gem 'rufus-scheduler', '~> 3.1.10'
+
 # HTTP requests
 gem 'httparty', '~> 0.13.3'

Gemfile.lock

@@ -987,6 +987,7 @@ DEPENDENCIES
   rubocop-rspec (~> 1.12.0)
   ruby-fogbugz (~> 0.2.1)
   ruby-prof (~> 0.16.2)
+  rufus-scheduler (~> 3.1.10)
   rugged (~> 0.25.1.1)
   sanitize (~> 2.0)
   sass-rails (~> 5.0.6)

app/assets/javascripts/blob/blob_fork_suggestion.js

+function BlobForkSuggestion(openButton, cancelButton, suggestionSection) {
+  if (openButton) {
+    openButton.addEventListener('click', () => {
+      suggestionSection.classList.remove('hidden');
+    });
+  }
+
+  if (cancelButton) {
+    cancelButton.addEventListener('click', () => {
+      suggestionSection.classList.add('hidden');
+    });
+  }
+}
+
+export default BlobForkSuggestion;

app/assets/javascripts/build.js

@@ -84,10 +84,10 @@ window.Build = (function() {
     var removeRefreshStatuses = ['success', 'failed', 'canceled', 'skipped'];
     return $.ajax({
-      url: this.buildUrl,
+      url: this.pageUrl + "/trace.json",
       dataType: 'json',
       success: function(buildData) {
-        $('.js-build-output').html(buildData.trace_html);
+        $('.js-build-output').html(buildData.html);
         gl.utils.setCiStatusFavicon(`${this.pageUrl}/status.json`);
         if (window.location.hash === DOWN_BUILD_TRACE) {
           $("html,body").scrollTop(this.$buildTrace.height());

app/assets/javascripts/copy_to_clipboard.js

@@ -38,9 +38,35 @@ showTooltip = function(target, title) {
 };
 $(function() {
-  var clipboard;
-
-  clipboard = new Clipboard('[data-clipboard-target], [data-clipboard-text]');
+  const clipboard = new Clipboard('[data-clipboard-target], [data-clipboard-text]');
   clipboard.on('success', genericSuccess);
-  return clipboard.on('error', genericError);
+  clipboard.on('error', genericError);
+
+  // This a workaround around ClipboardJS limitations to allow the context-specific copy/pasting of plain text or GFM.
+  // The Ruby `clipboard_button` helper sneaks a JSON hash with `text` and `gfm` keys into the `data-clipboard-text`
+  // attribute that ClipboardJS reads from.
+  // When ClipboardJS creates a new `textarea` (directly inside `body`, with a `readonly` attribute`), sets its value
+  // to the value of this data attribute, focusses on it, and finally programmatically issues the 'Copy' command,
+  // this code intercepts the copy command/event at the last minute to deconstruct this JSON hash and set the
+  // `text/plain` and `text/x-gfm` copy data types to the intended values.
+  $(document).on('copy', 'body > textarea[readonly]', function(e) {
+    const clipboardData = e.originalEvent.clipboardData;
+    if (!clipboardData) return;
+
+    const text = e.target.value;
+
+    let json;
+    try {
+      json = JSON.parse(text);
+    } catch (ex) {
+      return;
+    }
+
+    if (!json.text || !json.gfm) return;
+
+    e.preventDefault();
+
+    clipboardData.setData('text/plain', json.text);
+    clipboardData.setData('text/x-gfm', json.gfm);
+  });
 });

app/assets/javascripts/dispatcher.js

@@ -43,6 +43,7 @@ import GroupsList from './groups_list';
 import ProjectsList from './projects_list';
 import MiniPipelineGraph from './mini_pipeline_graph_dropdown';
 import BlobLinePermalinkUpdater from './blob/blob_line_permalink_updater';
+import BlobForkSuggestion from './blob/blob_fork_suggestion';
 import UserCallout from './user_callout';
 import { ProtectedTagCreate, ProtectedTagEditList } from './protected_tags';
@@ -87,6 +88,12 @@ const ShortcutsBlob = require('./shortcuts_blob');
           skipResetBindings: true,
           fileBlobPermalinkUrl,
         });
+
+        new BlobForkSuggestion(
+          document.querySelector('.js-edit-blob-link-fork-toggler'),
+          document.querySelector('.js-cancel-fork-suggestion'),
+          document.querySelector('.js-file-fork-suggestion-section'),
+        );
       }
       switch (page) {

app/assets/javascripts/filtered_search/components/recent_searches_dropdown_content.js

+import eventHub from '../event_hub';
+
+export default {
+  name: 'RecentSearchesDropdownContent',
+
+  props: {
+    items: {
+      type: Array,
+      required: true,
+    },
+  },
+
+  computed: {
+    processedItems() {
+      return this.items.map((item) => {
+        const { tokens, searchToken }
+          = gl.FilteredSearchTokenizer.processTokens(item);
+
+        const resultantTokens = tokens.map(token => ({
+          prefix: `${token.key}:`,
+          suffix: `${token.symbol}${token.value}`,
+        }));
+
+        return {
+          text: item,
+          tokens: resultantTokens,
+          searchToken,
+        };
+      });
+    },
+    hasItems() {
+      return this.items.length > 0;
+    },
+  },
+
+  methods: {
+    onItemActivated(text) {
+      eventHub.$emit('recentSearchesItemSelected', text);
+    },
+    onRequestClearRecentSearches(e) {
+      // Stop the dropdown from closing
+      e.stopPropagation();
+
+      eventHub.$emit('requestClearRecentSearches');
+    },
+  },
+
+  template: `
+    <div>
+      <ul v-if="hasItems">
+        <li
+          v-for="(item, index) in processedItems"
+          :key="index">
+          <button
+            type="button"
+            class="filtered-search-history-dropdown-item"
+            @click="onItemActivated(item.text)">
+            <span>
+              <span
+                v-for="(token, tokenIndex) in item.tokens"
+                class="filtered-search-history-dropdown-token">
+                <span class="name">{{ token.prefix }}</span><span class="value">{{ token.suffix }}</span>
+              </span>
+            </span>
+            <span class="filtered-search-history-dropdown-search-token">
+              {{ item.searchToken }}
+            </span>
+          </button>
+        </li>
+        <li class="divider"></li>
+        <li>
+          <button
+            type="button"
+            class="filtered-search-history-clear-button"
+            @click="onRequestClearRecentSearches($event)">
+            Clear recent searches
+          </button>
+        </li>
+      </ul>
+      <div
+        v-else
+        class="dropdown-info-note">
+        You don't have any recent searches
+      </div>
+    </div>
+  `,
+};

app/assets/javascripts/filtered_search/dropdown_hint.js

@@ -56,7 +56,7 @@ require('./filtered_search_dropdown');
     renderContent() {
       const dropdownData = [];
-      [].forEach.call(this.input.closest('.filtered-search-input-container').querySelectorAll('.dropdown-menu'), (dropdownMenu) => {
+      [].forEach.call(this.input.closest('.filtered-search-box-input-container').querySelectorAll('.dropdown-menu'), (dropdownMenu) => {
         const { icon, hint, tag, type } = dropdownMenu.dataset;
         if (icon && hint && tag) {
           dropdownData.push(

app/assets/javascripts/filtered_search/dropdown_utils.js

@@ -129,7 +129,9 @@ import FilteredSearchContainer from './container';
         }
       });
-      return values.join(' ');
+      return values
+        .map(value => value.trim())
+        .join(' ');
     }
     static getSearchInput(filteredSearchInput) {

app/assets/javascripts/filtered_search/event_hub.js

+import Vue from 'vue';
+
+export default new Vue();

app/assets/javascripts/filtered_search/filtered_search_manager.js

+/* global Flash */
+
 import FilteredSearchContainer from './container';
+import RecentSearchesRoot from './recent_searches_root';
+import RecentSearchesStore from './stores/recent_searches_store';
+import RecentSearchesService from './services/recent_searches_service';
+import eventHub from './event_hub';
 (() => {
   class FilteredSearchManager {
     constructor(page) {
       this.container = FilteredSearchContainer.container;
       this.filteredSearchInput = this.container.querySelector('.filtered-search');
+      this.filteredSearchInputForm = this.filteredSearchInput.form;
       this.clearSearchButton = this.container.querySelector('.clear-search');
       this.tokensContainer = this.container.querySelector('.tokens-container');
       this.filteredSearchTokenKeys = gl.FilteredSearchTokenKeys;
+      this.recentSearchesStore = new RecentSearchesStore();
+      let recentSearchesKey = 'issue-recent-searches';
+      if (page === 'merge_requests') {
+        recentSearchesKey = 'merge-request-recent-searches';
+      }
+      this.recentSearchesService = new RecentSearchesService(recentSearchesKey);
+
+      // Fetch recent searches from localStorage
+      this.fetchingRecentSearchesPromise = this.recentSearchesService.fetch()
+        .catch(() => {
+          // eslint-disable-next-line no-new
+          new Flash('An error occured while parsing recent searches');
+          // Gracefully fail to empty array
+          return [];
+        })
+        .then((searches) => {
+          // Put any searches that may have come in before
+          // we fetched the saved searches ahead of the already saved ones
+          const resultantSearches = this.recentSearchesStore.setRecentSearches(
+            this.recentSearchesStore.state.recentSearches.concat(searches),
+          );
+          this.recentSearchesService.save(resultantSearches);
+        });
+
       if (this.filteredSearchInput) {
         this.tokenizer = gl.FilteredSearchTokenizer;
         this.dropdownManager = new gl.FilteredSearchDropdownManager(this.filteredSearchInput.getAttribute('data-base-endpoint') || '', page);
+        this.recentSearchesRoot = new RecentSearchesRoot(
+          this.recentSearchesStore,
+          this.recentSearchesService,
+          document.querySelector('.js-filtered-search-history-dropdown'),
+        );
+        this.recentSearchesRoot.init();
+
         this.bindEvents();
         this.loadSearchParamsFromURL();
         this.dropdownManager.setDropdown();
@@ -25,6 +63,10 @@ import FilteredSearchContainer from './container';
     cleanup() {
       this.unbindEvents();
       document.removeEventListener('beforeunload', this.cleanupWrapper);
+
+      if (this.recentSearchesRoot) {
+        this.recentSearchesRoot.destroy();
+      }
     }
     bindEvents() {
@@ -34,7 +76,7 @@ import FilteredSearchContainer from './container';
       this.handleInputPlaceholderWrapper = this.handleInputPlaceholder.bind(this);
       this.handleInputVisualTokenWrapper = this.handleInputVisualToken.bind(this);
       this.checkForEnterWrapper = this.checkForEnter.bind(this);
-      this.clearSearchWrapper = this.clearSearch.bind(this);
+      this.onClearSearchWrapper = this.onClearSearch.bind(this);
       this.checkForBackspaceWrapper = this.checkForBackspace.bind(this);
       this.removeSelectedTokenWrapper = this.removeSelectedToken.bind(this);
       this.unselectEditTokensWrapper = this.unselectEditTokens.bind(this);
@@ -42,8 +84,8 @@ import FilteredSearchContainer from './container';
       this.tokenChange = this.tokenChange.bind(this);
       this.addInputContainerFocusWrapper = this.addInputContainerFocus.bind(this);
       this.removeInputContainerFocusWrapper = this.removeInputContainerFocus.bind(this);
-      this.filteredSearchInputForm = this.filteredSearchInput.form;
+      this.onrecentSearchesItemSelectedWrapper = this.onrecentSearchesItemSelected.bind(this);
       this.filteredSearchInputForm.addEventListener('submit', this.handleFormSubmit);
       this.filteredSearchInput.addEventListener('input', this.setDropdownWrapper);
       this.filteredSearchInput.addEventListener('input', this.toggleClearSearchButtonWrapper);
@@ -56,11 +98,12 @@ import FilteredSearchContainer from './container';
       this.filteredSearchInput.addEventListener('focus', this.addInputContainerFocusWrapper);
       this.tokensContainer.addEventListener('click', FilteredSearchManager.selectToken);
       this.tokensContainer.addEventListener('dblclick', this.editTokenWrapper);
-      this.clearSearchButton.addEventListener('click', this.clearSearchWrapper);
+      this.clearSearchButton.addEventListener('click', this.onClearSearchWrapper);
       document.addEventListener('click', gl.FilteredSearchVisualTokens.unselectTokens);
       document.addEventListener('click', this.unselectEditTokensWrapper);
       document.addEventListener('click', this.removeInputContainerFocusWrapper);
       document.addEventListener('keydown', this.removeSelectedTokenWrapper);
+      eventHub.$on('recentSearchesItemSelected', this.onrecentSearchesItemSelectedWrapper);
     }
     unbindEvents() {
@@ -76,11 +119,12 @@ import FilteredSearchContainer from './container';
       this.filteredSearchInput.removeEventListener('focus', this.addInputContainerFocusWrapper);
       this.tokensContainer.removeEventListener('click', FilteredSearchManager.selectToken);
       this.tokensContainer.removeEventListener('dblclick', this.editTokenWrapper);
-      this.clearSearchButton.removeEventListener('click', this.clearSearchWrapper);
+      this.clearSearchButton.removeEventListener('click', this.onClearSearchWrapper);
       document.removeEventListener('click', gl.FilteredSearchVisualTokens.unselectTokens);
       document.removeEventListener('click', this.unselectEditTokensWrapper);
       document.removeEventListener('click', this.removeInputContainerFocusWrapper);
       document.removeEventListener('keydown', this.removeSelectedTokenWrapper);
+      eventHub.$off('recentSearchesItemSelected', this.onrecentSearchesItemSelectedWrapper);
     }
     checkForBackspace(e) {
@@ -131,7 +175,7 @@ import FilteredSearchContainer from './container';
     }
     addInputContainerFocus() {
-      const inputContainer = this.filteredSearchInput.closest('.filtered-search-input-container');
+      const inputContainer = this.filteredSearchInput.closest('.filtered-search-box');
       if (inputContainer) {
         inputContainer.classList.add('focus');
@@ -139,7 +183,7 @@ import FilteredSearchContainer from './container';
     }
     removeInputContainerFocus(e) {
-      const inputContainer = this.filteredSearchInput.closest('.filtered-search-input-container');
+      const inputContainer = this.filteredSearchInput.closest('.filtered-search-box');
       const isElementInFilteredSearch = inputContainer && inputContainer.contains(e.target);
       const isElementInDynamicFilterDropdown = e.target.closest('.filter-dropdown') !== null;
       const isElementInStaticFilterDropdown = e.target.closest('ul[data-dropdown]') !== null;
@@ -161,7 +205,7 @@ import FilteredSearchContainer from './container';
     }
     unselectEditTokens(e) {
-      const inputContainer = this.container.querySelector('.filtered-search-input-container');
+      const inputContainer = this.container.querySelector('.filtered-search-box');
       const isElementInFilteredSearch = inputContainer && inputContainer.contains(e.target);
       const isElementInFilterDropdown = e.target.closest('.filter-dropdown') !== null;
       const isElementTokensContainer = e.target.classList.contains('tokens-container');
@@ -215,9 +259,12 @@ import FilteredSearchContainer from './container';
       }
     }
-    clearSearch(e) {
+    onClearSearch(e) {
       e.preventDefault();
+      this.clearSearch();
+    }
+    clearSearch() {
       this.filteredSearchInput.value = '';
       const removeElements = [];
@@ -289,6 +336,17 @@ import FilteredSearchContainer from './container';
       this.search();
     }
+    saveCurrentSearchQuery() {
+      // Don't save before we have fetched the already saved searches
+      this.fetchingRecentSearchesPromise.then(() => {
+        const searchQuery = gl.DropdownUtils.getSearchQuery();
+        if (searchQuery.length > 0) {
+          const resultantSearches = this.recentSearchesStore.addRecentSearch(searchQuery);
+          this.recentSearchesService.save(resultantSearches);
+        }
+      });
+    }
+
     loadSearchParamsFromURL() {
       const params = gl.utils.getUrlParamsArray();
       const usernameParams = this.getUsernameParams();
@@ -343,6 +401,8 @@ import FilteredSearchContainer from './container';
         }
       });
+      this.saveCurrentSearchQuery();
+
       if (hasFilteredSearch) {
         this.clearSearchButton.classList.remove('hidden');
         this.handleInputPlaceholder();
@@ -351,8 +411,12 @@ import FilteredSearchContainer from './container';
     search() {
       const paths = [];
+      const searchQuery = gl.DropdownUtils.getSearchQuery();
+
+      this.saveCurrentSearchQuery();
+
       const { tokens, searchToken }
-        = this.tokenizer.processTokens(gl.DropdownUtils.getSearchQuery());
+        = this.tokenizer.processTokens(searchQuery);
       const currentState = gl.utils.getParameterByName('state') || 'opened';
       paths.push(`state=${currentState}`);
@@ -416,6 +480,13 @@ import FilteredSearchContainer from './container';
         currentDropdownRef.dispatchInputEvent();
       }
     }
+
+    onrecentSearchesItemSelected(text) {
+      this.clearSearch();
+      this.filteredSearchInput.value = text;
+      this.filteredSearchInput.dispatchEvent(new CustomEvent('input'));
+      this.search();
+    }
   }
   window.gl = window.gl || {};

app/assets/javascripts/filtered_search/recent_searches_root.js

+import Vue from 'vue';
+import RecentSearchesDropdownContent from './components/recent_searches_dropdown_content';
+import eventHub from './event_hub';
+
+class RecentSearchesRoot {
+  constructor(
+    recentSearchesStore,
+    recentSearchesService,
+    wrapperElement,
+  ) {
+    this.store = recentSearchesStore;
+    this.service = recentSearchesService;
+    this.wrapperElement = wrapperElement;
+  }
+
+  init() {
+    this.bindEvents();
+    this.render();
+  }
+
+  bindEvents() {
+    this.onRequestClearRecentSearchesWrapper = this.onRequestClearRecentSearches.bind(this);
+
+    eventHub.$on('requestClearRecentSearches', this.onRequestClearRecentSearchesWrapper);
+  }
+
+  unbindEvents() {
+    eventHub.$off('requestClearRecentSearches', this.onRequestClearRecentSearchesWrapper);
+  }
+
+  render() {
+    this.vm = new Vue({
+      el: this.wrapperElement,
+      data: this.store.state,
+      template: `
+        <recent-searches-dropdown-content
+          :items="recentSearches" />
+      `,
+      components: {
+        'recent-searches-dropdown-content': RecentSearchesDropdownContent,
+      },
+    });
+  }
+
+  onRequestClearRecentSearches() {
+    const resultantSearches = this.store.setRecentSearches([]);
+    this.service.save(resultantSearches);
+  }
+
+  destroy() {
+    this.unbindEvents();
+    if (this.vm) {
+      this.vm.$destroy();
+    }
+  }
+
+}
+
+export default RecentSearchesRoot;

app/assets/javascripts/filtered_search/services/recent_searches_service.js

+class RecentSearchesService {
+  constructor(localStorageKey = 'issuable-recent-searches') {
+    this.localStorageKey = localStorageKey;
+  }
+
+  fetch() {
+    const input = window.localStorage.getItem(this.localStorageKey);
+
+    let searches = [];
+    if (input && input.length > 0) {
+      try {
+        searches = JSON.parse(input);
+      } catch (err) {
+        return Promise.reject(err);
+      }
+    }
+
+    return Promise.resolve(searches);
+  }
+
+  save(searches = []) {
+    window.localStorage.setItem(this.localStorageKey, JSON.stringify(searches));
+  }
+}
+
+export default RecentSearchesService;

app/assets/javascripts/filtered_search/stores/recent_searches_store.js

+import _ from 'underscore';
+
+class RecentSearchesStore {
+  constructor(initialState = {}) {
+    this.state = Object.assign({
+      recentSearches: [],
+    }, initialState);
+  }
+
+  addRecentSearch(newSearch) {
+    this.setRecentSearches([newSearch].concat(this.state.recentSearches));
+
+    return this.state.recentSearches;
+  }
+
+  setRecentSearches(searches = []) {
+    const trimmedSearches = searches.map(search => search.trim());
+    this.state.recentSearches = _.uniq(trimmedSearches).slice(0, 5);
+    return this.state.recentSearches;
+  }
+}
+
+export default RecentSearchesStore;

app/assets/stylesheets/framework/dropdowns.scss

@@ -177,10 +177,6 @@
   border-radius: $border-radius-base;
   box-shadow: 0 2px 4px $dropdown-shadow-color;
-  .filtered-search-input-container & {
-    max-width: 280px;
-  }
-
   &.is-loading {
     .dropdown-content {
       display: none;
@@ -467,6 +463,11 @@
   overflow-y: auto;
 }
+.dropdown-info-note {
+  color: $gl-text-color-secondary;
+  text-align: center;
+}
+
 .dropdown-footer {
   padding-top: 10px;
   margin-top: 10px;

app/assets/stylesheets/framework/files.scss

@@ -281,3 +281,16 @@ span.idiff {
     display: none;
   }
 }
+
+.file-fork-suggestion {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  background-color: $gray-light;
+  border-bottom: 1px solid $border-color;
+  padding: 5px $gl-padding;
+}
+
+.file-fork-suggestion-note {
+  margin-right: 1.5em;
+}

app/assets/stylesheets/framework/filters.scss

@@ -22,7 +22,6 @@
 }
 @media (min-width: $screen-sm-min) {
-  .issues-filters,
   .issues_bulk_update {
     .dropdown-menu-toggle {
       width: 132px;
@@ -56,7 +55,7 @@
   }
 }
-.filtered-search-container {
+.filtered-search-wrapper {
   display: -webkit-flex;
   display: flex;
@@ -151,11 +150,13 @@
   width: 100%;
 }
-.filtered-search-input-container {
+.filtered-search-box {
+  position: relative;
+  flex: 1;
   display: -webkit-flex;
   display: flex;
-  position: relative;
   width: 100%;
+  min-width: 0;
   border: 1px solid $border-color;
   background-color: $white-light;
@@ -163,14 +164,6 @@
     -webkit-flex: 1 1 auto;
     flex: 1 1 auto;
     margin-bottom: 10px;
-
-    .dropdown-menu {
-      width: auto;
-      left: 0;
-      right: 0;
-      max-width: none;
-      min-width: 100%;
-    }
   }
   &:hover {
@@ -229,6 +222,118 @@
   }
 }
+.filtered-search-box-input-container {
+  flex: 1;
+  position: relative;
+  // Fix PhantomJS not supporting `flex: 1;` properly.
+  // This is important because it can change the expected `e.target` when clicking things in tests.
+  // See https://gitlab.com/gitlab-org/gitlab-ce/blob/b54acba8b732688c59fe2f38510c469dc86ee499/spec/features/issues/filtered_search/visual_tokens_spec.rb#L61
+  // - With `width: 100%`: `e.target` = `.tokens-container`, https://i.imgur.com/jGq7wbx.png
+  // - Without `width: 100%`: `e.target` = `.filtered-search`, https://i.imgur.com/cNI2CyT.png
+  width: 100%;
+  min-width: 0;
+}
+
+.filtered-search-input-dropdown-menu {
+  max-width: 280px;
+
+  @media (max-width: $screen-xs-min) {
+    width: auto;
+    left: 0;
+    right: 0;
+    max-width: none;
+    min-width: 100%;
+  }
+}
+
+.filtered-search-history-dropdown-toggle-button {
+  display: flex;
+  align-items: center;
+  width: auto;
+  height: 100%;
+  padding-top: 0;
+  padding-left: 0.75em;
+  padding-bottom: 0;
+  padding-right: 0.5em;
+
+  background-color: transparent;
+  border-radius: 0;
+  border-top: 0;
+  border-left: 0;
+  border-bottom: 0;
+  border-right: 1px solid $border-color;
+
+  color: $gl-text-color-secondary;
+
+  transition: color 0.1s linear;
+
+  &:hover,
+  &:focus {
+    color: $gl-text-color;
+    border-color: $dropdown-input-focus-border;
+    outline: none;
+  }
+
+  .dropdown-toggle-text {
+    color: inherit;
+
+    .fa {
+      color: inherit;
+    }
+  }
+
+  .fa {
+    position: initial;
+  }
+
+}
+
+.filtered-search-history-dropdown-wrapper {
+  position: initial;
+  flex-shrink: 0;
+}
+
+.filtered-search-history-dropdown {
+  width: 40%;
+
+  @media (max-width: $screen-xs-min) {
+    left: 0;
+    right: 0;
+    max-width: none;
+  }
+}
+
+.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-token {
+  display: inline;
+
+  &:not(:last-child) {
+    margin-right: 0.3em;
+  }
+
+  & > .value {
+    font-weight: 600;
+  }
+}
+
 .filter-dropdown-container {
   display: -webkit-flex;
   display: flex;
@@ -248,10 +353,8 @@
 }
 @media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) {
-  .issues-details-filters {
-    .dropdown-menu-toggle {
-      width: 100px;
-    }
+  .issue-bulk-update-dropdown-toggle {
+    width: 100px;
   }
 }

app/assets/stylesheets/pages/container_registry.scss

+/**
+ * Container Registry
+ */
+
+.container-image {
+  border-bottom: 1px solid $white-normal;
+}
+
+.container-image-head {
+  padding: 0 16px;
+  line-height: 4em;
+}
+
+.table.tags {
+  margin-bottom: 0;
+}