Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: [M3-7252] - Only show regions that support VPCs in VPC Create page #9787

Merged
merged 4 commits into from
Oct 17, 2023
Merged

feat: [M3-7252] - Only show regions that support VPCs in VPC Create page #9787

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
964a18c
filter to regions that support VPCs for VPCCreate
coliu-akamai Oct 12, 2023
45cdd2b
hide disabled Tokyo from
coliu-akamai Oct 12, 2023
49c0648
Added changeset: Only show regions that support VPCs in VPC Create page
coliu-akamai Oct 12, 2023
e60de74
mocked regions to include vpc capabilities
coliu-akamai Oct 16, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions packages/manager/.changeset/pr-9787-upcoming-features-1697145963212.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@linode/manager": Upcoming Features
---

Only show regions that support VPCs in VPC Create page ([#9787](https://github.com/linode/manager/pull/9787))
37 changes: 26 additions & 11 deletions packages/manager/cypress/e2e/core/vpc/vpc-create.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,17 @@
*/

import type { Subnet, VPC } from '@linode/api-v4';
import { vpcFactory, subnetFactory, linodeFactory } from '@src/factories';
import {
vpcFactory,
subnetFactory,
linodeFactory,
regionFactory,
} from '@src/factories';
import {
mockAppendFeatureFlags,
mockGetFeatureFlagClientstream,
} from 'support/intercepts/feature-flags';
import { mockGetRegions } from 'support/intercepts/regions';
import {
mockCreateVPCError,
mockCreateVPC,
Expand Down Expand Up @@ -44,7 +50,9 @@ describe('VPC create flow', () => {
* - Confirms that UI redirects to created VPC page after creating a VPC.
*/
it('can create a VPC', () => {
const vpcRegion = chooseRegion();
const mockVPCRegion = regionFactory.build({
capabilities: ['VPCs'],
});

const mockSubnets: Subnet[] = buildArray(3, (index: number) => {
return subnetFactory.build({
Expand All @@ -61,7 +69,7 @@ describe('VPC create flow', () => {
const mockVpc: VPC = vpcFactory.build({
id: randomNumber(10000, 99999),
label: randomLabel(),
region: vpcRegion.id,
region: mockVPCRegion.id,
description: randomPhrase(),
subnets: mockSubnets,
});
Expand All @@ -75,13 +83,15 @@ describe('VPC create flow', () => {
}).as('getFeatureFlags');
mockGetFeatureFlagClientstream().as('getClientstream');

mockGetRegions([mockVPCRegion]).as('getRegions');

cy.visitWithLogin('/vpcs/create');
cy.wait(['@getFeatureFlags', '@getClientstream']);
cy.wait(['@getFeatureFlags', '@getClientstream', '@getRegions']);

cy.findByText('Region')
.should('be.visible')
.click()
.type(`${vpcRegion.label}{enter}`);
.type(`${mockVPCRegion.label}{enter}`);

cy.findByText('VPC Label').should('be.visible').click().type(mockVpc.label);

Expand Down Expand Up @@ -250,7 +260,7 @@ describe('VPC create flow', () => {
cy.contains(`Subnets ${mockVpc.subnets.length}`).should('be.visible');
cy.contains(`Linodes ${totalSubnetUniqueLinodes}`).should('be.visible');
cy.contains(`VPC ID ${mockVpc.id}`).should('be.visible');
cy.contains(`Region ${vpcRegion.label}`).should('be.visible');
cy.contains(`Region ${mockVPCRegion.label}`).should('be.visible');
});

mockSubnets.forEach((mockSubnet: Subnet) => {
Expand All @@ -272,11 +282,14 @@ describe('VPC create flow', () => {
* - Confirms that Cloud Manager UI responds accordingly when creating a VPC without subnets.
*/
it('can create a VPC without any subnets', () => {
const vpcRegion = chooseRegion();
const mockVPCRegion = regionFactory.build({
capabilities: ['VPCs'],
});

const mockVpc: VPC = vpcFactory.build({
id: randomNumber(10000, 99999),
label: randomLabel(),
region: vpcRegion.id,
region: mockVPCRegion.id,
description: randomPhrase(),
subnets: [],
});
Expand All @@ -288,13 +301,15 @@ describe('VPC create flow', () => {
}).as('getFeatureFlags');
mockGetFeatureFlagClientstream().as('getClientstream');

mockGetRegions([mockVPCRegion]).as('getRegions');

cy.visitWithLogin('/vpcs/create');
cy.wait(['@getFeatureFlags', '@getClientstream']);
cy.wait(['@getFeatureFlags', '@getClientstream', '@getRegions']);

cy.findByText('Region')
.should('be.visible')
.click()
.type(`${vpcRegion.label}{enter}`);
.type(`${mockVPCRegion.label}{enter}`);

cy.findByText('VPC Label').should('be.visible').click().type(mockVpc.label);

Expand Down Expand Up @@ -338,7 +353,7 @@ describe('VPC create flow', () => {
cy.contains(`Subnets ${mockVpc.subnets.length}`).should('be.visible');
cy.contains(`Linodes ${totalSubnetUniqueLinodes}`).should('be.visible');
cy.contains(`VPC ID ${mockVpc.id}`).should('be.visible');
cy.contains(`Region ${vpcRegion.label}`).should('be.visible');
cy.contains(`Region ${mockVPCRegion.label}`).should('be.visible');
});

cy.findByText('No Subnets are assigned.').should('be.visible');
Expand Down
2 changes: 1 addition & 1 deletion packages/manager/src/components/EnhancedSelect/variants/RegionSelect/disabledRegions.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ interface DisabledRegion {
export const listOfDisabledRegions: DisabledRegion[] = [
{
disabledMessage: tokyoDisabledMessage,
excludePaths: ['/object-storage/buckets/create'],
excludePaths: ['/object-storage/buckets/create', '/vpcs/create'],
fakeRegion: fakeTokyo,
featureFlag: 'soldOutTokyo',
},
Expand Down
4 changes: 3 additions & 1 deletion packages/manager/src/features/VPCs/VPCCreate/VPCCreate.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,8 @@ const VPCCreate = () => {
const { data: profile } = useProfile();
const { data: grants } = useGrants();
const { data: regions } = useRegionsQuery();
const regionsWithVPCCapability =
regions?.filter((region) => region.capabilities.includes('VPCs')) ?? [];
const { isLoading, mutateAsync: createVPC } = useCreateVPCMutation();
const [
generalSubnetErrorsFromAPI,
Expand Down Expand Up @@ -242,7 +244,7 @@ const VPCCreate = () => {
disabled={userCannotAddVPC}
errorText={errors.region}
isClearable
regions={regions ?? []}
regions={regionsWithVPCCapability}
selectedID={values.region}
/>
<TextField
Expand Down