Fixed pagination in projects & snippets on user page
Changed it from being json links to normal links & then doing a AJAX request to get the content. Closes #29624
This commit is contained in:
		
							parent
							
								
									4bf4612cfb
								
							
						
					
					
						commit
						652d80458a
					
				| 
						 | 
					@ -1,4 +1,4 @@
 | 
				
			||||||
/* eslint-disable max-len, space-before-function-paren, no-underscore-dangle, consistent-return, comma-dangle, no-unused-vars, dot-notation, no-new, no-return-assign, camelcase, no-param-reassign */
 | 
					/* eslint-disable max-len, space-before-function-paren, no-underscore-dangle, consistent-return, comma-dangle, no-unused-vars, dot-notation, no-new, no-return-assign, camelcase, no-param-reassign, class-methods-use-this */
 | 
				
			||||||
 | 
					
 | 
				
			||||||
/*
 | 
					/*
 | 
				
			||||||
UserTabs
 | 
					UserTabs
 | 
				
			||||||
| 
						 | 
					@ -82,8 +82,19 @@ content on the Users#show page.
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    bindEvents() {
 | 
					    bindEvents() {
 | 
				
			||||||
      return this.$parentEl.off('shown.bs.tab', '.nav-links a[data-toggle="tab"]')
 | 
					      this.changeProjectsPageWrapper = this.changeProjectsPage.bind(this);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      this.$parentEl.off('shown.bs.tab', '.nav-links a[data-toggle="tab"]')
 | 
				
			||||||
        .on('shown.bs.tab', '.nav-links a[data-toggle="tab"]', event => this.tabShown(event));
 | 
					        .on('shown.bs.tab', '.nav-links a[data-toggle="tab"]', event => this.tabShown(event));
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      this.$parentEl.on('click', '.gl-pagination a', this.changeProjectsPageWrapper);
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    changeProjectsPage(e) {
 | 
				
			||||||
 | 
					      e.preventDefault();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      $('.tab-pane.active').empty();
 | 
				
			||||||
 | 
					      this.loadTab($(e.target).attr('href'), this.getCurrentAction());
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    tabShown(event) {
 | 
					    tabShown(event) {
 | 
				
			||||||
| 
						 | 
					@ -119,7 +130,7 @@ content on the Users#show page.
 | 
				
			||||||
        complete: () => this.toggleLoading(false),
 | 
					        complete: () => this.toggleLoading(false),
 | 
				
			||||||
        dataType: 'json',
 | 
					        dataType: 'json',
 | 
				
			||||||
        type: 'GET',
 | 
					        type: 'GET',
 | 
				
			||||||
        url: `${source}.json`,
 | 
					        url: source,
 | 
				
			||||||
        success: (data) => {
 | 
					        success: (data) => {
 | 
				
			||||||
          const tabSelector = `div#${action}`;
 | 
					          const tabSelector = `div#${action}`;
 | 
				
			||||||
          this.$parentEl.find(tabSelector).html(data.html);
 | 
					          this.$parentEl.find(tabSelector).html(data.html);
 | 
				
			||||||
| 
						 | 
					@ -153,6 +164,10 @@ content on the Users#show page.
 | 
				
			||||||
      }, document.title, new_state);
 | 
					      }, document.title, new_state);
 | 
				
			||||||
      return new_state;
 | 
					      return new_state;
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    getCurrentAction() {
 | 
				
			||||||
 | 
					      return this.$parentEl.find('.nav-links .active a').data('action');
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
  global.UserTabs = UserTabs;
 | 
					  global.UserTabs = UserTabs;
 | 
				
			||||||
})(window.gl || (window.gl = {}));
 | 
					})(window.gl || (window.gl = {}));
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -39,7 +39,7 @@ class UsersController < ApplicationController
 | 
				
			||||||
      format.html { render 'show' }
 | 
					      format.html { render 'show' }
 | 
				
			||||||
      format.json do
 | 
					      format.json do
 | 
				
			||||||
        render json: {
 | 
					        render json: {
 | 
				
			||||||
          html: view_to_html_string("shared/projects/_list", projects: @projects, remote: true)
 | 
					          html: view_to_html_string("shared/projects/_list", projects: @projects)
 | 
				
			||||||
        }
 | 
					        }
 | 
				
			||||||
      end
 | 
					      end
 | 
				
			||||||
    end
 | 
					    end
 | 
				
			||||||
| 
						 | 
					@ -65,7 +65,7 @@ class UsersController < ApplicationController
 | 
				
			||||||
      format.html { render 'show' }
 | 
					      format.html { render 'show' }
 | 
				
			||||||
      format.json do
 | 
					      format.json do
 | 
				
			||||||
        render json: {
 | 
					        render json: {
 | 
				
			||||||
          html: view_to_html_string("snippets/_snippets", collection: @snippets, remote: true)
 | 
					          html: view_to_html_string("snippets/_snippets", collection: @snippets)
 | 
				
			||||||
        }
 | 
					        }
 | 
				
			||||||
      end
 | 
					      end
 | 
				
			||||||
    end
 | 
					    end
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -0,0 +1,31 @@
 | 
				
			||||||
 | 
					require 'spec_helper'
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					describe 'Projects tab on a user profile', :feature, :js do
 | 
				
			||||||
 | 
					  include WaitForAjax
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  let(:user) { create(:user) }
 | 
				
			||||||
 | 
					  let!(:project) { create(:empty_project, namespace: user.namespace) }
 | 
				
			||||||
 | 
					  let!(:project2) { create(:empty_project, namespace: user.namespace) }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  before do
 | 
				
			||||||
 | 
					    allow(Project).to receive(:default_per_page).and_return(1)
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    login_as(user)
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    visit user_path(user)
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    page.within('.user-profile-nav') do
 | 
				
			||||||
 | 
					      click_link('Personal projects')
 | 
				
			||||||
 | 
					    end
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    wait_for_ajax
 | 
				
			||||||
 | 
					  end
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  it 'paginates results' do
 | 
				
			||||||
 | 
					    expect(page).to have_content(project2.name)
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    click_link('Next')
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    expect(page).to have_content(project.name)
 | 
				
			||||||
 | 
					  end
 | 
				
			||||||
 | 
					end
 | 
				
			||||||
		Loading…
	
		Reference in New Issue