Merge branch 'release-v1.138.0' into staging

Author: bnussman

packages/manager/cypress/e2e/core/linodes/rebuild-linode.spec.ts

@@ -1,12 +1,20 @@
 import { createStackScript } from '@linode/api-v4/lib';
-import { createLinodeRequestFactory, linodeFactory } from '@src/factories';
+import {
+  createLinodeRequestFactory,
+  imageFactory,
+  linodeFactory,
+  regionFactory,
+} from '@src/factories';
 import { authenticate } from 'support/api/authentication';
 import { LINODE_CREATE_TIMEOUT } from 'support/constants/linodes';
+import { mockGetAllImages, mockGetImage } from 'support/intercepts/images';
 import {
   interceptRebuildLinode,
   mockGetLinodeDetails,
+  mockRebuildLinode,
   mockRebuildLinodeError,
 } from 'support/intercepts/linodes';
+import { mockGetRegions } from 'support/intercepts/regions';
 import {
   interceptGetStackScript,
   interceptGetStackScripts,
@@ -340,4 +348,69 @@ describe('rebuild linode', () => {
       cy.findByText(mockErrorMessage);
     });
   });
+
+  it('can rebuild a Linode reusing existing user data', () => {
+    const region = regionFactory.build({ capabilities: ['Metadata'] });
+    const linode = linodeFactory.build({
+      region: region.id,
+      // has_user_data: true - add this when we add the type to make this test more realistic
+    });
+    const image = imageFactory.build({
+      capabilities: ['cloud-init'],
+      is_public: true,
+    });
+
+    mockRebuildLinode(linode.id, linode).as('rebuildLinode');
+    mockGetLinodeDetails(linode.id, linode).as('getLinode');
+    mockGetRegions([region]);
+    mockGetAllImages([image]);
+    mockGetImage(image.id, image);
+
+    cy.visitWithLogin(`/linodes/${linode.id}?rebuild=true`);
+
+    findRebuildDialog(linode.label).within(() => {
+      // Select an Image
+      ui.autocomplete.findByLabel('Image').should('be.visible').click();
+      ui.autocompletePopper
+        .findByTitle(image.label, { exact: false })
+        .should('be.visible')
+        .click();
+
+      // Type a root password
+      assertPasswordComplexity(rootPassword, 'Good');
+
+      // Open the User Data accordion
+      ui.accordionHeading.findByTitle('Add User Data').scrollIntoView().click();
+
+      // Verify the reuse checkbox is not checked by default and check it
+      cy.findByLabelText(
+        `Reuse user data previously provided for ${linode.label}`
+      )
+        .should('not.be.checked')
+        .click();
+
+      // Verify the checkbox becomes checked
+      cy.findByLabelText(
+        `Reuse user data previously provided for ${linode.label}`
+      ).should('be.checked');
+
+      // Type to confirm
+      cy.findByLabelText('Linode Label').should('be.visible').click();
+      cy.focused().type(linode.label);
+
+      submitRebuild();
+    });
+
+    cy.wait('@rebuildLinode').then((xhr) => {
+      // Confirm that metadata is NOT in the payload.
+      // If we omit metadata from the payload, the API will reuse previously provided userdata.
+      expect(xhr.request.body.metadata).to.be.undefined;
+
+      // Verify other expected values are in the request
+      expect(xhr.request.body.image).to.equal(image.id);
+      expect(xhr.request.body.root_pass).to.be.a('string');
+    });
+
+    ui.toast.assertMessage('Linode rebuild started.');
+  });
 });

packages/manager/cypress/support/intercepts/linodes.ts

@@ -189,6 +189,25 @@ export const interceptRebuildLinode = (
   );
 };
 
