7debc4925e
* De-feedify contract bets list * De-feedify contract comments lists * Clean up a bunch of duplicated work in the comments list stuff * Remove wrapper markup from comment replies list * Fix sort order on comments I broke * Kill now unhelpful `CommentRepliesList` wrapper component * More random cleanup * More cleanup and fix some styling I had broken * Make bet calculations less wrong * Keep up to date with master * Make copy link component copy better URL * Make highlighted comments align properly * Make user header left align with content on comments * Fix some free response UI stuff up
47 lines
1.5 KiB
TypeScript
47 lines
1.5 KiB
TypeScript
import React, { useState } from 'react'
|
|
import { copyToClipboard } from 'web/lib/util/copy'
|
|
import { DateTimeTooltip } from 'web/components/datetime-tooltip'
|
|
import Link from 'next/link'
|
|
import { fromNow } from 'web/lib/util/time'
|
|
import { ToastClipboard } from 'web/components/toast-clipboard'
|
|
import { LinkIcon } from '@heroicons/react/outline'
|
|
|
|
export function CopyLinkDateTimeComponent(props: {
|
|
prefix: string
|
|
slug: string
|
|
createdTime: number
|
|
elementId: string
|
|
className?: string
|
|
}) {
|
|
const { prefix, slug, elementId, createdTime, className } = props
|
|
const [showToast, setShowToast] = useState(false)
|
|
|
|
function copyLinkToComment(
|
|
event: React.MouseEvent<HTMLAnchorElement, MouseEvent>
|
|
) {
|
|
event.preventDefault()
|
|
const commentUrl = new URL(window.location.href)
|
|
commentUrl.pathname = `/${prefix}/${slug}`
|
|
commentUrl.hash = elementId
|
|
copyToClipboard(commentUrl.toString())
|
|
setShowToast(true)
|
|
setTimeout(() => setShowToast(false), 2000)
|
|
}
|
|
return (
|
|
<DateTimeTooltip className={className} time={createdTime} noTap>
|
|
<Link href={`/${prefix}/${slug}#${elementId}`} passHref={true}>
|
|
<a
|
|
onClick={copyLinkToComment}
|
|
className={
|
|
'mx-1 whitespace-nowrap rounded-sm px-1 text-gray-400 hover:bg-gray-100'
|
|
}
|
|
>
|
|
{fromNow(createdTime)}
|
|
{showToast && <ToastClipboard />}
|
|
<LinkIcon className="ml-1 mb-0.5 inline" height={13} />
|
|
</a>
|
|
</Link>
|
|
</DateTimeTooltip>
|
|
)
|
|
}
|