Skip to content

feat(website): add community/official/all filter to collections overview#1273

Open
fhennig wants to merge 6 commits into
mainfrom
feat/collections-type-filter
Open

feat(website): add community/official/all filter to collections overview#1273
fhennig wants to merge 6 commits into
mainfrom
feat/collections-type-filter

Conversation

@fhennig

@fhennig fhennig commented Jun 11, 2026

Copy link
Copy Markdown
Contributor

Closes #1271

Summary

  • Adds a segmented control ([ Community ] [ Official ] [ All ]) to the collections overview page
  • Filtering is done client-side based on ownedBy; "Community" is the default, preserving current behavior
  • Adds getSystemUserId() to config.ts (returns 1 on staging, 3 on prod); called server-side in the Astro page and passed as a prop so it doesn't reach the browser

Screenshot

Screen.Recording.2026-06-11.at.13.45.12.mov

Test plan

  • Community filter shows only non-system-user collections
  • Official filter shows only system-user collections
  • All filter shows everything
  • Default on page load is Community
  • Browser spec passes

🤖 Generated with Claude Code

Adds a segmented control to the collections overview page so users can
filter by community submissions, official (GenSpectrum) collections, or
all. Filtering is done client-side based on ownedBy. The system user ID
is resolved server-side in the Astro page via a new getSystemUserId()
helper in config.ts and passed down as a prop.

Closes #1271

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@vercel

vercel Bot commented Jun 11, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
dashboards Ready Ready Preview, Comment Jun 11, 2026 12:15pm

Request Review

fhennig and others added 2 commits June 11, 2026 13:42
…trol

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@fhennig fhennig marked this pull request as ready for review June 11, 2026 11:53
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@fhennig

fhennig commented Jun 11, 2026

Copy link
Copy Markdown
Contributor Author

the test failure is unrelated. idea for a fix here: #1277

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Pull request overview

Adds a client-side segmented filter to the collections overview so users can switch between Community, Official, and All collections, using a centralized system-user ID to distinguish “Official” ownership.

Changes:

  • Passes a systemUserId value from the Astro page into the client component.
  • Removes backend-side excludeSystemCollections filtering and filters client-side by ownedBy.
  • Extends browser specs to cover default/community behavior and switching to Official/All.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.

File Description
website/src/pages/collections/[pathFragment]/index.astro Passes systemUserId into the collections overview component.
website/src/config.ts Adds getSystemUserId() helper for staging/prod system user IDs.
website/src/components/collections/overview/CollectionsOverview.tsx Implements client-side filtering and adds the segmented filter UI.
website/src/components/collections/overview/CollectionsOverview.browser.spec.tsx Updates/extends browser tests for the new filter behavior.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment on lines +111 to +133
return (
<div className='flex text-sm'>
{FILTER_OPTIONS.map((opt, i) => (
<Fragment key={opt.value}>
<input
type='radio'
id={`${id}-${opt.value}`}
name={id}
className='hidden'
checked={filter === opt.value}
onChange={() => onChange(opt.value)}
/>
<label
htmlFor={`${id}-${opt.value}`}
className={`tooltip w-24 cursor-pointer border p-2 text-center ${i === 0 ? 'rounded-l-md' : '-ml-px rounded-none'} ${i === FILTER_OPTIONS.length - 1 ? 'rounded-r-md' : ''} ${filter === opt.value ? 'border-primary relative z-10' : 'border-gray-300'}`}
data-tip={opt.tooltip}
>
{opt.label}
</label>
</Fragment>
))}
</div>
);

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Comment thread website/src/config.ts
Comment on lines +111 to +115
/* The system user gets created first by the backend, so if we ever re-create the staging DB, it will be 1
* (and is 1 at the moment as well). On prod, the system user is ID 3. */
export function getSystemUserId(): number {
return isStaging() ? 1 : 3;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Collections overview: filter by collection type (community vs. official)

3 participants