hotfix: Use 'edge'-class plans for edge regions

packages/api-v4/CHANGELOG.md

@@ -1,3 +1,10 @@
+## [2024-05-06] - v0.116.0
+
+
+### Added:
+
+- 'edge' Linode type class ([#10441](https://github.com/linode/manager/pull/10441))
+
 ## [2024-04-29] - v0.115.0
 
 

packages/api-v4/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@linode/api-v4",
-  "version": "0.115.0",
+  "version": "0.116.0",
   "homepage": "https://github.com/linode/manager/tree/develop/packages/api-v4",
   "bugs": {
     "url": "https://github.com/linode/manager/issues"

packages/api-v4/src/linodes/types.ts

@@ -328,7 +328,8 @@ export type LinodeTypeClass =
   | 'gpu'
   | 'metal'
   | 'prodedicated'
-  | 'premium';
+  | 'premium'
+  | 'edge';
 
 export interface IPAllocationRequest {
   type: 'ipv4';

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-05-06] - v1.118.1
+
+
+### Upcoming Features:
+
+- Use 'edge'-class plans in edge regions ([#10441](https://github.com/linode/manager/pull/10441))
+
 ## [2024-04-29] - v1.118.0
 
 

packages/manager/package.json

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

packages/manager/src/features/Linodes/LinodeCreatev2/Plan.tsx

@@ -45,7 +45,7 @@ export const Plan = () => {
       regionsData={regions} // @todo move this query deeper if possible
       selectedId={field.value}
       selectedRegionID={regionId}
-      showTransfer
+      showLimits
       types={types?.map(extendType) ?? []} // @todo don't extend type
     />
   );

packages/manager/src/features/Linodes/LinodesCreate/LinodeCreate.tsx

@@ -644,7 +644,7 @@ export class LinodeCreate extends React.PureComponent<
               regionsData={regionsData!}
               selectedId={this.props.selectedTypeID}
               selectedRegionID={selectedRegionID}
-              showTransfer
+              showLimits
               types={this.filterTypes()}
             />
           </Stack>

packages/manager/src/features/components/PlansPanel/PlanContainer.tsx

@@ -53,7 +53,7 @@ export interface Props {
   selectedDiskSize?: number;
   selectedId?: string;
   selectedRegionId?: Region['id'];
-  showTransfer?: boolean;
+  showLimits?: boolean;
 }
 
 export const PlanContainer = (props: Props) => {
@@ -71,18 +71,17 @@ export const PlanContainer = (props: Props) => {
     selectedDiskSize,
     selectedId,
     selectedRegionId,
-    showTransfer,
+    showLimits,
   } = props;
   const location = useLocation();
 
   // Show the Transfer column if, for any plan, the api returned data and we're not in the Database Create flow
-  const shouldShowTransfer =
-    showTransfer && plans.some((plan: TypeWithAvailability) => plan.transfer);
+  const showTransfer =
+    showLimits && plans.some((plan: TypeWithAvailability) => plan.transfer);
 
   // Show the Network throughput column if, for any plan, the api returned data (currently Bare Metal does not)
-  const shouldShowNetwork =
-    showTransfer &&
-    plans.some((plan: TypeWithAvailability) => plan.network_out);
+  const showNetwork =
+    showLimits && plans.some((plan: TypeWithAvailability) => plan.network_out);
 
   // DC Dynamic price logic - DB creation and DB resize flows are currently out of scope
   const isDatabaseCreateFlow = location.pathname.includes('/databases/create');
@@ -124,26 +123,28 @@ export const PlanContainer = (props: Props) => {
           selectedDiskSize={selectedDiskSize}
           selectedId={selectedId}
           selectedRegionId={selectedRegionId}
+          showNetwork={showNetwork}
           showTransfer={showTransfer}
           type={plan}
           wholePanelIsDisabled={isWholePanelDisabled}
         />
       );
     });
   }, [
-    allDisabledPlans,
-    disabledPlanTypesToolTipText,
-    hasMajorityOfPlansDisabled,
     plans,
-    selectedRegionId,
+    allDisabledPlans,
     isWholePanelDisabled,
+    hasMajorityOfPlansDisabled,
     currentPlanHeading,
     disabledClasses,
+    disabledPlanTypesToolTipText,
     isCreate,
     linodeID,
     onSelect,
     selectedDiskSize,
     selectedId,
+    selectedRegionId,
+    showNetwork,
     showTransfer,
   ]);
 
@@ -170,8 +171,8 @@ export const PlanContainer = (props: Props) => {
                 {tableCells.map(({ cellName, center, noWrap, testId }) => {
                   const attributeValue = `${testId}-header`;
                   if (
-                    (!shouldShowTransfer && testId === 'transfer') ||
-                    (!shouldShowNetwork && testId === 'network')
+                    (!showTransfer && testId === 'transfer') ||
+                    (!showNetwork && testId === 'network')
                   ) {
                     return null;
                   }

packages/manager/src/features/components/PlansPanel/PlanSelection.tsx

@@ -48,6 +48,7 @@ export interface PlanSelectionProps {
   selectedDiskSize?: number;
   selectedId?: string;
   selectedRegionId?: Region['id'];
+  showNetwork?: boolean;
   showTransfer?: boolean;
   type: PlanSelectionType;
   wholePanelIsDisabled?: boolean;
@@ -95,6 +96,7 @@ export const PlanSelection = (props: PlanSelectionProps) => {
     selectedDiskSize,
     selectedId,
     selectedRegionId,
+    showNetwork,
     showTransfer,
     type,
     wholePanelIsDisabled,
@@ -111,8 +113,6 @@ export const PlanSelection = (props: PlanSelectionProps) => {
   });
   const isGPU = type.class === 'gpu';
   const isDisabledClass = getDisabledClass(type.class, disabledClasses ?? []);
-  const shouldShowTransfer = showTransfer && type.transfer;
-  const shouldShowNetwork = showTransfer && type.network_out;
 
   const { data: linode } = useLinodeQuery(
     linodeID ?? -1,
@@ -275,16 +275,22 @@ export const PlanSelection = (props: PlanSelectionProps) => {
           <TableCell center data-qa-storage noWrap>
             {convertMegabytesTo(type.disk, true)}
           </TableCell>
-          {shouldShowTransfer && type.transfer ? (
+          {showTransfer ? (
             <TableCell center data-qa-transfer>
-              {type.transfer / 1000} TB
+              {type.transfer ? <>{type.transfer / 1000} TB</> : ''}
             </TableCell>
           ) : null}
-          {shouldShowNetwork && type.network_out ? (
+          {showNetwork ? (
             <TableCell center data-qa-network noWrap>
-              {LINODE_NETWORK_IN} Gbps{' '}
-              <span style={{ color: '#9DA4A6' }}>/</span>{' '}
-              {type.network_out / 1000} Gbps
+              {type.network_out ? (
+                <>
+                  {LINODE_NETWORK_IN} Gbps{' '}
+                  <span style={{ color: '#9DA4A6' }}>/</span>{' '}
+                  {type.network_out / 1000} Gbps
+                </>
+              ) : (
+                ''
+              )}
             </TableCell>
           ) : null}
         </TableRow>

packages/manager/src/features/components/PlansPanel/PlansPanel.tsx

@@ -44,7 +44,7 @@ export interface PlansPanelProps {
   selectedDiskSize?: number;
   selectedId?: string;
   selectedRegionID?: string;
-  showTransfer?: boolean;
+  showLimits?: boolean;
   tabDisabledMessage?: string;
   tabbedPanelInnerClass?: string;
   types: PlanSelectionType[];
@@ -69,7 +69,7 @@ export const PlansPanel = (props: PlansPanelProps) => {
     selectedDiskSize,
     selectedId,
     selectedRegionID,
-    showTransfer,
+    showLimits,
     types,
   } = props;
 
@@ -96,6 +96,12 @@ export const PlansPanel = (props: PlansPanelProps) => {
     getIsEdgeRegion(regionsData ?? [], selectedRegionID ?? '');
 
   const getDedicatedEdgePlanType = () => {
+    const edgePlans = types.filter((type) => type.class === 'edge');
+    if (edgePlans.length) {
+      return edgePlans;
+    }
+
+    // @TODO Remove fallback once edge plans are activated
     // 256GB and 512GB plans will not be supported for Edge
     const plansUpTo128GB = _plans.dedicated.filter(
       (planType) =>
@@ -185,7 +191,7 @@ export const PlansPanel = (props: PlansPanelProps) => {
               selectedDiskSize={selectedDiskSize}
               selectedId={selectedId}
               selectedRegionId={selectedRegionID}
-              showTransfer={showTransfer}
+              showLimits={showLimits}
             />
           </>
         );