From c0731719950ca673e4874ab4b303fa65d9d81dd4 Mon Sep 17 00:00:00 2001 From: taniaholst Date: Mon, 17 Mar 2025 13:46:45 +0100 Subject: [PATCH 01/16] frontend for tags --- .../HeaderWithParent.module.scss | 16 ++++++++++++++++ .../headerWithParent/HeaderWithParent.tsx | 12 +++++++++++- 2 files changed, 27 insertions(+), 1 deletion(-) diff --git a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss index 78be26eff..94c8bf2eb 100644 --- a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss +++ b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss @@ -15,4 +15,20 @@ font-size: 40px; line-height: 52px; } + + .tagsList { + display: flex; + list-style: none; + padding: 0; + align-items: center; + gap: 5px; + margin: 0; + flex-wrap: wrap; + + .tag { + background-color: var(--a-surface-neutral-subtle); + border-radius: 2px; + padding: 3px 6px; + } + } } diff --git a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx index e6718c371..d9b12a528 100644 --- a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx +++ b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx @@ -10,9 +10,10 @@ type Props = { }; textAboveTitle?: string; className?: string; + tags?: string[]; }; -export const HeaderWithParent = ({ contentProps, textAboveTitle, className }: Props) => { +export const HeaderWithParent = ({ contentProps, textAboveTitle, className, tags }: Props) => { const { data } = contentProps; return ( @@ -23,6 +24,15 @@ export const HeaderWithParent = ({ contentProps, textAboveTitle, className }: Pr {data.title} + {tags && ( + + )} ); }; From c9e348250496d11cda3dc85a502eb199cbf340a1 Mon Sep 17 00:00:00 2001 From: Terje Karlsen Date: Wed, 19 Mar 2025 12:56:31 +0100 Subject: [PATCH 02/16] Legger til ekstra steg i mellomsteg og forenkler typingen noe --- .../FormIntermediateStepLink.tsx | 4 +- .../FormIntermediateStepPage.tsx | 4 +- .../useFormIntermediateStepPage.tsx | 152 ++++++++++++++++++ .../useFormIntermediateStepPageState.tsx | 119 -------------- .../content-props/form-intermediate-step.ts | 47 ++---- 5 files changed, 172 insertions(+), 154 deletions(-) create mode 100644 packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx delete mode 100644 packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPageState.tsx diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx index 95e2471ba..ff1b78d4c 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { LinkPanel } from '@navikt/ds-react'; import { InfoBox } from 'components/_common/infoBox/InfoBox'; import { LenkeBase } from 'components/_common/lenke/lenkeBase/LenkeBase'; -import { FormIntermediateStep_StepLinkData } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPageState'; +import { FormIntermediateStep_StepLinkData } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPage'; import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; type Props = FormIntermediateStep_StepLinkData & @@ -14,6 +14,8 @@ export const FormIntermediateStepLink = ({ languageDisclaimer, href, isStepNavigation, + // eslint-disable-next-line @typescript-eslint/no-unused-vars + nextStep, ...rest }: Props) => { if (!href) { diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx index 47338cb49..44382e5a8 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx @@ -5,7 +5,7 @@ import { ThemedPageHeader } from 'components/_common/headers/themedPageHeader/Th import { FormIntermediateStepPageProps } from 'types/content-props/form-intermediate-step'; import { ParsedHtml } from 'components/_common/parsedHtml/ParsedHtml'; import { LenkeBase } from 'components/_common/lenke/lenkeBase/LenkeBase'; -import { useFormIntermediateStepPageState } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPageState'; +import { useFormIntermediateStepPage } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPage'; import { FormIntermediateStepLink } from 'components/pages/form-intermediate-step-page/FormIntermediateStepLink'; import style from './FormIntermediateStepPage.module.scss'; @@ -14,7 +14,7 @@ export const FormIntermediateStepPage = (props: FormIntermediateStepPageProps) = const { language, type, displayName, modifiedTime, data } = props; const { title, illustration } = data; - const { currentStepData, backUrl } = useFormIntermediateStepPageState(props); + const { currentStepData, backUrl } = useFormIntermediateStepPage(props); const getTranslations = translator('form', language); diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx new file mode 100644 index 000000000..60230f09a --- /dev/null +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx @@ -0,0 +1,152 @@ +import { useEffect, useState } from 'react'; +import { useRouter } from 'next/compat/router'; +import { + FormIntermediateStepPageProps, + SelectableStep, + StepBase, +} from 'types/content-props/form-intermediate-step'; +import { stripXpPathPrefix } from 'utils/urls'; + +const STEP_PARAM = 'stegvalg'; + +export type FormIntermediateStep_StepLinkData = SelectableStep & { + href?: string; + isStepNavigation?: boolean; +}; + +type StepPath = number[]; +export const buildStepUrl = (basePath: string, stepPath: StepPath) => + `${basePath}?${STEP_PARAM}=${stepPath.join(',')}`; + +export const resolveStepUrl = ({ + step, + nextStepPath, + basePath, +}: { + step: SelectableStep; + nextStepPath: StepPath; + basePath: string; +}): FormIntermediateStep_StepLinkData => { + switch (step.nextStep?._selected) { + case 'external': { + return { + ...step, + href: step.nextStep.external?.externalUrl, + }; + } + case 'internal': { + return { + ...step, + href: stripXpPathPrefix(step.nextStep.internal?.internalContent._path), + }; + } + default: { + return { + ...step, + href: buildStepUrl(basePath, nextStepPath), + isStepNavigation: true, + }; + } + } +}; + +export const getStepData = ( + data: FormIntermediateStepPageProps['data'], + stepPath: StepPath +): StepBase => { + // No steps selected (meaning the user is on first step) + if (stepPath.length === 0) { + return { + editorial: data.editorial, + stepsHeadline: data.stepsHeadline, + steps: data.steps, + }; + } + + let tmp: any = data; + + stepPath.forEach((index) => { + const foundStep = tmp.steps[index]; + if (foundStep) { + tmp = foundStep.nextStep?.next; + } + }); + + const stepDetails = tmp.nextStep; + if (stepDetails?._selected === 'next') { + return stepDetails.next; + } + + return { + editorial: tmp.editorial, + stepsHeadline: tmp.stepsHeadline, + steps: tmp.steps, + }; +}; + +export const buildCurrentStepData = ( + allData: FormIntermediateStepPageProps['data'], + basePath: string, + stepPath: StepPath +): StepBase => { + const stepData = getStepData(allData, stepPath); + + return { + ...stepData, + steps: stepData.steps.map((step, index) => + resolveStepUrl({ step, nextStepPath: [...stepPath, index], basePath }) + ), + }; +}; + +export const buildBackUrl = (basePath: string, stepPath: StepPath): string | null => { + if (stepPath.length === 0) { + return null; // No back URL if on the first step + } + + if (stepPath.length === 1) { + return basePath; // Back to the first step + } + return buildStepUrl(basePath, stepPath.slice(0, -1)); +}; + +export const getStepPathFromParam = (url: string): StepPath => { + const stepQuery = new URL(url, window.location.origin).searchParams.get(STEP_PARAM); + const stepPath = stepQuery ? stepQuery.split(',').map(Number) : []; + if (stepPath.some(isNaN)) { + return []; + } + return stepPath; +}; + +export const useFormIntermediateStepPage = (props: FormIntermediateStepPageProps) => { + const [stepPath, setStepPath] = useState([]); + const router = useRouter(); + + const pagePath = stripXpPathPrefix(props._path); + const currentStepData = buildCurrentStepData(props.data, pagePath, stepPath); + + const backUrl = buildBackUrl(pagePath, stepPath); + + useEffect(() => { + if (!router) { + return; + } + + const handleRouteChange = (url: string) => { + setStepPath(getStepPathFromParam(url)); + }; + + handleRouteChange(router.asPath); + + router.events.on('routeChangeComplete', handleRouteChange); + return () => { + router.events.off('routeChangeComplete', handleRouteChange); + }; + }, [router]); + + return { + currentStepData, + backUrl, + }; +}; diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPageState.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPageState.tsx deleted file mode 100644 index 320396888..000000000 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPageState.tsx +++ /dev/null @@ -1,119 +0,0 @@ -import { useEffect, useState } from 'react'; -import { useRouter } from 'next/compat/router'; -import { - FormIntermediateStepPageProps, - FormIntermediateStep_CompoundedStepData, - FormIntermediateStep_StepBase, - FormIntermediateStep_StepData, - FormIntermediateStep_StepLevel, -} from 'types/content-props/form-intermediate-step'; -import { stripXpPathPrefix } from 'utils/urls'; - -const STEP_PARAM = 'stegvalg'; - -export type FormIntermediateStep_StepLinkData = FormIntermediateStep_StepBase & { - href?: string; - isStepNavigation?: boolean; -}; - -type CurrentStepData = FormIntermediateStep_StepData; - -const buildStepUrl = (basePath: string, stepIndex: number) => - `${basePath}?${STEP_PARAM}=${stepIndex}`; - -const resolveStepUrl = ( - step: FormIntermediateStep_StepLevel, - stepIndex: number, - basePath: string -): FormIntermediateStep_StepLinkData => { - switch (step.nextStep?._selected) { - case 'external': { - return { - ...step, - href: step.nextStep.external?.externalUrl, - }; - } - case 'internal': { - return { - ...step, - href: stripXpPathPrefix(step.nextStep.internal?.internalContent._path), - }; - } - default: { - return { - ...step, - href: buildStepUrl(basePath, stepIndex), - isStepNavigation: true, - }; - } - } -}; - -const getStepData = ( - data: FormIntermediateStepPageProps['data'], - selectedStepIndex: number | null -): FormIntermediateStep_CompoundedStepData => { - if (selectedStepIndex !== null) { - const stepDetails = data.steps[selectedStepIndex].nextStep; - if (stepDetails?._selected === 'next') { - return stepDetails.next; - } - } - - return { - editorial: data.editorial, - stepsHeadline: data.stepsHeadline, - steps: data.steps, - }; -}; - -const buildResolvedStepData = ( - data: FormIntermediateStepPageProps['data'], - basePath: string, - prevSelectedStep: number | null -): CurrentStepData => { - const stepData = getStepData(data, prevSelectedStep); - - return { - ...stepData, - steps: stepData.steps.map((step, index) => resolveStepUrl(step, index, basePath)), - }; -}; - -const getSelectedStepFromParam = (url: string) => { - const stepQuery = new URL(url, window.location.origin).searchParams.get(STEP_PARAM); - return stepQuery ? Number(stepQuery) : null; -}; - -export const useFormIntermediateStepPageState = (props: FormIntermediateStepPageProps) => { - const [selectedStepIndex, setSelectedStepIndex] = useState(null); - const router = useRouter(); - - const pagePath = stripXpPathPrefix(props._path); - - const currentStepData = buildResolvedStepData(props.data, pagePath, selectedStepIndex); - - const backUrl = selectedStepIndex !== null ? pagePath : null; - - useEffect(() => { - if (!router) { - return; - } - - const handleRouteChange = (url: string) => { - setSelectedStepIndex(getSelectedStepFromParam(url)); - }; - - handleRouteChange(router.asPath); - - router.events.on('routeChangeComplete', handleRouteChange); - return () => { - router.events.off('routeChangeComplete', handleRouteChange); - }; - }, [router]); - - return { - currentStepData, - backUrl, - }; -}; diff --git a/packages/nextjs/src/types/content-props/form-intermediate-step.ts b/packages/nextjs/src/types/content-props/form-intermediate-step.ts index 9131e7563..96a558e45 100644 --- a/packages/nextjs/src/types/content-props/form-intermediate-step.ts +++ b/packages/nextjs/src/types/content-props/form-intermediate-step.ts @@ -4,46 +4,29 @@ import { OptionSetSingle } from 'types/util-types'; import { ContentCommonProps, ContentType } from './_content-common'; import { PictogramsProps } from './pictograms'; -export type FormIntermediateStep_StepData< - NextStep extends FormIntermediateStep_StepBase = FormIntermediateStep_StepBase, -> = { - editorial: ProcessedHtmlProps; - stepsHeadline: string; - steps: NextStep[]; +type ExternalOption = any; +type InternalOption = any; +type NextOption = any; + +export type StepOptions = { + external?: ExternalOption; + internal?: InternalOption; + next?: NextOption; }; -export type FormIntermediateStep_StepBase = { +export type SelectableStep = { label: string; explanation: string; languageDisclaimer?: string; + nextStep: OptionSetSingle; }; -type StepBaseOptions = { - external: { - externalUrl: string; - }; - internal: { - internalContent: ContentCommonProps; - }; -}; - -type StepLevel1 = FormIntermediateStep_StepBase & { - nextStep: OptionSetSingle< - StepBaseOptions & { - next: FormIntermediateStep_StepData; - } - >; -}; - -type StepLevel2 = FormIntermediateStep_StepBase & { - nextStep: OptionSetSingle; +export type StepBase = { + editorial: ProcessedHtmlProps; + stepsHeadline: string; + steps: SelectableStep[]; }; -export type FormIntermediateStep_StepLevel = StepLevel1 | StepLevel2; - -export type FormIntermediateStep_CompoundedStepData = - FormIntermediateStep_StepData; - export type FormIntermediateStepPageProps = ContentCommonProps & { type: ContentType.FormIntermediateStepPage; data: { @@ -51,5 +34,5 @@ export type FormIntermediateStepPageProps = ContentCommonProps & { illustration: PictogramsProps; taxonomy?: Taxonomy[]; customCategory: string; - } & FormIntermediateStep_StepData; + } & StepBase; }; From 11c50422ab65176b5ca3c6f42e1295e08ac7269d Mon Sep 17 00:00:00 2001 From: Terje Karlsen Date: Wed, 19 Mar 2025 14:33:23 +0100 Subject: [PATCH 03/16] =?UTF-8?q?Legger=20til=20funksjon=20for=20=C3=A5=20?= =?UTF-8?q?finne=20forrige=20tittel?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../FormIntermediateStepPage.tsx | 3 +- .../useFormIntermediateStepPage.tsx | 45 +++++++++++++++---- 2 files changed, 38 insertions(+), 10 deletions(-) diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx index 44382e5a8..92a64e340 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx @@ -14,7 +14,7 @@ export const FormIntermediateStepPage = (props: FormIntermediateStepPageProps) = const { language, type, displayName, modifiedTime, data } = props; const { title, illustration } = data; - const { currentStepData, backUrl } = useFormIntermediateStepPage(props); + const { currentStepData, backUrl, previousStepTitle } = useFormIntermediateStepPage(props); const getTranslations = translator('form', language); @@ -37,6 +37,7 @@ export const FormIntermediateStepPage = (props: FormIntermediateStepPageProps) =
+ {previousStepTitle &&
Forrige steg: {previousStepTitle}
} {currentStepData.stepsHeadline && ( {currentStepData.stepsHeadline} diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx index 60230f09a..c68348c77 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx @@ -15,10 +15,10 @@ export type FormIntermediateStep_StepLinkData = SelectableStep & { }; type StepPath = number[]; -export const buildStepUrl = (basePath: string, stepPath: StepPath) => +const buildStepUrl = (basePath: string, stepPath: StepPath) => `${basePath}?${STEP_PARAM}=${stepPath.join(',')}`; -export const resolveStepUrl = ({ +const resolveStepUrl = ({ step, nextStepPath, basePath, @@ -50,10 +50,7 @@ export const resolveStepUrl = ({ } }; -export const getStepData = ( - data: FormIntermediateStepPageProps['data'], - stepPath: StepPath -): StepBase => { +const getStepData = (data: FormIntermediateStepPageProps['data'], stepPath: StepPath): StepBase => { // No steps selected (meaning the user is on first step) if (stepPath.length === 0) { return { @@ -84,7 +81,7 @@ export const getStepData = ( }; }; -export const buildCurrentStepData = ( +const buildCurrentStepData = ( allData: FormIntermediateStepPageProps['data'], basePath: string, stepPath: StepPath @@ -99,7 +96,7 @@ export const buildCurrentStepData = ( }; }; -export const buildBackUrl = (basePath: string, stepPath: StepPath): string | null => { +const buildBackUrl = (basePath: string, stepPath: StepPath): string | null => { if (stepPath.length === 0) { return null; // No back URL if on the first step } @@ -110,7 +107,7 @@ export const buildBackUrl = (basePath: string, stepPath: StepPath): string | nul return buildStepUrl(basePath, stepPath.slice(0, -1)); }; -export const getStepPathFromParam = (url: string): StepPath => { +const getStepPathFromParam = (url: string): StepPath => { const stepQuery = new URL(url, window.location.origin).searchParams.get(STEP_PARAM); const stepPath = stepQuery ? stepQuery.split(',').map(Number) : []; if (stepPath.some(isNaN)) { @@ -119,6 +116,34 @@ export const getStepPathFromParam = (url: string): StepPath => { return stepPath; }; +const getPreviousStepTitle = ( + stepPath: StepPath, + allData: FormIntermediateStepPageProps['data'] +) => { + if (stepPath.length === 0) { + return null; // No previous step title if on the first step + } + + const previousStepPath = stepPath.slice(0, -1); + + // Previous step was the first page, so just get the + // headline from the data root. + if (previousStepPath.length === 0) { + return allData.stepsHeadline; + } + + // Traverse the tree to find the previous step. + let step: StepBase = allData; + previousStepPath.forEach((index) => { + const foundStep = step.steps[index]; + if (foundStep) { + step = foundStep.nextStep?.next; + } + }); + + return step.stepsHeadline; +}; + export const useFormIntermediateStepPage = (props: FormIntermediateStepPageProps) => { const [stepPath, setStepPath] = useState([]); const router = useRouter(); @@ -127,6 +152,7 @@ export const useFormIntermediateStepPage = (props: FormIntermediateStepPageProps const currentStepData = buildCurrentStepData(props.data, pagePath, stepPath); const backUrl = buildBackUrl(pagePath, stepPath); + const previousStepTitle = getPreviousStepTitle(stepPath, props.data); useEffect(() => { if (!router) { @@ -148,5 +174,6 @@ export const useFormIntermediateStepPage = (props: FormIntermediateStepPageProps return { currentStepData, backUrl, + previousStepTitle, }; }; From a2f419192b08f1194bcc0135c41dc6967bf30087 Mon Sep 17 00:00:00 2001 From: taniaholst Date: Thu, 20 Mar 2025 11:22:42 +0100 Subject: [PATCH 04/16] ny komponent LanguageDisclaimer, flyttet den til inni formIntermediateStepLink, flyttet den til components-mappen og lagde stories til begge --- .../FormIntermediateStepLink.stories.tsx | 52 +++++++++ .../FormIntermediateStepLink.tsx | 14 ++- .../LanguageDisclaimer.module.scss | 10 ++ .../LanguageDisclaimer.stories.tsx | 17 +++ .../languageDisclaimer/LanguageDisclaimer.tsx | 12 +++ .../FormIntermediateStepPage.module.scss | 101 +++++++++--------- .../FormIntermediateStepPage.tsx | 2 +- 7 files changed, 148 insertions(+), 60 deletions(-) create mode 100644 packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx rename packages/nextjs/src/components/{pages/form-intermediate-step-page => _common/formIntermediateStepLink}/FormIntermediateStepLink.tsx (65%) create mode 100644 packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.module.scss create mode 100644 packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.stories.tsx create mode 100644 packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.tsx diff --git a/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx new file mode 100644 index 000000000..efac5f578 --- /dev/null +++ b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx @@ -0,0 +1,52 @@ +import type { Meta, StoryObj } from '@storybook/react'; + +import { FormIntermediateStepLink } from './FormIntermediateStepLink'; + +const meta = { + component: FormIntermediateStepLink, +} satisfies Meta; + +export default meta; + +type Story = StoryObj; + +export const Default: Story = { + args: { + label: 'Steg 1', + explanation: 'Dette er et eksempel på hva som kan stå her', + href: '/example-path', + isStepNavigation: true, + analyticsComponent: 'mellomsteg', + analyticsLinkGroup: 'Example Group', + analyticsLabel: 'Example Step', + nextStep: { + _selected: 'next', + next: { + editorial: { html: '' }, + stepsHeadline: '', + steps: [], + }, + }, + }, +}; + +export const LanguageDisclaimer: Story = { + args: { + label: 'Steg med språk', + explanation: 'Dette er et eksempel på hva som kan stå her', + languageDisclaimer: 'Kun på bokmål', + href: '/example-path', + isStepNavigation: true, + analyticsComponent: 'mellomsteg', + analyticsLinkGroup: 'Example Group', + analyticsLabel: 'Example Step', + nextStep: { + _selected: 'next', + next: { + editorial: { html: '' }, + stepsHeadline: '', + steps: [], + }, + }, + }, +}; diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.tsx similarity index 65% rename from packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx rename to packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.tsx index ff1b78d4c..5970a4345 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx +++ b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.tsx @@ -1,9 +1,9 @@ import React from 'react'; import { LinkPanel } from '@navikt/ds-react'; -import { InfoBox } from 'components/_common/infoBox/InfoBox'; import { LenkeBase } from 'components/_common/lenke/lenkeBase/LenkeBase'; import { FormIntermediateStep_StepLinkData } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPage'; import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; +import { LanguageDisclaimer } from 'components/_common/languageDisclaimer/LanguageDisclaimer'; type Props = FormIntermediateStep_StepLinkData & Omit, 'children' | 'href'>; @@ -23,12 +23,10 @@ export const FormIntermediateStepLink = ({ } return ( - <> - {languageDisclaimer && {languageDisclaimer}} - - {label} - {explanation} - - + + {label} + {explanation} + {languageDisclaimer && {languageDisclaimer}} + ); }; diff --git a/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.module.scss b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.module.scss new file mode 100644 index 000000000..1f63f4c14 --- /dev/null +++ b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.module.scss @@ -0,0 +1,10 @@ +.languageDisclaimer { + display: flex; + align-items: center; + gap: 0.5rem; + margin-top: 1rem; + + svg { + color: var(--a-icon-subtle); + } +} diff --git a/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.stories.tsx b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.stories.tsx new file mode 100644 index 000000000..b3dd1e8fa --- /dev/null +++ b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.stories.tsx @@ -0,0 +1,17 @@ +import type { Meta, StoryObj } from '@storybook/react'; + +import { LanguageDisclaimer } from './LanguageDisclaimer'; + +const meta = { + component: LanguageDisclaimer, +} satisfies Meta; + +export default meta; + +type Story = StoryObj; + +export const Default: Story = { + args: { + children: 'Kun på bokmål', + }, +}; diff --git a/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.tsx b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.tsx new file mode 100644 index 000000000..6c12ebfe5 --- /dev/null +++ b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.tsx @@ -0,0 +1,12 @@ +import { PropsWithChildren } from 'react'; +import { InformationSquareIcon } from '@navikt/aksel-icons'; +import style from './LanguageDisclaimer.module.scss'; + +export const LanguageDisclaimer = (props: PropsWithChildren) => { + return ( +
+ + {props.children} +
+ ); +}; diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss index 5b73ed01f..11b79723e 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss @@ -8,65 +8,64 @@ $padding: 2rem; flex-direction: column; justify-content: flex-start; width: 100%; -} - -.content { - margin-top: 2rem; - display: flex; - flex-direction: column; - justify-content: flex-start; - align-self: center; - width: 100%; - max-width: common.$contentMaxWidth; - & > * { + .content { + margin-top: 2rem; + display: flex; + flex-direction: column; + justify-content: flex-start; + align-self: center; width: 100%; - } -} + max-width: common.$contentMaxWidth; -.stepOptionsWrapper { - display: flex; - flex-direction: column; - align-items: flex-start; - max-width: common.$sectionMaxWidth; -} + & > * { + width: 100%; + } -.stepList { - list-style-type: none; - margin: 0; - padding: 0; -} + .stepOptionsWrapper { + display: flex; + flex-direction: column; + align-items: flex-start; + max-width: common.$sectionMaxWidth; -.stepItem { - margin-bottom: var(--a-spacing-7); -} + .stepList { + list-style-type: none; + margin: 0; + padding: 0; -.stepAction { - &:global(.navds-link-panel) { - border-color: var(--default-action-color); - } - & :global { - .navds-link-panel__title, - .navds-link-panel__chevron { - color: var(--default-action-color); - } - } - @media #{common.$mq-screen-mobile} { - padding: 0.75rem; - } -} + .stepItem { + margin-bottom: var(--a-spacing-7); -.buttonGroup { - display: flex; -} + .stepAction { + &:global(.navds-link-panel) { + border-color: var(--default-action-color); + } + & :global { + .navds-link-panel__title, + .navds-link-panel__chevron { + color: var(--default-action-color); + } + } + @media #{common.$mq-screen-mobile} { + padding: 0.75rem; + } + } + } + } + } + .buttonGroup { + display: flex; + } -.backButton { - text-decoration-line: underline; - text-underline-offset: 4px; - padding: 0; - margin-top: 1rem; + .backButton { + text-decoration-line: underline; + text-underline-offset: 4px; + padding: 0; + margin-top: 1rem; - &:hover { - background-color: transparent; + &:hover { + background-color: transparent; + } + } } } diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx index 92a64e340..b70cbfaeb 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx @@ -6,7 +6,7 @@ import { FormIntermediateStepPageProps } from 'types/content-props/form-intermed import { ParsedHtml } from 'components/_common/parsedHtml/ParsedHtml'; import { LenkeBase } from 'components/_common/lenke/lenkeBase/LenkeBase'; import { useFormIntermediateStepPage } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPage'; -import { FormIntermediateStepLink } from 'components/pages/form-intermediate-step-page/FormIntermediateStepLink'; +import { FormIntermediateStepLink } from 'components/_common/formIntermediateStepLink/FormIntermediateStepLink'; import style from './FormIntermediateStepPage.module.scss'; From 1523b9cbdb856beb3f0a41350a5435cdf4cd3f63 Mon Sep 17 00:00:00 2001 From: taniaholst <21334782+taniaholst@users.noreply.github.com> Date: Thu, 20 Mar 2025 10:25:17 +0000 Subject: [PATCH 05/16] Update screenshots --- ...link--default-desktop-linux-desktop-linux.png | Bin 0 -> 5347 bytes ...ge-disclaimer-desktop-linux-desktop-linux.png | Bin 0 -> 9000 bytes ...imer--default-desktop-linux-desktop-linux.png | Bin 0 -> 2042 bytes 3 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--default-desktop-linux-desktop-linux.png create mode 100644 packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--language-disclaimer-desktop-linux-desktop-linux.png create mode 100644 packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-languagedisclaimer--default-desktop-linux-desktop-linux.png diff --git a/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--default-desktop-linux-desktop-linux.png b/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--default-desktop-linux-desktop-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..7ea9a38f7a4c4e4853d370fdd49a4279140607b1 GIT binary patch literal 5347 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 literal 0 HcmV?d00001 diff --git a/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--language-disclaimer-desktop-linux-desktop-linux.png b/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--language-disclaimer-desktop-linux-desktop-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..febbe7d360c0764788e344a1967f33e062bb3e9e GIT binary patch literal 9000 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 literal 0 HcmV?d00001 diff --git a/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-languagedisclaimer--default-desktop-linux-desktop-linux.png b/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-languagedisclaimer--default-desktop-linux-desktop-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..e723d437723aec37e7b964fa661f6904ed33772e GIT binary patch literal 2042 zcmVPx+v`IukRCt{2-Cs;oSsDQFPb0lgy)zSUlg+lSS|&TRMhnS6*@4zs0V5Pw7F?j1 zjtptQQRylcrhriY(FJ5-7Gc&3DoUh41WN{FW5LZ(c9KFSmVK~nb}brPH?h|+-X4-^H!KXpLdFK~ zPp08-&EHu9nk@N5oRqNh9aI%`$T4DUyFGy@QEGOYm`AL3JwAm*kr=j`=2uwe?<@}= zJ@$X*!$*$;ZE&jv*^L!V--x%|;{xN474NH#r z;fLn{@c#Sn1uG?EX+EYMC9^Nou2i=o_-V!2lZ~g;JuH5KI+?d3NdpxUMPk_MTDoDW z%TBLfzy4BFT~P8N$L)&J%MS6EH%`QJf)dd$gfLxuF@5FoElWrgiD9d0>8FGVpGuN; zNrRJ(nYdbX#>C33{nKYc(tDNeKQ0ySslLa|jk4D7-X42sfCgYJ+SI7b>-X(rS2eji zKi(#clUEGb(Hn6s+SI6hr?1wj_wR`nezYxWPj1Pzv6*8Z)1OFf{uKH_*w2xRX#Ed6koy5B+1RDRDkdhxhCc6;nj zMOlZHMvT3`u5fQ$luA5+`mK{k7 zU~z@q6E*u44R+DtE5?qKBBw!9-eG(5Zbt6O?lyZwK|{~C!yP9j$fQ%180-j``<=~t zvpYQf$l2y9l^B_Hs)_-p?^N{NbC^d>q{~_b!y5Gn2WeG^som0CG<>e4!oY%MV%QqC*p~3=Q@Ti_eevSO?!-^?^AtZVk;i&T-8lRN07g2;9O9G! zp4zi^sG9YMB1r(?<)<0U-9uJqj)4Dq0QRopGG!7E0Js_II+)7%vZdWB(~1k*?x=~` z!7&lERo*i+;Y#QF=$Y*3lV4xR;S&ImDvRbRa`i1;R%zOZ?y`-Wd8J(|1@K}IA>xZs+a{Ll9mI|vf9#BX((*i^Q-sWrbeNAy^;f z98D7v0GybD!enxy_59HM+4;}%DuY>2kg9)e90&W=)*o=Lv(kC8ilh8wL~xq!{` zV?F?49BvOu{et%^65vN`I>a!vo5iN6`405V4#_nwRf%ZueA8&apYcTYL zOX%Hf@e&Ug#2|B1>&Wb#&7vsM<951ccUZ__n{+Lsdm)6pEs&WsS)Q=?@j}n|fE9(y zQf60kXyKqGA`F#$=XjgBw z-op5b{`R!aK#Ih$HEgjh;memV|7QC8Qx^>Y-`u{lC+W9gVPQeYN$@j{W*L-Sjn}fo zY7q$}PaHvAAJ(@Ri5O<&R(HRZUe5jMzFVR!wB@G>+@n3$jArLXS$%?F;}n>$=%D zJ^egbSxK?7IFW7ZZ0NTm0N}(ZRT8$Xv-}I4(ZN;xrCF224SY+)j?R$4h)#7(*KJ0k z-1@e&GA?kURb`4u_h8kLf;>$-Bhl7=ww3L3I*VY7GK(c(dMyF~PgZra<+v0^+jQlX zErTwB;;Z($oHw3Q0sxQ^IVZAs_V%jIe+RHeT&zffCy5upKlOj^dJx#U4a0th)_K3c zZ|2>=K;I?wfBd_|ShN`jhD3ig)&=qjFAT#%4E{bW48uakkIt|jK6>o;cQC-iM~}B` z-t=y&!Y~Z;VZLGQjQ>qQGq-HsB>6=A4obo>4D)Rr{wEX|hJ^}zhJ|5R$iNK?!?2L? Ye@|YCR-zPB%>V!Z07*qoM6N<$f>5&Pp8x;= literal 0 HcmV?d00001 From eb5a93ac9758233a0f08a2d1e5c22f53c524fe02 Mon Sep 17 00:00:00 2001 From: Per Olav Mariussen <35491554+PerOlavM@users.noreply.github.com> Date: Fri, 21 Mar 2025 08:16:19 +0100 Subject: [PATCH 06/16] =?UTF-8?q?Justerer=20cpu=20og=20minne=20for=20alle?= =?UTF-8?q?=20milj=C3=B8er=20(#2226)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Mindre ressursbruk i alle miljøer --- .nais/vars/vars-dev1-failover.yml | 2 +- .nais/vars/vars-dev1.yml | 6 +++--- .nais/vars/vars-dev2-failover.yml | 2 +- .nais/vars/vars-dev2.yml | 6 +++--- .nais/vars/vars-prod-failover.yml | 6 +++--- .nais/vars/vars-prod.yml | 2 +- 6 files changed, 12 insertions(+), 12 deletions(-) diff --git a/.nais/vars/vars-dev1-failover.yml b/.nais/vars/vars-dev1-failover.yml index 38b52a0d7..11b978949 100644 --- a/.nais/vars/vars-dev1-failover.yml +++ b/.nais/vars/vars-dev1-failover.yml @@ -9,7 +9,7 @@ ingresses: - https://www-failover.intern.dev.nav.no resources: requests: - cpu: 100m + cpu: 50m memory: 250Mi limits: memory: 250Mi diff --git a/.nais/vars/vars-dev1.yml b/.nais/vars/vars-dev1.yml index 63b88599b..0a89a470c 100644 --- a/.nais/vars/vars-dev1.yml +++ b/.nais/vars/vars-dev1.yml @@ -11,10 +11,10 @@ ingresses: - https://www.intern.dev.nav.no resources: requests: - cpu: 500m - memory: 1000Mi + cpu: 100m + memory: 384Mi limits: - memory: 2000Mi + memory: 1024Mi valkey: plan: hobbyist project: nav-dev diff --git a/.nais/vars/vars-dev2-failover.yml b/.nais/vars/vars-dev2-failover.yml index 71180fa90..1ad650cf9 100644 --- a/.nais/vars/vars-dev2-failover.yml +++ b/.nais/vars/vars-dev2-failover.yml @@ -9,7 +9,7 @@ ingresses: - https://www-2-failover.intern.dev.nav.no resources: requests: - cpu: 100m + cpu: 50m memory: 250Mi limits: memory: 250Mi diff --git a/.nais/vars/vars-dev2.yml b/.nais/vars/vars-dev2.yml index faf605ebe..5fc39c37e 100644 --- a/.nais/vars/vars-dev2.yml +++ b/.nais/vars/vars-dev2.yml @@ -12,10 +12,10 @@ ingresses: - https://www-2.intern.dev.nav.no resources: requests: - cpu: 250m - memory: 500Mi + cpu: 100m + memory: 384Mi limits: - memory: 1000Mi + memory: 1024Mi valkey: plan: hobbyist project: nav-dev diff --git a/.nais/vars/vars-prod-failover.yml b/.nais/vars/vars-prod-failover.yml index 6fb26e920..45cf54d05 100644 --- a/.nais/vars/vars-prod-failover.yml +++ b/.nais/vars/vars-prod-failover.yml @@ -9,7 +9,7 @@ ingresses: - https://www-failover.nav.no resources: requests: - cpu: 500m - memory: 750Mi + cpu: 250m + memory: 512Mi limits: - memory: 750Mi + memory: 1024Mi diff --git a/.nais/vars/vars-prod.yml b/.nais/vars/vars-prod.yml index 6b5d850f6..b21f5300a 100644 --- a/.nais/vars/vars-prod.yml +++ b/.nais/vars/vars-prod.yml @@ -9,7 +9,7 @@ ingresses: - https://www.nav.no resources: requests: - cpu: 750m + cpu: 600m memory: 2048Mi limits: memory: 4096Mi From c73d9d6e65eeb7f06dd7fe4db13f5058ee2a0842 Mon Sep 17 00:00:00 2001 From: taniaholst Date: Mon, 17 Mar 2025 13:46:45 +0100 Subject: [PATCH 07/16] frontend for tags --- .../HeaderWithParent.module.scss | 16 ++++++++++++++++ .../headerWithParent/HeaderWithParent.tsx | 12 +++++++++++- 2 files changed, 27 insertions(+), 1 deletion(-) diff --git a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss index 418905bb6..95676d983 100644 --- a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss +++ b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss @@ -15,4 +15,20 @@ font-size: 40px; line-height: 52px; } + + .tagsList { + display: flex; + list-style: none; + padding: 0; + align-items: center; + gap: 5px; + margin: 0; + flex-wrap: wrap; + + .tag { + background-color: var(--a-surface-neutral-subtle); + border-radius: 2px; + padding: 3px 6px; + } + } } diff --git a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx index e6718c371..d9b12a528 100644 --- a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx +++ b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx @@ -10,9 +10,10 @@ type Props = { }; textAboveTitle?: string; className?: string; + tags?: string[]; }; -export const HeaderWithParent = ({ contentProps, textAboveTitle, className }: Props) => { +export const HeaderWithParent = ({ contentProps, textAboveTitle, className, tags }: Props) => { const { data } = contentProps; return ( @@ -23,6 +24,15 @@ export const HeaderWithParent = ({ contentProps, textAboveTitle, className }: Pr {data.title} + {tags && ( +
    + {tags.map((tag, index) => ( +
  • + {tag} +
  • + ))} +
+ )}
); }; From 76c8858c07d8d082aac0e6884c2ac05276f3e276 Mon Sep 17 00:00:00 2001 From: Terje Karlsen Date: Wed, 19 Mar 2025 12:56:31 +0100 Subject: [PATCH 08/16] Legger til ekstra steg i mellomsteg og forenkler typingen noe --- .../FormIntermediateStepLink.tsx | 4 +- .../FormIntermediateStepPage.tsx | 4 +- .../useFormIntermediateStepPage.tsx | 152 ++++++++++++++++++ .../useFormIntermediateStepPageState.tsx | 119 -------------- .../content-props/form-intermediate-step.ts | 47 ++---- 5 files changed, 172 insertions(+), 154 deletions(-) create mode 100644 packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx delete mode 100644 packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPageState.tsx diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx index 95e2471ba..ff1b78d4c 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { LinkPanel } from '@navikt/ds-react'; import { InfoBox } from 'components/_common/infoBox/InfoBox'; import { LenkeBase } from 'components/_common/lenke/lenkeBase/LenkeBase'; -import { FormIntermediateStep_StepLinkData } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPageState'; +import { FormIntermediateStep_StepLinkData } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPage'; import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; type Props = FormIntermediateStep_StepLinkData & @@ -14,6 +14,8 @@ export const FormIntermediateStepLink = ({ languageDisclaimer, href, isStepNavigation, + // eslint-disable-next-line @typescript-eslint/no-unused-vars + nextStep, ...rest }: Props) => { if (!href) { diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx index 47338cb49..44382e5a8 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx @@ -5,7 +5,7 @@ import { ThemedPageHeader } from 'components/_common/headers/themedPageHeader/Th import { FormIntermediateStepPageProps } from 'types/content-props/form-intermediate-step'; import { ParsedHtml } from 'components/_common/parsedHtml/ParsedHtml'; import { LenkeBase } from 'components/_common/lenke/lenkeBase/LenkeBase'; -import { useFormIntermediateStepPageState } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPageState'; +import { useFormIntermediateStepPage } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPage'; import { FormIntermediateStepLink } from 'components/pages/form-intermediate-step-page/FormIntermediateStepLink'; import style from './FormIntermediateStepPage.module.scss'; @@ -14,7 +14,7 @@ export const FormIntermediateStepPage = (props: FormIntermediateStepPageProps) = const { language, type, displayName, modifiedTime, data } = props; const { title, illustration } = data; - const { currentStepData, backUrl } = useFormIntermediateStepPageState(props); + const { currentStepData, backUrl } = useFormIntermediateStepPage(props); const getTranslations = translator('form', language); diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx new file mode 100644 index 000000000..60230f09a --- /dev/null +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx @@ -0,0 +1,152 @@ +import { useEffect, useState } from 'react'; +import { useRouter } from 'next/compat/router'; +import { + FormIntermediateStepPageProps, + SelectableStep, + StepBase, +} from 'types/content-props/form-intermediate-step'; +import { stripXpPathPrefix } from 'utils/urls'; + +const STEP_PARAM = 'stegvalg'; + +export type FormIntermediateStep_StepLinkData = SelectableStep & { + href?: string; + isStepNavigation?: boolean; +}; + +type StepPath = number[]; +export const buildStepUrl = (basePath: string, stepPath: StepPath) => + `${basePath}?${STEP_PARAM}=${stepPath.join(',')}`; + +export const resolveStepUrl = ({ + step, + nextStepPath, + basePath, +}: { + step: SelectableStep; + nextStepPath: StepPath; + basePath: string; +}): FormIntermediateStep_StepLinkData => { + switch (step.nextStep?._selected) { + case 'external': { + return { + ...step, + href: step.nextStep.external?.externalUrl, + }; + } + case 'internal': { + return { + ...step, + href: stripXpPathPrefix(step.nextStep.internal?.internalContent._path), + }; + } + default: { + return { + ...step, + href: buildStepUrl(basePath, nextStepPath), + isStepNavigation: true, + }; + } + } +}; + +export const getStepData = ( + data: FormIntermediateStepPageProps['data'], + stepPath: StepPath +): StepBase => { + // No steps selected (meaning the user is on first step) + if (stepPath.length === 0) { + return { + editorial: data.editorial, + stepsHeadline: data.stepsHeadline, + steps: data.steps, + }; + } + + let tmp: any = data; + + stepPath.forEach((index) => { + const foundStep = tmp.steps[index]; + if (foundStep) { + tmp = foundStep.nextStep?.next; + } + }); + + const stepDetails = tmp.nextStep; + if (stepDetails?._selected === 'next') { + return stepDetails.next; + } + + return { + editorial: tmp.editorial, + stepsHeadline: tmp.stepsHeadline, + steps: tmp.steps, + }; +}; + +export const buildCurrentStepData = ( + allData: FormIntermediateStepPageProps['data'], + basePath: string, + stepPath: StepPath +): StepBase => { + const stepData = getStepData(allData, stepPath); + + return { + ...stepData, + steps: stepData.steps.map((step, index) => + resolveStepUrl({ step, nextStepPath: [...stepPath, index], basePath }) + ), + }; +}; + +export const buildBackUrl = (basePath: string, stepPath: StepPath): string | null => { + if (stepPath.length === 0) { + return null; // No back URL if on the first step + } + + if (stepPath.length === 1) { + return basePath; // Back to the first step + } + return buildStepUrl(basePath, stepPath.slice(0, -1)); +}; + +export const getStepPathFromParam = (url: string): StepPath => { + const stepQuery = new URL(url, window.location.origin).searchParams.get(STEP_PARAM); + const stepPath = stepQuery ? stepQuery.split(',').map(Number) : []; + if (stepPath.some(isNaN)) { + return []; + } + return stepPath; +}; + +export const useFormIntermediateStepPage = (props: FormIntermediateStepPageProps) => { + const [stepPath, setStepPath] = useState([]); + const router = useRouter(); + + const pagePath = stripXpPathPrefix(props._path); + const currentStepData = buildCurrentStepData(props.data, pagePath, stepPath); + + const backUrl = buildBackUrl(pagePath, stepPath); + + useEffect(() => { + if (!router) { + return; + } + + const handleRouteChange = (url: string) => { + setStepPath(getStepPathFromParam(url)); + }; + + handleRouteChange(router.asPath); + + router.events.on('routeChangeComplete', handleRouteChange); + return () => { + router.events.off('routeChangeComplete', handleRouteChange); + }; + }, [router]); + + return { + currentStepData, + backUrl, + }; +}; diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPageState.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPageState.tsx deleted file mode 100644 index 320396888..000000000 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPageState.tsx +++ /dev/null @@ -1,119 +0,0 @@ -import { useEffect, useState } from 'react'; -import { useRouter } from 'next/compat/router'; -import { - FormIntermediateStepPageProps, - FormIntermediateStep_CompoundedStepData, - FormIntermediateStep_StepBase, - FormIntermediateStep_StepData, - FormIntermediateStep_StepLevel, -} from 'types/content-props/form-intermediate-step'; -import { stripXpPathPrefix } from 'utils/urls'; - -const STEP_PARAM = 'stegvalg'; - -export type FormIntermediateStep_StepLinkData = FormIntermediateStep_StepBase & { - href?: string; - isStepNavigation?: boolean; -}; - -type CurrentStepData = FormIntermediateStep_StepData; - -const buildStepUrl = (basePath: string, stepIndex: number) => - `${basePath}?${STEP_PARAM}=${stepIndex}`; - -const resolveStepUrl = ( - step: FormIntermediateStep_StepLevel, - stepIndex: number, - basePath: string -): FormIntermediateStep_StepLinkData => { - switch (step.nextStep?._selected) { - case 'external': { - return { - ...step, - href: step.nextStep.external?.externalUrl, - }; - } - case 'internal': { - return { - ...step, - href: stripXpPathPrefix(step.nextStep.internal?.internalContent._path), - }; - } - default: { - return { - ...step, - href: buildStepUrl(basePath, stepIndex), - isStepNavigation: true, - }; - } - } -}; - -const getStepData = ( - data: FormIntermediateStepPageProps['data'], - selectedStepIndex: number | null -): FormIntermediateStep_CompoundedStepData => { - if (selectedStepIndex !== null) { - const stepDetails = data.steps[selectedStepIndex].nextStep; - if (stepDetails?._selected === 'next') { - return stepDetails.next; - } - } - - return { - editorial: data.editorial, - stepsHeadline: data.stepsHeadline, - steps: data.steps, - }; -}; - -const buildResolvedStepData = ( - data: FormIntermediateStepPageProps['data'], - basePath: string, - prevSelectedStep: number | null -): CurrentStepData => { - const stepData = getStepData(data, prevSelectedStep); - - return { - ...stepData, - steps: stepData.steps.map((step, index) => resolveStepUrl(step, index, basePath)), - }; -}; - -const getSelectedStepFromParam = (url: string) => { - const stepQuery = new URL(url, window.location.origin).searchParams.get(STEP_PARAM); - return stepQuery ? Number(stepQuery) : null; -}; - -export const useFormIntermediateStepPageState = (props: FormIntermediateStepPageProps) => { - const [selectedStepIndex, setSelectedStepIndex] = useState(null); - const router = useRouter(); - - const pagePath = stripXpPathPrefix(props._path); - - const currentStepData = buildResolvedStepData(props.data, pagePath, selectedStepIndex); - - const backUrl = selectedStepIndex !== null ? pagePath : null; - - useEffect(() => { - if (!router) { - return; - } - - const handleRouteChange = (url: string) => { - setSelectedStepIndex(getSelectedStepFromParam(url)); - }; - - handleRouteChange(router.asPath); - - router.events.on('routeChangeComplete', handleRouteChange); - return () => { - router.events.off('routeChangeComplete', handleRouteChange); - }; - }, [router]); - - return { - currentStepData, - backUrl, - }; -}; diff --git a/packages/nextjs/src/types/content-props/form-intermediate-step.ts b/packages/nextjs/src/types/content-props/form-intermediate-step.ts index 9131e7563..96a558e45 100644 --- a/packages/nextjs/src/types/content-props/form-intermediate-step.ts +++ b/packages/nextjs/src/types/content-props/form-intermediate-step.ts @@ -4,46 +4,29 @@ import { OptionSetSingle } from 'types/util-types'; import { ContentCommonProps, ContentType } from './_content-common'; import { PictogramsProps } from './pictograms'; -export type FormIntermediateStep_StepData< - NextStep extends FormIntermediateStep_StepBase = FormIntermediateStep_StepBase, -> = { - editorial: ProcessedHtmlProps; - stepsHeadline: string; - steps: NextStep[]; +type ExternalOption = any; +type InternalOption = any; +type NextOption = any; + +export type StepOptions = { + external?: ExternalOption; + internal?: InternalOption; + next?: NextOption; }; -export type FormIntermediateStep_StepBase = { +export type SelectableStep = { label: string; explanation: string; languageDisclaimer?: string; + nextStep: OptionSetSingle; }; -type StepBaseOptions = { - external: { - externalUrl: string; - }; - internal: { - internalContent: ContentCommonProps; - }; -}; - -type StepLevel1 = FormIntermediateStep_StepBase & { - nextStep: OptionSetSingle< - StepBaseOptions & { - next: FormIntermediateStep_StepData; - } - >; -}; - -type StepLevel2 = FormIntermediateStep_StepBase & { - nextStep: OptionSetSingle; +export type StepBase = { + editorial: ProcessedHtmlProps; + stepsHeadline: string; + steps: SelectableStep[]; }; -export type FormIntermediateStep_StepLevel = StepLevel1 | StepLevel2; - -export type FormIntermediateStep_CompoundedStepData = - FormIntermediateStep_StepData; - export type FormIntermediateStepPageProps = ContentCommonProps & { type: ContentType.FormIntermediateStepPage; data: { @@ -51,5 +34,5 @@ export type FormIntermediateStepPageProps = ContentCommonProps & { illustration: PictogramsProps; taxonomy?: Taxonomy[]; customCategory: string; - } & FormIntermediateStep_StepData; + } & StepBase; }; From b34935aae67bfc5a3a5cbef5c2abcc77acb420f2 Mon Sep 17 00:00:00 2001 From: Terje Karlsen Date: Wed, 19 Mar 2025 14:33:23 +0100 Subject: [PATCH 09/16] =?UTF-8?q?Legger=20til=20funksjon=20for=20=C3=A5=20?= =?UTF-8?q?finne=20forrige=20tittel?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../FormIntermediateStepPage.tsx | 3 +- .../useFormIntermediateStepPage.tsx | 45 +++++++++++++++---- 2 files changed, 38 insertions(+), 10 deletions(-) diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx index 44382e5a8..92a64e340 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx @@ -14,7 +14,7 @@ export const FormIntermediateStepPage = (props: FormIntermediateStepPageProps) = const { language, type, displayName, modifiedTime, data } = props; const { title, illustration } = data; - const { currentStepData, backUrl } = useFormIntermediateStepPage(props); + const { currentStepData, backUrl, previousStepTitle } = useFormIntermediateStepPage(props); const getTranslations = translator('form', language); @@ -37,6 +37,7 @@ export const FormIntermediateStepPage = (props: FormIntermediateStepPageProps) =
+ {previousStepTitle &&
Forrige steg: {previousStepTitle}
} {currentStepData.stepsHeadline && ( {currentStepData.stepsHeadline} diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx index 60230f09a..c68348c77 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx @@ -15,10 +15,10 @@ export type FormIntermediateStep_StepLinkData = SelectableStep & { }; type StepPath = number[]; -export const buildStepUrl = (basePath: string, stepPath: StepPath) => +const buildStepUrl = (basePath: string, stepPath: StepPath) => `${basePath}?${STEP_PARAM}=${stepPath.join(',')}`; -export const resolveStepUrl = ({ +const resolveStepUrl = ({ step, nextStepPath, basePath, @@ -50,10 +50,7 @@ export const resolveStepUrl = ({ } }; -export const getStepData = ( - data: FormIntermediateStepPageProps['data'], - stepPath: StepPath -): StepBase => { +const getStepData = (data: FormIntermediateStepPageProps['data'], stepPath: StepPath): StepBase => { // No steps selected (meaning the user is on first step) if (stepPath.length === 0) { return { @@ -84,7 +81,7 @@ export const getStepData = ( }; }; -export const buildCurrentStepData = ( +const buildCurrentStepData = ( allData: FormIntermediateStepPageProps['data'], basePath: string, stepPath: StepPath @@ -99,7 +96,7 @@ export const buildCurrentStepData = ( }; }; -export const buildBackUrl = (basePath: string, stepPath: StepPath): string | null => { +const buildBackUrl = (basePath: string, stepPath: StepPath): string | null => { if (stepPath.length === 0) { return null; // No back URL if on the first step } @@ -110,7 +107,7 @@ export const buildBackUrl = (basePath: string, stepPath: StepPath): string | nul return buildStepUrl(basePath, stepPath.slice(0, -1)); }; -export const getStepPathFromParam = (url: string): StepPath => { +const getStepPathFromParam = (url: string): StepPath => { const stepQuery = new URL(url, window.location.origin).searchParams.get(STEP_PARAM); const stepPath = stepQuery ? stepQuery.split(',').map(Number) : []; if (stepPath.some(isNaN)) { @@ -119,6 +116,34 @@ export const getStepPathFromParam = (url: string): StepPath => { return stepPath; }; +const getPreviousStepTitle = ( + stepPath: StepPath, + allData: FormIntermediateStepPageProps['data'] +) => { + if (stepPath.length === 0) { + return null; // No previous step title if on the first step + } + + const previousStepPath = stepPath.slice(0, -1); + + // Previous step was the first page, so just get the + // headline from the data root. + if (previousStepPath.length === 0) { + return allData.stepsHeadline; + } + + // Traverse the tree to find the previous step. + let step: StepBase = allData; + previousStepPath.forEach((index) => { + const foundStep = step.steps[index]; + if (foundStep) { + step = foundStep.nextStep?.next; + } + }); + + return step.stepsHeadline; +}; + export const useFormIntermediateStepPage = (props: FormIntermediateStepPageProps) => { const [stepPath, setStepPath] = useState([]); const router = useRouter(); @@ -127,6 +152,7 @@ export const useFormIntermediateStepPage = (props: FormIntermediateStepPageProps const currentStepData = buildCurrentStepData(props.data, pagePath, stepPath); const backUrl = buildBackUrl(pagePath, stepPath); + const previousStepTitle = getPreviousStepTitle(stepPath, props.data); useEffect(() => { if (!router) { @@ -148,5 +174,6 @@ export const useFormIntermediateStepPage = (props: FormIntermediateStepPageProps return { currentStepData, backUrl, + previousStepTitle, }; }; From 277a4d5a836172f06c8d15e2eb7f53025485b767 Mon Sep 17 00:00:00 2001 From: taniaholst Date: Thu, 20 Mar 2025 11:22:42 +0100 Subject: [PATCH 10/16] ny komponent LanguageDisclaimer, flyttet den til inni formIntermediateStepLink, flyttet den til components-mappen og lagde stories til begge --- .../FormIntermediateStepLink.stories.tsx | 52 +++++++++ .../FormIntermediateStepLink.tsx | 14 ++- .../LanguageDisclaimer.module.scss | 10 ++ .../LanguageDisclaimer.stories.tsx | 17 +++ .../languageDisclaimer/LanguageDisclaimer.tsx | 12 +++ .../FormIntermediateStepPage.module.scss | 101 +++++++++--------- .../FormIntermediateStepPage.tsx | 2 +- 7 files changed, 148 insertions(+), 60 deletions(-) create mode 100644 packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx rename packages/nextjs/src/components/{pages/form-intermediate-step-page => _common/formIntermediateStepLink}/FormIntermediateStepLink.tsx (65%) create mode 100644 packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.module.scss create mode 100644 packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.stories.tsx create mode 100644 packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.tsx diff --git a/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx new file mode 100644 index 000000000..efac5f578 --- /dev/null +++ b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx @@ -0,0 +1,52 @@ +import type { Meta, StoryObj } from '@storybook/react'; + +import { FormIntermediateStepLink } from './FormIntermediateStepLink'; + +const meta = { + component: FormIntermediateStepLink, +} satisfies Meta; + +export default meta; + +type Story = StoryObj; + +export const Default: Story = { + args: { + label: 'Steg 1', + explanation: 'Dette er et eksempel på hva som kan stå her', + href: '/example-path', + isStepNavigation: true, + analyticsComponent: 'mellomsteg', + analyticsLinkGroup: 'Example Group', + analyticsLabel: 'Example Step', + nextStep: { + _selected: 'next', + next: { + editorial: { html: '' }, + stepsHeadline: '', + steps: [], + }, + }, + }, +}; + +export const LanguageDisclaimer: Story = { + args: { + label: 'Steg med språk', + explanation: 'Dette er et eksempel på hva som kan stå her', + languageDisclaimer: 'Kun på bokmål', + href: '/example-path', + isStepNavigation: true, + analyticsComponent: 'mellomsteg', + analyticsLinkGroup: 'Example Group', + analyticsLabel: 'Example Step', + nextStep: { + _selected: 'next', + next: { + editorial: { html: '' }, + stepsHeadline: '', + steps: [], + }, + }, + }, +}; diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.tsx similarity index 65% rename from packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx rename to packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.tsx index ff1b78d4c..5970a4345 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepLink.tsx +++ b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.tsx @@ -1,9 +1,9 @@ import React from 'react'; import { LinkPanel } from '@navikt/ds-react'; -import { InfoBox } from 'components/_common/infoBox/InfoBox'; import { LenkeBase } from 'components/_common/lenke/lenkeBase/LenkeBase'; import { FormIntermediateStep_StepLinkData } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPage'; import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; +import { LanguageDisclaimer } from 'components/_common/languageDisclaimer/LanguageDisclaimer'; type Props = FormIntermediateStep_StepLinkData & Omit, 'children' | 'href'>; @@ -23,12 +23,10 @@ export const FormIntermediateStepLink = ({ } return ( - <> - {languageDisclaimer && {languageDisclaimer}} - - {label} - {explanation} - - + + {label} + {explanation} + {languageDisclaimer && {languageDisclaimer}} + ); }; diff --git a/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.module.scss b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.module.scss new file mode 100644 index 000000000..1f63f4c14 --- /dev/null +++ b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.module.scss @@ -0,0 +1,10 @@ +.languageDisclaimer { + display: flex; + align-items: center; + gap: 0.5rem; + margin-top: 1rem; + + svg { + color: var(--a-icon-subtle); + } +} diff --git a/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.stories.tsx b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.stories.tsx new file mode 100644 index 000000000..b3dd1e8fa --- /dev/null +++ b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.stories.tsx @@ -0,0 +1,17 @@ +import type { Meta, StoryObj } from '@storybook/react'; + +import { LanguageDisclaimer } from './LanguageDisclaimer'; + +const meta = { + component: LanguageDisclaimer, +} satisfies Meta; + +export default meta; + +type Story = StoryObj; + +export const Default: Story = { + args: { + children: 'Kun på bokmål', + }, +}; diff --git a/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.tsx b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.tsx new file mode 100644 index 000000000..6c12ebfe5 --- /dev/null +++ b/packages/nextjs/src/components/_common/languageDisclaimer/LanguageDisclaimer.tsx @@ -0,0 +1,12 @@ +import { PropsWithChildren } from 'react'; +import { InformationSquareIcon } from '@navikt/aksel-icons'; +import style from './LanguageDisclaimer.module.scss'; + +export const LanguageDisclaimer = (props: PropsWithChildren) => { + return ( +
+ + {props.children} +
+ ); +}; diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss index 5b73ed01f..11b79723e 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss @@ -8,65 +8,64 @@ $padding: 2rem; flex-direction: column; justify-content: flex-start; width: 100%; -} - -.content { - margin-top: 2rem; - display: flex; - flex-direction: column; - justify-content: flex-start; - align-self: center; - width: 100%; - max-width: common.$contentMaxWidth; - & > * { + .content { + margin-top: 2rem; + display: flex; + flex-direction: column; + justify-content: flex-start; + align-self: center; width: 100%; - } -} + max-width: common.$contentMaxWidth; -.stepOptionsWrapper { - display: flex; - flex-direction: column; - align-items: flex-start; - max-width: common.$sectionMaxWidth; -} + & > * { + width: 100%; + } -.stepList { - list-style-type: none; - margin: 0; - padding: 0; -} + .stepOptionsWrapper { + display: flex; + flex-direction: column; + align-items: flex-start; + max-width: common.$sectionMaxWidth; -.stepItem { - margin-bottom: var(--a-spacing-7); -} + .stepList { + list-style-type: none; + margin: 0; + padding: 0; -.stepAction { - &:global(.navds-link-panel) { - border-color: var(--default-action-color); - } - & :global { - .navds-link-panel__title, - .navds-link-panel__chevron { - color: var(--default-action-color); - } - } - @media #{common.$mq-screen-mobile} { - padding: 0.75rem; - } -} + .stepItem { + margin-bottom: var(--a-spacing-7); -.buttonGroup { - display: flex; -} + .stepAction { + &:global(.navds-link-panel) { + border-color: var(--default-action-color); + } + & :global { + .navds-link-panel__title, + .navds-link-panel__chevron { + color: var(--default-action-color); + } + } + @media #{common.$mq-screen-mobile} { + padding: 0.75rem; + } + } + } + } + } + .buttonGroup { + display: flex; + } -.backButton { - text-decoration-line: underline; - text-underline-offset: 4px; - padding: 0; - margin-top: 1rem; + .backButton { + text-decoration-line: underline; + text-underline-offset: 4px; + padding: 0; + margin-top: 1rem; - &:hover { - background-color: transparent; + &:hover { + background-color: transparent; + } + } } } diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx index 92a64e340..b70cbfaeb 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx @@ -6,7 +6,7 @@ import { FormIntermediateStepPageProps } from 'types/content-props/form-intermed import { ParsedHtml } from 'components/_common/parsedHtml/ParsedHtml'; import { LenkeBase } from 'components/_common/lenke/lenkeBase/LenkeBase'; import { useFormIntermediateStepPage } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPage'; -import { FormIntermediateStepLink } from 'components/pages/form-intermediate-step-page/FormIntermediateStepLink'; +import { FormIntermediateStepLink } from 'components/_common/formIntermediateStepLink/FormIntermediateStepLink'; import style from './FormIntermediateStepPage.module.scss'; From 3b2c5f2b149ed853d62d00e13cd1cfc40086d040 Mon Sep 17 00:00:00 2001 From: taniaholst <21334782+taniaholst@users.noreply.github.com> Date: Thu, 20 Mar 2025 10:25:17 +0000 Subject: [PATCH 11/16] Update screenshots --- ...link--default-desktop-linux-desktop-linux.png | Bin 0 -> 5347 bytes ...ge-disclaimer-desktop-linux-desktop-linux.png | Bin 0 -> 9000 bytes ...imer--default-desktop-linux-desktop-linux.png | Bin 0 -> 2042 bytes 3 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--default-desktop-linux-desktop-linux.png create mode 100644 packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--language-disclaimer-desktop-linux-desktop-linux.png create mode 100644 packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-languagedisclaimer--default-desktop-linux-desktop-linux.png diff --git a/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--default-desktop-linux-desktop-linux.png b/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--default-desktop-linux-desktop-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..7ea9a38f7a4c4e4853d370fdd49a4279140607b1 GIT binary patch literal 5347 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 literal 0 HcmV?d00001 diff --git a/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--language-disclaimer-desktop-linux-desktop-linux.png b/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--language-disclaimer-desktop-linux-desktop-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..febbe7d360c0764788e344a1967f33e062bb3e9e GIT binary patch literal 9000 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 literal 0 HcmV?d00001 diff --git a/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-languagedisclaimer--default-desktop-linux-desktop-linux.png b/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-languagedisclaimer--default-desktop-linux-desktop-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..e723d437723aec37e7b964fa661f6904ed33772e GIT binary patch literal 2042 zcmVPx+v`IukRCt{2-Cs;oSsDQFPb0lgy)zSUlg+lSS|&TRMhnS6*@4zs0V5Pw7F?j1 zjtptQQRylcrhriY(FJ5-7Gc&3DoUh41WN{FW5LZ(c9KFSmVK~nb}brPH?h|+-X4-^H!KXpLdFK~ zPp08-&EHu9nk@N5oRqNh9aI%`$T4DUyFGy@QEGOYm`AL3JwAm*kr=j`=2uwe?<@}= zJ@$X*!$*$;ZE&jv*^L!V--x%|;{xN474NH#r z;fLn{@c#Sn1uG?EX+EYMC9^Nou2i=o_-V!2lZ~g;JuH5KI+?d3NdpxUMPk_MTDoDW z%TBLfzy4BFT~P8N$L)&J%MS6EH%`QJf)dd$gfLxuF@5FoElWrgiD9d0>8FGVpGuN; zNrRJ(nYdbX#>C33{nKYc(tDNeKQ0ySslLa|jk4D7-X42sfCgYJ+SI7b>-X(rS2eji zKi(#clUEGb(Hn6s+SI6hr?1wj_wR`nezYxWPj1Pzv6*8Z)1OFf{uKH_*w2xRX#Ed6koy5B+1RDRDkdhxhCc6;nj zMOlZHMvT3`u5fQ$luA5+`mK{k7 zU~z@q6E*u44R+DtE5?qKBBw!9-eG(5Zbt6O?lyZwK|{~C!yP9j$fQ%180-j``<=~t zvpYQf$l2y9l^B_Hs)_-p?^N{NbC^d>q{~_b!y5Gn2WeG^som0CG<>e4!oY%MV%QqC*p~3=Q@Ti_eevSO?!-^?^AtZVk;i&T-8lRN07g2;9O9G! zp4zi^sG9YMB1r(?<)<0U-9uJqj)4Dq0QRopGG!7E0Js_II+)7%vZdWB(~1k*?x=~` z!7&lERo*i+;Y#QF=$Y*3lV4xR;S&ImDvRbRa`i1;R%zOZ?y`-Wd8J(|1@K}IA>xZs+a{Ll9mI|vf9#BX((*i^Q-sWrbeNAy^;f z98D7v0GybD!enxy_59HM+4;}%DuY>2kg9)e90&W=)*o=Lv(kC8ilh8wL~xq!{` zV?F?49BvOu{et%^65vN`I>a!vo5iN6`405V4#_nwRf%ZueA8&apYcTYL zOX%Hf@e&Ug#2|B1>&Wb#&7vsM<951ccUZ__n{+Lsdm)6pEs&WsS)Q=?@j}n|fE9(y zQf60kXyKqGA`F#$=XjgBw z-op5b{`R!aK#Ih$HEgjh;memV|7QC8Qx^>Y-`u{lC+W9gVPQeYN$@j{W*L-Sjn}fo zY7q$}PaHvAAJ(@Ri5O<&R(HRZUe5jMzFVR!wB@G>+@n3$jArLXS$%?F;}n>$=%D zJ^egbSxK?7IFW7ZZ0NTm0N}(ZRT8$Xv-}I4(ZN;xrCF224SY+)j?R$4h)#7(*KJ0k z-1@e&GA?kURb`4u_h8kLf;>$-Bhl7=ww3L3I*VY7GK(c(dMyF~PgZra<+v0^+jQlX zErTwB;;Z($oHw3Q0sxQ^IVZAs_V%jIe+RHeT&zffCy5upKlOj^dJx#U4a0th)_K3c zZ|2>=K;I?wfBd_|ShN`jhD3ig)&=qjFAT#%4E{bW48uakkIt|jK6>o;cQC-iM~}B` z-t=y&!Y~Z;VZLGQjQ>qQGq-HsB>6=A4obo>4D)Rr{wEX|hJ^}zhJ|5R$iNK?!?2L? Ye@|YCR-zPB%>V!Z07*qoM6N<$f>5&Pp8x;= literal 0 HcmV?d00001 From 5885145d0b914e181f3164d70c5d7d1579c735dd Mon Sep 17 00:00:00 2001 From: taniaholst Date: Fri, 21 Mar 2025 11:40:24 +0100 Subject: [PATCH 12/16] justerte headerWithParent og la den inn i formIntermediateStepPage --- .../HeaderWithParent.module.scss | 4 +- .../headerWithParent/HeaderWithParent.tsx | 22 +++++---- .../ContactStepPage.module.scss | 1 + .../contact-step-page/ContactStepPage.tsx | 5 ++- .../FormIntermediateStepPage.module.scss | 43 +++++++++++++++--- .../FormIntermediateStepPage.tsx | 45 +++++++++++-------- .../useFormIntermediateStepPage.tsx | 7 +-- .../content-props/form-intermediate-step.ts | 13 ------ 8 files changed, 86 insertions(+), 54 deletions(-) diff --git a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss index 95676d983..ac3e051a6 100644 --- a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss +++ b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss @@ -16,7 +16,7 @@ line-height: 52px; } - .tagsList { + .skjemanummerListe { display: flex; list-style: none; padding: 0; @@ -25,7 +25,7 @@ margin: 0; flex-wrap: wrap; - .tag { + .skjemanummer { background-color: var(--a-surface-neutral-subtle); border-radius: 2px; padding: 3px 6px; diff --git a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx index d9b12a528..67a88db91 100644 --- a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx +++ b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx @@ -6,16 +6,20 @@ import style from './HeaderWithParent.module.scss'; type Props = { contentProps: Pick & { - data: Pick; + data: Pick; }; textAboveTitle?: string; className?: string; - tags?: string[]; + formNumbers?: string[]; }; -export const HeaderWithParent = ({ contentProps, textAboveTitle, className, tags }: Props) => { +export const HeaderWithParent = ({ + contentProps, + textAboveTitle, + className, + formNumbers, +}: Props) => { const { data } = contentProps; - return (
@@ -24,11 +28,11 @@ export const HeaderWithParent = ({ contentProps, textAboveTitle, className, tags {data.title} - {tags && ( -
    - {tags.map((tag, index) => ( -
  • - {tag} + {formNumbers && ( +
      + {formNumbers.map((nummer, index) => ( +
    • + {nummer}
    • ))}
    diff --git a/packages/nextjs/src/components/pages/contact-step-page/ContactStepPage.module.scss b/packages/nextjs/src/components/pages/contact-step-page/ContactStepPage.module.scss index 61c44c1e0..05fdc3b47 100644 --- a/packages/nextjs/src/components/pages/contact-step-page/ContactStepPage.module.scss +++ b/packages/nextjs/src/components/pages/contact-step-page/ContactStepPage.module.scss @@ -37,6 +37,7 @@ .content { grid-area: content; + margin-top: 2rem; .linkPanels { display: flex; diff --git a/packages/nextjs/src/components/pages/contact-step-page/ContactStepPage.tsx b/packages/nextjs/src/components/pages/contact-step-page/ContactStepPage.tsx index 16cf81c8e..8bfbf6b97 100644 --- a/packages/nextjs/src/components/pages/contact-step-page/ContactStepPage.tsx +++ b/packages/nextjs/src/components/pages/contact-step-page/ContactStepPage.tsx @@ -20,6 +20,7 @@ export type ContactStepPageProps = ContentCommonProps & { linkPanelsSubHeading: string; linkPanels: (InternalLinkMixin & { ingress?: string })[]; backLink: InternalLinkMixin; + formNumbers?: string[]; }; }; @@ -33,15 +34,17 @@ export const ContactStepPage = ({ data }: ContactStepPageProps) => { linkPanelsSubHeading, linkPanels, backLink, + formNumbers, } = data; return (
    diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss index 11b79723e..ce5751151 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss @@ -3,13 +3,45 @@ $padding: 2rem; .formIntermediateStepPage { - background-color: white; - display: flex; - flex-direction: column; - justify-content: flex-start; - width: 100%; + padding-bottom: 1rem; + column-gap: 1.75rem; + margin: 1.25rem auto 2.5rem; + display: grid; + grid-template-columns: 1fr 40rem 1fr; + grid-template-areas: + 'pictogram header .' + '. content .' + '. backButton .'; + + @media only screen and (max-width: 1024px) { + grid-template-columns: none; + grid-template-areas: + '. pictogram .' + '. header .' + '. content .' + '. backButton .'; + } + .pictogram { + grid-area: pictogram; + display: block; + justify-self: end; + width: 4.5rem; + height: auto; + position: relative; + align-self: flex-start; + + @media only screen and (max-width: 1024px) { + width: 4rem; + justify-self: start; + } + } + + .header { + grid-area: header; + } .content { + grid-area: content; margin-top: 2rem; display: flex; flex-direction: column; @@ -58,6 +90,7 @@ $padding: 2rem; } .backButton { + grid-area: backButton; text-decoration-line: underline; text-underline-offset: 4px; padding: 0; diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx index b70cbfaeb..49cafe3db 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx @@ -1,38 +1,45 @@ import React from 'react'; import { Button, Heading } from '@navikt/ds-react'; import { translator } from 'translations'; -import { ThemedPageHeader } from 'components/_common/headers/themedPageHeader/ThemedPageHeader'; -import { FormIntermediateStepPageProps } from 'types/content-props/form-intermediate-step'; +import { StepBase } from 'types/content-props/form-intermediate-step'; import { ParsedHtml } from 'components/_common/parsedHtml/ParsedHtml'; import { LenkeBase } from 'components/_common/lenke/lenkeBase/LenkeBase'; import { useFormIntermediateStepPage } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPage'; import { FormIntermediateStepLink } from 'components/_common/formIntermediateStepLink/FormIntermediateStepLink'; - +import { HeaderWithParent } from 'components/_common/headers/headerWithParent/HeaderWithParent'; +import { IllustrationStatic } from 'components/_common/illustration/static/IllustrationStatic'; +import { ContentCommonProps, ContentType } from 'types/content-props/_content-common'; +import { PictogramsProps } from 'types/content-props/pictograms'; +import { Taxonomy } from 'types/taxonomies'; import style from './FormIntermediateStepPage.module.scss'; -export const FormIntermediateStepPage = (props: FormIntermediateStepPageProps) => { - const { language, type, displayName, modifiedTime, data } = props; - const { title, illustration } = data; +export type FormIntermediateStepPageProps = ContentCommonProps & { + type: ContentType.FormIntermediateStepPage; + data: { + title: string; + illustration: PictogramsProps; + taxonomy?: Taxonomy[]; + customCategory: string; + textAboveTitle?: string; + formNumbers?: string[]; + } & StepBase; +}; +export const FormIntermediateStepPage = (props: FormIntermediateStepPageProps) => { + const { language, data } = props; + const { title, illustration, textAboveTitle, formNumbers } = data; const { currentStepData, backUrl, previousStepTitle } = useFormIntermediateStepPage(props); const getTranslations = translator('form', language); return (
    - +
    diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx index c68348c77..6e70c7092 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/useFormIntermediateStepPage.tsx @@ -1,11 +1,8 @@ import { useEffect, useState } from 'react'; import { useRouter } from 'next/compat/router'; -import { - FormIntermediateStepPageProps, - SelectableStep, - StepBase, -} from 'types/content-props/form-intermediate-step'; +import { SelectableStep, StepBase } from 'types/content-props/form-intermediate-step'; import { stripXpPathPrefix } from 'utils/urls'; +import { FormIntermediateStepPageProps } from './FormIntermediateStepPage'; const STEP_PARAM = 'stegvalg'; diff --git a/packages/nextjs/src/types/content-props/form-intermediate-step.ts b/packages/nextjs/src/types/content-props/form-intermediate-step.ts index 96a558e45..b4113304d 100644 --- a/packages/nextjs/src/types/content-props/form-intermediate-step.ts +++ b/packages/nextjs/src/types/content-props/form-intermediate-step.ts @@ -1,8 +1,5 @@ import { ProcessedHtmlProps } from 'types/processed-html-props'; -import { Taxonomy } from 'types/taxonomies'; import { OptionSetSingle } from 'types/util-types'; -import { ContentCommonProps, ContentType } from './_content-common'; -import { PictogramsProps } from './pictograms'; type ExternalOption = any; type InternalOption = any; @@ -26,13 +23,3 @@ export type StepBase = { stepsHeadline: string; steps: SelectableStep[]; }; - -export type FormIntermediateStepPageProps = ContentCommonProps & { - type: ContentType.FormIntermediateStepPage; - data: { - title: string; - illustration: PictogramsProps; - taxonomy?: Taxonomy[]; - customCategory: string; - } & StepBase; -}; From a43d869a9dd140318474c859025e551b2f1a532d Mon Sep 17 00:00:00 2001 From: taniaholst Date: Fri, 21 Mar 2025 13:15:31 +0100 Subject: [PATCH 13/16] fikset import --- packages/nextjs/src/types/content-props/_content-common.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/nextjs/src/types/content-props/_content-common.ts b/packages/nextjs/src/types/content-props/_content-common.ts index 98bffe8ef..b1c5781f0 100644 --- a/packages/nextjs/src/types/content-props/_content-common.ts +++ b/packages/nextjs/src/types/content-props/_content-common.ts @@ -10,6 +10,9 @@ import { SiteProps } from 'types/content-props/site-props'; import { FormsOverviewProps } from 'types/content-props/forms-overview'; import { OverviewPageProps } from 'types/content-props/overview-props'; import { ContactStepPageProps } from 'components/pages/contact-step-page/ContactStepPage'; +import { + FormIntermediateStepPageProps +} from 'components/pages/form-intermediate-step-page/FormIntermediateStepPage'; import { ExternalLinkProps } from './external-link-props'; import { InternalLinkProps } from './internal-link-props'; import { ContentListProps } from './content-list-props'; @@ -43,7 +46,6 @@ import { PayoutDatesProps } from './payout-dates'; import { FragmentPageProps } from './fragment-page-props'; import { AreaPageProps, FrontPageNestedProps, FrontPageProps } from './index-pages-props'; import { FormDetailsPageProps } from './form-details'; -import { FormIntermediateStepPageProps } from './form-intermediate-step'; import { FallbackPageProps } from './fallback-page-props'; export enum ContentType { From e1d595930a34d90dc9a2b3d0c24055e6a1614ad0 Mon Sep 17 00:00:00 2001 From: taniaholst Date: Fri, 21 Mar 2025 14:33:15 +0100 Subject: [PATCH 14/16] la til skjemanummer inni lenkepanelene i mellomsteg for skjema --- .../FormIntermediateStepLink.tsx | 7 +- .../formNumberTag/FormNumberTag.module.scss | 7 ++ .../_common/formNumberTag/FormNumberTag.tsx | 11 +++ .../HeaderWithParent.module.scss | 8 +- .../headerWithParent/HeaderWithParent.tsx | 8 +- .../FormIntermediateStepPage.module.scss | 44 +++-------- .../FormIntermediateStepPage.tsx | 73 +++++++++---------- .../content-props/form-intermediate-step.ts | 1 + 8 files changed, 74 insertions(+), 85 deletions(-) create mode 100644 packages/nextjs/src/components/_common/formNumberTag/FormNumberTag.module.scss create mode 100644 packages/nextjs/src/components/_common/formNumberTag/FormNumberTag.tsx diff --git a/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.tsx b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.tsx index 5970a4345..887f53e60 100644 --- a/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.tsx +++ b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.tsx @@ -4,9 +4,12 @@ import { LenkeBase } from 'components/_common/lenke/lenkeBase/LenkeBase'; import { FormIntermediateStep_StepLinkData } from 'components/pages/form-intermediate-step-page/useFormIntermediateStepPage'; import { EditorHelp } from 'components/_editor-only/editor-help/EditorHelp'; import { LanguageDisclaimer } from 'components/_common/languageDisclaimer/LanguageDisclaimer'; +import FormNumberTag from 'components/_common/formNumberTag/FormNumberTag'; type Props = FormIntermediateStep_StepLinkData & - Omit, 'children' | 'href'>; + Omit, 'children' | 'href'> & { + formNumberStepData?: string; + }; export const FormIntermediateStepLink = ({ label, @@ -16,6 +19,7 @@ export const FormIntermediateStepLink = ({ isStepNavigation, // eslint-disable-next-line @typescript-eslint/no-unused-vars nextStep, + formNumberStepData, ...rest }: Props) => { if (!href) { @@ -25,6 +29,7 @@ export const FormIntermediateStepLink = ({ return ( {label} + {formNumberStepData && } {explanation} {languageDisclaimer && {languageDisclaimer}} diff --git a/packages/nextjs/src/components/_common/formNumberTag/FormNumberTag.module.scss b/packages/nextjs/src/components/_common/formNumberTag/FormNumberTag.module.scss new file mode 100644 index 000000000..9897e2ead --- /dev/null +++ b/packages/nextjs/src/components/_common/formNumberTag/FormNumberTag.module.scss @@ -0,0 +1,7 @@ +.formNumberTag { + background-color: var(--a-surface-neutral-subtle); + border-radius: 2px; + padding: 3px 6px; + color: var(--a-gray-700); + width: fit-content; +} diff --git a/packages/nextjs/src/components/_common/formNumberTag/FormNumberTag.tsx b/packages/nextjs/src/components/_common/formNumberTag/FormNumberTag.tsx new file mode 100644 index 000000000..562fb6852 --- /dev/null +++ b/packages/nextjs/src/components/_common/formNumberTag/FormNumberTag.tsx @@ -0,0 +1,11 @@ +import style from './FormNumberTag.module.scss'; + +interface Props { + formNumber: string; +} + +export const FormNumberTag = ({ formNumber }: Props) => { + return
    {formNumber}
    ; +}; + +export default FormNumberTag; diff --git a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss index ac3e051a6..eec4e4d40 100644 --- a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss +++ b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.module.scss @@ -16,7 +16,7 @@ line-height: 52px; } - .skjemanummerListe { + .formNumberListe { display: flex; list-style: none; padding: 0; @@ -24,11 +24,5 @@ gap: 5px; margin: 0; flex-wrap: wrap; - - .skjemanummer { - background-color: var(--a-surface-neutral-subtle); - border-radius: 2px; - padding: 3px 6px; - } } } diff --git a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx index 51ca7d143..91ea37478 100644 --- a/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx +++ b/packages/nextjs/src/components/_common/headers/headerWithParent/HeaderWithParent.tsx @@ -2,6 +2,7 @@ import { BodyShort, Heading } from '@navikt/ds-react'; import { ProductDataMixin } from 'types/component-props/_mixins'; import { ContentProps } from 'types/content-props/_content-common'; import { classNames } from 'utils/classnames'; +import FormNumberTag from 'components/_common/formNumberTag/FormNumberTag'; import style from './HeaderWithParent.module.scss'; type Props = { @@ -19,7 +20,6 @@ export const HeaderWithParent = ({ className, formNumbers, }: Props) => { - const { data } = contentProps; return (
    @@ -30,11 +30,9 @@ export const HeaderWithParent = ({ {data.title} {formNumbers && ( -
      +
        {formNumbers.map((nummer, index) => ( -
      • - {nummer} -
      • + ))}
      )} diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss index ce5751151..e795db16c 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.module.scss @@ -1,7 +1,3 @@ -@use 'common' as common; - -$padding: 2rem; - .formIntermediateStepPage { padding-bottom: 1rem; column-gap: 1.75rem; @@ -43,44 +39,22 @@ $padding: 2rem; .content { grid-area: content; margin-top: 2rem; - display: flex; - flex-direction: column; - justify-content: flex-start; - align-self: center; - width: 100%; - max-width: common.$contentMaxWidth; & > * { width: 100%; } - .stepOptionsWrapper { - display: flex; - flex-direction: column; - align-items: flex-start; - max-width: common.$sectionMaxWidth; - - .stepList { - list-style-type: none; - margin: 0; - padding: 0; + .stepList { + list-style-type: none; + margin: 0; + padding: 0; - .stepItem { - margin-bottom: var(--a-spacing-7); + .stepItem { + margin-bottom: var(--a-spacing-7); - .stepAction { - &:global(.navds-link-panel) { - border-color: var(--default-action-color); - } - & :global { - .navds-link-panel__title, - .navds-link-panel__chevron { - color: var(--default-action-color); - } - } - @media #{common.$mq-screen-mobile} { - padding: 0.75rem; - } + .stepAction { + &:global(.navds-link-panel) { + border-color: var(--default-action-color); } } } diff --git a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx index cf13e1f6f..ef5606e41 100644 --- a/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx +++ b/packages/nextjs/src/components/pages/form-intermediate-step-page/FormIntermediateStepPage.tsx @@ -43,45 +43,44 @@ export const FormIntermediateStepPage = (props: FormIntermediateStepPageProps) = formNumbers={formNumbers} />
      -
      - - {previousStepTitle &&
      Forrige steg: {previousStepTitle}
      } - {currentStepData.stepsHeadline && ( - - {currentStepData.stepsHeadline} - - )} -
        - {currentStepData.steps.map((step) => ( -
      • - -
      • - ))} -
      -
      - {backUrl && ( -
      - -
      + + {previousStepTitle &&
      Forrige steg: {previousStepTitle}
      } + {currentStepData.stepsHeadline && ( + + {currentStepData.stepsHeadline} + )} +
        + {currentStepData.steps.map((step) => ( +
      • + +
      • + ))} +
      + {backUrl && ( +
      + +
      + )}
    ); }; diff --git a/packages/nextjs/src/types/content-props/form-intermediate-step.ts b/packages/nextjs/src/types/content-props/form-intermediate-step.ts index b4113304d..445701852 100644 --- a/packages/nextjs/src/types/content-props/form-intermediate-step.ts +++ b/packages/nextjs/src/types/content-props/form-intermediate-step.ts @@ -12,6 +12,7 @@ export type StepOptions = { }; export type SelectableStep = { + formNumberStepData: string | undefined; label: string; explanation: string; languageDisclaimer?: string; From 0fe9e3992da9f8dc666d8f8964aa22e1dbee5738 Mon Sep 17 00:00:00 2001 From: taniaholst Date: Fri, 21 Mar 2025 14:36:03 +0100 Subject: [PATCH 15/16] la til skjemanummer inni lenkepanelene i mellomsteg for skjema --- .../FormIntermediateStepLink.stories.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx index efac5f578..c08ec30f9 100644 --- a/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx +++ b/packages/nextjs/src/components/_common/formIntermediateStepLink/FormIntermediateStepLink.stories.tsx @@ -19,12 +19,14 @@ export const Default: Story = { analyticsComponent: 'mellomsteg', analyticsLinkGroup: 'Example Group', analyticsLabel: 'Example Step', + formNumberStepData: 'Nav 04-01.02', nextStep: { _selected: 'next', next: { editorial: { html: '' }, stepsHeadline: '', steps: [], + formNumberStepData: 'Nav 04-01.02', }, }, }, @@ -40,12 +42,14 @@ export const LanguageDisclaimer: Story = { analyticsComponent: 'mellomsteg', analyticsLinkGroup: 'Example Group', analyticsLabel: 'Example Step', + formNumberStepData: 'Nav 04-01.02', nextStep: { _selected: 'next', next: { editorial: { html: '' }, stepsHeadline: '', steps: [], + formNumberStepData: 'Nav 04-01.02', }, }, }, From 9a9cc078ac7e4b35911a9774c1eabdaa771b3468 Mon Sep 17 00:00:00 2001 From: taniaholst <21334782+taniaholst@users.noreply.github.com> Date: Fri, 21 Mar 2025 13:38:25 +0000 Subject: [PATCH 16/16] Update screenshots --- ...k--default-desktop-linux-desktop-linux.png | Bin 5347 -> 7149 bytes ...disclaimer-desktop-linux-desktop-linux.png | Bin 9000 -> 10868 bytes 2 files changed, 0 insertions(+), 0 deletions(-) diff --git a/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--default-desktop-linux-desktop-linux.png b/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--default-desktop-linux-desktop-linux.png index 7ea9a38f7a4c4e4853d370fdd49a4279140607b1..29b1da6491915051d36bd27196d10125eea41e7b 100644 GIT binary patch literal 7149 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 D8@}lv literal 5347 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 diff --git a/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--language-disclaimer-desktop-linux-desktop-linux.png b/packages/nextjs/playwright/screenshot.spec.ts-snapshots/components-common-formintermediatesteplink--language-disclaimer-desktop-linux-desktop-linux.png index febbe7d360c0764788e344a1967f33e062bb3e9e..74101128d7a91295e7a065c35cce5529c84c944d 100644 GIT binary patch literal 10868 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 literal 9000 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