aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/organisms/forms/comment-form.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/organisms/forms/comment-form.tsx')
-rw-r--r--src/components/organisms/forms/comment-form.tsx58
1 files changed, 29 insertions, 29 deletions
diff --git a/src/components/organisms/forms/comment-form.tsx b/src/components/organisms/forms/comment-form.tsx
index a823977..e4140dd 100644
--- a/src/components/organisms/forms/comment-form.tsx
+++ b/src/components/organisms/forms/comment-form.tsx
@@ -1,13 +1,15 @@
import { FC, ReactNode, useState } from 'react';
import { useIntl } from 'react-intl';
-import Button from '../../atoms/buttons/button';
-import Form, { type FormProps } from '../../atoms/forms/form';
-import Heading, {
- type HeadingProps,
+import {
+ Button,
+ Form,
+ type FormProps,
+ Heading,
type HeadingLevel,
-} from '../../atoms/headings/heading';
-import Spinner from '../../atoms/loaders/spinner';
-import LabelledField from '../../molecules/forms/labelled-field';
+ type HeadingProps,
+ Spinner,
+} from '../../atoms';
+import { LabelledField } from '../../molecules';
import styles from './comment-form.module.scss';
export type CommentFormData = {
@@ -46,7 +48,7 @@ export type CommentFormProps = Pick<FormProps, 'className'> & {
titleLevel?: HeadingLevel;
};
-const CommentForm: FC<CommentFormProps> = ({
+export const CommentForm: FC<CommentFormProps> = ({
Notice,
parentId,
saveComment,
@@ -119,55 +121,55 @@ const CommentForm: FC<CommentFormProps> = ({
return (
<Form
- onSubmit={submitHandler}
+ {...props}
aria-label={formAriaLabel}
aria-labelledby={formLabelledBy}
- {...props}
+ onSubmit={submitHandler}
>
{title && (
- <Heading id={formId} level={titleLevel} alignment={titleAlignment}>
+ <Heading alignment={titleAlignment} id={formId} level={titleLevel}>
{title}
</Heading>
)}
<LabelledField
- type="text"
+ className={styles.field}
id="commenter-name"
- name="commenter-name"
label={nameLabel}
+ name="commenter-name"
required={true}
- value={name}
setValue={setName}
- className={styles.field}
+ type="text"
+ value={name}
/>
<LabelledField
- type="email"
+ className={styles.field}
id="commenter-email"
- name="commenter-email"
label={emailLabel}
+ name="commenter-email"
required={true}
- value={email}
setValue={setEmail}
- className={styles.field}
+ type="email"
+ value={email}
/>
<LabelledField
- type="text"
+ className={styles.field}
id="commenter-website"
- name="commenter-website"
label={websiteLabel}
+ name="commenter-website"
required={false}
- value={website}
setValue={setWebsite}
- className={styles.field}
+ type="text"
+ value={website}
/>
<LabelledField
- type="textarea"
+ className={styles.field}
id="commenter-comment"
- name="commenter-comment"
label={commentLabel}
+ name="commenter-comment"
required={true}
- value={comment}
setValue={setComment}
- className={styles.field}
+ type="textarea"
+ value={comment}
/>
<Button type="submit" kind="primary" className={styles.button}>
{intl.formatMessage({
@@ -189,5 +191,3 @@ const CommentForm: FC<CommentFormProps> = ({
</Form>
);
};
-
-export default CommentForm;