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

Jump to bottom

fix: [M3-7251] Interface-level VPC IPv4 error in Add/Edit Linode Config dialog when VPC IPv4 checkbox is unchecked but VPC IPv4 not provided #9779

Closed
wants to merge 30 commits into from
Closed

fix: [M3-7251] Interface-level VPC IPv4 error in Add/Edit Linode Config dialog when VPC IPv4 checkbox is unchecked but VPC IPv4 not provided #9779

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
30 commits
Select commit Hold shift + click to select a range
168fa98
display vpc in the network interfaces column of the config table
hana-akamai Sep 19, 2023
e325b51
linode add config vpc state
hana-akamai Sep 21, 2023
21bc318
fix label error on submit
hana-akamai Sep 22, 2023
6e66e00
fix vpc select and errors not displaying
hana-akamai Sep 22, 2023
8bb08e9
filter by region
hana-akamai Sep 22, 2023
2728840
feature flag vpc option
hana-akamai Sep 25, 2023
307c089
fix vpc and subnet validation errors
hana-akamai Sep 25, 2023
d87c0d3
fix vpc ipv4 input being overwritten
hana-akamai Sep 25, 2023
0c2fed9
clean up payload
hana-akamai Sep 25, 2023
3242a49
fix vlan ipam_address not nullable
hana-akamai Sep 25, 2023
55bfffb
clean up error code
hana-akamai Sep 25, 2023
c1c4106
fix type errors
hana-akamai Sep 26, 2023
94cc92e
use VPCPanel
hana-akamai Sep 27, 2023
fc008f2
clean up and fix styling
hana-akamai Sep 27, 2023
66015bf
Merge branch 'develop' into M3-7121-vpc-add-config-dialog-and-table
hana-akamai Sep 27, 2023
47a48cf
Merge in latest develop and resolve conflicts
DevDW Sep 28, 2023
8e508c8
Fix styling of VPC panel in Linode Create flow
DevDW Sep 28, 2023
0243356
Formatting fixed for VPCPanel in Add/Edit Config dialog; Primary Inte…
DevDW Sep 29, 2023
4f42031
Refactors in LinodeConfigDialog.tsx; refactors in InterfaceSelect.tsx…
DevDW Sep 29, 2023
8f919ce
Move destructured props higher in function component body in Interfac…
DevDW Sep 30, 2023
8af257c
Ensure primaryInterfaceIndex is 0 if we are in Create mode upon dialo…
DevDW Oct 2, 2023
bc6ea6e
Adjust useEffect() logic to handle for non-VPC cases to prevent VLAN bug
DevDW Oct 2, 2023
1c5d210
Don't display 'None' option for VPC interfaces in Config dialog
DevDW Oct 3, 2023
6950b89
Fix Assign Linode bug; minor casing adjustment in variable name
DevDW Oct 5, 2023
bfa3ea6
Temporary solution for surfacing a couple of errors pending API fix
DevDW Oct 6, 2023
ccba866
fix types
hana-akamai Oct 6, 2023
6922b0b
Set custom breakpoint conditionally to stack elements sooner and avoi…
DevDW Oct 6, 2023
6d969d7
Merge branch 'M3-7121-vpc-add-config-dialog-and-table' of https://git…
DevDW Oct 6, 2023
35e5874
POC to surface and clear errors at index level for VPC IPv4 field whe…
DevDW Oct 10, 2023
484eebf
Merge in latest develop and resolve conflicts
DevDW Oct 17, 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
31 changes: 30 additions & 1 deletion packages/manager/src/features/Linodes/LinodesDetail/LinodeConfigs/LinodeConfigDialog.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -269,6 +269,10 @@ export const LinodeConfigDialog = (props: Props) => {
setPrimaryInterfaceIndex,
] = React.useState<number>();

const [insufficientVPCIPv4Data, setInsufficientVPCIPv4Data] = React.useState(
{}
);

