Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fiks maks lengde på brevtekst. #6354

Merged
merged 1 commit into from
Jul 5, 2024
Merged

Fiks maks lengde på brevtekst. #6354

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/v2/gui/src/sak/meldinger/FritekstInput.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export const Default: StoryObj<typeof FritekstInput> = {
args: {
språk: { kode: 'NB', kodeverk: 'SPRAAK_KODE' },
show: true,
showTitle: true,
fritekstModus: 'EnkelFritekst',
showValidation: true,
},
};
41 changes: 24 additions & 17 deletions packages/v2/gui/src/sak/meldinger/FritekstInput.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React, { type ForwardedRef, forwardRef, useEffect, useImperativeHandle, useReducer } from 'react';
import { Tag, type TagProps, Textarea, TextField } from '@navikt/ds-react';
import { $FritekstbrevinnholdDto } from '@k9-sak-web/backend/k9sak/generated';
import { $BestillBrevDto, $FritekstbrevinnholdDto } from '@k9-sak-web/backend/k9sak/generated';
import type { Språkkode } from '@k9-sak-web/backend/k9sak/kodeverk/Språkkode.js';
import { validateTextCharacters } from '../../utils/validation/validateTextCharacters.js';

Expand All @@ -26,10 +26,13 @@ export interface FritekstInputInvalid {
readonly tekst?: never;
}

// Sending av brev med fritekst har to ulike varianter. Ein kort enkel fritekst eller lengre tekst med tittel.
export type FritekstModus = 'EnkelFritekst' | 'StørreFritekstOgTittel';

