Files
Compass/web/components/comments/comment-edit-history-button.tsx
2026-03-01 16:55:19 +01:00

91 lines
3.3 KiB
TypeScript

// import {Comment} from 'common/comment'
// import {run} from 'common/supabase/utils'
// import {useEffect, useState} from 'react'
// import {Col} from 'web/components/layout/col'
// import {Modal} from 'web/components/layout/modal'
// import {Content} from 'web/components/widgets/editor'
// import {LoadingIndicator} from 'web/components/widgets/loading-indicator'
// import {Title} from 'web/components/widgets/title'
// import {useIsClient} from 'web/hooks/use-is-client'
// import {useT} from 'web/lib/locale'
// import {db} from 'web/lib/supabase/db'
// import {shortenedFromNow} from 'web/lib/util/shortenedFromNow'
// import {formatTimeShort} from 'web/lib/util/time'
//
// import {DateTimeTooltip} from '../widgets/datetime-tooltip'
//
// type EditHistory = Comment & {
// editCreatedTime: number
// }
// export const CommentEditHistoryButton = (props: {comment: Comment}) => {
// const {comment} = props
// const [showEditHistory, setShowEditHistory] = useState(false)
// const [edits, setEdits] = useState<EditHistory[] | undefined>(undefined)
//
// const isClient = useIsClient()
// const t = useT()
//
// const loadEdits = async () => {
// const {data} = await run(
// db
// .from('contract_comment_edits')
// .select('*')
// .eq('comment_id', comment.id)
// .order('created_time', {ascending: false}),
// )
//
// // created_time is the time the row is created, but the row's content is the content before the edit, aka created_time is when the content is deleted and replaced
// const comments = data.map((edit, i) => {
// const comment = edit.data as Comment
// const editCreatedTime =
// i === data.length - 1 ? comment.createdTime : new Date(data[i + 1].created_time).valueOf()
//
// return {...comment, editCreatedTime}
// })
//
// setEdits(comments)
// }
//
// useEffect(() => {
// if (showEditHistory && edits === undefined) {
// loadEdits()
// }
// }, [showEditHistory])
//
// if (!comment.editedTime) return null
//
// return (
// <>
// <DateTimeTooltip time={comment.editedTime} placement={'top'}>
// <button
// className={
// 'text-ink-400 hover:bg-ink-50 mx-1 inline-block whitespace-nowrap rounded px-0.5 text-sm'
// }
// onClick={() => setShowEditHistory(true)}
// >
// (edited) {isClient && shortenedFromNow(comment.editedTime, t)}
// </button>
// </DateTimeTooltip>
// <Modal size={'md'} open={showEditHistory} setOpen={setShowEditHistory}>
// <div className={'bg-canvas-50 rounded-2xl p-4'}>
// <Title className="w-full text-center">Edit History</Title>
// {!edits ? (
// <LoadingIndicator />
// ) : (
// <Col className="gap-4">
// {edits.map((edit) => (
// <Col key={edit.id} className={'bg-ink-100 gap-2 rounded-xl rounded-tl-none p-2'}>
// <div className="text-ink-500 text-sm">
// {formatTimeShort(edit.editCreatedTime)}
// </div>
// <Content size="sm" className="mt-1 grow" content={edit.content || edit.text} />
// </Col>
// ))}
// </Col>
// )}
// </div>
// </Modal>
// </>
// )
// }