feat: projects page improvements for cloud editing support

[AdityaHegde]

Improves projects page by integrating the new toolbar. Clicking edit will always open the edit branch modal.

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!

[ericokuma]

Product UXQA:

1. Make sure to display the "Create from main/edit existing branch" modal when Edit is clicked (also make sure that Edit is only visible to Admin and Editor roles)

Design nits/feedback (FYI @Di7design)

1. The Filter Clear all button feels really really far from the Filters.

2. When I have less than 4 cards, it looks like the search, sort, and new project buttons are just floating

3. I find it a bit annoying that I had to click to expand the search field. Can we just have an always expanded search field? Also found it odd that it's all the way to the right. Most orgs won't have more than 2-3 projects so placing most of the action buttons all the way to the right feels a bit off

4. With the Sort design, I couldn't tell if the sort was displaying the current sort order or what the sort order would be if i clicked it. Mostly because the cards don't have dates on them so I have no idea what it's sorting.

Suggestions:

1. Always-visible search field
   Change: Remove click-to-expand. Render a permanent 240–260px search input.
   Why: Hiding search behind an icon adds a click without saving meaningful space. Also matches the always-on pattern used elsewhere in Rill.

2. Left-align all controls into one group
   Change: Replace justify-between with justify-start + consistent gap. Filter, Search, Sort sit together on the left; "New project" stays right-aligned as the primary action.
   Why: justify-between makes sense for dense tables but creates "floating controls" when the card grid is sparse. Grouping the controls reads as a single control strip rather than orphaned widgets.

3. "Clear all" adjacent to filter chips
   Change: Move "Clear all" to sit immediately after the last chip in the same flex row, not pushed to the far right edge.
   Why: Currently the button is ~1000px away from the chip it operates on. Proximity is the visual cue that they're related.

4. Sort as labeled dropdown with checkmark
   Change: Replace the toggle button (Newest ⇅) with a dropdown labeled Sort: Newest first ▾. Show a ✓ next to the active option. Perhaps we should also have sorting for Name ASC and DESC too
   Why: The current toggle is ambiguous — "Newest" could mean current state or pending action. The Sort: prefix labels the value; the checkmark confirms the active state.

5. Drop the slide transition on the filter chips row
   Change: Keep the row hidden when empty (don't reserve space), but remove the slide animation. Cards just appear/disappear.
   Why: The shift itself is fine — it's predictable, and reserving permanent empty space looks broken. The slide animation is what makes the jump feel jarring; an instant change perhaps reads as cleaner.

[AdityaHegde]

Thanks @ericokuma . We need the edit modal before we can show that. Will be in a separate PR.

All the design feedback are on the TableToolbar that was in #9173 . So lets take that separately. Probably worth revisiting it for card view and when they are 1-2 cards (this will probably be for most orgs).

[notion-workspace]

“Create New” button appears on all project list page regardless of permissions

[ericokuma]

LGTM.

One thing to change:

When no matches for filter applied or search applied, the message should be updated from "This organization has no projects yet" to "No matching projects found"

[ericokuma]

see above

[ericpgreen2]

Following up on @ericokuma's earlier review — his feedback raised the same toolbar concerns I had (sort ambiguity, click-to-expand search, floating controls when sparse), and I appreciate the framing of taking those to #9173.

Two proposed changes for this PR:

1. Implement the card layout from the latest Figma mocks rather than extending the existing card. The current card was designed for a much simpler payload (name + permission tag), and this PR adds status, actions, and (existing) public/private state to its corners without rethinking the layout. The result is four pieces of metadata orbiting a centered title, with the brand-purple "Ready" chip outweighing the project name visually. The Figma redesign (header row with status + permission + actions, title block, footer with visibility + date) handles this payload much better and reads as the right next step — recommend landing it here instead of an intermediate state.

2. Drop the new toolbar from the projects page for now. The redesigned toolbar in the latest mocks is a meaningful step up from the one in this PR, and shipping the current toolbar in the meantime risks an awkward intermediate state — particularly for orgs with only one project, which is the most common case and where the floating controls look the most off. Better to wait for the redesigned toolbar to land than to ship two iterations of it in quick succession.

A few smaller items worth picking up regardless of the above:

• "Ready" renders in the brand purple (Chip type="dimension" → primary-50/200/800), which makes the status chip more prominent than the project name. Purple is also unconventional for a healthy state — green is the universal expectation (GitHub, Vercel, Netlify, Linear). Worth using a less saturated treatment, or a different chip variant.
• Card.svelte toggles the actions menu on onmouseenter / onmouseleave only, so keyboard users tabbing through cards can't reach the three-dot menu. :focus-within or onfocusin / onfocusout would close that gap.
• ProjectNameSettings.svelte:16 has a leftover console.log(newProject, project).

---

Developed in collaboration with Claude Code

[ericokuma]

If it helps, I have this PR that addresses the toobar issues: #9367

[ericokuma]

@ericpgreen2, can we address your feedback in a separate PR? Move this one forward so that at least we can have the edit button available on main to test E2E flow?