Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[UI v2] Variables table - part 2 #16025

Merged
merged 5 commits into from
Nov 15, 2024
Merged

[UI v2] Variables table - part 2 #16025

merged 5 commits into from
Nov 15, 2024

Conversation

desertaxle
Copy link
Member

@desertaxle desertaxle commented Nov 15, 2024

This PR finishes up the variables table by adding filtering, page size selection, and sorting to the table. This PR also refactors the TagsInput component slightly to fit into the table filtering layout a little better.

Here are some of the changes in action:
variables-table-2

Related to #15512

@desertaxle desertaxle added the development Tech debt, refactors, CI, tests, and other related work. label Nov 15, 2024
@desertaxle desertaxle marked this pull request as ready for review November 15, 2024 01:57
ui-v2/src/components/variables/data-table/data-table.tsx Outdated Show resolved Hide resolved
Comment on lines +154 to +160
<div>
<div className="grid sm:grid-cols-2 md:grid-cols-6 lg:grid-cols-12 gap-2 pb-4 items-center">
<div className="sm:col-span-2 md:col-span-6 lg:col-span-4 order-last lg:order-first">
<p className="text-sm text-muted-foreground">
{currentVariableCount} Variables
</p>
</div>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see the CREATE action is in the parent component, but the filtering fields are colocated with the table itself. This is totally fine, but how are you thinking about that in general?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The filters feel more related to the table than the parent component since I can't imagine a scenario where you'd want the table without the filters, but I'm open to changing this layout as we build more.

}) => {
columnFilters,
onColumnFiltersChange,
searchDebounceMs = 500,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

let's keep this south of ~200-250ms

https://en.wikipedia.org/wiki/Input_lag

@desertaxle desertaxle merged commit c87003f into main Nov 15, 2024
7 checks passed
@desertaxle desertaxle deleted the ui-v2-variables-list-2 branch November 15, 2024 22:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
development Tech debt, refactors, CI, tests, and other related work.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants