Skip to content

Commit

Permalink
Merge branch 'develop' into M3-7721-switch-api-from-aglb-to-aclb
Browse files Browse the repository at this point in the history
  • Loading branch information
bnussman committed Feb 6, 2024
2 parents 6adb2ac + 418f4f6 commit 093715b
Show file tree
Hide file tree
Showing 17 changed files with 443 additions and 93 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@linode/manager": Upcoming Features
---

Create Placement Groups Select component ([#10100](https://github.com/linode/manager/pull/10100))
5 changes: 5 additions & 0 deletions packages/manager/.changeset/pr-10142-fixed-1707158870254.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@linode/manager": Fixed
---

Unit tests Button enabled assertions ([#10142](https://github.com/linode/manager/pull/10142))
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@linode/manager": Tech Stories
---

DC Get Well - Cleanup/Remove feature flag logic ([#10146](https://github.com/linode/manager/pull/10146))
5 changes: 5 additions & 0 deletions packages/manager/.changeset/pr-10150-tests-1707236804326.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@linode/manager": Tests
---

Fix billing contact Cypress test by narrowing element selection scope ([#10150](https://github.com/linode/manager/pull/10150))
132 changes: 70 additions & 62 deletions packages/manager/cypress/e2e/core/billing/billing-contact.spec.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { mockGetAccount, mockUpdateAccount } from 'support/intercepts/account';
import { accountFactory } from 'src/factories/account';
import type { Account } from '@linode/api-v4';
import { ui } from 'support/ui';

/* eslint-disable sonarjs/no-duplicate-string */
const accountData = accountFactory.build({
Expand Down Expand Up @@ -66,75 +67,82 @@ describe('Billing Contact', () => {
// mock the user's account data and confirm that it is displayed correctly upon page load
mockGetAccount(accountData).as('getAccount');
cy.visitWithLogin('/account/billing');
checkAccountContactDisplay(accountData);

// edit the billing contact information
mockUpdateAccount(newAccountData).as('updateAccount');
cy.get('[data-qa-contact-summary]').within((_contact) => {
checkAccountContactDisplay(accountData);
cy.findByText('Edit').should('be.visible').click();
});
// check drawer is visible
cy.findByLabelText('First Name')
.should('be.visible')
.click()
.clear()
.type(newAccountData['first_name']);
cy.findByLabelText('Last Name')
.should('be.visible')
.click()
.clear()
.type(newAccountData['last_name']);
cy.findByLabelText('Company Name')
.should('be.visible')
.click()
.clear()
.type(newAccountData['company']);
cy.findByLabelText('Address')
.should('be.visible')
.click()
.clear()
.type(newAccountData['address_1']);
cy.findByLabelText('Address 2')
.should('be.visible')
.click()
.clear()
.type(newAccountData['address_2']);
cy.findByLabelText('Email (required)')
.should('be.visible')
.click()
.clear()
.type(newAccountData['email']);
cy.findByLabelText('City')
.should('be.visible')
.click()
.clear()
.type(newAccountData['city']);
cy.findByLabelText('Postal Code')
.should('be.visible')
.click()
.clear()
.type(newAccountData['zip']);
cy.findByLabelText('Phone')
.should('be.visible')
.click()
.clear()
.type(newAccountData['phone']);
cy.get('[data-qa-contact-country]').click().type('United States{enter}');
cy.get('[data-qa-contact-state-province]')
.should('be.visible')
.click()
.type(`${newAccountData['state']}{enter}`);
cy.findByLabelText('Tax ID')

ui.drawer
.findByTitle('Edit Billing Contact Info')
.should('be.visible')
.click()
.clear()
.type(newAccountData['tax_id']);
cy.get('[data-qa-save-contact-info="true"]')
.click()
.then(() => {
cy.wait('@updateAccount').then((xhr) => {
expect(xhr.response?.body).to.eql(newAccountData);
});
.within(() => {
cy.findByLabelText('First Name')
.should('be.visible')
.click()
.clear()
.type(newAccountData['first_name']);
cy.findByLabelText('Last Name')
.should('be.visible')
.click()
.clear()
.type(newAccountData['last_name']);
cy.findByLabelText('Company Name')
.should('be.visible')
.click()
.clear()
.type(newAccountData['company']);
cy.findByLabelText('Address')
.should('be.visible')
.click()
.clear()
.type(newAccountData['address_1']);
cy.findByLabelText('Address 2')
.should('be.visible')
.click()
.clear()
.type(newAccountData['address_2']);
cy.findByLabelText('Email (required)')
.should('be.visible')
.click()
.clear()
.type(newAccountData['email']);
cy.findByLabelText('City')
.should('be.visible')
.click()
.clear()
.type(newAccountData['city']);
cy.findByLabelText('Postal Code')
.should('be.visible')
.click()
.clear()
.type(newAccountData['zip']);
cy.findByLabelText('Phone')
.should('be.visible')
.click()
.clear()
.type(newAccountData['phone']);
cy.get('[data-qa-contact-country]')
.click()
.type('United States{enter}');
cy.get('[data-qa-contact-state-province]')
.should('be.visible')
.click()
.type(`${newAccountData['state']}{enter}`);
cy.findByLabelText('Tax ID')
.should('be.visible')
.click()
.clear()
.type(newAccountData['tax_id']);
cy.get('[data-qa-save-contact-info="true"]')
.click()
.then(() => {
cy.wait('@updateAccount').then((xhr) => {
expect(xhr.response?.body).to.eql(newAccountData);
});
});
});

// check the page updates to reflect the edits
Expand Down
Original file line number Diff line number Diff line change
@@ -1,20 +1,46 @@
import { Region } from '@linode/api-v4/lib/regions';
import { useTheme } from '@mui/material/styles';
import * as React from 'react';

import { Box } from 'src/components/Box';
import { Notice } from 'src/components/Notice/Notice';
import { Paper } from 'src/components/Paper';
import {
PlacementGroupsSelect,
PlacementGroupsSelectProps,
} from 'src/components/PlacementGroupsSelect/PlacementGroupsSelect';
import { TagsInput, TagsInputProps } from 'src/components/TagsInput/TagsInput';
import { TextField, TextFieldProps } from 'src/components/TextField';
import { Paper } from 'src/components/Paper';
import { TooltipIcon } from 'src/components/TooltipIcon';
import { Typography } from 'src/components/Typography';
import { useFlags } from 'src/hooks/useFlags';

{
/* TODO VM_Placement: 'Learn more' Link */
}
const tooltipText = `
Add your virtual machine (VM) to a group to best meet your needs.
You may want to group VMs closer together to help improve performance, or further apart to enable high-availability configurations.
Learn more.`;

interface LabelAndTagsProps {
error?: string;
labelFieldProps?: TextFieldProps;
placementGroupsSelectProps?: PlacementGroupsSelectProps;
regions?: Region[];
tagsInputProps?: TagsInputProps;
}

export const LabelAndTagsPanel = (props: LabelAndTagsProps) => {
const theme = useTheme();
const { error, labelFieldProps, tagsInputProps } = props;
const flags = useFlags();
const showPlacementGroups = Boolean(flags.vmPlacement);
const {
error,
labelFieldProps,
placementGroupsSelectProps,
tagsInputProps,
} = props;

return (
<Paper
Expand All @@ -35,6 +61,45 @@ export const LabelAndTagsPanel = (props: LabelAndTagsProps) => {
noMarginTop
/>
{tagsInputProps && <TagsInput {...tagsInputProps} />}
{showPlacementGroups && (
<>
{!placementGroupsSelectProps?.selectedRegionId && (
<Notice
dataTestId="placement-groups-no-region-notice"
spacingBottom={0}
spacingTop={16}
variant="warning"
>
<Typography>
<b>Select a region above to see available Placement Groups.</b>
</Typography>
</Notice>
)}
{placementGroupsSelectProps && (
<Box alignItems="flex-end" display="flex">
<PlacementGroupsSelect
{...placementGroupsSelectProps}
sx={{
[theme.breakpoints.down('sm')]: {
width: 320,
},
width: '400px',
}}
/>
<TooltipIcon
sxTooltipIcon={{
marginBottom: '6px',
marginLeft: theme.spacing(),
padding: 0,
}}
status="help"
text={tooltipText}
tooltipPosition="right"
/>
</Box>
)}
</>
)}
</Paper>
);
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import * as React from 'react';

import { renderWithTheme } from 'src/utilities/testHelpers';

import {
PlacementGroupsSelect,
PlacementGroupsSelectProps,
} from './PlacementGroupsSelect';

const props: PlacementGroupsSelectProps = {
errorText: '',
handlePlacementGroupSelection: vi.fn(),
id: '',
label: 'Placement Groups in Atlanta, GA (us-southeast)',
noOptionsMessage: '',
selectedRegionId: 'us-southeast',
};

describe('PlacementGroupSelect', () => {
it('should render a Select component', () => {
const { getByTestId } = renderWithTheme(
<PlacementGroupsSelect {...props} />
);
expect(getByTestId('placement-groups-select')).toBeInTheDocument();
});

it('should render a Select component with the correct label', () => {
const { getByText } = renderWithTheme(<PlacementGroupsSelect {...props} />);
expect(getByText(/Placement Groups in /)).toBeInTheDocument();
});
});
Loading

0 comments on commit 093715b

Please sign in to comment.