diff --git a/apps/studio/components/interfaces/ProjectCreation/ProjectCreation.utils.test.ts b/apps/studio/components/interfaces/ProjectCreation/ProjectCreation.utils.test.ts index c7e1bc40e59..344eaf59ad9 100644 --- a/apps/studio/components/interfaces/ProjectCreation/ProjectCreation.utils.test.ts +++ b/apps/studio/components/interfaces/ProjectCreation/ProjectCreation.utils.test.ts @@ -11,7 +11,6 @@ import { getAvailableRegions, getHighAvailabilityRegionCode, resolveDefaultDbRegion, - resolveSelectedRegionOptionType, } from './ProjectCreation.utils' describe('resolveDefaultDbRegion', () => { @@ -70,55 +69,6 @@ describe('resolveDefaultDbRegion', () => { }) }) -describe('resolveSelectedRegionOptionType', () => { - const smartGroupRegions = [{ name: 'Americas' }, { name: 'APAC' }] - const specificRegions = [{ name: 'ap-southeast-1' }, { name: 'us-east-1' }] - - it('returns general when the "Best available region" shortcut was used', () => { - expect( - resolveSelectedRegionOptionType({ - isBestAvailableSelected: true, - dbRegion: 'ap-southeast-1', - smartGroupRegions, - specificRegions, - }) - ).toBe('general') - }) - - it('returns general when the region was picked from the smart group list', () => { - expect( - resolveSelectedRegionOptionType({ - isBestAvailableSelected: false, - dbRegion: 'Americas', - smartGroupRegions, - specificRegions, - }) - ).toBe('general') - }) - - it('returns specific when the region was picked from the specific regions list', () => { - expect( - resolveSelectedRegionOptionType({ - isBestAvailableSelected: false, - dbRegion: 'ap-southeast-1', - smartGroupRegions, - specificRegions, - }) - ).toBe('specific') - }) - - it('returns undefined when the region matches neither list', () => { - expect( - resolveSelectedRegionOptionType({ - isBestAvailableSelected: false, - dbRegion: undefined, - smartGroupRegions, - specificRegions, - }) - ).toBeUndefined() - }) -}) - describe('getAvailableRegions', () => { it.each(['local', 'staging', 'prod'])('returns all AWS regions for AWS on %s', (environment) => { expect(getAvailableRegions('AWS', environment)).toEqual(AWS_REGIONS) diff --git a/apps/studio/components/interfaces/ProjectCreation/ProjectCreation.utils.ts b/apps/studio/components/interfaces/ProjectCreation/ProjectCreation.utils.ts index 42fe8186721..92c3938925a 100644 --- a/apps/studio/components/interfaces/ProjectCreation/ProjectCreation.utils.ts +++ b/apps/studio/components/interfaces/ProjectCreation/ProjectCreation.utils.ts @@ -68,26 +68,6 @@ export function resolveDefaultDbRegion({ : fixedDefaultRegion } -type ResolveSelectedRegionOptionTypeArgs = { - isBestAvailableSelected: boolean - dbRegion: string | undefined - smartGroupRegions: Array<{ name: string }> - specificRegions: Array<{ name: string }> -} - -export function resolveSelectedRegionOptionType({ - isBestAvailableSelected, - dbRegion, - smartGroupRegions, - specificRegions, -}: ResolveSelectedRegionOptionTypeArgs): 'general' | 'specific' | undefined { - // The "Best available region" shortcut always resolves to a smart-group recommendation - if (isBestAvailableSelected) return 'general' - if (smartGroupRegions.some((region) => region.name === dbRegion)) return 'general' - if (specificRegions.some((region) => region.name === dbRegion)) return 'specific' - return undefined -} - /** * When launching new projects, they only get assigned a compute size once successfully launched, * this might assume wrong compute size, but only for projects being rapidly launched after one another on non-default compute sizes. diff --git a/apps/studio/components/interfaces/ProjectCreation/ProjectCreationForm.tsx b/apps/studio/components/interfaces/ProjectCreation/ProjectCreationForm.tsx index 157bfb69a6b..45284928fb2 100644 --- a/apps/studio/components/interfaces/ProjectCreation/ProjectCreationForm.tsx +++ b/apps/studio/components/interfaces/ProjectCreation/ProjectCreationForm.tsx @@ -35,7 +35,6 @@ import { instanceLabel, monthlyInstancePrice, resolveDefaultDbRegion, - resolveSelectedRegionOptionType, smartRegionToExactRegion, } from './ProjectCreation.utils' import { ProjectCreationFooter } from './ProjectCreationFooter' @@ -143,18 +142,6 @@ export const ProjectCreationForm = ({ useFlag('newProjectInternalOnlyConfiguration') && !isVercelIntegrationFlow const { getRegionRestriction } = useRegionRestriction() - // [Joshen] Temp experiment - to clean up once completed - const showBestAvailableRegionFeature = useIsFeatureEnabled( - 'project_creation:show_best_available_region' - ) - const showBestAvailableRegionFlag = useFlag('showBestAvailableRegion') - const showBestAvailableRegionOption = - showBestAvailableRegionFeature && showBestAvailableRegionFlag && isFreePlan - const [isBestAvailableSelected, setIsBestAvailableSelected] = useState(false) - - const shouldTrackRegionRecommendation = isFreePlan && showBestAvailableRegionFeature - const initialRecommendedRegionRef = useRef(undefined) - // Read the raw flag for telemetry — coerce-undefined-to-false would record false for // users whose flags haven't loaded yet. The raw value preserves undefined (omitted from // PostHog) so we only record an actual value (boolean true/false, or a variant string @@ -309,16 +296,6 @@ export const ProjectCreationForm = ({ ? availableRegionsData?.recommendations.smartGroup.name : '' - if ( - initialRecommendedRegionRef.current === undefined && - flagsLoaded && - shouldTrackRegionRecommendation - ) { - initialRecommendedRegionRef.current = showBestAvailableRegionOption - ? 'best_available' - : recommendedSmartRegion || undefined - } - const fixedDefaultRegion = PROVIDERS[selectedCloudProvider].default_region.displayName const regionError = smartRegionEnabled ? availableRegionsError : defaultRegionError const defaultRegion = resolveDefaultDbRegion({ @@ -371,15 +348,6 @@ export const ProjectCreationForm = ({ } = useProjectCreateMutation({ onSuccess: (res) => { setProjectCreationError(undefined) - const { smartGroup = [], specific = [] } = availableRegionsData?.all ?? {} - const submittedDbRegion = form.getValues('dbRegion') - const selectedRegionOption = isBestAvailableSelected ? 'best_available' : submittedDbRegion - const selectedRegionOptionType = resolveSelectedRegionOptionType({ - isBestAvailableSelected, - dbRegion: submittedDbRegion, - smartGroupRegions: smartGroup, - specificRegions: specific, - }) track( 'project_creation_simple_version_submitted', { @@ -392,11 +360,6 @@ export const ProjectCreationForm = ({ ...(dataApiRevokeOnCreateDefaultFlag !== undefined && { dataApiRevokeOnCreateDefaultEnabled: dataApiRevokeOnCreateDefaultFlag, }), - ...(shouldTrackRegionRecommendation && { - selectedRegionOption, - selectedRegionOptionType, - initialRecommendedRegion: initialRecommendedRegionRef.current, - }), }, { project: res.ref, @@ -818,9 +781,6 @@ export const ProjectCreationForm = ({ form={form} hasSelectedOrganization={hasSelectedOrganization} instanceSize={instanceSize as DesiredInstanceSize} - showBestAvailableRegionOption={showBestAvailableRegionOption} - isBestAvailableSelected={isBestAvailableSelected} - onBestAvailableSelectedChange={setIsBestAvailableSelected} /> {isVercelIntegrationFlow && !!externalId && } diff --git a/apps/studio/components/interfaces/ProjectCreation/RegionSelector.tsx b/apps/studio/components/interfaces/ProjectCreation/RegionSelector.tsx index 587b31e247b..da573afda9d 100644 --- a/apps/studio/components/interfaces/ProjectCreation/RegionSelector.tsx +++ b/apps/studio/components/interfaces/ProjectCreation/RegionSelector.tsx @@ -1,5 +1,5 @@ import { useFeatureFlags, useFlag, useParams } from 'common' -import { Loader2, ThumbsUp } from 'lucide-react' +import { Loader2 } from 'lucide-react' import { useEffect, useRef } from 'react' import { UseFormReturn } from 'react-hook-form' import type { CloudProvider } from 'shared-data' @@ -51,9 +51,6 @@ interface RegionSelectorProps { hasSelectedOrganization: boolean instanceSize?: DesiredInstanceSize layout?: 'vertical' | 'horizontal' - showBestAvailableRegionOption: boolean - isBestAvailableSelected: boolean - onBestAvailableSelectedChange: (value: boolean) => void } // [Joshen] Let's use a library to maintain the flag SVGs in the future @@ -70,20 +67,11 @@ const getDisplayNameForSmartRegion = (name: string): string => { const isLocal = process.env.NEXT_PUBLIC_ENVIRONMENT === 'local' -const BestAvailableRegionIcon = () => ( -
- -
-) - export const RegionSelector = ({ form, hasSelectedOrganization, instanceSize, layout = 'horizontal', - showBestAvailableRegionOption, - isBestAvailableSelected, - onBestAvailableSelectedChange, }: RegionSelectorProps) => { const { slug } = useParams() const cloudProvider = form.getValues('cloudProvider') as CloudProvider @@ -127,32 +115,6 @@ export const RegionSelector = ({ const recommendedSmartRegions = new Set( [availableRegionsData?.recommendations.smartGroup.code].filter(Boolean) ) - const recommendedSmartRegion = smartRegions.find( - (x) => x.code === recommendedSmartRegions.values().next().value - ) - - const isBestAvailableOptionShown = showBestAvailableRegionOption && !!recommendedSmartRegion - const isBestAvailableActive = isBestAvailableSelected && isBestAvailableOptionShown - - // Defaults free orgs to the "Best available region" shortcut once the recommendation loads, - // unless the user has already interacted with the region field themselves. - const hasUserSelectedRegionRef = useRef(false) - useEffect(() => { - if (hasUserSelectedRegionRef.current) return - if (isBestAvailableOptionShown) { - onBestAvailableSelectedChange(true) - } - }, [isBestAvailableOptionShown, onBestAvailableSelectedChange]) - - // Keeps dbRegion following the recommendation while "Best available" is active, so a - // recommendation change (e.g. after a refetch) doesn't leave the form submitting a stale - // region behind a label that still reads "Auto". - useEffect(() => { - if (!isBestAvailableSelected || !recommendedSmartRegion) return - if (dbRegion !== recommendedSmartRegion.name) { - form.setValue('dbRegion', recommendedSmartRegion.name) - } - }, [isBestAvailableSelected, recommendedSmartRegion, dbRegion, form]) const recommendedSpecificRegions = new Set( availableRegionsData?.recommendations.specific.map((region) => region.code) @@ -234,11 +196,7 @@ export const RegionSelector = ({ selectedRestriction !== undefined ? getRegionRestrictionCopy(selectedRestriction) : undefined - const triggerLabel = isLoading - ? 'Loading available regions...' - : isBestAvailableActive - ? 'Auto' - : selectedRegionLabel + const triggerLabel = isLoading ? 'Loading available regions...' : selectedRegionLabel const affectingIncidents = incidents.filter((incident) => { const affectedRegions = incident.cache?.affected_regions ?? [] @@ -280,18 +238,10 @@ export const RegionSelector = ({ >