hotfix: Incorrect Region Options (#11449)

* add initial fix

* version bump and changelog update

* POC of better fix

* clean up

* feedback - use prop approach

* feedback - use prop approach

* feedback - use prop approach

---------

Co-authored-by: Banks Nussman <banks@nussman.us>

Author: bnussman-akamai

packages/manager/CHANGELOG.md

@@ -4,6 +4,13 @@ All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](http://keepachangelog.com/) and this project adheres to [Semantic Versioning](http://semver.org/).
 
+## [2024-12-20] - v1.133.2
+
+### Fixed:
+
+- Incorrectly displayed region options ([#11449](https://github.com/linode/manager/pull/11449))
+
+
 ## [2024-12-19] - v1.133.1
 
 ### Fixed:

packages/manager/package.json

@@ -2,7 +2,7 @@
   "name": "linode-manager",
   "author": "Linode",
   "description": "The Linode Manager website",
-  "version": "1.133.1",
+  "version": "1.133.2",
   "private": true,
   "type": "module",
   "bugs": {

packages/manager/src/components/RegionSelect/RegionMultiSelect.tsx

@@ -3,7 +3,6 @@ import CloseIcon from '@mui/icons-material/Close';
 import React from 'react';
 
 import { Flag } from 'src/components/Flag';
-import { useIsObjectStorageGen2Enabled } from 'src/features/ObjectStorage/hooks/useIsObjectStorageGen2Enabled';
 import { useAllAccountAvailabilitiesQuery } from 'src/queries/account/availability';
 import { getRegionCountryGroup } from 'src/utilities/formatRegion';
 
@@ -38,6 +37,7 @@ export const RegionMultiSelect = React.memo((props: RegionMultiSelectProps) => {
     disabled,
     disabledRegions: disabledRegionsFromProps,
     errorText,
+    forcefullyShownRegionIds,
     helperText,
     isClearable,
     label,
@@ -51,16 +51,14 @@ export const RegionMultiSelect = React.memo((props: RegionMultiSelectProps) => {
     ...rest
   } = props;
 
-  const { isObjectStorageGen2Enabled } = useIsObjectStorageGen2Enabled();
-
   const {
     data: accountAvailability,
     isLoading: accountAvailabilityLoading,
   } = useAllAccountAvailabilitiesQuery();
 
   const regionOptions = getRegionOptions({
     currentCapability,
-    isObjectStorageGen2Enabled,
+    forcefullyShownRegionIds,
     regions,
   });
 

packages/manager/src/components/RegionSelect/RegionSelect.tsx

@@ -4,7 +4,6 @@ import * as React from 'react';
 
 import { Flag } from 'src/components/Flag';
 import { useIsGeckoEnabled } from 'src/components/RegionSelect/RegionSelect.utils';
-import { useIsObjectStorageGen2Enabled } from 'src/features/ObjectStorage/hooks/useIsObjectStorageGen2Enabled';
 import { useAllAccountAvailabilitiesQuery } from 'src/queries/account/availability';
 import { getRegionCountryGroup } from 'src/utilities/formatRegion';
 
@@ -39,6 +38,7 @@ export const RegionSelect = <
     disabled,
     disabledRegions: disabledRegionsFromProps,
     errorText,
+    forcefullyShownRegionIds,
     helperText,
     ignoreAccountAvailability,
     label,
@@ -54,7 +54,6 @@ export const RegionSelect = <
   } = props;
 
   const { isGeckoLAEnabled } = useIsGeckoEnabled();
-  const { isObjectStorageGen2Enabled } = useIsObjectStorageGen2Enabled();
 
   const {
     data: accountAvailability,
@@ -63,7 +62,7 @@ export const RegionSelect = <
 
   const regionOptions = getRegionOptions({
     currentCapability,
-    isObjectStorageGen2Enabled,
+    forcefullyShownRegionIds,
     regionFilter,
     regions,
   });

packages/manager/src/components/RegionSelect/RegionSelect.types.ts

@@ -38,6 +38,11 @@ export interface RegionSelectProps<
    * A key/value object for disabling regions by their ID.
    */
   disabledRegions?: Record<string, DisableItemOption>;
+  /**
+   * Used to override filtering done by the `currentCapability` prop
+   * @todo Remove this after Object Storage Gen2.
+   */
+  forcefullyShownRegionIds?: Set<string>;
   helperText?: string;
   /**
    * Ignores account availability information when rendering region options
@@ -67,6 +72,11 @@ export interface RegionMultiSelectProps
   }>;
   currentCapability: Capabilities | undefined;
   disabledRegions?: Record<string, DisableItemOption>;
+  /**
+   * Used to override filtering done by the `currentCapability` prop
+   * @todo Remove this after Object Storage Gen2.
+   */
+  forcefullyShownRegionIds?: Set<string>;
   helperText?: string;
   isClearable?: boolean;
   label?: string;

packages/manager/src/components/RegionSelect/RegionSelect.utils.tsx

@@ -15,32 +15,20 @@ const NORTH_AMERICA = CONTINENT_CODE_TO_CONTINENT.NA;
 
 interface RegionSelectOptionsOptions {
   currentCapability: Capabilities | undefined;
-  /**
-   * @TODO: This is a temporary property to gate the whitelisted regions to Gen2 users
-   */
-  isObjectStorageGen2Enabled?: boolean;
+  forcefullyShownRegionIds?: Set<string>;
   regionFilter?: RegionFilterValue;
   regions: Region[];
 }
 
-// @TODO: OBJ Gen2: This should be removed once these regions obtain the `Object Storage` capability.
-const WHITELISTED_REGIONS = new Set([
-  'gb-lon',
-  'au-mel',
-  'in-bom-2',
-  'de-fra-2',
-  'sg-sin-2',
-]);
-
 export const getRegionOptions = ({
   currentCapability,
-  isObjectStorageGen2Enabled,
+  forcefullyShownRegionIds,
   regionFilter,
   regions,
 }: RegionSelectOptionsOptions) => {
   return regions
     .filter((region) => {
-      if (isObjectStorageGen2Enabled && WHITELISTED_REGIONS.has(region.id)) {
+      if (forcefullyShownRegionIds?.has(region.id)) {
         return true;
       }
 

packages/manager/src/features/ObjectStorage/AccessKeyLanding/AccessKeyRegions/AccessKeyRegions.tsx

@@ -5,6 +5,8 @@ import { useObjectStorageRegions } from 'src/features/ObjectStorage/hooks/useObj
 import { sortByString } from 'src/utilities/sort-by';
 
 import type { Region } from '@linode/api-v4';
+import { useIsObjectStorageGen2Enabled } from '../../hooks/useIsObjectStorageGen2Enabled';
+import { WHITELISTED_REGIONS } from '../../utilities';
 
 interface Props {
   disabled?: boolean;
@@ -27,11 +29,16 @@ export const AccessKeyRegions = (props: Props) => {
     availableStorageRegions,
   } = useObjectStorageRegions();
 
+  const { isObjectStorageGen2Enabled } = useIsObjectStorageGen2Enabled();
+
   // Error could be: 1. General Regions error, 2. Field error, 3. Nothing
   const errorText = error || allRegionsError?.[0]?.reason;
 
   return (
     <RegionMultiSelect
+      forcefullyShownRegionIds={
+        isObjectStorageGen2Enabled ? WHITELISTED_REGIONS : undefined
+      }
       placeholder={
         selectedRegion.length > 0 ? '' : 'Select regions or type to search'
       }

packages/manager/src/features/ObjectStorage/BucketLanding/BucketRegions.tsx

@@ -2,6 +2,8 @@ import * as React from 'react';
 
 import { RegionSelect } from 'src/components/RegionSelect/RegionSelect';
 import { useObjectStorageRegions } from 'src/features/ObjectStorage/hooks/useObjectStorageRegions';
+import { useIsObjectStorageGen2Enabled } from '../hooks/useIsObjectStorageGen2Enabled';
+import { WHITELISTED_REGIONS } from '../utilities';
 
 interface Props {
   disabled?: boolean;
@@ -20,11 +22,16 @@ export const BucketRegions = (props: Props) => {
     availableStorageRegions,
   } = useObjectStorageRegions();
 
+  const { isObjectStorageGen2Enabled } = useIsObjectStorageGen2Enabled();
+
   // Error could be: 1. General Regions error, 2. Field error, 3. Nothing
   const errorText = error || allRegionsError?.[0]?.reason;
 
   return (
     <RegionSelect
+      forcefullyShownRegionIds={
+        isObjectStorageGen2Enabled ? WHITELISTED_REGIONS : undefined
+      }
       currentCapability="Object Storage"
       disableClearable
       disabled={disabled}

packages/manager/src/features/ObjectStorage/utilities.ts

@@ -172,6 +172,15 @@ export const objectACLHelperText: Record<ACLType, string> = {
   'public-read-write': 'Public Read/Write ACL',
 };
 
+// @TODO: OBJ Gen2: This should be removed once these regions obtain the `Object Storage` capability.
+export const WHITELISTED_REGIONS = new Set([
+  'gb-lon',
+  'au-mel',
+  'in-bom-2',
+  'de-fra-2',
+  'sg-sin-2',
+]);
+
 /**
  * For OBJ Gen2 users, filter regions based on available Object Storage endpoints.
  * Otherwise, we return the regions as is.