mirror of
https://github.com/supabase/supabase.git
synced 2026-09-06 09:59:03 +08:00
## Summary This is a precursor to unifying "compute and disk" and "infrastructure pages". First step is just updating the existing compute and disk page to make use of standard page and form patterns. - Reorganizes the existing Compute and Disk form into the established settings layout pattern, with Scaling, Compute, Disk, and Advanced sections. - Moves billing deltas to section headers while retaining the sticky review footer. - Adds animated notices, validation-error scrolling, and a responsive compute-size selector (2 columns by default, 3 from 680px, and 4 from 900px). - Preserves permissions, entitlements, cooldowns, read-only warnings, replica pricing, GP3 validation, Nano/PITR locks, and the free Micro upgrade treatment. - Keeps the redesigned experience on `/settings/compute-and-disk` so it can be reviewed independently of the route cutover. ## Stack 1. #48368 (this PR) 2. #48369 3. #48370 ## How to test 1. Check out `chore/infra-compute-1-config` and start Studio with `pnpm dev:studio`. 2. Open `/project/<ref>/settings/compute-and-disk`. 3. Confirm the page header and Scaling, Compute, Disk, and Advanced sections follow the standard settings-page spacing, with the plan notice directly below the Scaling header. 4. Change the compute size and disk configuration. Confirm billing deltas appear in the relevant section headers and the sticky review footer summarizes and applies the pending changes. 5. Enter invalid GP3 IOPS or throughput values and submit. Confirm the validation message is shown and the first invalid field is scrolled into view. 6. Exercise representative project states: insufficient permissions, read-only mode, resize cooldown, Nano with PITR, a project with read replicas, and a free Micro upgrade. Confirm the existing locks, warnings, pricing, and upgrade treatment remain intact. 7. Resize the viewport and confirm the compute cards use 2 columns by default, 3 columns from 680px, and no more than 4 columns from 900px. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Reworked the Compute and Disk settings UI into clearer sectioned pages, including smoother navigation to the first validation error. - Added a transitional in-form NoticeBar for consistent alert rendering. - Improved billing change badges to reflect accurate before/after totals. - **Bug Fixes** - Fixed disk IOPS/throughput pricing to include replica-based charges. - Strengthened disk sizing validation (GP3 limits, legacy/size edge cases, spend-cap behavior, and provider-specific constraints). - **Refactor** - Updated key form field layouts for improved readability. - **Tests** - Expanded schema validation and pricing/billing badge test coverage. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
20 lines
680 B
TypeScript
20 lines
680 B
TypeScript
import { useCheckEntitlements } from '@/hooks/misc/useCheckEntitlements'
|
|
import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject'
|
|
|
|
export function useShowMicroUpgradeBadge() {
|
|
const { data: project, isPending: isProjectLoading } = useSelectedProjectQuery()
|
|
const { hasAccess: canUpdateCompute, isLoading: isEntitlementLoading } = useCheckEntitlements(
|
|
'instances.compute_update_available_sizes'
|
|
)
|
|
|
|
const projectComputeSize = project?.infra_compute_size ?? 'nano'
|
|
const showMicroUpgradeBadge = canUpdateCompute && projectComputeSize === 'nano'
|
|
|
|
return {
|
|
project,
|
|
isProjectLoading,
|
|
isEntitlementLoading,
|
|
showMicroUpgradeBadge,
|
|
}
|
|
}
|