Legg på validering av janzz med feilmelding

navikt · Oct 30, 2024 · 7748ac0 · 7748ac0
1 parent 9e97f35
commit 7748ac0
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 5 deletions.
diff --git a/src/stilling/stilling/adDataReducer.ts b/src/stilling/stilling/adDataReducer.ts
@@ -107,6 +107,7 @@ const adDataReducer = (state = initialState, action: any) => {
 const manipulateAdReducer = (state: Stilling, action: any) => {
     switch (action.type) {
         case SET_JANZZ:
+            console.log('datareducer SET_JANZZ', action);
             return {
                 ...state,
                 categoryList: action.kategori,

diff --git a/src/stilling/stilling/adValidationReducer.ts b/src/stilling/stilling/adValidationReducer.ts
@@ -144,6 +144,7 @@ function* validateLocationArea(): Generator<unknown, any, any> {
 function* validateYrkestittel(): Generator<unknown, any, any> {
     const state = yield select();
     const { categoryList } = state.adData;
+    console.log('validateYrkestittel SET_JANZZ', categoryList);
 
     if (valueIsNotSet(categoryList)) {
         yield addValidationError({ field: 'yrkestittel', message: 'Yrkestittel mangler' });

diff --git a/src/stilling/stilling/edit/om-stillingen/janzz/Janzz.tsx b/src/stilling/stilling/edit/om-stillingen/janzz/Janzz.tsx
@@ -6,8 +6,9 @@ import { fetchJanzzYrker, JanzzStilling } from '../../../../api/api';
 import capitalizeEmployerName from '../../endre-arbeidsgiver/capitalizeEmployerName';
 import { SET_EMPLOYMENT_JOBTITLE, SET_JANZZ } from '../../../adDataReducer';
 import { StyrkCategory } from 'felles/domene/stilling/Stilling';
-import { useDispatch } from 'react-redux';
-import { UNSAFE_Combobox } from '@navikt/ds-react';
+import { useDispatch, useSelector } from 'react-redux';
+import Skjemalabel from '../../skjemaetikett/Skjemalabel';
+import { State } from '../../../../redux/store';
 
 type Props = {
     categoryList: StyrkCategory[];
@@ -16,6 +17,7 @@ type Props = {
 
 const Janzz: FunctionComponent<Props> = ({ categoryList, tittel }) => {
     const dispatch = useDispatch();
+    const yrkestittelError = useSelector((state: State) => state.adValidation.errors.yrkestittel);
 
     const [input, setInput] = useState<string>(tittel);
     const [suggestions, setSuggestions] = useState<Nettressurs<JanzzStilling[]>>(ikkeLastet());
@@ -57,6 +59,7 @@ const Janzz: FunctionComponent<Props> = ({ categoryList, tittel }) => {
     };
 
     const onForslagValgt = (valgtForslag: Suggestion) => {
+        console.log('valgtforslag', valgtForslag);
         if (suggestions.kind === Nettstatus.Suksess) {
             if (valgtForslag) {
                 const found = finnJanzzStilling(suggestions.data, valgtForslag.value);
@@ -73,25 +76,31 @@ const Janzz: FunctionComponent<Props> = ({ categoryList, tittel }) => {
                             parentId: null,
                         },
                     ];
+                    console.log('kategori', kategori);
                     dispatch({ type: SET_JANZZ, kategori });
+                } else {
+                    dispatch({ type: SET_JANZZ, undefined });
                 }
                 setInput(capitalizeEmployerName(found ? found.label : null) || '');
+            } else {
+                dispatch({ type: SET_JANZZ, undefined });
             }
         }
     };
 
-    const feilmeldingTilBruker = suggestions.kind === Nettstatus.Feil && suggestions.error.message;
+    //const feilmeldingTilBruker = suggestions.kind === Nettstatus.Feil && suggestions.error.message;
 
     return (
         <div>
+            <Skjemalabel påkrevd>Yrkestittel som vises på stillingen</Skjemalabel>
             <Typeahead
-                label="Yrkestittel som vises på stillingen (må fylles ut)"
+                label=""
                 value={input === 'Stilling uten valgt jobbtittel' ? '' : input}
                 onSelect={onForslagValgt}
                 onChange={onChange}
                 onBlur={onChange}
                 suggestions={konverterTilTypeaheadFormat(suggestions)}
-                error={feilmeldingTilBruker || undefined}
+                error={yrkestittelError}
                 className={css.typeahead}
                 aria-labelledby="endre-stilling-styrk"
             />