HAI-1866 Add length limit for hanke name

src/common/components/textInput/TextInput.tsx

@@ -9,6 +9,7 @@ import { getInputErrorText } from '../../utils/form';
 type PropTypes = {
   name: string;
   label?: string;
+  maxLength?: number | undefined;
   disabled?: boolean;
   required?: boolean;
   readOnly?: boolean;
@@ -23,6 +24,7 @@ type PropTypes = {
 const TextInput: React.FC<React.PropsWithChildren<PropTypes>> = ({
   name,
   label,
+  maxLength = undefined,
   disabled,
   tooltip,
   required,
@@ -48,6 +50,7 @@ const TextInput: React.FC<React.PropsWithChildren<PropTypes>> = ({
           className={className}
           label={label || t(`hankeForm:labels:${name}`)}
           value={value || ''}
+          maxLength={maxLength}
           helperText={helperText}
           placeholder={placeholder}
           errorText={getInputErrorText(t, error)}

src/domain/hanke/edit/HankeForm.test.tsx

@@ -119,6 +119,23 @@ describe('HankeForm', () => {
     expect(screen.getByTestId(FORMFIELD.KUVAUS)).toHaveValue(hankkeenKuvaus);
   });
 
+  test('Hanke nimi should be limited to 100 characters and not exceed the limit with additional characters', async () => {
+    const { user } = render(<HankeFormContainer />);
+    const initialName = 'b'.repeat(90);
+
+    fireEvent.change(screen.getByRole('textbox', { name: /hankkeen nimi/i }), {
+      target: { value: initialName },
+    });
+
+    await user.type(
+      screen.getByRole('textbox', { name: /hankkeen nimi/i }),
+      'additional_characters',
+    );
+
+    const result = screen.getByRole('textbox', { name: /hankkeen nimi/i });
+    expect(result).toHaveValue(initialName.concat('additional'));
+  });
+
   test('Yhteystiedot can be filled', async () => {
     const { user } = await setupYhteystiedotPage(<HankeFormContainer hankeTunnus="HAI22-1" />);
 

src/domain/hanke/edit/HankeFormPerustiedot.tsx

@@ -51,7 +51,7 @@ const HankeFormPerustiedot: React.FC<React.PropsWithChildren<FormProps>> = ({
         <p>{t('form:requiredInstruction')}</p>
       </Box>
       <div className="formWpr">
-        <TextInput name={FORMFIELD.NIMI} required />
+        <TextInput name={FORMFIELD.NIMI} maxLength={100} required />
       </div>
       <div className="formWpr">
         <TextArea