mirror of
https://github.com/overleaf/overleaf.git
synced 2024-10-17 21:05:04 -04:00
56 lines
2.1 KiB
TypeScript
56 lines
2.1 KiB
TypeScript
|
import React, { FC } from 'react'
|
||
|
import { useTranslation, Trans } from 'react-i18next'
|
||
|
import { ThreadId } from '../../../../../types/review-panel/review-panel'
|
||
|
import { useThreadsActionsContext } from '../context/threads-context'
|
||
|
import { Button } from 'react-bootstrap'
|
||
|
import MaterialIcon from '@/shared/components/material-icon'
|
||
|
import { ExpandableContent } from './review-panel-expandable-content'
|
||
|
import { ReviewPanelCommentContent } from './review-panel-comment-content'
|
||
|
import { Change, CommentOperation } from '../../../../../types/change'
|
||
|
|
||
|
export const ReviewPanelResolvedThread: FC<{
|
||
|
id: string
|
||
|
comment: Change<CommentOperation>
|
||
|
docName: string
|
||
|
}> = ({ id, comment, docName }) => {
|
||
|
const { t } = useTranslation()
|
||
|
const { reopenThread, deleteThread } = useThreadsActionsContext()
|
||
|
|
||
|
return (
|
||
|
<div className="review-panel-resolved-comment" key={id}>
|
||
|
<div className="review-panel-resolved-comment-header">
|
||
|
<div>
|
||
|
<Trans
|
||
|
i18nKey="from_filename"
|
||
|
components={[
|
||
|
// eslint-disable-next-line react/jsx-key
|
||
|
<span className="review-panel-resolved-comment-filename" />,
|
||
|
]}
|
||
|
values={{ filename: docName }}
|
||
|
shouldUnescape
|
||
|
tOptions={{ interpolation: { escapeValue: true } }}
|
||
|
/>
|
||
|
</div>
|
||
|
<div className="review-panel-resolved-comment-buttons">
|
||
|
<Button onClick={() => reopenThread(id as ThreadId)}>
|
||
|
<MaterialIcon type="refresh" accessibilityLabel={t('reopen')} />
|
||
|
</Button>
|
||
|
<Button onClick={() => deleteThread(id as ThreadId)}>
|
||
|
<MaterialIcon type="delete" accessibilityLabel={t('delete')} />
|
||
|
</Button>
|
||
|
</div>
|
||
|
</div>
|
||
|
<div className="review-panel-resolved-comment-quoted-text">
|
||
|
<div className="review-panel-resolved-comment-quoted-text-label">
|
||
|
{t('quoted_text')}
|
||
|
</div>
|
||
|
<ExpandableContent className="review-panel-resolved-comment-quoted-text-quote">
|
||
|
{comment?.op.c}
|
||
|
</ExpandableContent>
|
||
|
</div>
|
||
|
|
||
|
<ReviewPanelCommentContent comment={comment} isResolved />
|
||
|
</div>
|
||
|
)
|
||
|
}
|