design: Improve TableToolbar layout and styling

[ericokuma]

Improves the shared TableToolbar component and projects page to match the updated Figma design:

• Rearranges toolbar layout: Filter + Sort grouped on the left, always-visible Search (flex-1) in the center, view toggle + action buttons on the right
• Replaces the Sort toggle with a dropdown supporting Newest, Oldest, A-Z, and Z-A options
• Adds bordered button styling to Filter and Sort buttons with accent state when filters are active
• Styles the applied filters row with a subtle gray background (bg-surface-subtle) and rounded bottom corners
• Adds status filtering, A-Z/Z-A name sorting, view toggle, and "New project" button to the projects page toolbar

Follows up on #9173

Figma: https://www.figma.com/design/JtG3sbaopjO0xQlyeCjmho/RILL-WIP?node-id=7699-201332&m=dev

Checklist:

• Covered by tests
• Ran it and it works as intended
• Reviewed the diff before requesting a review
• Checked for unhandled edge cases
• Linked the issues it closes
• Checked if the docs need to be updated. If so, create a separate Linear DOCS issue
• Intend to cherry-pick into the release branch
• I'm proud of this work!

---

Developed in collaboration with Claude Code

[ericpgreen2]

My 2c: I think this is an improvement – it's much better that the controls don't float in empty space – but IMO the toolbar feels large and domineering. ~1% of users (mainly Rill employees) will have enough projects to justify needing these controls, so I don't think the controls should feel so prominent. But, yes, we also have to operate within our existing design system. Thoughts on removing these controls from the list-of-projects page for now?

[ericokuma]

I’m fine with that although without it, the “new project” just floats on the page and looks weird

…

On Mon, May 4, 2026 at 12:04 PM Eric P Green ***@***.***> wrote: *ericpgreen2* left a comment (rilldata/rill#9367) <#9367 (comment)> My 2c: I think this is an improvement – it's much better that the controls don't float in empty space – but IMO the toolbar feels large and domineering. ~1% of users (mainly Rill employees) will have enough projects to justify needing these controls, so I don't think the controls should feel so prominent. But, yes, we also have to operate within our existing design system. Thoughts on removing these controls from the list-of-projects page for now? — Reply to this email directly, view it on GitHub <#9367 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/BIKBUEBLCEWQ57RILAZ4CNL4ZDSURAVCNFSM6AAAAACYN5XJOKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHM2DGNZTG4YTSOBZHA> . Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub>. You are receiving this because you authored the thread.Message ID: ***@***.***>