From f68f8a7e268ded2c463e89143de94eb64c284395 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=A2=93=E5=AE=89?= <455454007@qq.com>
Date: Fri, 8 Sep 2023 11:09:29 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20Combination=20of=20Simple=20mode=20?=
 =?UTF-8?q?pagination=20along=20with=20page=20size=20changer=20(#530)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* ✨ Combination of Simple mode pagination along with page size changer

* Update tests/simple.test.js

Co-authored-by: afc163 <afc163@gmail.com>

* test✅:Update  should quick jump to expect page test

---------

Co-authored-by: afc163 <afc163@gmail.com>
---
 docs/examples/simple.tsx |  9 +++++++++
 src/Pagination.tsx       | 14 +++++++++++++-
 tests/jumper.test.js     |  3 +--
 tests/simple.test.js     | 36 ++++++++++++++++++++++++++++++++++++
 4 files changed, 59 insertions(+), 3 deletions(-)

diff --git a/docs/examples/simple.tsx b/docs/examples/simple.tsx
index aad3901b..31dc15b9 100644
--- a/docs/examples/simple.tsx
+++ b/docs/examples/simple.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
 import Pagination from 'rc-pagination';
+import Select from 'rc-select';
 import '../../assets/index.less';
 
 export default () => (
@@ -12,5 +13,13 @@ export default () => (
       total={50}
       showTotal={(total) => `Total ${total} items`}
     />
+    <br />
+    <Pagination
+      simple
+      defaultCurrent={1}
+      total={50}
+      showSizeChanger
+      selectComponentClass={Select}
+    />
   </>
 );
diff --git a/src/Pagination.tsx b/src/Pagination.tsx
index a448644e..8175b2af 100644
--- a/src/Pagination.tsx
+++ b/src/Pagination.tsx
@@ -590,7 +590,19 @@ class Pagination extends React.Component<PaginationProps, PaginationState> {
           >
             {this.renderNext(nextPage)}
           </li>
-          {gotoButton}
+          <Options
+            disabled={disabled}
+            locale={locale}
+            rootPrefixCls={prefixCls}
+            selectComponentClass={selectComponentClass}
+            selectPrefixCls={selectPrefixCls}
+            changeSize={this.getShowSizeChanger() ? this.changePageSize : null}
+            current={current}
+            pageSize={pageSize}
+            pageSizeOptions={pageSizeOptions}
+            quickGo={this.shouldDisplayQuickJumper() ? this.handleChange : null}
+            goButton={gotoButton}
+          />
         </ul>
       );
     }
diff --git a/tests/jumper.test.js b/tests/jumper.test.js
index 85529067..7dbc1f03 100644
--- a/tests/jumper.test.js
+++ b/tests/jumper.test.js
@@ -1,4 +1,3 @@
-import React from 'react';
 import { mount } from 'enzyme';
 import Pagination from '../src';
 
@@ -99,7 +98,7 @@ describe('simple quick jumper', () => {
   });
 
   it('should quick jump to expect page', () => {
-    const quickJumper = wrapper.find('.rc-pagination-simple');
+    const quickJumper = wrapper.find('.rc-pagination-options-quick-jumper');
     const input = quickJumper.find('input');
     const goButton = quickJumper.find('.go-button');
     input.simulate('change', { target: { value: '2' } });
diff --git a/tests/simple.test.js b/tests/simple.test.js
index fb77d927..00fce9d8 100644
--- a/tests/simple.test.js
+++ b/tests/simple.test.js
@@ -1,5 +1,6 @@
 import React, { useState } from 'react';
 import { mount } from 'enzyme';
+import Select from 'rc-select';
 import Pagination from '../src';
 
 describe('simple Pagination', () => {
@@ -84,4 +85,39 @@ describe('simple Pagination', () => {
     expect(input.getDOMNode().value).toBe('3');
     expect(component.state().current).toBe(3);
   });
+
+  it('should merge custom pageSize to pageSizeOptions', () => {
+    const wrapper = mount(
+      <Pagination
+        simple
+        total={500}
+        pageSize={15}
+        showSizeChanger
+        selectComponentClass={Select}
+      />,
+    );
+    wrapper.find(Select).find('input').simulate('mousedown');
+    expect(wrapper.find(Select).find('.rc-select-item').length).toBe(5);
+  });
+
+  it('should onChange called when pageSize change', () => {
+    const onChange = jest.fn();
+    const wrapper = mount(
+      <Pagination
+        simple
+        selectComponentClass={Select}
+        onChange={onChange}
+        total={500}
+        defaultPageSize={20}
+      />,
+    );
+    wrapper.find(Select).find('input').simulate('mousedown');
+    expect(wrapper.find(Select).find('.rc-select-item').at(2).text()).toBe(
+      '50 条/页',
+    );
+    const pageSize1 = wrapper.find(Select).find('.rc-select-item').at(0);
+    pageSize1.simulate('click');
+    expect(onChange).toBeCalled();
+    expect(onChange).toHaveBeenLastCalledWith(1, 10);
+  });
 });