[OPIK-5582][FE]: add avatars to projects;#6043
Merged
Conversation
![baz-reviewer[bot]](https://avatars.githubusercontent.com/in/933528?s=60&v=4){kind=small}
apps/opik-frontend/src/v2/layout/SideBar/ProjectSelector/ProjectSelector.tsx
Outdated
Show resolved
Hide resolved
Comment on lines
+11
to
+22
| const { data } = useProjectsList({ | ||
| workspaceName, | ||
| sorting: [{ id: "created_at", desc: false }], | ||
| page: 1, | ||
| size: 1000, | ||
| queryKey: PROJECTS_ICONS_QUERY_KEY, | ||
| }); | ||
|
|
||
| return useMemo(() => { | ||
| if (!data?.content) return new Map<string, number>(); | ||
| return new Map(data.content.map((p, i) => [p.id, i % PROJECT_ICON_COUNT])); | ||
| }, [data?.content]); |
Contributor
There was a problem hiding this comment.
useProjectIconIndices only fetches the first 1000 projects so projects beyond that fall back to ?? 0 and render the default avatar — should we paginate or remove the 1000 cap so every project is added to the id→index map?
Finding type: Logical Bugs | Severity: 🔴 High
Want Baz to fix this for you? Activate Fixer
Other fix methods
Prompt for AI Agents:
Before applying, verify this suggestion against the current code. In
apps/opik-frontend/src/hooks/useProjectIconIndex.ts around lines 11 to 22, the
useProjectIconIndices hook currently calls useProjectsList with page: 1 and size: 1000
and then builds the id→index Map from only that single page. This omits any projects
beyond the first 1000. Refactor the hook to paginate through all project pages (or
remove the hard cap if the API supports unlimited results): repeatedly call/use the API
with incremental page numbers, accumulate all data.content entries until a page returns
fewer items than the requested size (or no content), then build and return the Map from
the full accumulated list. Ensure the query key/params remain stable and keep the
deterministic index calculation (i % PROJECT_ICON_COUNT).
Collaborator
Author
There was a problem hiding this comment.
that's good for now, no workspace has >1000 projects for now
awkoy
approved these changes
Apr 2, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Details
New files
Modified files
*ProjectSelector.tsx — redesigned trigger (owl + two-line layout), added robot icons to dropdown items, selected item styling (bg-primary-100, blue check), name underline on hover
*ProjectSidebarContent.tsx — added separator between project selector and menu items
*ProjectsPage.tsx — swapped TextCell for ProjectNameCell on the Name column
*AgentRunnerEmptyState.tsx — added owl icon next to "Connect your agent" heading
Change checklist
Issues
AI-WATERMARK
Testing
npm run lintnpm run typecheckDocumentation