change: [UIE-9890] - changes related to private IP field in create linode flow (#13253)

Author: grevanak-akamai

packages/manager/.changeset/pr-13253-changed-1767795144176.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Changed
+---
+
+Changes related to private IP field in create linode flow ([#13253](https://github.com/linode/manager/pull/13253))

packages/manager/src/features/Linodes/LinodeCreate/Addons/Addons.test.tsx

@@ -37,4 +37,34 @@ describe('Linode Create Addons', () => {
       'Backups and Private IP are not available for distributed regions.'
     );
   });
+
+  it('should hide the Private IP addon if interface generation is "linode"', () => {
+    const { queryByText } = renderWithThemeAndHookFormContext({
+      component: <Addons />,
+      useFormOptions: {
+        values: {
+          interface_generation: 'linode',
+        },
+      },
+    });
+
+    const privateIPLabel = queryByText('Private IP');
+
+    expect(privateIPLabel).not.toBeInTheDocument();
+  });
+
+  it('should show the Private IP addon if interface generation is not "linode"', () => {
+    const { queryByText } = renderWithThemeAndHookFormContext({
+      component: <Addons />,
+      useFormOptions: {
+        values: {
+          interface_generation: 'legacy_config',
+        },
+      },
+    });
+
+    const privateIPLabel = queryByText('Private IP');
+
+    expect(privateIPLabel).toBeVisible();
+  });
 });

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

@@ -9,7 +9,10 @@ import { PrivateIP } from './PrivateIP';
 import type { CreateLinodeRequest } from '@linode/api-v4';
 
 export const Addons = () => {
-  const regionId = useWatch<CreateLinodeRequest, 'region'>({ name: 'region' });
+  const [regionId, interfaceGeneration] = useWatch<
+    CreateLinodeRequest,
+    ['region', 'interface_generation']
+  >({ name: ['region', 'interface_generation'] });
 
   const { data: regions } = useRegionsQuery();
 
@@ -21,6 +24,8 @@ export const Addons = () => {
   const isDistributedRegionSelected =
     selectedRegion?.site_type === 'distributed';
 
+  const shouldShowPrivateIP = interfaceGeneration !== 'linode';
+
   return (
     <Paper data-qa-add-ons>
       <Stack spacing={2}>
@@ -33,7 +38,7 @@ export const Addons = () => {
         )}
         <Stack divider={<Divider />} spacing={2}>
           <Backups />
-          <PrivateIP />
+          {shouldShowPrivateIP && <PrivateIP />}
         </Stack>
       </Stack>
     </Paper>

packages/manager/src/features/Linodes/LinodeCreate/Addons/PrivateIP.tsx

@@ -2,6 +2,7 @@ import { useRegionsQuery } from '@linode/queries';
 import {
   Checkbox,
   FormControlLabel,
+  NewFeatureChip,
   Notice,
   Stack,
   Typography,
@@ -55,9 +56,18 @@ export const PrivateIP = () => {
             />
           )}
           <Typography component="span" display="block" variant="body1">
-            Use Private IP for a backend node to a NodeBalancer. Use VPC instead
-            for private communication between your Linodes.
+            Lets you connect with other Linodes in the same region over the data
+            center&apos;s private network, without using a public IPv4 address.
           </Typography>
+          <Notice variant="tip">
+            <Stack alignItems="center" direction="row" spacing={1}>
+              <NewFeatureChip />
+              <Typography>
+                You can use VPC for private networking instead. NodeBalancers
+                now connect to backend nodes without a private IPv4 address.
+              </Typography>
+            </Stack>
+          </Notice>
         </Stack>
       }
       onChange={field.onChange}