670 component order limiter

[henrypalacios]

Summary

Closes #670

• Create a reusable component, and a storybook of it.
• Use a component in top tab header.
• Pass limit filter to table when selecting a value.

To Test

1. Go to https://pr686--gpui.review.gnosisdev.com/rinkeby/address/0xb6BAd41ae76A11D10f7b0E664C5007b908bC77C9/
2. Storybook Dropdown componenteUI

[github-actions]

• 🔭 Explorer: Explorer test app
• 🔒 Safe Swap App: Trade test app (add to your safe apps)
• 📈 Trade: Trade test app
• 📚 Storybook: Component stories

[henrypalacios]

@alfetopito
The Dropdown component could go in src/comonents/common/Dropdown, WDYT?

What do you think about these options [10, 20, 30, 50] in the paging selector?

[alfetopito]

I think you went a bit overboard here and added stuff we'll probably not need, but good to have anyway :)

About the storybook, when I pick something from the dropdown the selection doesn't change... 🤷 not a big deal if takes too long to fix

About the real table, add some padding/margin on the right. The dropdown glued to the border

Some minor comments/questions below.

Great job!

[anxolin]

Not necessarily for this PR, but if we are adding this control, should we add it also to the query params when you change the default page size?

[henrypalacios]

@anxolin You mean if I had the limiter set to 20 and I change the screen size we should adjust the limiter pageSize selected according to the new size of the screen.

[alongoni]

Looks great!

Nice to have / UX improvement:
When the arrows are implemented, we should duplicate the component at the end of the order list.

[alfetopito]

@anxolin You mean if I had the limiter set to 20 and I change the screen size we should adjust the limiter pageSize selected according to the new size of the screen.

Not quite. I believe he meant to update the URL with the preferred page size, in case for example if we reflect user's selection in the URL, so it's shareable: .../address/0x..../?pageSize=20

But as Anxo said, not for now.
We can keep this in mind for later.

[alfetopito]

LGTM, only minor comments

[anxolin]

Not quite. I believe he meant to update the URL with the preferred page size, in case for example if we reflect user's > selection in the URL, so it's shareable: .../address/0x..../?pageSize=20
But as Anxo said, not for now.
We can keep this in mind for later.

Yep, exactly as Leandro said. All good. Thanks