refactor(forntend): improve providers table

[jog1t]

Description

Please include a summary of the changes and the related issue. Please also include relevant motivation and context.

Type of change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

How Has This Been Tested?

Please describe the tests that you ran to verify your changes.

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review of my code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes

[jog1t]

• fix(frontend): entry deduplication #5061
• [slop]feat(frontend): enable compute, add historical logs #5059
• chore: regenerate sdk #5036
• feat(frontend): allow creating serverfull instances during onboarding #5035
• feat(frontend): add provider icons #5034
• refactor(forntend): improve providers table #5033 👈 (View in Graphite)
• fix(frontend): missing provider configuration right after adding it #5032
• refactor(frontend): datacenter aware provider configuration #5031
• feat(frontend): allow local->staging tunnel in dev #5030
• refactor(frontend): better gateway errors #5029
• feat(frontend): rbac token notice for the engine #5028
• fix(frontend): build ladle correctly #5027
• feat(frontend): improve runners errors ui #5026
• fix(frontend): 404 navigation issues #5025
• fix(frontend): ns aware navigation #5024
• fix(frontend): navigate only by using actor ids #5023
• feat(frontend): add serverless check when editing the runner config #4961 : 1 other dependent PR (#4964 )
• main

This stack of pull requests is managed by Graphite. Learn more about stacking.

[claude]

Code Review: refactor(frontend): improve providers table

Overview

This PR decouples RunnerConfigsTable from TanStack Router navigation and React Query data fetching, injecting those concerns as props (renderRegion, onEditConfig, onDeleteConfig, totalDatacenterCount). It also adds a ProviderSummary component showing provider + kind (serverless/runner) inline, improves the endpoint tooltip to show per-datacenter URLs, adds Ladle stories, and implements a redirect-after-login flow via the from query param.

---

Potential Bugs

totalDatacenterCount can be NaN - in settings.tsx:

select: (data) =>
  data.pages.reduce((acc, page) => acc + page.datacenters?.length, 0),

page.datacenters?.length returns undefined when datacenters is missing, so acc + undefined = NaN. The Regions component guards with totalDatacenterCount !== undefined && regions.length === totalDatacenterCount, and NaN === anything is always false - so the "Global" label silently fails to appear when it should. Fix:

data.pages.reduce((acc, page) => acc + (page.datacenters?.length ?? 0), 0)

Inconsistent open-redirect guard for Google OAuth callback - login.tsx uses an inline check:

from && from.startsWith("/") && !from.startsWith("//")

But isSafeInternalPath in auth.ts additionally blocks /login, /join, /verify-email-pending, and /forgot-password. After a Google OAuth round-trip, a from=/login param would pass the looser inline check and create a redirect loop. Consider exporting isSafeInternalPath and reusing it in login.tsx.

redirect({ to: from }) with a raw string - TanStack Router's to expects a typed route path. Passing an arbitrary string may produce a TypeScript error in strict mode. Using href: from (TanStack Router's escape hatch for raw paths) would be more explicit and avoids the typed-route constraint.

---

Code Quality

• Good: The provider if/else chain replaced with PROVIDER_ICONS/PROVIDER_LABELS lookup tables is much cleaner and easier to extend.
• Good: Decoupling navigation and data fetching from the table component makes it independently testable - the Ladle stories are a direct payoff.
• Good: The endpoint tooltip now shows per-datacenter breakdown (region + URL) rather than a flat list of unique URLs, which is more useful when datacenters share the same endpoint.
• Note: The Ping component is replaced with inline Tailwind animation markup. If Ping still exists in the design system, prefer the shared component to avoid visual drift over time.

---

Security

• isSafeInternalPath correctly prevents protocol-relative URLs (//evil.com) and enforces same-origin paths. The auth-page blocklist is a nice touch to avoid loops.
• The from -> redirect in redirectToOrganization fires before the org-lookup flow, meaning a valid from bypasses org selection entirely. Worth confirming: if from points to a resource that requires a specific org context, the org context may not be set when the user lands there.

---

Minor

• PR title has a typo: "forntend" should be "frontend".
• PR description checklist is empty - no test description or self-review recorded.

---

Overall this is a clean, well-structured refactor. The decoupling pattern is correct, and the stories cover the meaningful edge cases (empty endpoint set, mixed kinds, error state, global deployment). The ?? 0 NaN fix and the Google OAuth path-check inconsistency are the two items worth addressing.

[jog1t]

Merge activity

• May 15, 7:36 PM UTC: A user started a stack merge that includes this pull request via Graphite.
• May 15, 7:58 PM UTC: Graphite rebased this pull request as part of a merge.
• May 15, 7:58 PM UTC: @jog1t merged this pull request with Graphite.