Create paginator component #3195

CarolineDenis · 2023-03-16T18:08:33Z

CarolineDenis · 2023-03-17T13:02:35Z

Tests are failing because Paginator component is called by RecordSetsDialog. The props in RecordSetsDialog have been modified, need to add those new props in other places where the component is called. (Not just in RecordSetsOverlay)

specifyweb/frontend/js_src/lib/components/Toolbar/RecordSets.tsx

Fixes #1398

specifyweb/frontend/js_src/lib/components/Molecules/Paginator.tsx

Shift burden of responsibility to the hook, from the component. Since the hook is going to be called in many places, that will result in reduction of code.

Fixes https://github.com/specify/specify7/pull/3195/files#r1140301202

Because default value for sort config was a new object that was created on each render

@CarolineDenis

@CarolineDenis I had to remove the min-w from <select> as it was causing issues in many places. Instead, you should add it back only for small screens, and only in places where it was necessary

maxpatiiuk

@CarolineDenis please review the changes I did.
Changed this branch to be based on xml-editor since record sets code was simplified there.

928be8b - Moved most of the code and states into usePaginator() so that the places using it have very little stuff left to do
08bb7ba - Fixed the bug with record sets not being sorted properly
1ec1f25 - Fixed page size selector being too wide
bf23b48 - Made usePaginator() remember the page size user selected last time

maxpatiiuk · 2023-03-17T15:10:03Z

Note tests are failing because I need to fix them on xml-editor branch. If the behavior in the UI is correct, this should be merged despite failing tests (or wait for me to fix them on xml-editor)

maxpatiiuk · 2023-03-17T15:11:05Z

@CarolineDenis either here, or after this is merged on a new branch, can you add a paginator to the queries dialog?

Then look though specify to identify other places that could use a paginator

maxpatiiuk · 2023-03-17T15:11:43Z

@specify/ux-testing the loading dialog that appears whenever you change page or page size is too obtrusive. We have a bug to incrementally fix that across specify - #2998

Fixes #1398

chanulee1

Should paginator be locked in place?

pEqMxvLOrs.mp4

https://sdnhmpaleo33123-issue-1398.test.specifysystems.org/specify/overlay/record-sets/

It should have been removed, but probably was resurected by a git merge

There was conflict between "fields", the relationship in the SpQuery table, and "fields" the property of the /api/specify_rows/ endpoint

Triggered by 0360179 on branch refs/heads/issue-1398

maxpatiiuk

nothing major. looking good

specifyweb/frontend/js_src/lib/components/Forms/ResourceView.tsx

specifyweb/frontend/js_src/lib/components/Molecules/Dialog.tsx

specifyweb/frontend/js_src/lib/components/Toolbar/Query.tsx

chanulee1

Paginator also not locked in place in Create Loan dialog.

dJl2cS7e5F.mp4

https://sdnhmpaleo33123-issue-1398.test.specifysystems.org/specify/overlay/interactions/create/Loan/

chanulee1 · 2023-04-25T16:31:43Z

Other than that, looks good. Tested record set list, query list, and record set list in create loan dialog. Is there any other place I missed?

CarolineDenis · 2023-04-25T21:33:08Z

Paginator also not locked in place in Create Loan dialog.

dJl2cS7e5F.mp4

https://sdnhmpaleo33123-issue-1398.test.specifysystems.org/specify/overlay/interactions/create/Loan/

but was elsewhere?

chanulee1 · 2023-04-26T17:51:08Z

Paginator also not locked in place in Create Loan dialog.
dJl2cS7e5F.mp4
https://sdnhmpaleo33123-issue-1398.test.specifysystems.org/specify/overlay/interactions/create/Loan/

but was elsewhere?

Yes, it was locked in place on the query list and record set list dialogs but not the Create Loan dialog.

L3sUt2oD1b.mp4

So that long numbers are not hidden behind numeric field arrows when typing them

Make them stick to the bottom of the dialog

Triggered by b397f5a on branch refs/heads/issue-1398

chanulee1

Looks good!

CarolineDenis requested a review from maxpatiiuk March 16, 2023 18:08

CarolineDenis marked this pull request as draft March 16, 2023 18:19

maxpatiiuk reviewed Mar 17, 2023

View reviewed changes

specifyweb/frontend/js_src/lib/components/Toolbar/RecordSets.tsx Outdated Show resolved Hide resolved

CarolineDenis added 2 commits March 17, 2023 09:22

Create paginator component

c703170

Fixes #1398

Move Paginator component to molecule and delete uncessary libraries

44ac47a

Fixes #1398

maxpatiiuk reviewed Mar 17, 2023

View reviewed changes

specifyweb/frontend/js_src/lib/components/Molecules/Paginator.tsx Outdated Show resolved Hide resolved

maxpatiiuk added 4 commits March 17, 2023 09:33

Simplify usage of usePaginator()

928be8b

Shift burden of responsibility to the hook, from the component. Since the hook is going to be called in many places, that will result in reduction of code.

Sort Record Sets on the back-end

08bb7ba

Fixes https://github.com/specify/specify7/pull/3195/files#r1140301202

Fix sort config causing infinite fetch loop

