From e9f1f0b093da200b73f7b05fb8af0689d5238570 Mon Sep 17 00:00:00 2001 From: Sampo Tawast <5328394+sirtawast@users.noreply.github.com> Date: Thu, 5 Oct 2023 09:33:38 +0300 Subject: [PATCH] HL-1001, HL-1004 | Fix various issues regarding application step 1 (#2323) * fix: de minimis values would be overriden by initial values on steps 2+ * feat: stylize de minimis aids list * fix: require co-operation negotiantions description * fix: wrong translation key for street address * feat: add missing co-operation negotiation helper text * fix: use correct variable to check for deminimis length --- frontend/benefit/applicant/package.json | 2 +- .../applicant/public/locales/en/common.json | 1 + .../applicant/public/locales/fi/common.json | 1 + .../applicant/public/locales/sv/common.json | 1 + .../deMinimisAid/DeMinimisAidForm.tsx | 6 ++-- .../deMinimisAid/deMinimisAid.sc.ts | 31 +++++++++++++------ .../deMinimisAid/list/DeMinimisAidsList.tsx | 9 +++--- .../step1/ApplicationFormStep1.tsx | 1 + .../step1/companyInfo/CompanyInfo.tsx | 2 +- .../application/step1/utils/validation.ts | 10 +++++- .../applicant/src/hooks/useFormActions.tsx | 17 +++++++--- 11 files changed, 57 insertions(+), 24 deletions(-) diff --git a/frontend/benefit/applicant/package.json b/frontend/benefit/applicant/package.json index fffdf28af1..50623cd1d3 100644 --- a/frontend/benefit/applicant/package.json +++ b/frontend/benefit/applicant/package.json @@ -11,7 +11,7 @@ "test": "jest --passWithNoTests", "test:staged": "yarn test --watchAll=false --findRelatedTests", "test:coverage": "yarn test --verbose --coverage", - "browser-test": "testcafe 'chrome --allow-insecure-localhost --ignore-certificate-errors --ignore-urlfetcher-cert-requests --window-size=\"1249,720\"' browser-tests/testruns/deminimis.testcafe.ts", + "browser-test": "testcafe 'chrome --allow-insecure-localhost --ignore-certificate-errors --ignore-urlfetcher-cert-requests --window-size=\"1249,1249\"' browser-tests/testruns/deminimis.testcafe.ts", "browser-test:ci": "testcafe 'chrome:headless --disable-gpu --window-size=\"1249,720\" --ignore-certificate-errors-spki-list=\"8sg/cl7YabrOFqSqH+Bu0e+P27Av33gWgi8Lq28DW1I=,gJt+wt/T3afCRkxtMMSjXcl/99sgzWc2kk1c1PC9tG0=,zrQI2/1q8i2SRPmMZ1sMntIkG+lMW0legPFokDo3nrY=\"' --screenshots path=report --video report --reporter spec,custom,html:report/index.html browser-tests/testruns/*.ts --experimental-proxyless" }, "dependencies": { diff --git a/frontend/benefit/applicant/public/locales/en/common.json b/frontend/benefit/applicant/public/locales/en/common.json index 903611c73d..5006e871ce 100644 --- a/frontend/benefit/applicant/public/locales/en/common.json +++ b/frontend/benefit/applicant/public/locales/en/common.json @@ -176,6 +176,7 @@ }, "coOperationNegotiations": { "label": "Does the organisation have ongoing or concluded change negotiations within the last 12 months?", + "tooltipText": "If change negotiations are ongoing or ended during the previous 12 months, please provide a more detailed explanation of the situation, such as for example who the negotiations concern or what outcome the negotiations led to.", "yes": "Yes", "no": "No" }, diff --git a/frontend/benefit/applicant/public/locales/fi/common.json b/frontend/benefit/applicant/public/locales/fi/common.json index ec3b04bfb2..98d9c16c2f 100644 --- a/frontend/benefit/applicant/public/locales/fi/common.json +++ b/frontend/benefit/applicant/public/locales/fi/common.json @@ -176,6 +176,7 @@ }, "coOperationNegotiations": { "label": "Onko organisaatiolla käynnissä tai edeltävän 12 kuukauden aikana päättynyt muutosneuvottelut?", + "tooltipText": "Jos muutosneuvottelut ovat käynnissä tai päättyneet edeltävän 12 kuukauden aikana, niin anna tarkempi selvitys tilanteesta, kuten esimerkiksi ketä neuvottelut koskevat tai mihin lopputulokseen neuvottelut johtivat.", "yes": "Kyllä", "no": "Ei" }, diff --git a/frontend/benefit/applicant/public/locales/sv/common.json b/frontend/benefit/applicant/public/locales/sv/common.json index afdded9f68..236695933e 100644 --- a/frontend/benefit/applicant/public/locales/sv/common.json +++ b/frontend/benefit/applicant/public/locales/sv/common.json @@ -176,6 +176,7 @@ }, "coOperationNegotiations": { "label": "Pågår samarbetsförhandlingar i organisationen eller har de avslutats under föregående 12 månader?", + "tooltipText": "Om samarbetsförhandlingar pågår eller avslutats under de senaste 12 månaderna, vänligen ge en mer detaljerad förklaring av situationen, som till exempel vem samarbetsförhandlingarna gäller eller vilket resultat samarbetsförhandlingarna ledde till.", "yes": "Ja", "no": "Nej" }, diff --git a/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/DeMinimisAidForm.tsx b/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/DeMinimisAidForm.tsx index d379d3fc49..c39c0e0086 100644 --- a/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/DeMinimisAidForm.tsx +++ b/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/DeMinimisAidForm.tsx @@ -16,7 +16,7 @@ import { } from 'shared/utils/string.utils'; import { useTheme } from 'styled-components'; -import { $DeMinimisGridPadded, $DeMinimisSubHeader } from './deMinimisAid.sc'; +import { $DeMinimisGridForm, $DeMinimisSubHeader } from './deMinimisAid.sc'; import { useDeminimisAid } from './useDeminimisAid'; interface DeMinimisAidFormProps { @@ -68,7 +68,7 @@ const DeMinimisAidForm: React.FC = ({ {t(`${translationsBase}.deMinimisAidsHeading`)} - <$DeMinimisGridPadded> + <$DeMinimisGridForm> <$GridCell $colSpan={4}> = ({ {t(`${translationsBase}.deMinimisAidsAdd`)} - + ); }; diff --git a/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/deMinimisAid.sc.ts b/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/deMinimisAid.sc.ts index a7de3daffe..67bf7b4fd8 100644 --- a/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/deMinimisAid.sc.ts +++ b/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/deMinimisAid.sc.ts @@ -4,6 +4,10 @@ import { } from 'shared/components/forms/section/FormSection.sc'; import styled from 'styled-components'; +type DeMinimisGridProps = { + $bgColor?: string; +}; + export const $DeMinimisSubHeader = styled($SubHeader)` margin-top: ${(props) => props.theme.spacing.xs3}; margin-bottom: ${(props) => props.theme.spacing.s}; @@ -12,21 +16,30 @@ export const $DeMinimisSubHeader = styled($SubHeader)` font-size: 1.1em; `; -export const $DeMinimisGrid = styled($Grid)` +export const $DeMinimisGrid = styled($Grid)` max-width: 1024px; margin-left: calc(-1 * ${(props) => props.theme.spacing.s}); - padding-left: ${(props) => props.theme.spacing.m}; - padding-right: ${(props) => props.theme.spacing.m}; -`; + padding: ${(props) => props.theme.spacing.xs2} + ${(props) => props.theme.spacing.m}; + margin-bottom: ${(props) => props.theme.spacing.xs2}; + background: ${(props) => + props.$bgColor ? props.$bgColor : props.theme.colors.black10}; -type DeMinimisGridProps = { - $bgColor?: string; -}; + justify-content: space-between; + + &:last-child { + margin-bottom: 0; + } -export const $DeMinimisGridPadded = styled($DeMinimisGrid)` + > * { + justify-content: space-between; + flex-flow: row wrap; + } +`; + +export const $DeMinimisGridForm = styled($DeMinimisGrid)` padding: ${(props) => props.theme.spacing.m}; margin-left: calc(-1 * ${(props) => props.theme.spacing.s}); background: ${(props) => props.$bgColor ? props.$bgColor : props.theme.colors.black10}; - margin-bottom: ${(props) => props.theme.spacing.s}; `; diff --git a/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/list/DeMinimisAidsList.tsx b/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/list/DeMinimisAidsList.tsx index 9d4539cf59..aa8081af8d 100644 --- a/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/list/DeMinimisAidsList.tsx +++ b/frontend/benefit/applicant/src/components/applications/forms/application/deMinimisAid/list/DeMinimisAidsList.tsx @@ -1,7 +1,7 @@ import { $Notification } from 'benefit/applicant/components/Notification/Notification.sc'; import { MAX_DEMINIMIS_AID_TOTAL_AMOUNT } from 'benefit/applicant/constants'; import { DE_MINIMIS_AID_KEYS } from 'benefit-shared/constants'; -import { Button, IconMinusCircle } from 'hds-react'; +import { Button, IconTrash } from 'hds-react'; import React from 'react'; import { $Grid, @@ -53,16 +53,17 @@ const DeMinimisAidsList: React.FC = () => { $colSpan={4} css={` margin-left: auto; - margin-bottom: ${theme.spacing.s}; + margin-bottom: 0; padding-left: ${theme.spacing.s}; `} >