Files
supabase/apps/studio/components/interfaces/Settings/Infrastructure/InfrastructureConfiguration/HaInstanceConfiguration.test.tsx
Alaister Young a14fc04937 [MUL-1475] fix(studio): show setup state on HA topology diagram during boot (#49786)
While an HA (Multigres) project is provisioning, the `/ha-admin`
topology endpoints fail or return an empty topology as a matter of
course — the cluster topology diagram rendered that as a hard "Failed to
retrieve cluster topology" error (or the "Cluster topology unavailable"
contact-support state). The diagram now checks the project status and,
while the project is building (`COMING_UP`/`UNKNOWN`, same pair
`ProjectLayout` treats as booting), shows a "Setting up project" empty
state instead. Both the project-detail query (self-polls while booting)
and the ha-admin queries (30s interval) keep refetching, so the diagram
appears on its own once boot completes.

Once the project is past provisioning, genuine errors and the
empty-topology state surface exactly as before.

<img width="1491" height="769" alt="mul1475-setting-up-state-wide"
src="https://github.com/user-attachments/assets/3f095634-9939-41cd-88c3-0849cbad7374"
/>

**Added:**
- Component tests for the four states: booting + error, booting + empty
(→ setup state), running + error (→ error alert), running + empty (→
unavailable state)

Addresses
[MUL-1475](https://linear.app/supabase/issue/MUL-1475/polish-infra-diagram).

## To test

- On an HA project mid-provisioning (or simulate: dev toolbar
project-status override → `COMING_UP`, with `/ha-admin` requests
failing), open Settings → Infrastructure — the topology panel shows
"Setting up project" with a spinner, not the error alert
- On a healthy HA project, the topology diagram renders as before; if
`/ha-admin` genuinely fails there, the error alert still shows
- `pnpm --filter studio exec vitest run
components/interfaces/Settings/Infrastructure/InfrastructureConfiguration/HaInstanceConfiguration.test.tsx`

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Added a “Setting up project” state while projects are provisioning or
their status is unavailable.
* Prevents premature topology errors or unavailable messages during
project setup.
* Added accessible status announcements for loading and setup-state
transitions.

* **Bug Fixes**
* Active projects now correctly display topology errors when cluster
health data cannot be retrieved.
* Healthy responses with no topology data display an appropriate
unavailable state.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
2026-09-01 00:53:01 +08:00

130 lines
4.4 KiB
TypeScript

import { screen, within } from '@testing-library/react'
import { platformComponents as components } from 'api-types'
import { http, HttpResponse } from 'msw'
import { describe, expect, test, vi } from 'vitest'
import { HaInstanceConfiguration } from './HaInstanceConfiguration'
import { API_URL } from '@/lib/constants'
import type { ProfileContextType } from '@/lib/profile'
import { customRender } from '@/tests/lib/custom-render'
import { addAPIMock, mswServer, type APIErrorBody } from '@/tests/lib/msw'
type ProjectDetailResponse = components['schemas']['ProjectDetailResponse']
vi.mock('@/lib/constants', async (importOriginal) => {
const actual = await importOriginal<typeof import('@/lib/constants')>()
return {
...actual,
IS_PLATFORM: true,
}
})
const PROFILE_CONTEXT: ProfileContextType = {
profile: {
id: 1,
auth0_id: 'auth0|test',
gotrue_id: 'gotrue-test',
username: 'testuser',
primary_email: 'test@example.com',
first_name: null,
last_name: null,
mobile: null,
is_alpha_user: false,
is_sso_user: false,
disabled_features: [],
free_project_limit: null,
},
error: null,
isLoading: false,
isError: false,
isSuccess: true,
}
const PROJECT: ProjectDetailResponse = {
cloud_provider: 'AWS_K8S',
connectionString: 'postgresql://postgres:password@db.default.supabase.co:5432/postgres',
db_host: 'db.default.supabase.co',
dbVersion: 'supabase-postgres-15.1.0',
high_availability: true,
id: 1,
infra_compute_size: 'large',
inserted_at: '2026-01-01T00:00:00.000Z',
integration_source: null,
is_branch_enabled: false,
is_physical_backups_enabled: false,
name: 'Production',
organization_id: 1,
ref: 'default',
region: 'us-east-1',
restUrl: 'https://default.supabase.co',
status: 'ACTIVE_HEALTHY',
subscription_id: 'subscription-1',
updated_at: '2026-01-01T00:00:00.000Z',
}
const mockProject = (status: ProjectDetailResponse['status']) => {
addAPIMock({
method: 'get',
path: '/platform/projects/:ref',
response: { ...PROJECT, status } satisfies ProjectDetailResponse,
})
}
// The /ha-admin passthrough paths are off-schema (see get-ha-admin.ts), so they
// can't go through the OpenAPI-typed addAPIMock.
const mockHaAdmin = ({ isHealthy }: { isHealthy: boolean }) => {
mswServer.use(
http.get(`${API_URL}/platform/projects/:ref/ha-admin/v1/gateways`, () =>
isHealthy
? HttpResponse.json({ gateways: [] })
: HttpResponse.json<APIErrorBody>({ message: 'upstream unavailable' }, { status: 500 })
),
http.get(`${API_URL}/platform/projects/:ref/ha-admin/v1/poolers`, () =>
isHealthy
? HttpResponse.json({ poolers: [] })
: HttpResponse.json<APIErrorBody>({ message: 'upstream unavailable' }, { status: 500 })
)
)
}
describe('HaInstanceConfiguration', () => {
test('shows the setup state instead of an error while the project is coming up', async () => {
mockProject('COMING_UP')
mockHaAdmin({ isHealthy: false })
customRender(<HaInstanceConfiguration />, { profileContext: PROFILE_CONTEXT })
const statusRegion = await screen.findByRole('status')
expect(await within(statusRegion).findByText('Setting up project')).toBeInTheDocument()
expect(screen.queryByText('Failed to retrieve cluster topology')).not.toBeInTheDocument()
})
test('shows the setup state instead of the unavailable state while the project is coming up with an empty topology', async () => {
mockProject('COMING_UP')
mockHaAdmin({ isHealthy: true })
customRender(<HaInstanceConfiguration />, { profileContext: PROFILE_CONTEXT })
expect(await screen.findByText('Setting up project')).toBeInTheDocument()
expect(screen.queryByText('Cluster topology unavailable')).not.toBeInTheDocument()
})
test('surfaces topology errors once the project is running', async () => {
mockProject('ACTIVE_HEALTHY')
mockHaAdmin({ isHealthy: false })
customRender(<HaInstanceConfiguration />, { profileContext: PROFILE_CONTEXT })
expect(await screen.findByText('Failed to retrieve cluster topology')).toBeInTheDocument()
})
test('shows the unavailable state for an empty topology once the project is running', async () => {
mockProject('ACTIVE_HEALTHY')
mockHaAdmin({ isHealthy: true })
customRender(<HaInstanceConfiguration />, { profileContext: PROFILE_CONTEXT })
expect(await screen.findByText('Cluster topology unavailable')).toBeInTheDocument()
})
})