const regionHasVLANS = regions.some(
(thisRegion) =>
thisRegion.id === linode?.region &&
Expand Down Expand Up @@ -998,6 +1002,26 @@ export const LinodeConfigDialog = (props: Props) => {
</>
)}
{values.interfaces.map((thisInterface, idx) => {
const surfaceVPCIPv4Error = () => {
const testing = {};
testing[`${idx}`] = true;

setInsufficientVPCIPv4Data((insufficientVPCIPv4Data) => ({
...insufficientVPCIPv4Data,
...testing,
}));
};

const clearVPCIPv4Error = () => {
const testing = {};
testing[`${idx}`] = false;

setInsufficientVPCIPv4Data((insufficientVPCIPv4Data) => ({
...insufficientVPCIPv4Data,
...testing,
}));
};

return (
<InterfaceSelect
errors={{
Expand All @@ -1010,11 +1034,15 @@ export const LinodeConfigDialog = (props: Props) => {
formik.errors[`interfaces[${idx}].subnet_id`],
vpcError: formik.errors[`interfaces[${idx}].vpc_id`],
vpcIPv4Error:
formik.errors[`interfaces[${idx}].ipv4.vpc`],
formik.errors[`interfaces[${idx}].ipv4.vpc`] ||
insufficientVPCIPv4Data[idx]
? 'Must be a valid IPv4 address, e.g. 192.168.2.0'
: undefined,
}}
handleChange={(newInterface: Interface) =>
handleInterfaceChange(idx, newInterface)
}
clearVPCIPv4Error={clearVPCIPv4Error}
ipamAddress={thisInterface.ipam_address}
key={`eth${idx}-interface`}
label={thisInterface.label}
Expand All @@ -1023,6 +1051,7 @@ export const LinodeConfigDialog = (props: Props) => {
region={linode?.region}
slotNumber={idx}
subnetId={thisInterface.subnet_id}
surfaceVPCIPv4Error={surfaceVPCIPv4Error}
vpcIPv4={thisInterface.ipv4?.vpc}
vpcId={thisInterface.vpc_id}
/>
Expand Down
30 changes: 30 additions & 0 deletions packages/manager/src/features/Linodes/LinodesDetail/LinodeSettings/InterfaceSelect.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import { isFeatureEnabled } from 'src/utilities/accountCapabilities';
import { sendLinodeCreateDocsEvent } from 'src/utilities/analytics';

export interface Props {
clearVPCIPv4Error?: () => void;
fromAddonsPanel?: boolean;
handleChange: (updatedInterface: ExtendedInterface) => void;
ipamAddress?: null | string;
Expand All @@ -27,6 +28,23 @@ export interface Props {
readOnly: boolean;
region?: string;
slotNumber: number;
surfaceVPCIPv4Error?: () => void;
}

interface VPCStateErrors {
ipamError?: string;
labelError?: string;
nat_1_1Error?: string;
subnetError?: string;
vpcError?: string;
vpcIPv4Error?: string;
}

interface VPCState {
errors: VPCStateErrors;
subnetId?: null | number;
vpcIPv4?: string;
vpcId?: null | number;
}

interface VPCStateErrors {
Expand Down Expand Up @@ -56,6 +74,7 @@ type CombinedProps = Props & VPCState;

export const InterfaceSelect = (props: CombinedProps) => {
const {
clearVPCIPv4Error,
errors,
fromAddonsPanel,
handleChange,
Expand All @@ -66,6 +85,7 @@ export const InterfaceSelect = (props: CombinedProps) => {
region,
slotNumber,
subnetId,
surfaceVPCIPv4Error,
vpcIPv4,
vpcId,
} = props;
Expand Down Expand Up @@ -227,6 +247,16 @@ export const InterfaceSelect = (props: CombinedProps) => {
}
}, [autoAssignVPCIPv4, autoAssignLinodeIPv4, purpose]);

React.useEffect(() => {
if (!autoAssignVPCIPv4 && !vpcIPv4 && surfaceVPCIPv4Error) {
surfaceVPCIPv4Error();
}

if (!autoAssignVPCIPv4 && vpcIPv4 && clearVPCIPv4Error) {
clearVPCIPv4Error();
}
}, [autoAssignVPCIPv4, vpcIPv4]);

const handleCreateOption = (_newVlan: string) => {
setNewVlan(_newVlan);
handleChange({
Expand Down