diff --git a/packages/manager/.changeset/pr-10956-added-1727103260742.md b/packages/manager/.changeset/pr-10956-added-1727103260742.md
new file mode 100644
index 00000000000..511c979c325
--- /dev/null
+++ b/packages/manager/.changeset/pr-10956-added-1727103260742.md
@@ -0,0 +1,5 @@
+---
+"@linode/manager": Added
+---
+
+GPUv2 Plan Selection Egress Banner ([#10956](https://github.com/linode/manager/pull/10956))
diff --git a/packages/manager/cypress/e2e/core/linodes/plan-selection.spec.ts b/packages/manager/cypress/e2e/core/linodes/plan-selection.spec.ts
index 82b97eb7d63..848732eb462 100644
--- a/packages/manager/cypress/e2e/core/linodes/plan-selection.spec.ts
+++ b/packages/manager/cypress/e2e/core/linodes/plan-selection.spec.ts
@@ -368,7 +368,7 @@ describe('displays specific linode plans for GPU', () => {
// Should display two separate tables
cy.findByText('GPU').click();
cy.get(linodePlansPanel).within(() => {
- cy.findAllByRole('alert').should('have.length', 1);
+ cy.findAllByRole('alert').should('have.length', 2);
cy.get(notices.unavailable).should('be.visible');
cy.findByRole('table', {
diff --git a/packages/manager/src/featureFlags.ts b/packages/manager/src/featureFlags.ts
index 57cc999ce71..35917a087a6 100644
--- a/packages/manager/src/featureFlags.ts
+++ b/packages/manager/src/featureFlags.ts
@@ -70,6 +70,7 @@ export interface CloudPulseResourceTypeMapFlag {
}
interface gpuV2 {
+ egressBanner: boolean;
planDivider: boolean;
}
diff --git a/packages/manager/src/features/components/PlansPanel/PlanInformation.tsx b/packages/manager/src/features/components/PlansPanel/PlanInformation.tsx
index 02b819e3b90..e631e7a9e25 100644
--- a/packages/manager/src/features/components/PlansPanel/PlanInformation.tsx
+++ b/packages/manager/src/features/components/PlansPanel/PlanInformation.tsx
@@ -1,11 +1,10 @@
-import { LinodeTypeClass } from '@linode/api-v4/lib/linodes';
-import { Theme, useTheme } from '@mui/material/styles';
import * as React from 'react';
import { Link } from 'src/components/Link';
import { Notice } from 'src/components/Notice/Notice';
import { Typography } from 'src/components/Typography';
import { StyledNoticeTypography } from 'src/features/Linodes/LinodesCreate/PlansAvailabilityNotice.styles';
+import { useFlags } from 'src/hooks/useFlags';
import { PlansAvailabilityNotice } from '../../Linodes/LinodesCreate/PlansAvailabilityNotice';
import {
@@ -19,6 +18,8 @@ import { MetalNotice } from './MetalNotice';
import { planTabInfoContent } from './utils';
import type { Region } from '@linode/api-v4';
+import type { LinodeTypeClass } from '@linode/api-v4/lib/linodes';
+import type { Theme } from '@mui/material/styles';
export interface PlanInformationProps {
disabledClasses?: LinodeTypeClass[];
@@ -40,20 +41,40 @@ export const PlanInformation = (props: PlanInformationProps) => {
planType,
regionsData,
} = props;
-
const getDisabledClass = (thisClass: LinodeTypeClass) => {
return Boolean(disabledClasses?.includes(thisClass));
};
+ const showGPUEgressBanner = Boolean(useFlags().gpuv2?.egressBanner);
return (
<>
{planType === 'gpu' ? (
-
+ <>
+ {showGPUEgressBanner && (
+
+ theme.font.bold}
+ fontSize="1rem"
+ >
+ New GPU instances are now generally available. Deploy an RTX
+ 4000 Ada GPU instance in select core compute regions in North
+ America, Europe, and Asia.
+ Receive 1 TB of free included network transfer for a limited
+ time.{' '}
+
+ Learn more
+
+ .
+
+
+ )}
+
+ >
) : null}
{planType === 'metal' ? (
{
const { planType } = props;
- const theme = useTheme();
let planTypeLabel: null | string;
let docLink: null | string;
@@ -133,7 +153,10 @@ export const ClassDescriptionCopy = (props: ClassDescriptionCopyProps) => {
return planTypeLabel && docLink ? (
({
+ marginBottom: theme.spacing(3),
+ marginTop: theme.spacing(1),
+ })}
>
{
planTabInfoContent[planType as keyof typeof planTabInfoContent]