feat(auth): redesign initial screen with rotating globe panel behind flag#3168
Merged
Conversation
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
Codecov Report❌ Patch coverage is Additional details and impacted files@@ Coverage Diff @@
## main #3168 +/- ##
==========================================
+ Coverage 63.68% 63.70% +0.01%
==========================================
Files 1081 1085 +4
Lines 26197 26293 +96
Branches 6357 6384 +27
==========================================
+ Hits 16684 16749 +65
- Misses 8325 8352 +27
- Partials 1188 1192 +4
🚀 New features to boost your workflow:
|
ygrishajev
force-pushed
the
feat/auth-globe-redesign
branch
from
ac43279 to
080d376
Compare
Contributor
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: ⛔ Files ignored due to path filters (3)
📒 Files selected for processing (18)
✅ Files skipped from review due to trivial changes (6)
🚧 Files skipped from review as they are similar to previous changes (8)
📝 WalkthroughWalkthroughAdds GPU pricing API operationId and types. Implements a client-side cobe Globe with theme-aware colors and marker tooltips. Introduces AuthLayoutV2 that uses the Globe and REGION_MARKERS. Adds H100PriceStatus component that queries listGpuPrices. Refactors AuthLayout to static marketing content and gates the new layout behind console_auth_redesign. ChangesAuth Redesign with Globe Visualization and GPU Pricing
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Comment |
Contributor
|
Caution Failed to replace (edit) comment. This is likely due to insufficient permissions or the comment being deleted. Error details |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/api/swagger/openapi.json`:
- Line 1950: The OpenAPI spec contains hard-coded default date values
("default": "2026-05-12") that conflict with the runtime Zod default (new
Date().toISOString().split("T")[0]); remove the static "default" properties for
those date schema entries (the occurrences with value "2026-05-12") so the spec
does not advertise a stale fixed default—locate the JSON objects where
"default": "2026-05-12" appears and delete those "default" keys so the runtime
dynamic default remains the single source of truth.
In `@apps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.spec.tsx`:
- Around line 1-5: Reorder the imports in AuthLayoutV2.spec.tsx so
external/package imports come first and relative imports last to satisfy
simple-import-sort: import from "vitest" and "@testing-library/react" before the
local import "./AuthLayoutV2" (which exports AuthLayoutV2 and DEPENDENCIES);
ensure grouping and ordering follow the ESLint simple-import-sort rules.
In `@apps/deploy-web/src/components/globe/Globe/Globe.tsx`:
- Around line 181-195: The hslStringToRgb function can produce NaN when given
malformed HSL tokens, so validate the parsed components (h, s, l) after
parseFloat in hslStringToRgb: check that each is a finite number and s and l are
within 0–100 (or normalized 0–1) and h is a finite number; if validation fails,
do not return a NaN-containing RGB—either throw or return a clear fallback
(e.g., null/undefined or a default RGB) so the caller (createGlobe/readToken
fallback) can handle it; update hslStringToRgb to perform this validation and
return the fallback signal instead of silently returning NaNs.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 0ebe1cc9-5c40-477d-8f9f-6cce8d864f2f
⛔ Files ignored due to path filters (2)
apps/deploy-web/src/components/auth/AuthLayout/__snapshots__/AuthLayout.spec.tsx.snapis excluded by!**/*.snappackage-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (17)
apps/api/src/gpu/routes/gpu.router.tsapps/api/swagger/openapi.jsonapps/deploy-web/package.jsonapps/deploy-web/src/components/auth/AuthLayout/AuthLayout.spec.tsxapps/deploy-web/src/components/auth/AuthLayout/AuthLayout.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.spec.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/markers.tsapps/deploy-web/src/components/auth/AuthPage/AuthPage.spec.tsxapps/deploy-web/src/components/auth/AuthPage/AuthPage.tsxapps/deploy-web/src/components/globe/Globe/Globe.spec.tsxapps/deploy-web/src/components/globe/Globe/Globe.tsxapps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.spec.tsxapps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.tsxapps/deploy-web/src/types/feature-flags.tspackages/console-api-types/src/operations.gen.tspackages/console-api-types/src/schema.d.ts
ygrishajev
force-pushed
the
feat/auth-globe-redesign
branch
from
080d376 to
6d6ea4a
Compare
Contributor
There was a problem hiding this comment.
Actionable comments posted: 3
♻️ Duplicate comments (1)
apps/api/swagger/openapi.json (1)
1950-1950:⚠️ Potential issue | 🟠 MajorHard-coded date defaults create spec/runtime mismatch.
These static defaults will become stale immediately after today, while the runtime generates today's date dynamically. Remove the
"default"keys to let the runtime behavior remain the source of truth.Also applies to: 2076-2076
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/api/swagger/openapi.json` at line 1950, Remove the hard-coded JSON schema "default" keys that contain static date strings (e.g., "default": "2026-05-12") so the spec matches runtime behavior which generates today's date dynamically; locate the entries in the OpenAPI JSON where "default" is set to a date string (the shown "default": "2026-05-12" and the other similar occurrence) and delete those "default" fields so no static date is emitted in the schema.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/deploy-web/src/components/globe/Globe/Globe.spec.tsx`:
- Around line 60-69: The test "renders label overlays for markers that have a
label" only asserts the positive case; add a negative assertion that the
unlabeled marker does not render by calling queryByText for the unlabeled marker
text and asserting .not.toBeInTheDocument() (e.g.,
expect(screen.queryByText("unlabeled")).not.toBeInTheDocument()); place this
assertion alongside the existing expect in the same test to enforce the "no
label — should not render" behavior.
In `@apps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.spec.tsx`:
- Around line 1-7: The import order breaks simple-import-sort: move the
local/relative import of DEPENDENCIES and H100PriceStatus (import { type
DEPENDENCIES, H100PriceStatus } from "./H100PriceStatus") so it appears after
all external package imports (vitest, vitest-mock-extended, testing-library, and
`@akashnetwork/console-api-types`), ensuring external module imports are grouped
first and local relative imports come last to satisfy
eslint-plugin-simple-import-sort.
- Around line 62-72: The nested mock passed directly into mock<T> for
DEPENDENCIES.useServices and the nested listGpuPrices.useQuery (currently
assigned via useServices and queryResult variables) can cause Proxy brittleness;
instead, create the mock objects first (create queryResult =
mock<ListGpuPricesResult>({ data: input.data }) and create a top-level
servicesMock = mock<ReturnType<typeof DEPENDENCIES.useServices>>() ), then
assign the nested shape onto servicesMock.api.v1.listGpuPrices.useQuery = () =>
queryResult; finally return servicesMock from the useServices stub so
DEPENDENCIES.useServices and listGpuPrices.useQuery are set by post-assignment
rather than nested in the initial mock call.
---
Duplicate comments:
In `@apps/api/swagger/openapi.json`:
- Line 1950: Remove the hard-coded JSON schema "default" keys that contain
static date strings (e.g., "default": "2026-05-12") so the spec matches runtime
behavior which generates today's date dynamically; locate the entries in the
OpenAPI JSON where "default" is set to a date string (the shown "default":
"2026-05-12" and the other similar occurrence) and delete those "default" fields
so no static date is emitted in the schema.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 7d85d178-6ab1-4dfe-82dc-dbfcb359ca3d
⛔ Files ignored due to path filters (2)
apps/deploy-web/src/components/auth/AuthLayout/__snapshots__/AuthLayout.spec.tsx.snapis excluded by!**/*.snappackage-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (18)
apps/api/src/gpu/routes/gpu.router.tsapps/api/swagger/openapi.jsonapps/deploy-web/package.jsonapps/deploy-web/public/images/auth-panel-noise.webpapps/deploy-web/src/components/auth/AuthLayout/AuthLayout.spec.tsxapps/deploy-web/src/components/auth/AuthLayout/AuthLayout.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.spec.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/markers.tsapps/deploy-web/src/components/auth/AuthPage/AuthPage.spec.tsxapps/deploy-web/src/components/auth/AuthPage/AuthPage.tsxapps/deploy-web/src/components/globe/Globe/Globe.spec.tsxapps/deploy-web/src/components/globe/Globe/Globe.tsxapps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.spec.tsxapps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.tsxapps/deploy-web/src/types/feature-flags.tspackages/console-api-types/src/operations.gen.tspackages/console-api-types/src/schema.d.ts
ygrishajev
force-pushed
the
feat/auth-globe-redesign
branch
from
6d6ea4a to
c045f1c
Compare
Contributor
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.tsx`:
- Around line 33-37: The getH100MinPrice function accepts m.price!.min without
validating it; filter the mapped values to exclude non-finite numbers (e.g.,
undefined, null, NaN, Infinity) before calling Math.min so malformed API values
don't produce NaN; specifically, in getH100MinPrice, after building prices from
data.models.filter(...).map(m => m.price!.min) apply a numeric finiteness check
(Number.isFinite) and only pass the resulting finite array to Math.min,
returning undefined if no finite values remain.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 9532a417-d133-45fd-b3ec-7ea4b255dcbb
⛔ Files ignored due to path filters (3)
apps/api/test/functional/__snapshots__/docs.spec.ts.snapis excluded by!**/*.snapapps/deploy-web/src/components/auth/AuthLayout/__snapshots__/AuthLayout.spec.tsx.snapis excluded by!**/*.snappackage-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (18)
apps/api/src/gpu/routes/gpu.router.tsapps/api/swagger/openapi.jsonapps/deploy-web/package.jsonapps/deploy-web/public/images/auth-panel-noise.webpapps/deploy-web/src/components/auth/AuthLayout/AuthLayout.spec.tsxapps/deploy-web/src/components/auth/AuthLayout/AuthLayout.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.spec.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/markers.tsapps/deploy-web/src/components/auth/AuthPage/AuthPage.spec.tsxapps/deploy-web/src/components/auth/AuthPage/AuthPage.tsxapps/deploy-web/src/components/globe/Globe/Globe.spec.tsxapps/deploy-web/src/components/globe/Globe/Globe.tsxapps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.spec.tsxapps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.tsxapps/deploy-web/src/types/feature-flags.tspackages/console-api-types/src/operations.gen.tspackages/console-api-types/src/schema.d.ts
✅ Files skipped from review due to trivial changes (5)
- apps/deploy-web/src/components/auth/AuthLayoutV2/markers.ts
- apps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.spec.tsx
- packages/console-api-types/src/operations.gen.ts
- apps/api/src/gpu/routes/gpu.router.ts
- packages/console-api-types/src/schema.d.ts
🚧 Files skipped from review as they are similar to previous changes (7)
- apps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.spec.tsx
- apps/deploy-web/src/components/auth/AuthLayout/AuthLayout.spec.tsx
- apps/deploy-web/src/components/auth/AuthPage/AuthPage.spec.tsx
- apps/deploy-web/package.json
- apps/deploy-web/src/components/globe/Globe/Globe.spec.tsx
- apps/deploy-web/src/components/globe/Globe/Globe.tsx
- apps/deploy-web/src/components/auth/AuthLayout/AuthLayout.tsx
ygrishajev
force-pushed
the
feat/auth-globe-redesign
branch
from
c045f1c to
b6e27c8
Compare
Contributor
There was a problem hiding this comment.
🧹 Nitpick comments (1)
apps/deploy-web/src/components/globe/Globe/Globe.spec.tsx (1)
1-7: ⚡ Quick winFix import order to satisfy
simple-import-sort.
@testing-library/reactshould be grouped with external imports before local./Globeimports; current order can fail lint.Proposed diff
import { beforeEach, describe, expect, it, vi } from "vitest"; - -import type { DEPENDENCIES, GlobeMarker } from "./Globe"; -import { Globe } from "./Globe"; - import { render, screen } from "@testing-library/react"; + +import type { DEPENDENCIES, GlobeMarker } from "./Globe"; +import { Globe } from "./Globe";As per coding guidelines: "Import sorting must be enforced via
eslint-plugin-simple-import-sortaccording to ESLint configuration."🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/deploy-web/src/components/globe/Globe/Globe.spec.tsx` around lines 1 - 7, Reorder the imports in Globe.spec.tsx so external packages are grouped before local files to satisfy simple-import-sort: move the "@testing-library/react" import (render, screen) up with other external imports (vitest) and keep the local "./Globe" and its type import after those externals; update the order of the import lines referencing Globe and its types (Globe, DEPENDENCIES, GlobeMarker) accordingly and re-run the linter to confirm the import-sort rule passes.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@apps/deploy-web/src/components/globe/Globe/Globe.spec.tsx`:
- Around line 1-7: Reorder the imports in Globe.spec.tsx so external packages
are grouped before local files to satisfy simple-import-sort: move the
"@testing-library/react" import (render, screen) up with other external imports
(vitest) and keep the local "./Globe" and its type import after those externals;
update the order of the import lines referencing Globe and its types (Globe,
DEPENDENCIES, GlobeMarker) accordingly and re-run the linter to confirm the
import-sort rule passes.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 4779b2e2-3f54-44e7-ab5c-92b274f7e7e0
⛔ Files ignored due to path filters (3)
apps/api/test/functional/__snapshots__/docs.spec.ts.snapis excluded by!**/*.snapapps/deploy-web/src/components/auth/AuthLayout/__snapshots__/AuthLayout.spec.tsx.snapis excluded by!**/*.snappackage-lock.jsonis excluded by!**/package-lock.json
📒 Files selected for processing (18)
apps/api/src/gpu/routes/gpu.router.tsapps/api/swagger/openapi.jsonapps/deploy-web/package.jsonapps/deploy-web/public/images/auth-panel-noise.webpapps/deploy-web/src/components/auth/AuthLayout/AuthLayout.spec.tsxapps/deploy-web/src/components/auth/AuthLayout/AuthLayout.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.spec.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.tsxapps/deploy-web/src/components/auth/AuthLayoutV2/markers.tsapps/deploy-web/src/components/auth/AuthPage/AuthPage.spec.tsxapps/deploy-web/src/components/auth/AuthPage/AuthPage.tsxapps/deploy-web/src/components/globe/Globe/Globe.spec.tsxapps/deploy-web/src/components/globe/Globe/Globe.tsxapps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.spec.tsxapps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.tsxapps/deploy-web/src/types/feature-flags.tspackages/console-api-types/src/operations.gen.tspackages/console-api-types/src/schema.d.ts
✅ Files skipped from review due to trivial changes (7)
- apps/deploy-web/package.json
- packages/console-api-types/src/operations.gen.ts
- apps/deploy-web/src/components/auth/AuthLayoutV2/markers.ts
- apps/api/src/gpu/routes/gpu.router.ts
- apps/api/swagger/openapi.json
- packages/console-api-types/src/schema.d.ts
- apps/deploy-web/src/components/auth/AuthLayout/AuthLayout.spec.tsx
🚧 Files skipped from review as they are similar to previous changes (7)
- apps/deploy-web/src/components/auth/AuthLayoutV2/AuthLayoutV2.tsx
- apps/deploy-web/src/components/auth/AuthPage/AuthPage.spec.tsx
- apps/deploy-web/src/components/globe/Globe/Globe.tsx
- apps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.spec.tsx
- apps/deploy-web/src/components/auth/AuthPage/AuthPage.tsx
- apps/deploy-web/src/types/feature-flags.ts
- apps/deploy-web/src/components/gpu/H100PriceStatus/H100PriceStatus.tsx
…flag Replace the dotted dark sidebar on the auth screen with a themed panel: a rotating cobe v2 globe, live H100 GPU pricing, and a help link. The right-side form panel is preserved — same tabs, fields, OAuth providers, and routes. The globe lives under `components/globe/` as a reusable component so the Deploying screen and future consumers can render it with their own markers. For this screen, the cobe playground "Data Centers" preset is used: eight region markers projected as labeled pills via cobe v2's CSS Anchor Positioning. Rotation speed is normalized to wall-clock time so it stays the same across refresh rates and globe sizes. The panel inverts the app theme — dark on a light app, light on a dark app — by wrapping the scope in the opposite class. Globe colors cascade through this inverted scope so the dark canvas remains dark in light mode. H100 pricing is fetched live via api.v1.listGpuPrices.useQuery() and rendered through a standalone H100PriceStatus component injected into the layout's header slot. Falls back to $1.80/hr while loading or when no h100 entry is returned. To expose the endpoint through the typed SDK, the route gains operationId: "listGpuPrices" and the generated swagger + console-api-types are regenerated. All changes are gated by the console_auth_redesign flag, read inside AuthPage. With the flag off, the screen renders identically to today.
ygrishajev
force-pushed
the
feat/auth-globe-redesign
branch
from
b6e27c8 to
9f56ae8
Compare
stalniy
approved these changes
May 13, 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.
Why
Fixes CON-299.
The current auth screen sidebar (dotted dark panel) doesn't match the redesign direction. This PR replaces it with a live, themed panel that introduces the visual language we'll reuse across onboarding (CON-300) and the Deploying screen (CON-314): a rotating globe with region markers and a live H100 pricing line. All gated by
console_auth_redesignso it ships dark.What
AuthLayoutV2rendered whenconsole_auth_redesignis on. The right-side form panel (tabs, OAuth, email, forgot password) is preserved verbatim — same flows, same routes.Globecomponent undercomponents/globe/(cobe v2). Uses cobe v2's CSS Anchor Positioning for marker labels — no manual projection math. Rotation speed is normalized to wall-clock time so it stays the same across refresh rates and globe sizes. Eight region markers from the cobe playground "Data Centers" preset.H100PriceStatuscomponent undercomponents/gpu/that callsapi.v1.listGpuPrices.useQuery()and shows the cheapest H100 min price, falling back to$1.80/hrwhile loading or when no h100 model is returned.operationId: "listGpuPrices"onGET /v1/gpu-pricesso the endpoint reaches the typed SDK.apps/api/swagger/openapi.jsonandpackages/console-api-typesare regenerated.cobeupgraded^0.6.5→^2.0.1.Globe,H100PriceStatus, andAuthLayoutV2; existingAuthLayout,AuthPage, and snapshot tests updated.Browser support note: CSS Anchor Positioning requires Chrome 125+, Edge 125+, Safari 26+, Firefox 147+. On older browsers the labels stay invisible (opacity fallback
0); the globe and dots still render. If wider support becomes a requirement we can add a JS-positioned fallback under@supports.Heads-up:
apps/api/swagger/openapi.jsonmay carry the localSERVER_ORIGINfromsdk:gen:swagger— please check theservers[0].urldiff before merging.Test plan
console_auth_redesignflag in Unleash; verify v1 renders identically when off and v2 renders when on$1.80fallback to the live min once/v1/gpu-pricesresolvesScreen.Recording.2026-05-12.at.17.14.30.mov
Screen.Recording.2026-05-12.at.17.14.14.mov
Summary by CodeRabbit
New Features
Improvements
Tests