5cfa38e

Because default value for sort config was a new object that was created on each render

Fix wrong sizing for the paginator <select>

1ec1f25

@CarolineDenis I had to remove the min-w from <select> as it was causing issues in many places. Instead, you should add it back only for small screens, and only in places where it was necessary

maxpatiiuk force-pushed the issue-1398 branch from 7da5f1a to 6f9b9a9 Compare March 17, 2023 15:06

Remember user's page size preference

bf23b48

maxpatiiuk force-pushed the issue-1398 branch from 6f9b9a9 to bf23b48 Compare March 17, 2023 15:08

maxpatiiuk approved these changes Mar 17, 2023

View reviewed changes

maxpatiiuk changed the base branch from production to xml-editor March 17, 2023 15:09

maxpatiiuk requested a review from a team March 17, 2023 15:10

maxpatiiuk marked this pull request as ready for review March 17, 2023 15:10

Implement pagination in Query overlay and refactor it

88137e7

Fixes #1398

chanulee1 suggested changes Apr 13, 2023

View reviewed changes

maxpatiiuk and others added 5 commits April 19, 2023 09:30

Delete duplicate file

05a0c4a

It should have been removed, but probably was resurected by a git merge

Fix wrong typing for fetchRows

93babd6

There was conflict between "fields", the relationship in the SpQuery table, and "fields" the property of the /api/specify_rows/ endpoint

Merge remote-tracking branch 'origin/xml-editor' into issue-1398

0360179

Lint code with ESLint and Prettier

3f73d6c

Triggered by 0360179 on branch refs/heads/issue-1398

Fix dialog size when navigating between pages in RecordSets overlay

d0f8a15

CarolineDenis marked this pull request as draft April 20, 2023 15:56

Fix the size of dialog when changing page in Query Overlay

62147ef

CarolineDenis added 2 commits April 20, 2023 09:23

Remove unnecessary import

0d08ab3

Remove full-height from ResourceView Dialog

edb9802

CarolineDenis marked this pull request as ready for review April 20, 2023 19:54

CarolineDenis requested a review from chanulee1 April 20, 2023 19:54

maxpatiiuk requested changes Apr 21, 2023

View reviewed changes

Simplify code

2032722

CarolineDenis requested a review from maxpatiiuk April 21, 2023 15:51

maxpatiiuk added 2 commits April 21, 2023 14:20

Fix failing test

e9aed7f

Provide simple mock for resize observer

17d5982

maxpatiiuk approved these changes Apr 21, 2023

View reviewed changes

chanulee1 suggested changes Apr 25, 2023

View reviewed changes

maxpatiiuk added 4 commits April 27, 2023 10:55

Work arround DevTools UX issue

0e47c2b

Always apply padding right to numeric fields

73cc56a

So that long numbers are not hidden behind numeric field arrows when typing them

Fix slider positioning in Interactions Dialog

b397f5a

Make them stick to the bottom of the dialog

Lint code with ESLint and Prettier

4763ca4

Triggered by b397f5a on branch refs/heads/issue-1398

CarolineDenis requested a review from chanulee1 May 2, 2023 19:00

CarolineDenis added 2 commits May 3, 2023 10:24

Merge branch 'xml-editor' into issue-1398

c428f14

Fix failing tests

949a08a

chanulee1 approved these changes May 3, 2023

View reviewed changes

CarolineDenis merged commit fb69938 into xml-editor May 3, 2023

CarolineDenis deleted the issue-1398 branch May 3, 2023 18:31

CarolineDenis linked an issue Aug 30, 2023 that may be closed by this pull request

Add a react virtual scrolling library #1761

Closed

grantfitzsimmons mentioned this pull request Aug 30, 2023

Add a react virtual scrolling library #1761

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Create paginator component #3195

Create paginator component #3195

CarolineDenis commented Mar 16, 2023

CarolineDenis commented Mar 17, 2023

maxpatiiuk left a comment

maxpatiiuk commented Mar 17, 2023

maxpatiiuk commented Mar 17, 2023

maxpatiiuk commented Mar 17, 2023

chanulee1 left a comment •

edited

Loading

maxpatiiuk left a comment

chanulee1 left a comment

chanulee1 commented Apr 25, 2023

CarolineDenis commented Apr 25, 2023

chanulee1 commented Apr 26, 2023

chanulee1 left a comment

Create paginator component #3195

Create paginator component #3195

Conversation

CarolineDenis commented Mar 16, 2023

CarolineDenis commented Mar 17, 2023

maxpatiiuk left a comment

Choose a reason for hiding this comment

maxpatiiuk commented Mar 17, 2023

maxpatiiuk commented Mar 17, 2023

maxpatiiuk commented Mar 17, 2023

chanulee1 left a comment • edited Loading

Choose a reason for hiding this comment

maxpatiiuk left a comment

Choose a reason for hiding this comment

chanulee1 left a comment

Choose a reason for hiding this comment

chanulee1 commented Apr 25, 2023

CarolineDenis commented Apr 25, 2023

chanulee1 commented Apr 26, 2023

chanulee1 left a comment

Choose a reason for hiding this comment

chanulee1 left a comment •

edited

Loading