fix: disk attributes on compute down size (supabase#36788)

When downgrading from a larger compute size to <large while having provisioned IOPS or throughput, we would leave the disk as-is, even though the configuration is unsupported and then block any disk changes because the instance size is too small, essentially dead-locking the customer on the disk attributes, unless they bump back up to a higher instance size.

PR addresses multiple issues:
- Automatically reset disk attributes to default when customers downgrade to <large instances
- Do not use the baseline compute IOPS/throughput for the fields, as this leads to accidentally over-provisioning by customers

Author: kevcodez

apps/studio/components/interfaces/DiskManagement/DiskManagementForm.tsx

@@ -53,7 +53,11 @@ import { IOPSField } from './fields/IOPSField'
 import { StorageTypeField } from './fields/StorageTypeField'
 import { ThroughputField } from './fields/ThroughputField'
 import { DiskCountdownRadial } from './ui/DiskCountdownRadial'
-import { DiskType, RESTRICTED_COMPUTE_FOR_THROUGHPUT_ON_GP3 } from './ui/DiskManagement.constants'
+import {
+  DISK_LIMITS,
+  DiskType,
+  RESTRICTED_COMPUTE_FOR_THROUGHPUT_ON_GP3,
+} from './ui/DiskManagement.constants'
 import { NoticeBar } from './ui/NoticeBar'
 import { SpendCapDisabledSection } from './ui/SpendCapDisabledSection'
 import { useIsAwsCloudProvider, useIsAwsK8sCloudProvider } from 'hooks/misc/useSelectedProject'
@@ -142,6 +146,10 @@ export function DiskManagementForm() {
   /**
    * Handle default values
    */
+  const computeSize = project?.infra_compute_size
+    ? mapComputeSizeNameToAddonVariantId(project?.infra_compute_size)
+    : undefined
+
   // @ts-ignore
   const { type, iops, throughput_mbps, size_gb } = data?.attributes ?? { size_gb: 0, iops: 0 }
   const { growth_percent, max_size_gb, min_increment_gb } = diskAutoscaleConfig ?? {}
@@ -150,9 +158,7 @@ export function DiskManagementForm() {
     provisionedIOPS: iops,
     throughput: throughput_mbps,
     totalSize: size_gb,
-    computeSize: project?.infra_compute_size
-      ? mapComputeSizeNameToAddonVariantId(project?.infra_compute_size)
-      : undefined,
+    computeSize,
     growthPercent: growth_percent,
     minIncrementGb: min_increment_gb,
     maxSizeGb: max_size_gb,
@@ -167,6 +173,20 @@ export function DiskManagementForm() {
     reValidateMode: 'onChange',
   })
 
+  const { computeSize: modifiedComputeSize } = form.watch()
+
+  // We only support disk configurations for >=Large instances
+  // If a customer downgrades back to <Large, we should reset the storage settings to avoid incurring unnecessary costs
+  useEffect(() => {
+    if (modifiedComputeSize && project?.infra_compute_size && isDialogOpen) {
+      if (RESTRICTED_COMPUTE_FOR_THROUGHPUT_ON_GP3.includes(modifiedComputeSize)) {
+        form.setValue('storageType', DiskType.GP3)
+        form.setValue('throughput', DISK_LIMITS['gp3'].minThroughput)
+        form.setValue('provisionedIOPS', DISK_LIMITS['gp3'].minIops)
+      }
+    }
+  }, [modifiedComputeSize, isDialogOpen, project])
+
   /**
    * State handling
    */

apps/studio/components/interfaces/DiskManagement/fields/IOPSField.tsx

@@ -13,11 +13,7 @@ import {
 } from '../DiskManagement.utils'
 import { BillingChangeBadge } from '../ui/BillingChangeBadge'
 import { ComputeSizeRecommendationSection } from '../ui/ComputeSizeRecommendationSection'
-import {
-  COMPUTE_BASELINE_IOPS,
-  DiskType,
-  RESTRICTED_COMPUTE_FOR_IOPS_ON_GP3,
-} from '../ui/DiskManagement.constants'
+import { DiskType, RESTRICTED_COMPUTE_FOR_IOPS_ON_GP3 } from '../ui/DiskManagement.constants'
 import { DiskManagementIOPSReadReplicas } from '../ui/DiskManagementReadReplicas'
 import FormMessage from '../ui/FormMessage'
 import { InputPostTab } from '../ui/InputPostTab'
@@ -117,13 +113,7 @@ export function IOPSField({ form, disableInput }: IOPSFieldProps) {
                     type="number"
                     className="flex-grow font-mono rounded-r-none max-w-32"
                     {...field}
-                    value={
-                      disableIopsInput
-                        ? COMPUTE_BASELINE_IOPS[
-                            watchedComputeSize as keyof typeof COMPUTE_BASELINE_IOPS
-                          ]
-                        : field.value
-                    }
+                    value={field.value}
                     disabled={disableInput || disableIopsInput || isError}
                     onChange={(e) => {
                       setValue('provisionedIOPS', e.target.valueAsNumber, {

apps/studio/components/interfaces/DiskManagement/fields/ThroughputField.tsx

@@ -11,7 +11,6 @@ import { DiskStorageSchemaType } from '../DiskManagement.schema'
 import { calculateThroughputPrice } from '../DiskManagement.utils'
 import { BillingChangeBadge } from '../ui/BillingChangeBadge'
 import {
-  COMPUTE_BASELINE_THROUGHPUT,
   DISK_LIMITS,
   DiskType,
   RESTRICTED_COMPUTE_FOR_IOPS_ON_GP3,
@@ -129,13 +128,7 @@ export function ThroughputField({ form, disableInput }: ThroughputFieldProps) {
                       <Input_Shadcn_
                         type="number"
                         {...field}
-                        value={
-                          disableIopsInput
-                            ? COMPUTE_BASELINE_THROUGHPUT[
-                                watchedComputeSize as keyof typeof COMPUTE_BASELINE_THROUGHPUT
-                              ]
-                            : field.value
-                        }
+                        value={field.value}
                         onChange={(e) => {
                           setValue('throughput', e.target.valueAsNumber, {
                             shouldDirty: true,