From 73a2ee357dafebda00bfa8acb0fabfbd32dcc740 Mon Sep 17 00:00:00 2001 From: bdahle Date: Thu, 27 Jun 2024 10:28:12 +0200 Subject: [PATCH 1/9] flytt tagline til en egen komponent --- .../general-page-header/GeneralPageHeader.tsx | 9 +++------ .../GeneralPageHeaderTagLine.tsx | 15 +++++++++++++++ 2 files changed, 18 insertions(+), 6 deletions(-) create mode 100644 src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx diff --git a/src/components/_common/headers/general-page-header/GeneralPageHeader.tsx b/src/components/_common/headers/general-page-header/GeneralPageHeader.tsx index 46493ed44..1d4d9511c 100644 --- a/src/components/_common/headers/general-page-header/GeneralPageHeader.tsx +++ b/src/components/_common/headers/general-page-header/GeneralPageHeader.tsx @@ -1,4 +1,4 @@ -import { BodyLong, BodyShort, Heading } from '@navikt/ds-react'; +import { BodyLong, Heading } from '@navikt/ds-react'; import { PagePropsForPageHeader, getContentTagline, @@ -6,6 +6,7 @@ import { import { Illustration } from 'components/_common/illustration/Illustration'; import { ContentProps, ContentType } from 'types/content-props/_content-common'; import { classNames } from 'utils/classnames'; +import { GeneralPageHeaderTagLine } from './GeneralPageHeaderTagLine'; import style from './GeneralPageHeader.module.scss'; @@ -26,11 +27,7 @@ export const GeneralPageHeader = (props: Props) => { return (
- {tagLine && ( - - {tagLine} - - )} + {tagLine && } { + return ( + + {props.tagLine} + + ); +}; From cd8c6cc1dd78d909b295fe51a1d2356218de1fa3 Mon Sep 17 00:00:00 2001 From: bdahle Date: Thu, 27 Jun 2024 10:45:28 +0200 Subject: [PATCH 2/9] flytt logikk over i tagline-komponenten --- .../AlternativeAudience.tsx | 38 ++-------------- .../GeneralPageHeaderTagLine.tsx | 44 ++++++++++++++++++- 2 files changed, 46 insertions(+), 36 deletions(-) diff --git a/src/components/_common/alternativeAudience/AlternativeAudience.tsx b/src/components/_common/alternativeAudience/AlternativeAudience.tsx index 64e339e06..bb4288915 100644 --- a/src/components/_common/alternativeAudience/AlternativeAudience.tsx +++ b/src/components/_common/alternativeAudience/AlternativeAudience.tsx @@ -3,8 +3,6 @@ import { BodyLong } from '@navikt/ds-react'; import { AlternativeAudience as AlternativeAudienceType, Audience, - AudienceOptions, - getAudience, } from 'types/component-props/_mixins'; import { usePageContentProps } from 'store/pageContext'; import { Language, translator } from 'translations'; @@ -71,45 +69,16 @@ export const AlternativeAudience = () => { const { showProductName } = config; const { alternativeAudience } = data; - const getAudienceLabel = translator('audience', language); - const getProviderAudienceLabel = translator('providerAudience', language); const getStringPart = translator('stringParts', language); const getRelatedString = translator('related', language); - const getProviderTypes = (audience: AudienceOptions) => { - if (audience._selected !== Audience.PROVIDER) { - return []; - } - return audience[audience._selected].provider_audience; - }; - - const buildAudienceAffirmation = (addPeriod: boolean) => { - const { audience: currentAudience } = data; - const currentAudienceKey = getAudience(currentAudience); - - if (!currentAudience || !currentAudienceKey || currentAudienceKey === 'person') { - return ''; - } - - const currentAudienceLabel = getAudienceLabel(currentAudienceKey); - const providerTypes = getProviderTypes(currentAudience) || []; - const providerTypesString = joinWithConjunction( - providerTypes.map((type) => getProviderAudienceLabel(type)), - language - ); - - const forString = `${getStringPart('for').charAt(0).toUpperCase()}${getStringPart( - 'for' - ).slice(1)}`; - - return `${forString} ${providerTypesString || currentAudienceLabel}${addPeriod ? '.' : ''} `; - }; - if (!alternativeAudience) { return (
- {buildAudienceAffirmation(false)} + {/* {buildAudienceAffirmation(false)} + TODO return ingenting?*/} + Test
); @@ -122,7 +91,6 @@ export const AlternativeAudience = () => { return (
- {buildAudienceAffirmation(true)} {getRelatedString('relatedAudience').replace('{name}', productName)}{' '} {audienceLinks.map((link, index) => ( diff --git a/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx b/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx index 6bf722bc4..6144c3076 100644 --- a/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx +++ b/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx @@ -1,4 +1,9 @@ import { BodyShort } from '@navikt/ds-react'; +import { usePageContentProps } from 'store/pageContext'; +import { translator } from 'translations'; +import { ProductPageProps } from 'types/content-props/dynamic-page-props'; +import { Audience, AudienceOptions, getAudience } from 'types/component-props/_mixins'; +import { joinWithConjunction } from 'utils/string'; import style from './GeneralPageHeader.module.scss'; @@ -7,9 +12,46 @@ type Props = { }; export const GeneralPageHeaderTagLine = (props: Props) => { + const { data, language } = usePageContentProps(); + + const getAudienceLabel = translator('audience', language); + const getProviderAudienceLabel = translator('providerAudience', language); + const getStringPart = translator('stringParts', language); + + const getProviderTypes = (audience: AudienceOptions) => { + if (audience._selected !== Audience.PROVIDER) { + return []; + } + return audience[audience._selected].provider_audience; + }; + + const buildAudienceAffirmation = (addPeriod: boolean) => { + const { audience: currentAudience } = data; + const currentAudienceKey = getAudience(currentAudience); + + if (!currentAudience || !currentAudienceKey || currentAudienceKey === 'person') { + return ''; + } + + const currentAudienceLabel = getAudienceLabel(currentAudienceKey); + const providerTypes = getProviderTypes(currentAudience) || []; + const providerTypesString = joinWithConjunction( + providerTypes.map((type) => getProviderAudienceLabel(type)), + language + ); + + const forString = `${getStringPart('for').charAt(0).toUpperCase()}${getStringPart( + 'for' + ).slice(1)}`; + + return `${forString} ${providerTypesString || currentAudienceLabel}${ + addPeriod ? '.' : '' + } `; + }; + return ( - {props.tagLine} + {props.tagLine} - {buildAudienceAffirmation(true)} ); }; From ccea532c04bded9b3a599af44f850ea1282863a5 Mon Sep 17 00:00:00 2001 From: bdahle Date: Thu, 27 Jun 2024 10:46:54 +0200 Subject: [PATCH 3/9] fjern logikk for punktum --- .../general-page-header/GeneralPageHeaderTagLine.tsx | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx b/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx index 6144c3076..30527bd9d 100644 --- a/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx +++ b/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx @@ -25,7 +25,7 @@ export const GeneralPageHeaderTagLine = (props: Props) => { return audience[audience._selected].provider_audience; }; - const buildAudienceAffirmation = (addPeriod: boolean) => { + const buildAudienceAffirmation = () => { const { audience: currentAudience } = data; const currentAudienceKey = getAudience(currentAudience); @@ -44,14 +44,12 @@ export const GeneralPageHeaderTagLine = (props: Props) => { 'for' ).slice(1)}`; - return `${forString} ${providerTypesString || currentAudienceLabel}${ - addPeriod ? '.' : '' - } `; + return `${forString} ${providerTypesString || currentAudienceLabel}`; }; return ( - {props.tagLine} - {buildAudienceAffirmation(true)} + {props.tagLine} - {buildAudienceAffirmation()} ); }; From 71397c730453ec1da8199af8cebbee8a737abc98 Mon Sep 17 00:00:00 2001 From: bdahle Date: Thu, 27 Jun 2024 10:56:23 +0200 Subject: [PATCH 4/9] lenger strek, em dash --- .../headers/general-page-header/GeneralPageHeaderTagLine.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx b/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx index 30527bd9d..6e9c458ed 100644 --- a/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx +++ b/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx @@ -49,7 +49,7 @@ export const GeneralPageHeaderTagLine = (props: Props) => { return ( - {props.tagLine} - {buildAudienceAffirmation()} + {`${props.tagLine} — ${buildAudienceAffirmation()}`} ); }; From 6e5e6116648acd6b963a4a880e1fbef31c627921 Mon Sep 17 00:00:00 2001 From: bdahle Date: Thu, 27 Jun 2024 11:09:50 +0200 Subject: [PATCH 5/9] preserve white space --- .../headers/general-page-header/GeneralPageHeader.module.scss | 1 + .../headers/general-page-header/GeneralPageHeaderTagLine.tsx | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/_common/headers/general-page-header/GeneralPageHeader.module.scss b/src/components/_common/headers/general-page-header/GeneralPageHeader.module.scss index 0d012a10a..be3f1b0be 100644 --- a/src/components/_common/headers/general-page-header/GeneralPageHeader.module.scss +++ b/src/components/_common/headers/general-page-header/GeneralPageHeader.module.scss @@ -41,6 +41,7 @@ margin-top: var(--a-spacing-3); font-variant: all-small-caps; color: var(--a-text-subtle); + white-space: pre-wrap; } .ingress:global(.navds-body-long) { diff --git a/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx b/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx index 6e9c458ed..221a4ebbe 100644 --- a/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx +++ b/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx @@ -49,7 +49,7 @@ export const GeneralPageHeaderTagLine = (props: Props) => { return ( - {`${props.tagLine} — ${buildAudienceAffirmation()}`} + {`${props.tagLine} — ${buildAudienceAffirmation()}`} ); }; From c81cdb0deee3d701cadc991c4d3fab36df5186a3 Mon Sep 17 00:00:00 2001 From: bdahle Date: Thu, 27 Jun 2024 11:12:27 +0200 Subject: [PATCH 6/9] reverter til return null --- .../alternativeAudience/AlternativeAudience.tsx | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/src/components/_common/alternativeAudience/AlternativeAudience.tsx b/src/components/_common/alternativeAudience/AlternativeAudience.tsx index bb4288915..78c6771c4 100644 --- a/src/components/_common/alternativeAudience/AlternativeAudience.tsx +++ b/src/components/_common/alternativeAudience/AlternativeAudience.tsx @@ -73,15 +73,7 @@ export const AlternativeAudience = () => { const getRelatedString = translator('related', language); if (!alternativeAudience) { - return ( -
- - {/* {buildAudienceAffirmation(false)} - TODO return ingenting?*/} - Test - -
- ); + return null; } const productName = From aca5f15200b84fc1d6430f59eb479ad35e044029 Mon Sep 17 00:00:00 2001 From: bdahle Date: Thu, 27 Jun 2024 11:16:54 +0200 Subject: [PATCH 7/9] =?UTF-8?q?ikke=20vis=20strek=20n=C3=A5r=20det=20ikke?= =?UTF-8?q?=20kommer=20noe=20etterp=C3=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../headers/general-page-header/GeneralPageHeaderTagLine.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx b/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx index 221a4ebbe..3a2903c30 100644 --- a/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx +++ b/src/components/_common/headers/general-page-header/GeneralPageHeaderTagLine.tsx @@ -44,12 +44,13 @@ export const GeneralPageHeaderTagLine = (props: Props) => { 'for' ).slice(1)}`; - return `${forString} ${providerTypesString || currentAudienceLabel}`; + return ` — ${forString} ${providerTypesString || currentAudienceLabel}`; }; return ( - {`${props.tagLine} — ${buildAudienceAffirmation()}`} + {props.tagLine} + {buildAudienceAffirmation()} ); }; From e15bad180f468cb684bcbd254eb7bd5ff7e29847 Mon Sep 17 00:00:00 2001 From: bdahle Date: Fri, 28 Jun 2024 12:28:55 +0200 Subject: [PATCH 8/9] oppdater nynorsk slik gjer du det, glemt i #1923 --- src/translations/nn.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/translations/nn.ts b/src/translations/nn.ts index 57905488b..480fdeb4b 100644 --- a/src/translations/nn.ts +++ b/src/translations/nn.ts @@ -159,8 +159,8 @@ export const translationsBundleNn: PartialTranslations = { }, guides: { person: 'Slik gjer du det', - employer: 'For arbeidsgjevarar', - provider: 'For samarbeidspartnarar', + employer: 'Slik gjer du det', + provider: 'Slik gjer du det', }, publishingCalendar: { event: 'Hending', From bdc5d8a74d26f4a55bc82ebee7f5657372e9caae Mon Sep 17 00:00:00 2001 From: bdahle Date: Fri, 28 Jun 2024 12:34:35 +0200 Subject: [PATCH 9/9] ekstra tekst glemt --- src/translations/nn.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/translations/nn.ts b/src/translations/nn.ts index 480fdeb4b..8027ee3ed 100644 --- a/src/translations/nn.ts +++ b/src/translations/nn.ts @@ -154,7 +154,7 @@ export const translationsBundleNn: PartialTranslations = { }, situations: { person: 'Dette kan du ha rett til', - employer: 'For arbeidsgjevarar', + employer: 'Kva arbeidsgjevarar må vita', provider: 'For samarbeidspartnarar', }, guides: {