type FritekstInputProps = {
readonly språk: Språkkode;
readonly show: boolean;
readonly showTitle: boolean;
readonly fritekstModus: FritekstModus;
readonly showValidation: boolean;
readonly defaultValue?: FritekstInputValue;
readonly onChange?: (value: FritekstInputValue | FritekstInputInvalid) => void;
Expand All @@ -41,8 +44,9 @@ export interface FritekstInputMethods {
setValue(value: FritekstInputValue): void;
}

const fritekstMaxLength = $FritekstbrevinnholdDto.properties.brødtekst.maxLength;
const tittelMaxLength = $FritekstbrevinnholdDto.properties.overskrift.maxLength;
const storFritekstMaxLength = $FritekstbrevinnholdDto.properties.brødtekst.maxLength;
const litenFritekstMaxLength = $BestillBrevDto.properties.fritekst.maxLength

const validateTittel = (newValue: string | undefined): Valid | Error => {
const input = newValue || '';
Expand All @@ -58,11 +62,12 @@ const validateTittel = (newValue: string | undefined): Valid | Error => {

const tittelReducer = (_: Valid | Error, newValue: string | undefined): Valid | Error => validateTittel(newValue);

const validateTekst = (newValue: string | undefined): Valid | Error => {
const input = newValue || '';
const len = newValue?.trim().length || 0;
if (newValue !== undefined && len > 0 && len <= fritekstMaxLength) {
const charValidationResult = validateTextCharacters(newValue);
const validateTekst = (tekst: string | undefined, fritekstModus: FritekstModus): Valid | Error => {
const input = tekst || '';
const fritekstMaxLength = fritekstModus === "StørreFritekstOgTittel" ? storFritekstMaxLength : litenFritekstMaxLength
const len = tekst?.trim().length || 0;
if (tekst !== undefined && len > 0 && len <= fritekstMaxLength) {
const charValidationResult = validateTextCharacters(tekst);
if (charValidationResult.ok) {
// validation ok
return { valid: true, input };
Expand All @@ -77,7 +82,8 @@ const validateTekst = (newValue: string | undefined): Valid | Error => {
return { valid: false, input, error: `Fritekst kan være maks ${fritekstMaxLength} tegn` };
};

const tekstReducer = (_: Valid | Error, newValue: string | undefined): Valid | Error => validateTekst(newValue);
const tekstReducer = (_: Valid | Error, newValue: {tekst: string | undefined, modus: FritekstModus}): Valid | Error =>
validateTekst(newValue.tekst, newValue.modus);

const resolveLanguageName = (språk: Språkkode): string => {
switch (språk.kode.toUpperCase()) {
Expand Down Expand Up @@ -107,15 +113,15 @@ const resolveLanguageTagVariant = (språk: Språkkode): TagProps['variant'] =>
*/
const FritekstInput = forwardRef(
(
{ språk, show, showTitle, showValidation = false, defaultValue, onChange }: FritekstInputProps,
{ språk, show, fritekstModus, showValidation = false, defaultValue, onChange }: FritekstInputProps,
ref: ForwardedRef<FritekstInputMethods>,
) => {
const [tittel, setTittel] = useReducer(tittelReducer, validateTittel(defaultValue?.tittel));
const [tekst, setTekst] = useReducer(tekstReducer, validateTekst(defaultValue?.tekst));
const [tekst, setTekst] = useReducer(tekstReducer, validateTekst(defaultValue?.tekst, fritekstModus));

const getValue = (): FritekstInputValue | FritekstInputInvalid => {
if (tekst.valid) {
if (!showTitle) {
if (fritekstModus === 'EnkelFritekst') {
return { tittel: undefined, tekst: tekst.input };
}
if (tittel.valid) {
Expand All @@ -126,24 +132,25 @@ const FritekstInput = forwardRef(
};
const setValue = (value: FritekstInputValue | undefined) => {
setTittel(value?.tekst);
setTekst(value?.tekst);
setTekst({tekst: value?.tekst, modus: fritekstModus});
};

useEffect(() => {
if (onChange !== undefined) {
onChange(getValue());
}
}, [tittel, tekst, showTitle, onChange]);
}, [tittel, tekst, fritekstModus, onChange]);
useImperativeHandle(ref, () => {
const reset = () => setValue(defaultValue);
return { reset, getValue, setValue };
});

if (show) {
const fritekstMaxLength = fritekstModus === 'StørreFritekstOgTittel' ? storFritekstMaxLength : litenFritekstMaxLength
return (
<>
{
showTitle ? (
fritekstModus === 'StørreFritekstOgTittel' ? (
<TextField
value={tittel.input}
size="small"
Expand All @@ -170,13 +177,13 @@ const FritekstInput = forwardRef(
resize="vertical"
defaultValue={defaultValue?.tekst}
error={showValidation && tekst?.error}
onChange={ev => setTekst(ev.target.value)}
onChange={ev => setTekst({tekst: ev.target.value, modus: fritekstModus})}
/>
</>
);
}
return null; // Not displaying fritekst input
},
}
);

export default FritekstInput;
10 changes: 6 additions & 4 deletions packages/v2/gui/src/sak/meldinger/Messages.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ import FritekstForslagSelect from './FritekstForslagSelect.js';
import FritekstInput, {
type FritekstInputInvalid,
type FritekstInputMethods,
type FritekstInputValue,
type FritekstInputValue, type FritekstModus,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ser ut til at prettier ikke kjører i precommit mer 😄

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Du har rett, fekk EACCESS error når den køyrte og huska ikkje igjen korleis eg skulle fikse det i farten 😬

} from './FritekstInput.js';
import MalSelect from './MalSelect.jsx';
import type { BehandlingInfo } from '../BehandlingInfo.js';
Expand Down Expand Up @@ -238,13 +238,15 @@ const Messages = ({
onValgtMalChanged(valgtMal);
}, [valgtMal]);

const fritekstModus: FritekstModus = valgtMal?.støtterTittelOgFritekst ? 'StørreFritekstOgTittel' : 'EnkelFritekst'

const showFritekstInput = (valgtMal?.støtterFritekst || valgtMal?.støtterTittelOgFritekst) ?? false;

// FritekstbrevinnholdDto must be undefined or have props set with string value
const resolveFritekstbrevinnholdDto = (
fritekstInputValue: FritekstInputValue | FritekstInputInvalid | undefined,
): FritekstbrevinnholdDto | undefined => {
if (fritekstInputValue?.tittel !== undefined && fritekstInputValue?.tekst !== undefined) {
if (fritekstModus === 'StørreFritekstOgTittel' && fritekstInputValue?.tittel !== undefined && fritekstInputValue?.tekst !== undefined) {
return {
overskrift: fritekstInputValue.tittel,
brødtekst: fritekstInputValue.tekst,
Expand Down Expand Up @@ -280,7 +282,7 @@ const Messages = ({
const fritekstbrev = resolveFritekstbrevinnholdDto(fritekstInputValue);
// Ut frå oppførsel til gammal kode ser det ut til at fritekst skal settast når valgt mal ikkje støtter tittel.
// Ellers skal fritekstbrev prop settast.
const fritekst = fritekstInputValue?.tekst;
const fritekst = fritekstModus === 'EnkelFritekst' ? fritekstInputValue?.tekst : undefined;
const overstyrtMottaker = resolveOvertyrtMottaker();
// Viss valg for sending til tredjepartsmottaker er aktivt må overstyrtMottaker vere definert
if (tredjepartsmottakerAktivert && overstyrtMottaker === undefined) {
Expand Down Expand Up @@ -386,7 +388,7 @@ const Messages = ({
defaultValue={valgtFritekstInputValue}
ref={fritekstInputRef}
show={showFritekstInput}
showTitle={valgtMal?.støtterTittelOgFritekst === true}
fritekstModus={fritekstModus}
showValidation={showValidation}
/>
<HStack gap="3">
Expand Down