hana-akamai · Apr 11, 2024 · Apr 8, 2024 · Apr 8, 2024 · Apr 8, 2024 · Apr 10, 2024
diff --git a/packages/manager/.changeset/pr-10363-upcoming-features-1712613073120.md b/packages/manager/.changeset/pr-10363-upcoming-features-1712613073120.md
@@ -0,0 +1,5 @@
+---
+"@linode/manager": Upcoming Features
+---
+
+Update gecko feature flag to object ([#10363](https://github.com/linode/manager/pull/10363))
diff --git a/packages/manager/src/components/SelectRegionPanel/SelectRegionPanel.tsx b/packages/manager/src/components/SelectRegionPanel/SelectRegionPanel.tsx
@@ -78,9 +78,15 @@ export const SelectRegionPanel = (props: SelectRegionPanelProps) => {
     });
 
   const hideEdgeRegions =
-    !flags.gecko ||
+    !flags.gecko2?.enabled ||
+    flags.gecko2?.ga ||
     !getIsLinodeCreateTypeEdgeSupported(params.type as LinodeCreateType);
 
+  const isGeckoGA =
+    flags.gecko2?.enabled &&
+    flags.gecko2?.ga &&
+    getIsLinodeCreateTypeEdgeSupported(params.type as LinodeCreateType);
+
   const showEdgeIconHelperText = Boolean(
     !hideEdgeRegions &&
       currentCapability &&
@@ -130,6 +136,7 @@ export const SelectRegionPanel = (props: SelectRegionPanelProps) => {
           </Typography>
         </Notice>
       ) : null}
+      {isGeckoGA && 'Gecko GA'}
       <RegionSelect
         currentCapability={currentCapability}
         disabled={disabled}

diff --git a/packages/manager/src/dev-tools/FeatureFlagTool.tsx b/packages/manager/src/dev-tools/FeatureFlagTool.tsx
@@ -22,7 +22,7 @@ const options: { flag: keyof Flags; label: string }[] = [
   { flag: 'aclbFullCreateFlow', label: 'ACLB Full Create Flow' },
   { flag: 'disableLargestGbPlans', label: 'Disable Largest GB Plans' },
   { flag: 'linodeCloneUiChanges', label: 'Linode Clone UI Changes' },
-  { flag: 'gecko', label: 'Gecko' },
+  { flag: 'gecko2', label: 'Gecko' },
   { flag: 'parentChildAccountAccess', label: 'Parent/Child Account' },
   { flag: 'selfServeBetas', label: 'Self Serve Betas' },
   { flag: 'firewallNodebalancer', label: 'Firewall NodeBalancer' },

diff --git a/packages/manager/src/featureFlags.ts b/packages/manager/src/featureFlags.ts
@@ -42,6 +42,11 @@ interface PlacementGroupsFlag {
   enabled: boolean;
 }
 
+interface GeckoFlag {
+  enabled: boolean;
+  ga: boolean;
+}
+
 type OneClickApp = Record<string, string>;
 
 export interface Flags {
@@ -53,7 +58,8 @@ export interface Flags {
   databases: boolean;
   disableLargestGbPlans: boolean;
   firewallNodebalancer: boolean;
-  gecko: boolean;
+  gecko: boolean; // @TODO gecko: delete this after next release
+  gecko2: GeckoFlag;
   ipv6Sharing: boolean;
   linodeCloneUiChanges: boolean;
   linodeCreateRefactor: boolean;

diff --git a/packages/manager/src/features/Linodes/LinodesCreate/LinodeCreate.tsx b/packages/manager/src/features/Linodes/LinodesCreate/LinodeCreate.tsx
@@ -474,7 +474,7 @@ export class LinodeCreate extends React.PureComponent<
       (imageIsCloudInitCompatible || linodeIsCloudInitCompatible);
 
     const isEdgeRegionSelected = Boolean(
-      flags.gecko &&
+      flags.gecko2?.enabled &&
         getIsEdgeRegion(regionsData, this.props.selectedRegionID ?? '')
     );
 

diff --git a/packages/manager/src/features/Linodes/LinodesCreate/TabbedContent/FromLinodeContent.tsx b/packages/manager/src/features/Linodes/LinodesCreate/TabbedContent/FromLinodeContent.tsx
@@ -80,7 +80,7 @@ export const FromLinodeContent = (props: CombinedProps) => {
       (linode) => !getIsEdgeRegion(regionsData, linode.region) // Hide linodes that are in an edge region
     );
 
-  const filteredLinodes = flags.gecko
+  const filteredLinodes = flags.gecko2?.enabled
     ? filterEdgeLinodes(linodesData)
     : linodesData;
 

diff --git a/packages/manager/src/features/Linodes/LinodesLanding/LinodesLanding.tsx b/packages/manager/src/features/Linodes/LinodesLanding/LinodesLanding.tsx
@@ -11,6 +11,10 @@ import OrderBy from 'src/components/OrderBy';
 import { PreferenceToggle } from 'src/components/PreferenceToggle/PreferenceToggle';
 import { ProductInformationBanner } from 'src/components/ProductInformationBanner/ProductInformationBanner';
 import { TransferDisplay } from 'src/components/TransferDisplay/TransferDisplay';
+import {
+  WithFeatureFlagProps,
+  withFeatureFlags,
+} from 'src/containers/flags.container';
 import {
   WithProfileProps,
   withProfile,
@@ -87,14 +91,15 @@ export interface LinodesLandingProps {
   someLinodesHaveScheduledMaintenance: boolean;
 }
 
-interface ListLinodesProps
-  extends LinodesLandingProps,
-    RouteProps,
-    WithProfileProps {}
+type CombinedProps = LinodesLandingProps &
+  RouteProps &
+  WithFeatureFlagProps &
+  WithProfileProps;
 
-class ListLinodes extends React.Component<ListLinodesProps, State> {
+class ListLinodes extends React.Component<CombinedProps, State> {
   render() {
     const {
+      flags,
       grants,
       linodesData,
       linodesInTransition,
@@ -161,6 +166,7 @@ class ListLinodes extends React.Component<ListLinodesProps, State> {
 
     return (
       <React.Fragment>
+        {flags.gecko2?.enabled && flags.gecko2?.ga && 'Gecko GA'}
         <LinodeResize
           linodeId={this.state.selectedLinodeID}
           onClose={this.closeDialogs}
@@ -447,9 +453,10 @@ const sendGroupByAnalytic = (value: boolean) => {
   sendGroupByTagEnabledEvent(eventCategory, value);
 };
 
-export const enhanced = compose<ListLinodesProps, LinodesLandingProps>(
+export const enhanced = compose<CombinedProps, LinodesLandingProps>(
   withRouter,
-  withProfile
+  withProfile,
+  withFeatureFlags
 );
 
 export default enhanced(ListLinodes);
diff --git a/packages/manager/src/features/Linodes/MigrateLinode/ConfigureForm.tsx b/packages/manager/src/features/Linodes/MigrateLinode/ConfigureForm.tsx
@@ -134,6 +134,9 @@ export const ConfigureForm = React.memo((props: Props) => {
 
         <StyledMigrationBox>
           <RegionSelect
+            regionFilter={
+              flags.gecko2?.enabled && linodeIsInEdgeRegion ? 'edge' : 'core'
+            }
             regions={
               regions?.filter(
                 (eachRegion) => eachRegion.id !== currentRegion
@@ -146,7 +149,6 @@ export const ConfigureForm = React.memo((props: Props) => {
             errorText={errorText}
             handleSelection={handleSelectRegion}
             label="New Region"
-            regionFilter={flags.gecko && linodeIsInEdgeRegion ? 'edge' : 'core'}
             selectedId={selectedRegion}
           />
           {shouldDisplayPriceComparison && selectedRegion && (

diff --git a/packages/manager/src/features/Linodes/MigrateLinode/MigrateLinode.tsx b/packages/manager/src/features/Linodes/MigrateLinode/MigrateLinode.tsx
@@ -151,7 +151,7 @@ export const MigrateLinode = React.memo((props: Props) => {
   );
 
   const edgeRegionWarning =
-    flags.gecko && linodeIsInEdgeRegion
+    flags.gecko2?.enabled && linodeIsInEdgeRegion
       ? 'Edge sites may only be migrated to other Edge sites.'
       : undefined;
 

diff --git a/packages/manager/src/features/components/PlansPanel/PlansPanel.tsx b/packages/manager/src/features/components/PlansPanel/PlansPanel.tsx
@@ -87,7 +87,7 @@ export const PlansPanel = (props: Props) => {
   );
 
   const hideEdgeRegions =
-    !flags.gecko ||
+    !flags.gecko2?.enabled ||
     !getIsLinodeCreateTypeEdgeSupported(params.type as LinodeCreateType);
 
   const showEdgePlanTable =