Merge branch '228705-enable-open-closed-all-tabs-in-jira-issue-list-ui' into 'master'

Add Open/Closed/All tab navigation to Jira issues

See merge request gitlab-org/gitlab!36929

app/assets/javascripts/issuables_list/components/issuables_list_app.vue

@@ -293,10 +293,10 @@ export default {
       this.filters = filters;
     },
     refetchIssuables() {
-      const ignored = ['utf8', 'state'];
+      const ignored = ['utf8'];
       const params = omit(this.filters, ignored);
 
-      historyPushState(setUrlParams(params, window.location.href, true));
+      historyPushState(setUrlParams(params, window.location.href, true, true));
       this.fetchIssuables();
     },
     handleFilter(filters) {

app/assets/javascripts/lib/utils/url_utility.js

@@ -344,9 +344,15 @@ export function objectToQuery(obj) {
  * @param {Object} params The query params to be set/updated
  * @param {String} url The url to be operated on
  * @param {Boolean} clearParams Indicates whether existing query params should be removed or not
+ * @param {Boolean} railsArraySyntax When enabled, changes the array syntax from `keys=` to `keys[]=` according to Rails conventions
  * @returns {String} A copy of the original with the updated query params
  */
-export const setUrlParams = (params, url = window.location.href, clearParams = false) => {
+export const setUrlParams = (
+  params,
+  url = window.location.href,
+  clearParams = false,
+  railsArraySyntax = false,
+) => {
   const urlObj = new URL(url);
   const queryString = urlObj.search;
   const searchParams = clearParams ? new URLSearchParams('') : new URLSearchParams(queryString);
@@ -355,11 +361,12 @@ export const setUrlParams = (params, url = window.location.href, clearParams = f
     if (params[key] === null || params[key] === undefined) {
       searchParams.delete(key);
     } else if (Array.isArray(params[key])) {
+      const keyName = railsArraySyntax ? `${key}[]` : key;
       params[key].forEach((val, idx) => {
         if (idx === 0) {
-          searchParams.set(key, val);
+          searchParams.set(keyName, val);
         } else {
-          searchParams.append(key, val);
+          searchParams.append(keyName, val);
         }
       });
     } else {

ee/app/controllers/projects/integrations/jira/issues_controller.rb

@@ -18,6 +18,8 @@ module Projects
         rescue_from ::Projects::Integrations::Jira::IssuesFinder::RequestError, with: :render_request_error
 
         def index
+          params[:state] = params[:state].presence || default_state
+
           respond_to do |format|
             format.html
             format.json do
@@ -46,7 +48,6 @@ module Projects
         end
 
         def finder_options
-          params[:state] = default_state if params[:state].blank?
           options = { sort: set_sort_order }
 
           # Used by view to highlight active option

ee/app/views/projects/integrations/jira/issues/_nav_btns.html.haml

-.nav-controls.issues-nav-controls.gl-my-5
-  = link_to @project.external_issue_tracker.new_issue_url, class: 'btn gl-button', target: '_blank', rel: 'noopener noreferrer' do
+.nav-controls.issues-nav-controls
+  = link_to @project.external_issue_tracker.new_issue_url, class: 'btn gl-button gl-align-self-start', target: '_blank', rel: 'noopener noreferrer' do
     = _('Create new issue in Jira')
     = sprite_icon('external-link', css_class: 'gl-ml-1')

ee/app/views/projects/integrations/jira/issues/index.html.haml

 - page_title _('Jira Issues')
 
-.top-area.gl-border-b-0.gl-justify-content-end
+.top-area.gl-border-b-0.gl-mt-6
+  = render 'shared/issuable/nav', type: :issues, display_count: false
   = render 'projects/integrations/jira/issues/nav_btns'
 
 .js-issuables-list{ data: { endpoint: expose_path(project_integrations_jira_issues_path(@project, format: :json)),

spec/frontend/lib/utils/url_utility_spec.js

@@ -595,6 +595,14 @@ describe('URL utility', () => {
       );
     });
 
+    it('handles arrays properly when railsArraySyntax=true', () => {
+      const url = 'https://gitlab.com/test';
+
+      expect(urlUtils.setUrlParams({ labels: ['foo', 'bar'] }, url, false, true)).toEqual(
+        'https://gitlab.com/test?labels%5B%5D=foo&labels%5B%5D=bar',
+      );
+    });
+
     it('removes all existing URL params and sets a new param when cleanParams=true', () => {
       const url = 'https://gitlab.com/test?group_id=gitlab-org&project_id=my-project';