From 94b24651c5e98a5f744e690af38dd6af350be312 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Fri, 1 Dec 2023 16:12:56 -0500 Subject: [PATCH 01/18] fix action cell --- packages/manager/src/components/TableCell/TableCell.tsx | 9 +-------- 1 file changed, 1 insertion(+), 8 deletions(-) diff --git a/packages/manager/src/components/TableCell/TableCell.tsx b/packages/manager/src/components/TableCell/TableCell.tsx index bbcd7d7487e..159b10fcdde 100644 --- a/packages/manager/src/components/TableCell/TableCell.tsx +++ b/packages/manager/src/components/TableCell/TableCell.tsx @@ -10,14 +10,7 @@ import { TooltipIcon } from 'src/components/TooltipIcon'; const useStyles = makeStyles()((theme: Theme) => ({ actionCell: { - // Prevents Safari from adding margins to the ActionMenu button - '& > button': { - margin: 0, - }, - alignItems: 'center', - display: 'flex', - justifyContent: 'flex-end', - padding: 0, + textAlign: 'right', }, center: { '&:last-child': { From 0d156f19ed32770e61091821f7644f2298882bd1 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Fri, 1 Dec 2023 16:23:40 -0500 Subject: [PATCH 02/18] update copy for rule drawer --- .../LoadBalancerDetail/Routes/RuleDrawer.tsx | 7 ++++--- .../LoadBalancers/LoadBalancerDetail/Routes/constants.ts | 8 ++++++-- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx index 680c9da69ff..28e137419d1 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx @@ -62,8 +62,9 @@ export const RuleDrawer = (props: Props) => { const isEditMode = ruleIndexToEdit !== undefined; - const validationSchema = - route?.protocol === 'tcp' ? TCPRuleSchema : HTTPRuleSchema; + const protocol = route?.protocol ?? 'tcp'; + + const validationSchema = protocol === 'tcp' ? TCPRuleSchema : HTTPRuleSchema; const { error, @@ -200,7 +201,7 @@ export const RuleDrawer = (props: Props) => { >
- {ROUTE_COPY.Rule.Description} + {ROUTE_COPY.Rule.Description[protocol]} {generalErrors && } diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/constants.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/constants.ts index 0e5a25e8512..76f87014622 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/constants.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/constants.ts @@ -8,8 +8,12 @@ export const ROUTE_COPY = { 'TCP rules include the percentage of incoming requests that should be directed to each target.', }, Rule: { - Description: - 'Rules set the conditions that are used for target selection. TCP rules include the percentage of incoming requests that should be directed to each target.', + Description: { + http: + 'Rules set the conditions that are used for target selection. HTTP/S rules include Match Rules and the percentage of incoming requests that should be directed to each target.', + tcp: + 'Rules set the conditions that are used for target selection. TCP rules include the percentage of incoming requests that should be directed to each target.', + }, Hostname: 'The hostname of the target where the rule applies. If a hostname is not specified, the rule applies to all targets. Wildcards (*) are supported.', MatchRule: { From 35dbf266e758f85794cb5b5529662d87b5c578c0 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Mon, 4 Dec 2023 08:47:47 -0500 Subject: [PATCH 03/18] spacing fixes --- .../Routes/CreateRouteDrawer.tsx | 4 +++- .../ServiceTargets/ServiceTargetDrawer.tsx | 14 ++++++++++++-- 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/CreateRouteDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/CreateRouteDrawer.tsx index 99a82d43fbb..6471e71731e 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/CreateRouteDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/CreateRouteDrawer.tsx @@ -61,7 +61,9 @@ export const CreateRouteDrawer = (props: Props) => { return ( - {generalError && } + {generalError && ( + + )} { )} {generalCreateErrors && ( - + )} {generalUpdateErrors && ( - + )} Date: Mon, 4 Dec 2023 09:00:21 -0500 Subject: [PATCH 04/18] add changesets --- packages/manager/.changeset/pr-9954-fixed-1701698397297.md | 5 +++++ .../.changeset/pr-9954-upcoming-features-1701698414248.md | 5 +++++ 2 files changed, 10 insertions(+) create mode 100644 packages/manager/.changeset/pr-9954-fixed-1701698397297.md create mode 100644 packages/manager/.changeset/pr-9954-upcoming-features-1701698414248.md diff --git a/packages/manager/.changeset/pr-9954-fixed-1701698397297.md b/packages/manager/.changeset/pr-9954-fixed-1701698397297.md new file mode 100644 index 00000000000..0bda884c125 --- /dev/null +++ b/packages/manager/.changeset/pr-9954-fixed-1701698397297.md @@ -0,0 +1,5 @@ +--- +"@linode/manager": Fixed +--- + +`TableCell` styling for `ActionMenu`s ([#9954](https://github.com/linode/manager/pull/9954)) diff --git a/packages/manager/.changeset/pr-9954-upcoming-features-1701698414248.md b/packages/manager/.changeset/pr-9954-upcoming-features-1701698414248.md new file mode 100644 index 00000000000..0cf3ef7f731 --- /dev/null +++ b/packages/manager/.changeset/pr-9954-upcoming-features-1701698414248.md @@ -0,0 +1,5 @@ +--- +"@linode/manager": Upcoming Features +--- + +AGLB copy changes and improvments ([#9954](https://github.com/linode/manager/pull/9954)) From 5a014b99b5eedb430f5ff17c1840d9d33998f039 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Mon, 4 Dec 2023 10:21:48 -0500 Subject: [PATCH 05/18] normalize service target payload --- packages/api-v4/src/aglb/types.ts | 6 +++--- .../ServiceTargets/ServiceTargetDrawer.tsx | 16 ++++++++++++++-- 2 files changed, 17 insertions(+), 5 deletions(-) diff --git a/packages/api-v4/src/aglb/types.ts b/packages/api-v4/src/aglb/types.ts index c6a416f7a2f..b718813796c 100644 --- a/packages/api-v4/src/aglb/types.ts +++ b/packages/api-v4/src/aglb/types.ts @@ -159,8 +159,8 @@ interface HealthCheck { timeout: number; unhealthy_threshold: number; healthy_threshold: number; - path: string; - host: string; + path?: string | null; + host?: string | null; } export interface ServiceTarget extends ServiceTargetPayload { @@ -169,7 +169,7 @@ export interface ServiceTarget extends ServiceTargetPayload { export interface Endpoint { ip: string; - host?: string; + host?: string | null; port: number; rate_capacity: number; } diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx index 0b19141992d..3f85a0b7470 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx @@ -66,11 +66,23 @@ export const ServiceTargetDrawer = (props: Props) => { enableReinitialize: true, initialValues: isEditMode ? serviceTarget : initialValues, async onSubmit(values: ServiceTargetPayload) { + const normalizedValues: ServiceTargetPayload = { + ...values, + endpoints: values.endpoints.map((e) => ({ + ...e, + host: e.host ?? null, + })), + healthcheck: { + ...values.healthcheck, + host: values.healthcheck.host ?? null, + path: values.healthcheck.path ?? null, + }, + }; try { if (isEditMode) { - await updateServiceTarget(values); + await updateServiceTarget(normalizedValues); } else { - await createServiceTarget(values); + await createServiceTarget(normalizedValues); } onClose(); } catch (errors) { From ab6c46ccf1c53af9140d7c372bf58b9d6f4fa666 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Mon, 4 Dec 2023 11:15:01 -0500 Subject: [PATCH 06/18] payload fixes --- .../Certificates/CreateCertificateDrawer.tsx | 19 +++++++++++++------ .../ServiceTargets/ServiceTargetDrawer.tsx | 6 +++--- .../validation/src/loadbalancers.schema.ts | 6 +++--- 3 files changed, 19 insertions(+), 12 deletions(-) diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/CreateCertificateDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/CreateCertificateDrawer.tsx index 7ad54c050e8..d2af36d8a02 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/CreateCertificateDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/CreateCertificateDrawer.tsx @@ -44,12 +44,19 @@ export const CreateCertificateDrawer = (props: Props) => { const formik = useFormik({ enableReinitialize: true, - initialValues: { - certificate: '', - key: '', - label: '', - type, - }, + initialValues: + type === 'ca' + ? { + certificate: '', + label: '', + type, + } + : { + certificate: '', + key: '', + label: '', + type, + }, async onSubmit(values) { try { await createCertificate(values); diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx index 3f85a0b7470..809409a3f45 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx @@ -70,12 +70,12 @@ export const ServiceTargetDrawer = (props: Props) => { ...values, endpoints: values.endpoints.map((e) => ({ ...e, - host: e.host ?? null, + host: e.host ? e.host : null, })), healthcheck: { ...values.healthcheck, - host: values.healthcheck.host ?? null, - path: values.healthcheck.path ?? null, + host: values.healthcheck.host ? values.healthcheck.host : null, + path: values.healthcheck.path ? values.healthcheck.path : null, }, }; try { diff --git a/packages/validation/src/loadbalancers.schema.ts b/packages/validation/src/loadbalancers.schema.ts index cd02d0b72bd..c9cad0fb0f2 100644 --- a/packages/validation/src/loadbalancers.schema.ts +++ b/packages/validation/src/loadbalancers.schema.ts @@ -40,7 +40,7 @@ export const CertificateConfigSchema = object({ export const EndpointSchema = object({ ip: string().required('IP is required.'), - host: string(), + host: string().nullable(), port: number() .required('Port is required.') .min(1, 'Port must be greater than 0.') @@ -54,8 +54,8 @@ const HealthCheckSchema = object({ timeout: number().min(0), unhealthy_threshold: number().min(0), healthy_threshold: number().min(0), - path: string(), - host: string(), + path: string().nullable(), + host: string().nullable(), }); export const CreateServiceTargetSchema = object({ From 5d9f012240cbaaddd0b2e01bf2bdc40f9c55ca48 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Mon, 4 Dec 2023 11:32:01 -0500 Subject: [PATCH 07/18] tcp rule payload fix --- packages/api-v4/src/aglb/types.ts | 2 +- .../LoadBalancerDetail/Routes/RuleDrawer.tsx | 16 ++++++++++++++-- packages/validation/src/loadbalancers.schema.ts | 2 +- 3 files changed, 16 insertions(+), 4 deletions(-) diff --git a/packages/api-v4/src/aglb/types.ts b/packages/api-v4/src/aglb/types.ts index b718813796c..7dcae7df052 100644 --- a/packages/api-v4/src/aglb/types.ts +++ b/packages/api-v4/src/aglb/types.ts @@ -131,7 +131,7 @@ export interface RuleCreatePayload { } export interface MatchCondition { - hostname: string; + hostname: string | null; match_field: MatchField; match_value: string; session_stickiness_cookie: string | null; diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx index 28e137419d1..6e968023c1b 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx @@ -84,9 +84,19 @@ export const RuleDrawer = (props: Props) => { try { const existingRules = route?.rules ?? []; + const normalizedRule: RulePayload = { + match_condition: { + ...rule.match_condition, + hostname: rule.match_condition.hostname + ? rule.match_condition.hostname + : null, + }, + service_targets: rule.service_targets, + }; + // If we are editing, update the rule with the form data. if (isEditMode) { - existingRules[ruleIndexToEdit] = rule; + existingRules[ruleIndexToEdit] = normalizedRule; } await updateRoute({ @@ -94,7 +104,9 @@ export const RuleDrawer = (props: Props) => { protocol: route?.protocol, // If we are editing, send the updated rules, otherwise // append a new rule to the end. - rules: isEditMode ? existingRules : [...existingRules, rule], + rules: isEditMode + ? existingRules + : [...existingRules, normalizedRule], }); onClose(); } catch (errors) { diff --git a/packages/validation/src/loadbalancers.schema.ts b/packages/validation/src/loadbalancers.schema.ts index c9cad0fb0f2..c99a46218c7 100644 --- a/packages/validation/src/loadbalancers.schema.ts +++ b/packages/validation/src/loadbalancers.schema.ts @@ -101,7 +101,7 @@ const RouteServiceTargetSchema = object({ }); const TCPMatchConditionSchema = object({ - hostname: string(), + hostname: string().nullable(), }); const HTTPMatchConditionSchema = TCPMatchConditionSchema.concat( From faa1bfa482c534db10562a8e7993df66edf30691 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Mon, 4 Dec 2023 12:13:37 -0500 Subject: [PATCH 08/18] make deleting rules work --- .../LoadBalancerDetail/Routes/DeleteRuleDialog.tsx | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx index b9149b2f185..31e6bb76fc8 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx @@ -31,8 +31,20 @@ export const DeleteRuleDialog = (props: Props) => { newRules.splice(ruleIndex, 1); + const normalizedRules = newRules.map((rule) => ({ + match_condition: { + ...rule.match_condition, + hostname: rule.match_condition.hostname + ? rule.match_condition.hostname + : null, + }, + service_targets: rule.service_targets, + })); + await mutateAsync({ - rules: newRules, + label: route.label, + protocol: route.protocol, + rules: normalizedRules, }); onClose(); }; From 379355373e74af4d9774736ea7d792a8ea681411 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Mon, 4 Dec 2023 13:34:18 -0500 Subject: [PATCH 09/18] clean up for demo --- .../LoadBalancerSummary.tsx | 42 ++++++++++++------- .../LoadBalancerLanding/LoadBalancerRow.tsx | 25 ++++++++--- .../LoadBalancerLanding/Ports.tsx | 4 ++ 3 files changed, 50 insertions(+), 21 deletions(-) diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx index 281f4d35606..4289c795bea 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx @@ -3,13 +3,14 @@ import React from 'react'; import { useParams } from 'react-router-dom'; import { Paper } from 'src/components/Paper'; +import { Stack } from 'src/components/Stack'; import { Typography } from 'src/components/Typography'; import { IPAddress } from 'src/features/Linodes/LinodesLanding/IPAddress'; import { useLoadBalancerQuery } from 'src/queries/aglb/loadbalancers'; -import { useRegionsQuery } from 'src/queries/regions'; +// import { useRegionsQuery } from 'src/queries/regions'; import { Ports } from '../LoadBalancerLanding/Ports'; -import { Stack } from 'src/components/Stack'; +import { LoadBalancerRegions } from './LoadBalancerRegions'; export const LoadBalancerSummary = () => { const { loadbalancerId } = useParams<{ loadbalancerId: string }>(); @@ -17,12 +18,23 @@ export const LoadBalancerSummary = () => { const id = Number(loadbalancerId); const { data: loadbalancer } = useLoadBalancerQuery(id); - const { data: regions } = useRegionsQuery(); + // const { data: regions } = useRegionsQuery(); const items = [ { title: 'Hostname', - value: , + value: ( + + ), + }, + { + title: 'Load Balancer ID', + value: {loadbalancer?.id}, }, { title: 'Ports', @@ -30,17 +42,15 @@ export const LoadBalancerSummary = () => { }, { title: 'Regions', - value: ( - - {loadbalancer?.regions - .map((region) => regions?.find((r) => r.id === region)?.label) - .join(', ')} - - ), - }, - { - title: 'Load Balancer ID', - value: {loadbalancer?.id}, + value: , + // Uncomment the line below to show the regions returned by the API. + // value: ( + // + // {loadbalancer?.regions + // .map((region) => regions?.find((r) => r.id === region)?.label) + // .join(', ')} + // + // ), }, ]; @@ -50,7 +60,7 @@ export const LoadBalancerSummary = () => { {items.map(({ title, value }) => ( - + {title} {value} diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx index 79c1484343c..e65fa67ae1f 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx @@ -3,12 +3,15 @@ import * as React from 'react'; import { Link } from 'react-router-dom'; import { Hidden } from 'src/components/Hidden'; +import { Stack } from 'src/components/Stack'; import { TableCell } from 'src/components/TableCell'; import { TableRow } from 'src/components/TableRow'; +import { Typography } from 'src/components/Typography'; +import { regions as alphaRegions } from '../LoadBalancerDetail/LoadBalancerRegions'; import { LoadBalancerActionsMenu } from './LoadBalancerActionsMenu'; import { Ports } from './Ports'; -import { RegionsCell } from './RegionsCell'; +import { IPAddress } from 'src/features/Linodes/LinodesLanding/IPAddress'; export interface LoadBalancerHandlers { onDelete: () => void; @@ -20,7 +23,7 @@ interface Props { } export const LoadBalancerRow = ({ handlers, loadBalancer }: Props) => { - const { hostname, id, label, regions } = loadBalancer; + const { hostname, id, label } = loadBalancer; return ( { - {hostname} + + + - {regions.map((region) => ( + + {alphaRegions.map(({ id, label }) => ( + + {label} ({id}) + + ))} + + {/* Uncomment the code below to show the regions returned by the API */} + {/* {regions.map((region) => ( - ))} + ))} */} diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/Ports.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/Ports.tsx index 0d484733c35..23a8467352f 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/Ports.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/Ports.tsx @@ -21,6 +21,10 @@ export const Ports = ({ loadbalancerId }: PortProps) => { return ; } + if (ports?.length === 0) { + return None; + } + if (error || !ports) { return Unknown; } From 2553e9005bc0f4face7caa8cda2464a345f544cb Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Mon, 4 Dec 2023 14:55:06 -0500 Subject: [PATCH 10/18] make e2es pass for alpha --- .../load-balancer-landing-page.spec.ts | 32 +++++++++---------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/packages/manager/cypress/e2e/core/loadBalancers/load-balancer-landing-page.spec.ts b/packages/manager/cypress/e2e/core/loadBalancers/load-balancer-landing-page.spec.ts index 87cec38587f..b7be9ae8955 100644 --- a/packages/manager/cypress/e2e/core/loadBalancers/load-balancer-landing-page.spec.ts +++ b/packages/manager/cypress/e2e/core/loadBalancers/load-balancer-landing-page.spec.ts @@ -72,14 +72,14 @@ describe('Akamai Global Load Balancer landing page', () => { .should('be.visible') .closest('tr') .within(() => { - // Confirm that regions are listed for load balancer. - loadbalancerMock.regions.forEach((loadbalancerRegion: string) => { - const regionLabel = getRegionById(loadbalancerRegion).label; - cy.findByText(regionLabel, { exact: false }).should('be.visible'); - cy.findByText(loadbalancerRegion, { exact: false }).should( - 'be.visible' - ); - }); + // TODO: AGLB - Confirm that regions from the API are listed for load balancer + // loadbalancerMock.regions.forEach((loadbalancerRegion: string) => { + // const regionLabel = getRegionById(loadbalancerRegion).label; + // cy.findByText(regionLabel, { exact: false }).should('be.visible'); + // cy.findByText(loadbalancerRegion, { exact: false }).should( + // 'be.visible' + // ); + // }); cy.findByText(loadbalancerMock.hostname).should('be.visible'); @@ -94,14 +94,14 @@ describe('Akamai Global Load Balancer landing page', () => { .should('be.visible') .closest('tr') .within(() => { - // Confirm that regions are listed for load balancer. - loadbalancerMock.regions.forEach((loadbalancerRegion: string) => { - const regionLabel = getRegionById(loadbalancerRegion).label; - cy.findByText(regionLabel, { exact: false }).should('be.visible'); - cy.findByText(loadbalancerRegion, { exact: false }).should( - 'be.visible' - ); - }); + // TODO: AGLB - Confirm that regions from the API are listed for load balancer + // loadbalancerMock.regions.forEach((loadbalancerRegion: string) => { + // const regionLabel = getRegionById(loadbalancerRegion).label; + // cy.findByText(regionLabel, { exact: false }).should('be.visible'); + // cy.findByText(loadbalancerRegion, { exact: false }).should( + // 'be.visible' + // ); + // }); ui.actionMenu .findByTitle( From ba3d8af19a82ed73b15c978275f45c0dcd601c41 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Mon, 4 Dec 2023 15:28:59 -0500 Subject: [PATCH 11/18] clean up --- .../Certificates/CreateCertificateDrawer.tsx | 15 ++---------- .../Certificates/constants.ts | 14 +++++++++++ .../LoadBalancerSummary.tsx | 9 +------ .../Routes/DeleteRuleDialog.tsx | 11 ++------- .../LoadBalancerDetail/Routes/RuleDrawer.tsx | 11 ++------- .../LoadBalancerDetail/Routes/utils.ts | 14 +++++++++++ .../ServiceTargets/ServiceTargetDrawer.tsx | 18 ++++---------- .../ServiceTargets/utils.ts | 24 +++++++++++++++++++ .../LoadBalancerLanding/LoadBalancerRow.tsx | 4 +--- 9 files changed, 65 insertions(+), 55 deletions(-) create mode 100644 packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.ts diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/CreateCertificateDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/CreateCertificateDrawer.tsx index d2af36d8a02..a1e04d70220 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/CreateCertificateDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/CreateCertificateDrawer.tsx @@ -14,6 +14,7 @@ import { CERTIFICATES_COPY, exampleCert, exampleKey, + initialValues, labelMap, titleMap, } from './constants'; @@ -44,19 +45,7 @@ export const CreateCertificateDrawer = (props: Props) => { const formik = useFormik({ enableReinitialize: true, - initialValues: - type === 'ca' - ? { - certificate: '', - label: '', - type, - } - : { - certificate: '', - key: '', - label: '', - type, - }, + initialValues: initialValues[type], async onSubmit(values) { try { await createCertificate(values); diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/constants.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/constants.ts index b56aa642b9a..e1c6d48d616 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/constants.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/constants.ts @@ -1,5 +1,19 @@ import type { Certificate } from '@linode/api-v4'; +export const initialValues = { + ca: { + certificate: '', + label: '', + type: 'ca', + }, + downstream: { + certificate: '', + key: '', + label: '', + type: 'downstream', + }, +} as const; + export const CERTIFICATES_COPY = { Create: { ca: diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx index 4289c795bea..1d88703e25b 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx @@ -23,14 +23,7 @@ export const LoadBalancerSummary = () => { const items = [ { title: 'Hostname', - value: ( - - ), + value: , }, { title: 'Load Balancer ID', diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx index 31e6bb76fc8..4dd14aed0db 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx @@ -5,6 +5,7 @@ import { ConfirmationDialog } from 'src/components/ConfirmationDialog/Confirmati import { useLoadBalancerRouteUpdateMutation } from 'src/queries/aglb/routes'; import type { Route } from '@linode/api-v4'; +import { getNormzlizedRulePayload } from './utils'; interface Props { loadbalancerId: number; @@ -31,15 +32,7 @@ export const DeleteRuleDialog = (props: Props) => { newRules.splice(ruleIndex, 1); - const normalizedRules = newRules.map((rule) => ({ - match_condition: { - ...rule.match_condition, - hostname: rule.match_condition.hostname - ? rule.match_condition.hostname - : null, - }, - service_targets: rule.service_targets, - })); + const normalizedRules = newRules.map(getNormzlizedRulePayload); await mutateAsync({ label: route.label, diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx index 6e968023c1b..a63467fc219 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx @@ -27,6 +27,7 @@ import { defaultServiceTarget, defaultTTL, getIsSessionStickinessEnabled, + getNormzlizedRulePayload, initialValues, matchTypeOptions, matchValuePlaceholder, @@ -84,15 +85,7 @@ export const RuleDrawer = (props: Props) => { try { const existingRules = route?.rules ?? []; - const normalizedRule: RulePayload = { - match_condition: { - ...rule.match_condition, - hostname: rule.match_condition.hostname - ? rule.match_condition.hostname - : null, - }, - service_targets: rule.service_targets, - }; + const normalizedRule: RulePayload = getNormzlizedRulePayload(rule); // If we are editing, update the rule with the form data. if (isEditMode) { diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts index c3c52efff7f..674a5fe9ab1 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts @@ -61,6 +61,20 @@ export const getIsSessionStickinessEnabled = (rule: Rule | RulePayload) => { ); }; +/** + * Converts empty strings to `null` in RulePayload + * so that the API accept the payload. + */ +export const getNormzlizedRulePayload = (rule: RulePayload) => ({ + match_condition: { + ...rule.match_condition, + hostname: rule.match_condition.hostname + ? rule.match_condition.hostname + : null, + }, + service_targets: rule.service_targets, +}); + export const timeUnitFactorMap = { millisecond: 1, second: 1000, diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx index 809409a3f45..e75f0c5eba6 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx @@ -37,6 +37,7 @@ import { initialValues, protocolOptions, } from './constants'; +import { getNormzlizedServiceTargetPayload } from './utils'; interface Props { loadbalancerId: number; @@ -65,19 +66,10 @@ export const ServiceTargetDrawer = (props: Props) => { const formik = useFormik({ enableReinitialize: true, initialValues: isEditMode ? serviceTarget : initialValues, - async onSubmit(values: ServiceTargetPayload) { - const normalizedValues: ServiceTargetPayload = { - ...values, - endpoints: values.endpoints.map((e) => ({ - ...e, - host: e.host ? e.host : null, - })), - healthcheck: { - ...values.healthcheck, - host: values.healthcheck.host ? values.healthcheck.host : null, - path: values.healthcheck.path ? values.healthcheck.path : null, - }, - }; + async onSubmit(values) { + const normalizedValues: ServiceTargetPayload = getNormzlizedServiceTargetPayload( + values + ); try { if (isEditMode) { await updateServiceTarget(normalizedValues); diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.ts new file mode 100644 index 00000000000..52214ca14b6 --- /dev/null +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.ts @@ -0,0 +1,24 @@ +import type { ServiceTargetPayload } from '@linode/api-v4'; + +/** + * Replaces empty strings with `null` in ServiceTargetPayload + * so that the API accepts the request. + */ +export const getNormzlizedServiceTargetPayload = ( + serviceTarget: ServiceTargetPayload +) => ({ + ...serviceTarget, + endpoints: serviceTarget.endpoints.map((e) => ({ + ...e, + host: e.host ? e.host : null, + })), + healthcheck: { + ...serviceTarget.healthcheck, + host: serviceTarget.healthcheck.host + ? serviceTarget.healthcheck.host + : null, + path: serviceTarget.healthcheck.path + ? serviceTarget.healthcheck.path + : null, + }, +}); diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx index e65fa67ae1f..43c6262e2a6 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx @@ -40,9 +40,7 @@ export const LoadBalancerRow = ({ handlers, loadBalancer }: Props) => { - + {hostname ? : 'None'} From 0956f04e5cbc8ccb12655a8a9aea16578efac28d Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Mon, 4 Dec 2023 15:42:23 -0500 Subject: [PATCH 12/18] add tests --- .../Routes/DeleteRuleDialog.tsx | 3 +- .../LoadBalancerDetail/Routes/utils.test.ts | 39 +++++++++++++ .../LoadBalancerDetail/Routes/utils.ts | 2 +- .../ServiceTargets/utils.test.ts | 55 +++++++++++++++++++ 4 files changed, 97 insertions(+), 2 deletions(-) create mode 100644 packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts create mode 100644 packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx index 4dd14aed0db..fd7c68eaa24 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx @@ -4,9 +4,10 @@ import { ActionsPanel } from 'src/components/ActionsPanel/ActionsPanel'; import { ConfirmationDialog } from 'src/components/ConfirmationDialog/ConfirmationDialog'; import { useLoadBalancerRouteUpdateMutation } from 'src/queries/aglb/routes'; -import type { Route } from '@linode/api-v4'; import { getNormzlizedRulePayload } from './utils'; +import type { Route } from '@linode/api-v4'; + interface Props { loadbalancerId: number; onClose: () => void; diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts new file mode 100644 index 00000000000..6d641836273 --- /dev/null +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts @@ -0,0 +1,39 @@ +import { getNormzlizedRulePayload } from './utils'; + +describe('getNormzlizedRulePayload', () => { + it('should change empty strings to null', () => { + expect( + getNormzlizedRulePayload({ + match_condition: { + hostname: '', + match_field: 'path_prefix', + match_value: '', + session_stickiness_cookie: null, + session_stickiness_ttl: null, + }, + service_targets: [ + { + id: 42, + label: 'test-1', + percentage: 100, + }, + ], + }) + ).toStrictEqual({ + match_condition: { + hostname: null, + match_field: 'path_prefix', + match_value: '', + session_stickiness_cookie: null, + session_stickiness_ttl: null, + }, + service_targets: [ + { + id: 42, + label: 'test-1', + percentage: 100, + }, + ], + }); + }); +}); diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts index 674a5fe9ab1..98624ebfa22 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts @@ -62,7 +62,7 @@ export const getIsSessionStickinessEnabled = (rule: Rule | RulePayload) => { }; /** - * Converts empty strings to `null` in RulePayload + * Converts some empty strings to `null` in RulePayload * so that the API accept the payload. */ export const getNormzlizedRulePayload = (rule: RulePayload) => ({ diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts new file mode 100644 index 00000000000..5adaedbdeb3 --- /dev/null +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts @@ -0,0 +1,55 @@ +import { getNormzlizedServiceTargetPayload } from './utils'; + +describe('getNormzlizedRulePayload', () => { + it('should change empty strings to null', () => { + expect( + getNormzlizedServiceTargetPayload({ + certificate_id: null, + endpoints: [ + { + host: '', + ip: '139.144.129.228', + port: 80, + rate_capacity: 10000, + }, + ], + healthcheck: { + healthy_threshold: 3, + host: '', + interval: 10, + path: '', + protocol: 'http', + timeout: 5, + unhealthy_threshold: 3, + }, + label: 'test', + load_balancing_policy: 'round_robin', + percentage: 10, + protocol: 'https', + }) + ).toStrictEqual({ + certificate_id: null, + endpoints: [ + { + host: null, + ip: '139.144.129.228', + port: 80, + rate_capacity: 10000, + }, + ], + healthcheck: { + healthy_threshold: 3, + host: null, + interval: 10, + path: null, + protocol: 'http', + timeout: 5, + unhealthy_threshold: 3, + }, + label: 'test', + load_balancing_policy: 'round_robin', + percentage: 10, + protocol: 'https', + }); + }); +}); From 7df6d06f16db1cd9dc9c7c2767862c5ace81330e Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Tue, 5 Dec 2023 10:32:28 -0500 Subject: [PATCH 13/18] small fixes --- .../LoadBalancerDetail/Routes/RuleDrawer.tsx | 1 + .../LoadBalancers/LoadBalancerDetail/RuleRow.tsx | 10 +++++----- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx index a63467fc219..660ed808ffb 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx @@ -228,6 +228,7 @@ export const RuleDrawer = (props: Props) => { name="match_condition.hostname" onBlur={formik.handleBlur} onChange={formik.handleChange} + optional placeholder="www.example.com" value={formik.values.match_condition.hostname} /> diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/RuleRow.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/RuleRow.tsx index 552bde34d07..a27a81788ed 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/RuleRow.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/RuleRow.tsx @@ -86,7 +86,9 @@ export const RuleRow = (props: RuleRowProps) => { }} aria-label={`Match value: ${rule.match_condition.match_value}`} > - {rule.match_condition.match_value} + {rule.match_condition.match_value + ? rule.match_condition.match_value + : 'None'} @@ -112,10 +114,8 @@ export const RuleRow = (props: RuleRowProps) => { - {rule.service_targets.map(({ id, label }) => ( -
- {label}:{id} -
+ {rule.service_targets.map(({ label }) => ( +
{label}
))} } From f55d6977e2aefbe09bbc33d03670037d3f7e2c01 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Tue, 5 Dec 2023 10:42:24 -0500 Subject: [PATCH 14/18] spelling fixes --- .../Routes/DeleteRuleDialog.tsx | 4 ++-- .../LoadBalancerDetail/Routes/RuleDrawer.tsx | 16 ++++++++++++---- .../LoadBalancerDetail/Routes/utils.test.ts | 4 ++-- .../LoadBalancerDetail/Routes/utils.ts | 2 +- .../ServiceTargets/ServiceTargetDrawer.tsx | 4 ++-- .../ServiceTargets/utils.test.ts | 4 ++-- .../LoadBalancerDetail/ServiceTargets/utils.ts | 2 +- 7 files changed, 22 insertions(+), 14 deletions(-) diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx index fd7c68eaa24..c3d1804c251 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/DeleteRuleDialog.tsx @@ -4,7 +4,7 @@ import { ActionsPanel } from 'src/components/ActionsPanel/ActionsPanel'; import { ConfirmationDialog } from 'src/components/ConfirmationDialog/ConfirmationDialog'; import { useLoadBalancerRouteUpdateMutation } from 'src/queries/aglb/routes'; -import { getNormzlizedRulePayload } from './utils'; +import { getNormalizedRulePayload } from './utils'; import type { Route } from '@linode/api-v4'; @@ -33,7 +33,7 @@ export const DeleteRuleDialog = (props: Props) => { newRules.splice(ruleIndex, 1); - const normalizedRules = newRules.map(getNormzlizedRulePayload); + const normalizedRules = newRules.map(getNormalizedRulePayload); await mutateAsync({ label: route.label, diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx index 660ed808ffb..f4e7d6f8d06 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx @@ -27,7 +27,7 @@ import { defaultServiceTarget, defaultTTL, getIsSessionStickinessEnabled, - getNormzlizedRulePayload, + getNormalizedRulePayload, initialValues, matchTypeOptions, matchValuePlaceholder, @@ -85,7 +85,7 @@ export const RuleDrawer = (props: Props) => { try { const existingRules = route?.rules ?? []; - const normalizedRule: RulePayload = getNormzlizedRulePayload(rule); + const normalizedRule: RulePayload = getNormalizedRulePayload(rule); // If we are editing, update the rule with the form data. if (isEditMode) { @@ -339,10 +339,18 @@ export const RuleDrawer = (props: Props) => { : undefined } onChange={(serviceTarget) => { - formik.setFieldTouched(`service_targets[${index}].id`); + formik.setFieldTouched( + `service_targets[${index}].id`, + true + ); formik.setFieldValue( `service_targets[${index}].id`, - serviceTarget?.id ?? -1 + serviceTarget?.id ?? -1, + true + ); + formik.setFieldValue( + `service_targets[${index}].label`, + serviceTarget?.label ?? '' ); }} loadbalancerId={loadbalancerId} diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts index 6d641836273..202d4e1b462 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts @@ -1,9 +1,9 @@ -import { getNormzlizedRulePayload } from './utils'; +import { getNormalizedRulePayload } from './utils'; describe('getNormzlizedRulePayload', () => { it('should change empty strings to null', () => { expect( - getNormzlizedRulePayload({ + getNormalizedRulePayload({ match_condition: { hostname: '', match_field: 'path_prefix', diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts index 98624ebfa22..65cdb4e8ad6 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts @@ -65,7 +65,7 @@ export const getIsSessionStickinessEnabled = (rule: Rule | RulePayload) => { * Converts some empty strings to `null` in RulePayload * so that the API accept the payload. */ -export const getNormzlizedRulePayload = (rule: RulePayload) => ({ +export const getNormalizedRulePayload = (rule: RulePayload) => ({ match_condition: { ...rule.match_condition, hostname: rule.match_condition.hostname diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx index e75f0c5eba6..bdcf878bdf5 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/ServiceTargetDrawer.tsx @@ -37,7 +37,7 @@ import { initialValues, protocolOptions, } from './constants'; -import { getNormzlizedServiceTargetPayload } from './utils'; +import { getNormalizedServiceTargetPayload } from './utils'; interface Props { loadbalancerId: number; @@ -67,7 +67,7 @@ export const ServiceTargetDrawer = (props: Props) => { enableReinitialize: true, initialValues: isEditMode ? serviceTarget : initialValues, async onSubmit(values) { - const normalizedValues: ServiceTargetPayload = getNormzlizedServiceTargetPayload( + const normalizedValues: ServiceTargetPayload = getNormalizedServiceTargetPayload( values ); try { diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts index 5adaedbdeb3..1bfd89f62d2 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts @@ -1,9 +1,9 @@ -import { getNormzlizedServiceTargetPayload } from './utils'; +import { getNormalizedServiceTargetPayload } from './utils'; describe('getNormzlizedRulePayload', () => { it('should change empty strings to null', () => { expect( - getNormzlizedServiceTargetPayload({ + getNormalizedServiceTargetPayload({ certificate_id: null, endpoints: [ { diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.ts index 52214ca14b6..82277317e3d 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.ts @@ -4,7 +4,7 @@ import type { ServiceTargetPayload } from '@linode/api-v4'; * Replaces empty strings with `null` in ServiceTargetPayload * so that the API accepts the request. */ -export const getNormzlizedServiceTargetPayload = ( +export const getNormalizedServiceTargetPayload = ( serviceTarget: ServiceTargetPayload ) => ({ ...serviceTarget, From 69d3aaee5f5f9ef411ffb52db9b89354a9c742e4 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Tue, 5 Dec 2023 11:53:42 -0500 Subject: [PATCH 15/18] fix remaining bugs --- .../e2e/core/loadBalancers/load-balancer-routes.spec.ts | 2 +- .../LoadBalancerDetail/Routes/RuleDrawer.tsx | 8 +++++--- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/manager/cypress/e2e/core/loadBalancers/load-balancer-routes.spec.ts b/packages/manager/cypress/e2e/core/loadBalancers/load-balancer-routes.spec.ts index 8b6309f18d6..890c89f7066 100644 --- a/packages/manager/cypress/e2e/core/loadBalancers/load-balancer-routes.spec.ts +++ b/packages/manager/cypress/e2e/core/loadBalancers/load-balancer-routes.spec.ts @@ -539,7 +539,7 @@ describe('Akamai Global Load Balancer routes page', () => { .findByTitle('Edit Rule') .should('be.visible') .within(() => { - cy.findByLabelText('Hostname') + cy.findByLabelText('Hostname (optional)') .should('have.value', routes[0].rules[0].match_condition.hostname) .clear() .type('example.com'); diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx index f4e7d6f8d06..fee6152e6c2 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/RuleDrawer.tsx @@ -22,6 +22,7 @@ import { getFormikErrorsFromAPIErrors } from 'src/utilities/formikErrorUtils'; import { ServiceTargetSelect } from '../ServiceTargets/ServiceTargetSelect'; import { MatchTypeInfo } from './MatchTypeInfo'; +import { ROUTE_COPY } from './constants'; import { TimeUnit, defaultServiceTarget, @@ -37,7 +38,6 @@ import { } from './utils'; import type { Route, RulePayload } from '@linode/api-v4'; -import { ROUTE_COPY } from './constants'; interface Props { loadbalancerId: number; @@ -341,7 +341,8 @@ export const RuleDrawer = (props: Props) => { onChange={(serviceTarget) => { formik.setFieldTouched( `service_targets[${index}].id`, - true + true, + false ); formik.setFieldValue( `service_targets[${index}].id`, @@ -350,7 +351,8 @@ export const RuleDrawer = (props: Props) => { ); formik.setFieldValue( `service_targets[${index}].label`, - serviceTarget?.label ?? '' + serviceTarget?.label ?? '', + false ); }} loadbalancerId={loadbalancerId} From 9ca5e9358a3aaad86890ebc58f0c84036b11559a Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Tue, 5 Dec 2023 12:29:23 -0500 Subject: [PATCH 16/18] fix remaining aglb console errors --- .../LoadBalancerCreate/ConfigurationDetails.tsx | 15 ++++++++------- .../LoadBalancerCreate/LoadBalancerRegions.tsx | 9 ++++++--- .../LoadBalancerDetail/Certificates/index.tsx | 2 +- 3 files changed, 15 insertions(+), 11 deletions(-) diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerCreate/ConfigurationDetails.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerCreate/ConfigurationDetails.tsx index 5db9413b6e3..daad8310f82 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerCreate/ConfigurationDetails.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerCreate/ConfigurationDetails.tsx @@ -81,15 +81,16 @@ export const ConfigurationDetails = ({ index, name }: Props) => {
- ({ - marginLeft: '0 !important', - marginRight: `${theme.spacing(1 / 2)} !important`, - })} - /> + ({ + marginLeft: '0 !important', + marginRight: theme.spacing(), + })} + component="span" + /> After the load balancer is created, and if the protocol is HTTPS, - upload TLS termination certificates. + upload TLS termination certificates.{' '} Learn more. diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerCreate/LoadBalancerRegions.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerCreate/LoadBalancerRegions.tsx index d1722ceda96..bdf4339f703 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerCreate/LoadBalancerRegions.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerCreate/LoadBalancerRegions.tsx @@ -17,9 +17,12 @@ export const LoadBalancerRegions = () => { Where this Load Balancer instance will be deployed. - Load Balancers will - be automatically provisioned in these 5 Regions. No charges with be - incurred. + + Load Balancers will be automatically provisioned in these 5 Regions. + No charges with be incurred.
diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/index.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/index.tsx index 3d59c93eb9c..fa7ab4db202 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/index.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Certificates/index.tsx @@ -38,7 +38,7 @@ export const LoadBalancerCertificates = () => { Upload certificates to your Load Balancer for use across your Configurations and Service Targets. - + null}> ({ ...t, routeName: `${url}/${t.path}` }))} /> From 08af0c13cbca00ced4986c44ae097fda0a568dc8 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Tue, 5 Dec 2023 12:34:28 -0500 Subject: [PATCH 17/18] feedback @mjac0bs --- .../LoadBalancerDetail/LoadBalancerSummary.tsx | 6 +++++- .../LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts | 2 +- .../LoadBalancers/LoadBalancerDetail/Routes/utils.ts | 2 +- .../LoadBalancerDetail/ServiceTargets/utils.test.ts | 2 +- .../LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx | 2 +- 5 files changed, 9 insertions(+), 5 deletions(-) diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx index 1d88703e25b..5899ffb2c63 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerSummary.tsx @@ -23,7 +23,11 @@ export const LoadBalancerSummary = () => { const items = [ { title: 'Hostname', - value: , + value: loadbalancer?.hostname ? ( + + ) : ( + None + ), }, { title: 'Load Balancer ID', diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts index 202d4e1b462..29658494f67 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.test.ts @@ -1,6 +1,6 @@ import { getNormalizedRulePayload } from './utils'; -describe('getNormzlizedRulePayload', () => { +describe('getNormalizedRulePayload', () => { it('should change empty strings to null', () => { expect( getNormalizedRulePayload({ diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts index 65cdb4e8ad6..1367c26260d 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Routes/utils.ts @@ -63,7 +63,7 @@ export const getIsSessionStickinessEnabled = (rule: Rule | RulePayload) => { /** * Converts some empty strings to `null` in RulePayload - * so that the API accept the payload. + * so that the API accepts the payload. */ export const getNormalizedRulePayload = (rule: RulePayload) => ({ match_condition: { diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts index 1bfd89f62d2..8bb7350c3f0 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/ServiceTargets/utils.test.ts @@ -1,6 +1,6 @@ import { getNormalizedServiceTargetPayload } from './utils'; -describe('getNormzlizedRulePayload', () => { +describe('getNormalizedServiceTargetPayload', () => { it('should change empty strings to null', () => { expect( getNormalizedServiceTargetPayload({ diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx index 43c6262e2a6..51701cd8a86 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerLanding/LoadBalancerRow.tsx @@ -7,11 +7,11 @@ import { Stack } from 'src/components/Stack'; import { TableCell } from 'src/components/TableCell'; import { TableRow } from 'src/components/TableRow'; import { Typography } from 'src/components/Typography'; +import { IPAddress } from 'src/features/Linodes/LinodesLanding/IPAddress'; import { regions as alphaRegions } from '../LoadBalancerDetail/LoadBalancerRegions'; import { LoadBalancerActionsMenu } from './LoadBalancerActionsMenu'; import { Ports } from './Ports'; -import { IPAddress } from 'src/features/Linodes/LinodesLanding/IPAddress'; export interface LoadBalancerHandlers { onDelete: () => void; From 4c3e5427fc699953aebf2a0839e9e8a939c435f5 Mon Sep 17 00:00:00 2001 From: Banks Nussman Date: Tue, 5 Dec 2023 12:39:37 -0500 Subject: [PATCH 18/18] fix last beta chip console error --- .../LoadBalancers/LoadBalancerDetail/Settings/Region.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Settings/Region.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Settings/Region.tsx index 4fe59db5990..521f7302e35 100644 --- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Settings/Region.tsx +++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/Settings/Region.tsx @@ -33,11 +33,14 @@ export const Region = ({ loadbalancerId }: Props) => { return ( - + Regions - Load Balancer - regions can not be changed during beta. + {' '} + Load Balancer regions can not be changed during beta.