Don't use very slow dayjs formatter on timestamp tooltips

web/components/contract/contract-details.tsx

@@ -233,7 +233,7 @@ export function ContractDetails(props: {
               <ClockIcon className="h-5 w-5" />
               <DateTimeTooltip
                 text="Market resolved:"
-                time={dayjs(contract.resolutionTime)}
+                time={contract.resolutionTime}
               >
                 {resolvedDate}
               </DateTimeTooltip>
@@ -322,7 +322,7 @@ function EditableCloseDate(props: {
       ) : (
         <DateTimeTooltip
           text={closeTime > Date.now() ? 'Trading ends:' : 'Trading ended:'}
-          time={dayJsCloseTime}
+          time={closeTime}
         >
           {isSameYear
             ? dayJsCloseTime.format('MMM D')

web/components/datetime-tooltip.tsx

@@ -1,15 +1,12 @@
-import dayjs, { Dayjs } from 'dayjs'
-import utc from 'dayjs/plugin/utc'
-import timezone from 'dayjs/plugin/timezone'
-import advanced from 'dayjs/plugin/advancedFormat'
 import { Tooltip } from './tooltip'
 
-dayjs.extend(utc)
-dayjs.extend(timezone)
-dayjs.extend(advanced)
+const FORMATTER = new Intl.DateTimeFormat('default', {
+  dateStyle: 'medium',
+  timeStyle: 'long',
+})
 
 export function DateTimeTooltip(props: {
-  time: Dayjs
+  time: number
   text?: string
   className?: string
   children?: React.ReactNode
@@ -17,7 +14,7 @@ export function DateTimeTooltip(props: {
 }) {
   const { className, time, text, noTap } = props
 
-  const formattedTime = time.format('MMM DD, YYYY hh:mm a z')
+  const formattedTime = FORMATTER.format(time)
   const toolTip = text ? `${text} ${formattedTime}` : formattedTime
 
   return (

web/components/feed/copy-link-date-time.tsx

@@ -7,7 +7,6 @@ import { fromNow } from 'web/lib/util/time'
 import { ToastClipboard } from 'web/components/toast-clipboard'
 import { LinkIcon } from '@heroicons/react/outline'
 import clsx from 'clsx'
-import dayjs from 'dayjs'
 
 export function CopyLinkDateTimeComponent(props: {
   prefix: string
@@ -18,7 +17,6 @@ export function CopyLinkDateTimeComponent(props: {
 }) {
   const { prefix, slug, elementId, createdTime, className } = props
   const [showToast, setShowToast] = useState(false)
-  const time = dayjs(createdTime)
 
   function copyLinkToComment(
     event: React.MouseEvent<HTMLAnchorElement, MouseEvent>
@@ -32,7 +30,7 @@ export function CopyLinkDateTimeComponent(props: {
   }
   return (
     <div className={clsx('inline', className)}>
-      <DateTimeTooltip time={time} noTap>
+      <DateTimeTooltip time={createdTime} noTap>
         <Link href={`/${prefix}/${slug}#${elementId}`} passHref={true}>
           <a
             onClick={(event) => copyLinkToComment(event)}

web/components/relative-timestamp.tsx

@@ -8,7 +8,7 @@ export function RelativeTimestamp(props: { time: number }) {
   return (
     <DateTimeTooltip
       className="ml-1 whitespace-nowrap text-gray-400"
-      time={dayJsTime}
+      time={time}
     >
       {dayJsTime.fromNow()}
     </DateTimeTooltip>

web/pages/tournaments/index.tsx

@@ -188,7 +188,7 @@ function Section(props: {
               </span>
             )}
             {endTime && (
-              <DateTimeTooltip time={endTime} text="Ends">
+              <DateTimeTooltip time={endTime.valueOf()} text="Ends">
                 <span className="flex items-center gap-1">
                   <ClockIcon className="h-4" />
                   {endTime.format('MMM D')}