Commit 78dd2f05 authored by Luke "Jared" Bennett's avatar Luke "Jared" Bennett

Added issuables_helper.js, tidied up droplab-dropdown JS, fixed filtered search specs

parent f0f94278
import CloseReopenReportToggle from '../close_reopen_report_toggle';
export default function initCloseReopenReport() {
const container = document.querySelector('.js-issuable-close-dropdown');
if (!container) return undefined;
const dropdownTrigger = container.querySelector('.js-issuable-close-toggle');
const dropdownList = container.querySelector('.js-issuable-close-menu');
const button = container.querySelector('.js-issuable-close-button');
const closeReopenReportToggle = new CloseReopenReportToggle({
dropdownTrigger,
dropdownList,
button,
});
closeReopenReportToggle.initDroplab();
return closeReopenReportToggle;
}
...@@ -6,7 +6,7 @@ import '~/lib/utils/text_utility'; ...@@ -6,7 +6,7 @@ import '~/lib/utils/text_utility';
import './flash'; import './flash';
import './task_list'; import './task_list';
import CreateMergeRequestDropdown from './create_merge_request_dropdown'; import CreateMergeRequestDropdown from './create_merge_request_dropdown';
import CloseReopenReportToggle from './close_reopen_report_toggle'; import initCloseReopenReport from './helpers/issuables_helper';
class Issue { class Issue {
constructor() { constructor() {
...@@ -29,12 +29,10 @@ class Issue { ...@@ -29,12 +29,10 @@ class Issue {
Issue.initMergeRequests(); Issue.initMergeRequests();
Issue.initRelatedBranches(); Issue.initRelatedBranches();
this.initCloseReopenReport();
if (!this.closeReopenReportToggle) {
this.closeButtons = $('a.btn-close'); this.closeButtons = $('a.btn-close');
this.reopenButtons = $('a.btn-reopen'); this.reopenButtons = $('a.btn-reopen');
}
this.initCloseReopenReport();
if (Issue.createMrDropdownWrap) { if (Issue.createMrDropdownWrap) {
this.createMergeRequestDropdown = new CreateMergeRequestDropdown(Issue.createMrDropdownWrap); this.createMergeRequestDropdown = new CreateMergeRequestDropdown(Issue.createMrDropdownWrap);
...@@ -100,21 +98,10 @@ class Issue { ...@@ -100,21 +98,10 @@ class Issue {
} }
initCloseReopenReport() { initCloseReopenReport() {
const container = document.querySelector('.js-issuable-close-dropdown'); this.closeReopenReportToggle = initCloseReopenReport();
if (!container) return;
const dropdownTrigger = container.querySelector('.js-issuable-close-toggle'); this.closeButtons = this.closeButtons.not('.issuable-close-button');
const dropdownList = container.querySelector('.js-issuable-close-menu'); this.reopenButtons = this.reopenButtons.not('.issuable-close-button');
const button = container.querySelector('.js-issuable-close-button');
this.closeReopenReportToggle = new CloseReopenReportToggle({
dropdownTrigger,
dropdownList,
button,
});
this.closeReopenReportToggle.initDroplab();
} }
disableCloseReopenButton($button, shouldDisable) { disableCloseReopenButton($button, shouldDisable) {
...@@ -126,13 +113,10 @@ class Issue { ...@@ -126,13 +113,10 @@ class Issue {
} }
toggleCloseReopenButton(isClosed) { toggleCloseReopenButton(isClosed) {
if (this.closeReopenReportToggle) { if (this.closeReopenReportToggle) this.closeReopenReportToggle.updateButton(isClosed);
this.closeReopenReportToggle.updateButton(isClosed);
} else {
this.closeButtons.toggleClass('hidden', isClosed); this.closeButtons.toggleClass('hidden', isClosed);
this.reopenButtons.toggleClass('hidden', !isClosed); this.reopenButtons.toggleClass('hidden', !isClosed);
} }
}
static submitNoteForm(form) { static submitNoteForm(form) {
var noteText; var noteText;
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
import 'vendor/jquery.waitforimages'; import 'vendor/jquery.waitforimages';
import './task_list'; import './task_list';
import './merge_request_tabs'; import './merge_request_tabs';
import CloseReopenReportToggle from './close_reopen_report_toggle'; import initCloseReopenReport from './helpers/issuables_helper';
(function() { (function() {
this.MergeRequest = (function() { this.MergeRequest = (function() {
...@@ -26,7 +26,7 @@ import CloseReopenReportToggle from './close_reopen_report_toggle'; ...@@ -26,7 +26,7 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
this.initTabs(); this.initTabs();
this.initMRBtnListeners(); this.initMRBtnListeners();
this.initCommitMessageListeners(); this.initCommitMessageListeners();
this.initCloseReopenReport(); this.closeReopenReportToggle = initCloseReopenReport();
if ($("a.btn-close").length) { if ($("a.btn-close").length) {
this.taskList = new gl.TaskList({ this.taskList = new gl.TaskList({
...@@ -127,24 +127,6 @@ import CloseReopenReportToggle from './close_reopen_report_toggle'; ...@@ -127,24 +127,6 @@ import CloseReopenReportToggle from './close_reopen_report_toggle';
$el.text(gl.text.addDelimiter(count)); $el.text(gl.text.addDelimiter(count));
}; };
MergeRequest.prototype.initCloseReopenReport = function () {
const container = document.querySelector('.js-issuable-close-dropdown');
if (!container) return;
const dropdownTrigger = container.querySelector('.js-issuable-close-toggle');
const dropdownList = container.querySelector('.js-issuable-close-menu');
const button = container.querySelector('.js-issuable-close-button');
this.closeReopenReportToggle = new CloseReopenReportToggle({
dropdownTrigger,
dropdownList,
button,
});
this.closeReopenReportToggle.initDroplab();
};
return MergeRequest; return MergeRequest;
})(); })();
}).call(window); }).call(window);
...@@ -308,6 +308,7 @@ ...@@ -308,6 +308,7 @@
li { li {
padding: $gl-btn-padding $gl-btn-padding 2px; padding: $gl-btn-padding $gl-btn-padding 2px;
cursor: pointer;
> a, > a,
> button { > button {
......
...@@ -70,6 +70,7 @@ ...@@ -70,6 +70,7 @@
.input-token { .input-token {
max-width: 200px; max-width: 200px;
padding: 0;
&:hover, &:hover,
&:focus { &:focus {
...@@ -83,7 +84,6 @@ ...@@ -83,7 +84,6 @@
flex: 1; flex: 1;
-webkit-flex: 1; -webkit-flex: 1;
max-width: inherit; max-width: inherit;
padding: 0;
} }
} }
...@@ -165,6 +165,12 @@ ...@@ -165,6 +165,12 @@
.droplab-dropdown li.filtered-search-token { .droplab-dropdown li.filtered-search-token {
padding: 0; padding: 0;
&:hover,
&:focus {
background-color: inherit;
color: inherit;
}
} }
.filtered-search-term { .filtered-search-term {
......
...@@ -805,8 +805,22 @@ ...@@ -805,8 +805,22 @@
@include transition(border-color, color); @include transition(border-color, color);
} }
.issuable-close-dropdown .dropdown-menu { .issuable-close-dropdown {
.dropdown-menu {
min-width: 270px; min-width: 270px;
left: auto; left: auto;
right: 0; right: 0;
}
.description {
margin-bottom: 10px;
.text {
margin: 0;
}
}
.dropdown-toggle > .icon {
margin: 0 3px;
}
} }
...@@ -263,8 +263,6 @@ module IssuablesHelper ...@@ -263,8 +263,6 @@ module IssuablesHelper
issue_url(issuable, *options) issue_url(issuable, *options)
when MergeRequest when MergeRequest
merge_request_url(issuable, *options) merge_request_url(issuable, *options)
else
raise TypeError.new('unknown issuable type')
end end
end end
...@@ -274,8 +272,6 @@ module IssuablesHelper ...@@ -274,8 +272,6 @@ module IssuablesHelper
issue_button_visibility(issuable, closed) issue_button_visibility(issuable, closed)
when MergeRequest when MergeRequest
merge_request_button_visibility(issuable, closed) merge_request_button_visibility(issuable, closed)
else
raise TypeError.new('unknown issuable type')
end end
end end
...@@ -285,8 +281,6 @@ module IssuablesHelper ...@@ -285,8 +281,6 @@ module IssuablesHelper
'' ''
when MergeRequest when MergeRequest
'put' 'put'
else
raise TypeError.new('unknown issuable type')
end end
end end
...@@ -323,8 +317,6 @@ module IssuablesHelper ...@@ -323,8 +317,6 @@ module IssuablesHelper
issue_template_names issue_template_names
when MergeRequest when MergeRequest
merge_request_template_names merge_request_template_names
else
raise 'Unknown issuable type!'
end end
end end
......
...@@ -21,10 +21,9 @@ ...@@ -21,10 +21,9 @@
%button.btn.btn-transparent %button.btn.btn-transparent
= icon('check', class: 'icon') = icon('check', class: 'icon')
.description .description
%strong %strong.title
Close Close
= display_issuable_type = display_issuable_type
%p
%li.reopen-item{ class: "#{issuable_button_visibility(issuable, false) || 'droplab-item-selected'}", %li.reopen-item{ class: "#{issuable_button_visibility(issuable, false) || 'droplab-item-selected'}",
data: { text: "Reopen #{display_issuable_type}", url: reopen_issuable_url(issuable), data: { text: "Reopen #{display_issuable_type}", url: reopen_issuable_url(issuable),
...@@ -32,10 +31,9 @@ ...@@ -32,10 +31,9 @@
%button.btn.btn-transparent %button.btn.btn-transparent
= icon('check', class: 'icon') = icon('check', class: 'icon')
.description .description
%strong %strong.title
Reopen Reopen
= display_issuable_type = display_issuable_type
%p
%li.divider.droplab-item-ignore %li.divider.droplab-item-ignore
...@@ -44,8 +42,8 @@ ...@@ -44,8 +42,8 @@
%button.btn.btn-transparent %button.btn.btn-transparent
= icon('check', class: 'icon') = icon('check', class: 'icon')
.description .description
%strong Report abuse %strong.title Report abuse
%p %p.text
Report Report
= display_issuable_type.pluralize = display_issuable_type.pluralize
that are abusive, inappropriate or spam. that are abusive, inappropriate or spam.
require 'spec_helper' require 'spec_helper'
shared_examples 'an issuable close/reopen/report toggle' do describe 'Issuables Close/Reopen/Report toggle', :feature do
let(:user) { create(:user) }
shared_examples 'an issuable close/reopen/report toggle' do
let(:container) { find('.issuable-close-dropdown') } let(:container) { find('.issuable-close-dropdown') }
let(:human_model_name) { issuable.model_name.human.downcase } let(:human_model_name) { issuable.model_name.human.downcase }
...@@ -36,10 +39,7 @@ shared_examples 'an issuable close/reopen/report toggle' do ...@@ -36,10 +39,7 @@ shared_examples 'an issuable close/reopen/report toggle' do
expect(button).to have_content("Close #{human_model_name}") expect(button).to have_content("Close #{human_model_name}")
end end
end end
describe 'Issuables Close/Reopen/Report toggle', :feature do
let(:user) { create(:user) }
context 'on an issue' do context 'on an issue' do
let(:project) { create(:empty_project) } let(:project) { create(:empty_project) }
......
...@@ -133,7 +133,7 @@ describe 'Visual tokens', js: true, feature: true do ...@@ -133,7 +133,7 @@ describe 'Visual tokens', js: true, feature: true do
describe 'editing milestone token' do describe 'editing milestone token' do
before do before do
input_filtered_search('milestone:%10.0 author:none', submit: false) input_filtered_search('milestone:%10.0 author:none', submit: false)
first('.tokens-container .filtered-search-token').double_click first('.tokens-container .filtered-search-token').click
first('#js-dropdown-milestone .filter-dropdown .filter-dropdown-item') first('#js-dropdown-milestone .filter-dropdown .filter-dropdown-item')
end end
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment