diff options
-rw-r--r-- | app/assets/javascripts/diffs/components/tree_list.vue | 70 | ||||
-rw-r--r-- | app/controllers/projects/merge_requests_controller.rb | 4 | ||||
-rw-r--r-- | locale/gitlab.pot | 3 |
3 files changed, 64 insertions, 13 deletions
diff --git a/app/assets/javascripts/diffs/components/tree_list.vue b/app/assets/javascripts/diffs/components/tree_list.vue index 96ae197d8b8..7e00b994541 100644 --- a/app/assets/javascripts/diffs/components/tree_list.vue +++ b/app/assets/javascripts/diffs/components/tree_list.vue @@ -13,18 +13,43 @@ export default { Icon, FileRow, }, + data() { + return { + search: '', + }; + }, computed: { ...mapState('diffs', ['tree', 'renderTreeList']), ...mapGetters('diffs', ['allBlobs']), filteredTreeList() { - return this.renderTreeList ? this.tree : this.allBlobs; + const search = this.search.toLowerCase().trim(); + + if (search === '' || this.$options.fuzzyFileFinderEnabled) + return this.renderTreeList ? this.tree : this.allBlobs; + + return this.allBlobs.reduce((acc, folder) => { + const tree = folder.tree.filter(f => f.path.toLowerCase().indexOf(search) >= 0); + + if (tree.length) { + return acc.concat({ + ...folder, + tree, + }); + } + + return acc; + }, []); }, }, methods: { ...mapActions('diffs', ['toggleTreeOpen', 'scrollToFile', 'toggleFileFinder']), + clearSearch() { + this.search = ''; + }, }, shortcutKeyCharacter: `${/Mac/i.test(navigator.userAgent) ? '⌘' : 'Ctrl'}+P`, FileRowStats, + diffTreeFiltering: gon.features && gon.features.diffTreeFiltering, }; </script> @@ -33,17 +58,36 @@ export default { <div class="append-bottom-8 position-relative tree-list-search d-flex"> <div class="flex-fill d-flex"> <icon name="search" class="position-absolute tree-list-icon" /> - <button - type="button" - class="form-control text-left text-secondary" - @click="toggleFileFinder(true)" - > - {{ s__('MergeRequest|Search files') }} - </button> - <span - class="position-absolute text-secondary diff-tree-search-shortcut" - v-html="$options.shortcutKeyCharacter" - ></span> + <template v-if="$options.diffTreeFiltering"> + <input + v-model="search" + :placeholder="s__('MergeRequest|Filter files')" + type="search" + class="form-control" + /> + <button + v-show="search" + :aria-label="__('Clear search')" + type="button" + class="position-absolute bg-transparent tree-list-icon tree-list-clear-icon border-0 p-0" + @click="clearSearch" + > + <icon name="close" /> + </button> + </template> + <template v-else> + <button + type="button" + class="form-control text-left text-secondary" + @click="toggleFileFinder(true)" + > + {{ s__('MergeRequest|Search files') }} + </button> + <span + class="position-absolute text-secondary diff-tree-search-shortcut" + v-html="$options.shortcutKeyCharacter" + ></span> + </template> </div> </div> <div :class="{ 'pt-0 tree-list-blobs': !renderTreeList }" class="tree-list-scroll"> @@ -79,7 +123,7 @@ export default { pointer-events: none; } -.tree-list-icon { +.tree-list-icon:not(button) { pointer-events: none; } </style> diff --git a/app/controllers/projects/merge_requests_controller.rb b/app/controllers/projects/merge_requests_controller.rb index 5cf7fa3422d..46a44841c31 100644 --- a/app/controllers/projects/merge_requests_controller.rb +++ b/app/controllers/projects/merge_requests_controller.rb @@ -16,6 +16,10 @@ class Projects::MergeRequestsController < Projects::MergeRequests::ApplicationCo before_action :authenticate_user!, only: [:assign_related_issues] before_action :check_user_can_push_to_source_branch!, only: [:rebase] + before_action only: [:show] do + push_frontend_feature_flag(:diff_tree_filtering, default_enabled: true) + end + def index @merge_requests = @issuables diff --git a/locale/gitlab.pot b/locale/gitlab.pot index df4975877df..0ca7a1427ef 100644 --- a/locale/gitlab.pot +++ b/locale/gitlab.pot @@ -4494,6 +4494,9 @@ msgstr "" msgid "MergeRequest| %{paragraphStart}changed the description %{descriptionChangedTimes} times %{timeDifferenceMinutes}%{paragraphEnd}" msgstr "" +msgid "MergeRequest|Filter files" +msgstr "" + msgid "MergeRequest|No files found" msgstr "" |