52 lines
1.3 KiB
JavaScript
52 lines
1.3 KiB
JavaScript
import { Form, MarkdownInput } from '@/components/form'
|
|
import styles from './reply.module.css'
|
|
import { commentSchema } from '@/lib/validate'
|
|
import { FeeButtonProvider } from './fee-button'
|
|
import { ItemButtonBar } from './post'
|
|
import { UPDATE_COMMENT } from '@/fragments/paidAction'
|
|
import useItemSubmit from './use-item-submit'
|
|
|
|
export default function CommentEdit ({ comment, editThreshold, onSuccess, onCancel }) {
|
|
const onSubmit = useItemSubmit(UPDATE_COMMENT, {
|
|
paidMutationOptions: {
|
|
update (cache, { data: { upsertComment: { result } } }) {
|
|
if (!result) return
|
|
|
|
cache.modify({
|
|
id: `Item:${comment.id}`,
|
|
fields: {
|
|
text () {
|
|
return result.text
|
|
}
|
|
}
|
|
})
|
|
}
|
|
},
|
|
item: comment,
|
|
navigateOnSubmit: false,
|
|
onSuccessfulSubmit: onSuccess
|
|
})
|
|
|
|
return (
|
|
<div className={`${styles.reply} mt-2`}>
|
|
<FeeButtonProvider>
|
|
<Form
|
|
initial={{
|
|
text: comment.text
|
|
}}
|
|
schema={commentSchema}
|
|
onSubmit={onSubmit}
|
|
>
|
|
<MarkdownInput
|
|
name='text'
|
|
minRows={6}
|
|
autoFocus
|
|
required
|
|
/>
|
|
<ItemButtonBar itemId={comment.id} onDelete={onSuccess} hasCancel={false} />
|
|
</Form>
|
|
</FeeButtonProvider>
|
|
</div>
|
|
)
|
|
}
|