dh_demo

DreamHanks demo project
git clone git://git.lair.cx/dh_demo
Log | Files | Refs | README

ThreadCommentWrite.tsx (1322B)

      1 import { SubmitButton } from '@/components/elements/Button'
      2 import Field from '@/components/form/Field'
      3 import Fields from '@/components/form/Fields'
      4 import Form from '@/components/form/Form'
      5 import { useForm } from '@/lib/hooks/use_form'
      6 import { useMemo } from 'react'
      7 import styles from './ThreadCommentWrite.module.css'
      8 
      9 export interface ThreadCommentWriteProps {
     10   threadId: number
     11   onWritten?: () => void
     12 }
     13 
     14 interface ThreadCommentWriteForm {
     15   content: string
     16 }
     17 
     18 export default function ThreadCommentWrite (props: ThreadCommentWriteProps) {
     19   const [fields, updateFields, submit, isLoading, result, error] = useForm<ThreadCommentWriteForm>(
     20     `/api/threads/${props.threadId}/comments`,
     21     { content: '' },
     22     props.onWritten,
     23   )
     24 
     25   return (
     26     <div className={styles['comment-write']}>
     27       <Form onSubmit={submit}>
     28         <Fields horizontal>
     29           <Field
     30             type="textarea"
     31             placeholder="내용"
     32             value={fields.content}
     33             onValueChange={updateFields.bind(null, 'content')}
     34             disabled={isLoading}
     35             color={error ? 'error' : undefined}
     36             message={error?.message}
     37           />
     38 
     39           <SubmitButton
     40             value={'댓글 작성'}
     41             disabled={isLoading}
     42           />
     43         </Fields>
     44       </Form>
     45     </div>
     46   )
     47 }