-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
908ba47
commit f4c8dbc
Showing
36 changed files
with
444 additions
and
220 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,103 @@ | ||
| 'use client'; | ||
|
|
||
| import { Paragraph, Textarea, Textfield } from '@digdir/designsystemet-react'; | ||
| import { LabelWithTag, SubmitButton } from '@fdk-frontend/ui'; | ||
| import { type Dictionary } from '@fdk-frontend/dictionaries'; | ||
| import { useFormState } from 'react-dom'; | ||
| import styles from './page.module.css'; | ||
| import { sendEmailAction } from '../actions'; | ||
| import { EMPTY_FORM_STATE, extractErrorMessages } from '@fdk-frontend/utils'; | ||
|
|
||
| type Props = { | ||
| dictionary: Dictionary; | ||
| }; | ||
|
|
||
| const ContactForm = ({ dictionary }: Props) => { | ||
| const [state, formAction] = useFormState(sendEmailAction, EMPTY_FORM_STATE); | ||
| const textAreaCols = 100; | ||
| const textAreaRows = 5; | ||
|
|
||
| return ( | ||
| <form action={formAction}> | ||
| <Textarea | ||
| name='dataset' | ||
| className={styles.textArea} | ||
| required | ||
| cols={textAreaCols} | ||
| rows={textAreaRows} | ||
| label={ | ||
| <LabelWithTag | ||
| labelText={dictionary.contactForm.dataset.label} | ||
| tagText={dictionary.shouldBeFilledOut} | ||
| /> | ||
| } | ||
| description={<Paragraph>{dictionary.contactForm.dataset.description}</Paragraph>} | ||
| error={extractErrorMessages('dataset', state, dictionary)} | ||
| /> | ||
| <Textarea | ||
| name='location' | ||
| className={styles.textArea} | ||
| cols={textAreaCols} | ||
| rows={textAreaRows} | ||
| label={<LabelWithTag labelText={dictionary.contactForm.location.label} />} | ||
| description={<Paragraph>{dictionary.contactForm.location.description}</Paragraph>} | ||
| /> | ||
| <Textarea | ||
| name='efforts' | ||
| className={styles.textArea} | ||
| cols={textAreaCols} | ||
| rows={textAreaRows} | ||
| label={<LabelWithTag labelText={dictionary.contactForm.efforts.label} />} | ||
| description={<Paragraph>{dictionary.contactForm.efforts.description}</Paragraph>} | ||
| /> | ||
| <Textfield | ||
| name='name' | ||
| required | ||
| className={styles.textField} | ||
| error={extractErrorMessages('name', state, dictionary)} | ||
| label={ | ||
| <LabelWithTag | ||
| labelText={dictionary.name} | ||
| tagText={dictionary.shouldBeFilledOut} | ||
| /> | ||
| } | ||
| /> | ||
| <Textfield | ||
| name='email' | ||
| required | ||
| className={styles.textField} | ||
| error={extractErrorMessages('email', state, dictionary)} | ||
| type='email' | ||
| label={ | ||
| <LabelWithTag | ||
| labelText={dictionary.email} | ||
| tagText={dictionary.shouldBeFilledOut} | ||
| /> | ||
| } | ||
| /> | ||
| <Textfield | ||
| name='organizationNumber' | ||
| required | ||
| className={styles.textFieldHalfWith} | ||
| error={extractErrorMessages('organizationNumber', state, dictionary)} | ||
| label={ | ||
| <LabelWithTag | ||
| labelText={dictionary.organizationNumber} | ||
| tagText={dictionary.shouldBeFilledOut} | ||
| /> | ||
| } | ||
| /> | ||
| <Textfield | ||
| name='phoneNumber' | ||
| className={styles.textFieldHalfWith} | ||
| label={dictionary.phoneNumber} | ||
| /> | ||
| <SubmitButton | ||
| buttonText={dictionary.submitRequest} | ||
| extendedClassName={styles.button} | ||
| /> | ||
| </form> | ||
| ); | ||
| }; | ||
|
|
||
| export default ContactForm; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| /* eslint-disable camelcase */ | ||
| /* eslint-disable no-magic-numbers */ | ||
| import { z } from 'zod'; | ||
|
|
||
| /** | ||
| * The validation schema for the contact form. | ||
| * Form more information on the schema library, see https://zod.dev/?id=table-of-contents | ||
| */ | ||
| export const schema = z.object({ | ||
| dataset: z.string({ required_error: 'required' }).min(3, { message: 'minimumLength,3'}), | ||
| location: z.string().optional(), | ||
| efforts: z.string().optional(), | ||
| email: z.string({ required_error: 'required' }).email({ message: 'invalidEmail' }), | ||
| phoneNumber: z.string().optional(), | ||
| name: z.string({ required_error: 'required' }), | ||
| organizationNumber: z.string({ required_error: 'required' }).length(9, { message: 'invalidOrganizationNumber' }), | ||
| }); | ||
|
|
||
| export type SchemaType = z.infer<typeof schema>; | ||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| /* eslint-disable no-console */ | ||
| 'use server'; | ||
|
|
||
| import { revalidatePath } from 'next/cache'; | ||
| import { extractFormEntries, FormState, FormStatusEnum, getFormState } from '@fdk-frontend/utils'; | ||
| import { schema } from './[lang]/schema'; | ||
|
|
||
| export const sendEmailAction = async (prevState: FormState, formData: FormData) => { | ||
| const parse = schema.safeParse(extractFormEntries(formData)); | ||
|
|
||
| if (!parse.success) { | ||
| return getFormState(FormStatusEnum.ERROR, parse.error.formErrors.fieldErrors); | ||
| } | ||
|
|
||
| try { | ||
| // TODO: Send email with form data | ||
| // eslint-disable-next-line @typescript-eslint/no-unused-vars | ||
| // const data = parse.data; | ||
|
|
||
| revalidatePath('/'); | ||
| return getFormState(FormStatusEnum.SUCCESS, 'Mail was sent successfully'); | ||
| } catch (e) { | ||
| // TODO: Log error to some error tracking service, not logging out to console because of security reasons | ||
| // eslint-disable-next-line no-console | ||
| console.error('Sending email for Contact Form failed'); | ||
| return getFormState(FormStatusEnum.ERROR, 'Sending email failed'); | ||
| } | ||
| }; |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.