+/**
+ * Intercepts POST request to rebuild a Linode and mocks the response.
+ *
+ * @param linodeId - ID of Linode for intercepted request.
+ * @param linode - Linode for the mocked response
+ *
+ * @returns Cypress chainable.
+ */
+export const mockRebuildLinode = (
+  linodeId: number,
+  linode: Linode
+): Cypress.Chainable<null> => {
+  return cy.intercept(
+    'POST',
+    apiMatcher(`linode/instances/${linodeId}/rebuild`),
+    makeResponse(linode)
+  );
+};
+
 /**
  * Intercepts POST request to rebuild a Linode and mocks an error response.
  *

packages/manager/src/features/Linodes/LinodeEntityDetailBody.tsx

@@ -348,7 +348,7 @@ export const LinodeEntityDetailBody = React.memo((props: BodyProps) => {
           }}
           container
           direction="column"
-          spacing={2}
+          spacing={1}
         >
           <StyledColumnLabelGrid data-testid="vpc-section-title">
             VPC
@@ -358,20 +358,18 @@ export const LinodeEntityDetailBody = React.memo((props: BodyProps) => {
               alignItems: 'center',
               margin: 0,
               padding: '0 0 8px 0',
-
               [theme.breakpoints.down('md')]: {
                 alignItems: 'start',
                 display: 'flex',
                 flexDirection: 'column',
-                paddingLeft: '8px',
               },
             }}
             container
             direction="row"
-            spacing={2}
+            spacing={0}
           >
             <StyledVPCBox>
-              <StyledListItem>
+              <StyledListItem sx={{ paddingLeft: 0 }}>
                 <StyledLabelBox component="span">Label:</StyledLabelBox>{' '}
                 <Link
                   data-testid="assigned-vpc-label"
@@ -418,7 +416,7 @@ export const LinodeEntityDetailBody = React.memo((props: BodyProps) => {
               1
             )} ${theme.spacing(2)}`,
             [theme.breakpoints.down('md')]: {
-              paddingLeft: 3,
+              paddingLeft: 2,
             },
           }}
           container
@@ -430,6 +428,7 @@ export const LinodeEntityDetailBody = React.memo((props: BodyProps) => {
                 ...(!attachedFirewall && !isLinodeInterfacesEnabled
                   ? { borderRight: 'unset' }
                   : {}),
+                paddingLeft: 0,
               }}
             >
               <StyledLabelBox component="span">LKE Cluster:</StyledLabelBox>{' '}
@@ -447,6 +446,7 @@ export const LinodeEntityDetailBody = React.memo((props: BodyProps) => {
             <StyledListItem
               sx={{
                 ...(!isLinodeInterfacesEnabled ? { borderRight: 'unset' } : {}),
+                ...(!linodeLkeClusterId ? { paddingLeft: 0 } : {}),
               }}
             >
               <StyledLabelBox component="span">Firewall:</StyledLabelBox>{' '}
@@ -461,7 +461,14 @@ export const LinodeEntityDetailBody = React.memo((props: BodyProps) => {
             </StyledListItem>
           )}
           {isLinodeInterfacesEnabled && (
-            <StyledListItem sx={{ borderRight: 'unset' }}>
+            <StyledListItem
+              sx={{
+                ...(!linodeLkeClusterId && !attachedFirewall
+                  ? { paddingLeft: 0 }
+                  : {}),
+                borderRight: 'unset',
+              }}
+            >
               <StyledLabelBox component="span">Interfaces:</StyledLabelBox>{' '}
               {isLinodeInterface ? (
                 'Linode'

packages/manager/src/features/Linodes/LinodeEntityDetailFooter.tsx

@@ -1,11 +1,11 @@
-import { useTheme } from '@mui/material/styles';
+import { useLinodeUpdateMutation, useProfile } from '@linode/queries';
 import Grid from '@mui/material/Grid2';
+import { useTheme } from '@mui/material/styles';
 import { useSnackbar } from 'notistack';
 import * as React from 'react';
 
 import { TagCell } from 'src/components/TagCell/TagCell';
 import { useRestrictedGlobalGrantCheck } from 'src/hooks/useRestrictedGlobalGrantCheck';
-import { useLinodeUpdateMutation, useProfile } from '@linode/queries';
 import { getAPIErrorOrDefault } from 'src/utilities/errorUtils';
 import { formatDate } from 'src/utilities/formatDate';
 
@@ -67,16 +67,15 @@ export const LinodeEntityDetailFooter = React.memo((props: FooterProps) => {
 
   return (
     <Grid
-      container
-      direction="row"
-      spacing={2}
       sx={{
         alignItems: 'center',
-        justifyContent: 'space-between',
         flex: 1,
-        paddingX: 1,
+        justifyContent: 'space-between',
         paddingY: 0,
       }}
+      container
+      direction="row"
+      spacing={2}
     >
       <Grid
         size={{
@@ -137,16 +136,16 @@ export const LinodeEntityDetailFooter = React.memo((props: FooterProps) => {
         </StyledBox>
       </Grid>
       <Grid
+        size={{
+          lg: 4,
+          xs: 12,
+        }}
         sx={{
           [theme.breakpoints.down('lg')]: {
             display: 'flex',
             justifyContent: 'flex-start',
           },
         }}
-        size={{
-          lg: 4,
-          xs: 12,
-        }}
       >
         <TagCell
           sx={{

packages/manager/src/features/Linodes/LinodesDetail/LinodeRebuild/LinodeRebuildForm.tsx

@@ -77,10 +77,21 @@ export const LinodeRebuildForm = (props: Props) => {
   });
 
   const onSubmit = async (values: RebuildLinodeFormValues) => {
-    if (values.reuseUserData) {
-      values.metadata = undefined;
-    } else if (values.metadata?.user_data) {
+    /**
+     * User Data logic (see https://github.com/linode/manager/pull/8850)
+     * 1) if user data has been provided, encode it and include it in the payload
+     *    The backend will use the newly provided user data.
+     * 2) if the "Reuse User Data" checkbox is checked, remove the Metadata property from the payload
+     *    The backend will continue to use the existing user data.
+     * 3) if user data has not been provided and the Reuse User Data checkbox is not checked, send null in the payload
+     *    The backend deletes the Linode's user data. The Linode will no longer use user data.
+     */
+    if (values.metadata?.user_data) {
       values.metadata.user_data = utoa(values.metadata.user_data);
+    } else if (values.reuseUserData) {
+      values.metadata = undefined;
+    } else {
+      values.metadata = { user_data: null };
     }
 
     // Distributed instances are encrypted by default and disk_encryption should not be included in the payload.

packages/validation/src/linodes.schema.ts

@@ -390,7 +390,10 @@ export const RebuildLinodeSchema = object({
   stackscript_id: number().optional(),
   stackscript_data: stackscript_data.notRequired(),
   booted: boolean().optional(),
-  metadata: MetadataSchema.optional(),
+  /**
+   * `metadata` is an optional object with required properties (see https://github.com/jquense/yup/issues/772)
+   */
+  metadata: MetadataSchema.optional().default(undefined),
   disk_encryption: string().oneOf(['enabled', 'disabled']).optional(),
 });