Legger til Sanity tekster for dato/måned placeholder og format

Author: ole-kristian-rudjord

src/frontend/components/Felleskomponenter/Datovelger/Datovelger.tsx

@@ -1,11 +1,11 @@
 import React, { ReactNode, useEffect } from 'react';
 
 import { formatISO, isAfter, startOfDay } from 'date-fns';
-import { useIntl } from 'react-intl';
 
 import { BodyShort, ErrorMessage, DatePicker, useDatepicker } from '@navikt/ds-react';
 import type { Felt, ISkjema } from '@navikt/familie-skjema';
 
+import { useApp } from '../../../context/AppContext';
 import { useSpråk } from '../../../context/SpråkContext';
 import { ISODateString } from '../../../typer/common';
 import { SkjemaFeltTyper } from '../../../typer/skjema';
@@ -17,7 +17,6 @@ import {
     tidenesEnde,
     tidenesMorgen,
 } from '../../../utils/dato';
-import SpråkTekst from '../SpråkTekst/SpråkTekst';
 
 interface DatoVelgerProps {
     felt: Felt<ISODateString>;
@@ -44,8 +43,9 @@ const Datovelger: React.FC<DatoVelgerProps> = ({
     dynamisk = false,
     strategy = 'fixed',
 }) => {
-    const { formatMessage } = useIntl();
     const { valgtLocale } = useSpråk();
+    const { tekster, plainTekst } = useApp();
+    const { datoformatHjelpetekst, datoformatPlaceholder } = tekster().FELLES.hjelpeteksterForInput;
 
     const minDatoErIFremtiden = () =>
         tilhørendeFraOgMedFelt?.verdi &&
@@ -113,12 +113,8 @@ const Datovelger: React.FC<DatoVelgerProps> = ({
                     disabled={disabled}
                     size={'medium'}
                     label={label}
-                    description={
-                        <BodyShort>
-                            <SpråkTekst id={'felles.velg-dato.hjelpetekst'} />
-                        </BodyShort>
-                    }
-                    placeholder={formatMessage({ id: 'felles.velg-dato.placeholder' })}
+                    description={<BodyShort>{plainTekst(datoformatHjelpetekst)}</BodyShort>}
+                    placeholder={plainTekst(datoformatPlaceholder)}
                     error={!!(felt.feilmelding && skjema.visFeilmeldinger)}
                 />
             </DatePicker>

src/frontend/components/Felleskomponenter/MånedÅrVelger/MånedÅrVelger.tsx

@@ -53,6 +53,9 @@ export const MånedÅrVelger: React.FC<MånedÅrVelgerProps> = ({
     const { valgtLocale } = useSpråk();
     const { tekster, plainTekst } = useApp();
     const [error, setError] = useState<Feilmelding | undefined>(undefined);
+
+    const { manedformatPlaceholder } = tekster().FELLES.hjelpeteksterForInput;
+
     const formateringsfeilmeldinger = tekster()[ESanitySteg.FELLES].formateringsfeilmeldinger;
 
     const nullstillOgSettFeilmelding = (feilmelding: Feilmelding) => {
@@ -109,6 +112,7 @@ export const MånedÅrVelger: React.FC<MånedÅrVelgerProps> = ({
             <MonthPicker.Input
                 {...inputProps}
                 label={label}
+                placeholder={plainTekst(manedformatPlaceholder)}
                 disabled={disabled}
                 error={
                     error && visFeilmeldinger

src/frontend/typer/sanity/sanity.ts

@@ -57,6 +57,7 @@ export const navigasjonPrefix = 'NAVIGASJON';
 export const formateringsfeilmeldingerPrefix = 'FORMATERINGSFEILMELDINGER';
 export const vedlikeholdsarbeidPrefix = 'VEDLIKEHOLDSARBEID';
 export const kanIkkeBrukeSoeknadPrefix = 'KAN_IKKE_BRUKE_SOKNAD';
+export const hjelpeteksterForInputPrefix = 'HJELPETEKSTER_FOR_INPUT';
 
 export interface ISanitySpørsmålDokument extends SanityDokument {
     sporsmal: LocaleRecordBlock;

src/frontend/typer/sanity/tekstInnhold.ts

@@ -64,6 +64,7 @@ export interface IFellesTekstInnhold {
     formateringsfeilmeldinger: IFormateringsfeilmeldingerTekstinnhold;
     vedlikeholdsarbeid: IVedlikeholdsarbeidTekstinnhold;
     kanIkkeBrukeSoeknad: IKanIkkeBrukeSoeknadTekstinnhold;
+    hjelpeteksterForInput: IHjelpeteksterForInputTekstInnhold;
 }
 
 export interface IFrittståendeOrdTekstinnhold {
@@ -189,3 +190,10 @@ export interface IVedlikeholdsarbeidTekstinnhold {
 export interface IKanIkkeBrukeSoeknadTekstinnhold {
     brukPDFKontantstoette: LocaleRecordBlock;
 }
+
+export interface IHjelpeteksterForInputTekstInnhold {
+    datoformatHjelpetekst: LocaleRecordBlock;
+    datoformatPlaceholder: LocaleRecordBlock;
+    manedformatPlaceholder: LocaleRecordBlock;
+    velgLandPlaceholder: LocaleRecordBlock;
+}

src/frontend/utils/sanity.ts

@@ -22,6 +22,7 @@ import {
     FlettefeltVerdier,
     formateringsfeilmeldingerPrefix,
     frittståendeOrdPrefix,
+    hjelpeteksterForInputPrefix,
     kanIkkeBrukeSoeknadPrefix,
     LocaleRecordBlock,
     LocaleRecordString,
@@ -34,6 +35,7 @@ import {
     IFellesTekstInnhold,
     IFormateringsfeilmeldingerTekstinnhold,
     IFrittståendeOrdTekstinnhold,
+    IHjelpeteksterForInputTekstInnhold,
     IKanIkkeBrukeSoeknadTekstinnhold,
     IModalerTekstinnhold,
     INavigasjonTekstinnhold,
@@ -179,6 +181,9 @@ export const transformerTilTekstinnhold = (alleDokumenter: SanityDokument[]): IT
         kanIkkeBrukeSoeknad: struktrerInnholdForFelles(
             dokumenterFiltrertPåPrefix(fellesDokumenter, kanIkkeBrukeSoeknadPrefix)
         ) as IKanIkkeBrukeSoeknadTekstinnhold,
+        hjelpeteksterForInput: struktrerInnholdForFelles(
+            dokumenterFiltrertPåPrefix(fellesDokumenter, hjelpeteksterForInputPrefix)
+        ) as IHjelpeteksterForInputTekstInnhold,
     };
     return tekstInnhold as ITekstinnhold;
 };