feat: [M3-8931] - Add doc link and region availability banner for Accelerated plans (linode#11363)

* update link + add region availability banner

* Added changeset: Docs link and region availability notice for Accelerated compute plans

* update plan-selection tests due (new banner added)

Author: coliu-akamai

packages/manager/.changeset/pr-11363-added-1733258836295.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Added
+---
+
+Docs link and region availability notice for Accelerated compute plans ([#11363](https://github.com/linode/manager/pull/11363))

packages/manager/cypress/e2e/core/linodes/plan-selection.spec.ts

@@ -488,7 +488,7 @@ describe('Linode Accelerated plans', () => {
 
         cy.findByText('Accelerated').click();
         cy.get(linodePlansPanel).within(() => {
-          cy.findAllByRole('alert').should('have.length', 1);
+          cy.findAllByRole('alert').should('have.length', 2);
 
           cy.findByRole('table', {
             name: 'List of Linode Plans',
@@ -543,7 +543,7 @@ describe('Linode Accelerated plans', () => {
 
         cy.findByText('Accelerated').click();
         cy.get(k8PlansPanel).within(() => {
-          cy.findAllByRole('alert').should('have.length', 1);
+          cy.findAllByRole('alert').should('have.length', 2);
 
           cy.findByRole('table', { name: planSelectionTable }).within(() => {
             cy.findAllByRole('row').should('have.length', 2);

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

@@ -7,6 +7,7 @@ import { useFlags } from 'src/hooks/useFlags';
 
 import { APLNotice } from './APLNotice';
 import {
+  ACCELERATED_COMPUTE_INSTANCES_LINK,
   DEDICATED_COMPUTE_INSTANCES_LINK,
   GPU_COMPUTE_INSTANCES_LINK,
   HIGH_MEMORY_COMPUTE_INSTANCES_LINK,
@@ -60,12 +61,7 @@ export const PlanInformation = (props: PlanInformationProps) => {
     hasMajorityOfPlansDisabled;
 
   const transferBanner = (
-    <Notice
-      spacingBottom={
-        planType === 'accelerated' && !showLimitedAvailabilityBanner ? 24 : 8
-      }
-      variant="warning"
-    >
+    <Notice spacingBottom={8} variant="warning">
       <Typography
         fontFamily={(theme: Theme) => theme.font.bold}
         fontSize="1rem"
@@ -109,7 +105,17 @@ export const PlanInformation = (props: PlanInformationProps) => {
           />
         </>
       ) : null}
-      {planType === 'accelerated' && transferBanner}
+      {planType === 'accelerated' && (
+        <>
+          {transferBanner}
+          <PlansAvailabilityNotice
+            hasSelectedRegion={hasSelectedRegion}
+            isSelectedRegionEligibleForPlan={isSelectedRegionEligibleForPlan}
+            planType={planType}
+            regionsData={regionsData || []}
+          />
+        </>
+      )}
       {planType === 'metal' ? (
         <MetalNotice
           dataTestId="metal-notice"
@@ -177,9 +183,8 @@ export const ClassDescriptionCopy = (props: ExtendedPlanType) => {
       docLink = GPU_COMPUTE_INSTANCES_LINK;
       break;
     case 'accelerated':
-      // TODO: accelerated plans - acquire doc link
       planTypeLabel = 'Accelerated';
-      docLink = '#';
+      docLink = ACCELERATED_COMPUTE_INSTANCES_LINK;
       break;
     default:
       planTypeLabel = null;

packages/manager/src/features/components/PlansPanel/constants.ts

@@ -27,6 +27,9 @@ export const GPU_COMPUTE_INSTANCES_LINK =
   'https://techdocs.akamai.com/cloud-computing/docs/gpu-compute-instances';
 export const TRANSFER_COSTS_LINK =
   'https://techdocs.akamai.com/cloud-computing/docs/network-transfer-usage-and-costs';
+// TODO: accelerated plans - update to GA link (when GA launches)
+export const ACCELERATED_COMPUTE_INSTANCES_LINK =
+  'https://techdocs.akamai.com/cloud-computing/docs/accelerated-compute-instances-beta';
 
 export const DEDICATED_512_GB_PLAN: ExtendedType = {
   accelerated_devices: 0,