feat(ui): cut the organizations page over to the /ui/organizations path route

[ryan-crabbe-berri]

Relevant issues

Part of the App Router migration: page-by-page cutover from the legacy ?page= switch to path routes.

Linear ticket

Refs LIT-3687

Pre-Submission checklist

Please complete all items before asking a LiteLLM maintainer to review your PR

• I have added meaningful tests
• My PR passes all unit tests on make test-unit
• My PR's scope is as isolated as possible; it only solves 1 specific problem
• I have requested a Greptile review by commenting @greptileai and received a Confidence Score of at least 4/5 before requesting a maintainer review

Screenshots / Proof of Fix

With the dev stack running (litellm --config ... --port 4000 plus npm run dev in ui/litellm-dashboard), log in at http://localhost:4000/ui once, then:

1. Go to http://localhost:3000/organizations; the organizations table renders (requires a premium/enterprise license, otherwise the upsell text shows)
2. Filter by Organization ID or alias; the table narrows as you type and Reset restores the full list
3. Create an organization; the table refreshes with the new row. Delete it; the row disappears
4. Go to http://localhost:3000/?page=organizations; it redirects to /organizations (old bookmarks keep working)
5. Click "Organizations" in the sidebar; the URL is the path route and the item stays highlighted after a hard refresh

Type

🆕 New Feature

Changes

Same recipe as the previous batches, with one structural improvement: instead of threading lifted state through wrapper props, OrganizationsTable now owns its data via React Query hooks, which is the direction we want all panels to converge on.

Concretely: the organizations/setOrganizations prop pair is gone. The component calls useOrganizations, which gains optional org_id/org_alias filters (backwards compatible; the unfiltered call keeps its existing cache key, and empty-string filters normalize to the unfiltered key). Filter changes refetch through the query key instead of imperatively calling organizationListCall into a parent setter, and create/delete invalidate the organizations list queries. The userModels prop is replaced by a new useUserModels hook that wraps modelAvailableCall and maps the response to model ids, matching what the shell's fetchUserModels did. The dead currentOrg and guardrailsList props (destructured but never used or passed) are deleted.

The wrapper at app/(dashboard)/organizations/page.tsx passes only userRole, accessToken, and premiumUser from useAuthorized. The organizations entry is added to MIGRATED_PAGES and the e2e fixture, and the switch arm comes out of the legacy shell. The shell keeps its own fetchOrganizations call since the teams and api-keys arms still read the lifted organizations state; the shell's userModels state had no other readers and is deleted.

Pre-existing quirk left alone for scope: the refresh icon in the tab header is wired to an optional handleRefreshClick prop that no renderer has ever passed, so it has always been a no-op. Now that the component owns its query, a follow-up could point it at the list invalidation.

[greptile-apps]

Greptile Summary

This PR migrates the Organizations page from the legacy ?page=organizations switch-case to its own App Router path route at /ui/organizations, following the same recipe used for previous page cutovers. The structural improvement on top of the recipe is that OrganizationsTable now owns its own data: the organizations/setOrganizations prop pair is replaced by useOrganizations (which gains optional org_id/org_alias filters with correct empty-string normalization), and userModels is replaced by a new useUserModels hook.

• useOrganizations normalizes empty-string filters to null, producing the unfiltered cache key ({}) so reset works transparently through React Query rather than an imperative re-fetch. useOrganization.initialData is upgraded to search all list cache variants via getQueriesData, resolving the filtered-only-session initialData gap called out in a previous review.
• Create and delete mutations call queryClient.invalidateQueries({ queryKey: organizationKeys.lists() }), which correctly covers both filtered and unfiltered list cache entries.
• The legacy shell keeps its own fetchOrganizations call because the teams/api-keys arms still consume lifted organizations state; the dead userModels state (no other readers) is cleaned up.

Confidence Score: 5/5

The change is a well-scoped page migration; the existing switch-arm is removed cleanly, the new route wrapper is minimal, and all data paths are covered by updated unit tests.

All changed paths (create, delete, filter, reset, redirect) behave correctly. Filter normalization, cache key construction, and cross-cache initialData lookup are all consistent and tested. No regressions introduced in the legacy shell.

No files require special attention.

Important Files Changed

Filename	Overview
ui/litellm-dashboard/src/app/(dashboard)/organizations/page.tsx	New route wrapper that delegates to OrganizationsTable with only the three props it now needs; clean and minimal.
ui/litellm-dashboard/src/components/organizations.tsx	Props slimmed to userRole/accessToken/premiumUser; data ownership moved to useOrganizations + useUserModels; create/delete invalidate via queryClient.invalidateQueries. Logic is correct.
ui/litellm-dashboard/src/app/(dashboard)/hooks/organizations/useOrganizations.ts	Adds optional org_id/org_alias filters with correct empty-string normalization; useOrganization.initialData now searches all list cache variants via getQueriesData.
ui/litellm-dashboard/src/app/(dashboard)/hooks/models/useModels.ts	Adds useUserModels hook backed by a separate userModelsKeys cache entry; maps modelAvailableCall response to id strings. Separate key is intentional as noted in a previous review thread.
ui/litellm-dashboard/src/app/(dashboard)/page.tsx	Removes the organizations switch-arm and userModels state/fetch; fetchOrganizations import kept because teams/api-keys arms still need lifted state. Correct.
ui/litellm-dashboard/src/app/(dashboard)/hooks/organizations/useOrganizations.test.ts	Tests updated to assert null-normalized filter args; new tests cover filtered caching, empty-string normalization, and useOrganization's cross-cache initialData fallback.
ui/litellm-dashboard/src/app/(dashboard)/hooks/models/useModels.test.ts	Adds useUserModels tests covering the id-mapping path and the disabled-when-unauthenticated path; existing tests unchanged.
ui/litellm-dashboard/src/components/organizations.test.tsx	Wraps render in QueryClientProvider and removes now-deleted props; mock for useAuthorized added to prevent network calls in the test. Correct updates.
ui/litellm-dashboard/src/utils/migratedPages.ts	Adds organizations → "organizations" entry to MIGRATED_PAGES so legacy ?page=organizations redirects to the path route.
ui/litellm-dashboard/src/utils/migratedPages.test.ts	Adds a test asserting the organizations key maps to its route segment; follows the pattern of the users test immediately above it.
ui/litellm-dashboard/e2e_tests/fixtures/migratedPages.ts	Adds organizations to the e2e fixture map so the e2e redirect test covers the new route.

_{Reviews (2): Last reviewed commit: "fix(ui): seed organization detail initia..." | Re-trigger Greptile}

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!

[ryan-crabbe-berri]

@greptileai re review