dh_demo

DreamHanks demo project
git clone git://git.lair.cx/dh_demo
Log | Files | Refs | README

ThreadCommentView.tsx (1195B)


      1 import { ThreadComment } from '@/lib/models/thread'
      2 import Link from 'next/link'
      3 import styles from './ThreadCommentView.module.css'
      4 
      5 export interface ThreadCommentViewProps {
      6   index: number
      7   comment: ThreadComment
      8 }
      9 
     10 function pad (n: number) {
     11   return n < 10 ? `0${n}` : n
     12 }
     13 
     14 function formatDate (date: Date) {
     15   const year = date.getFullYear()
     16   const month = date.getMonth() + 1
     17   const day = date.getDate()
     18   const hours = date.getHours()
     19   const minutes = date.getMinutes()
     20   const seconds = date.getSeconds()
     21 
     22   return `${year}-${pad(month)}-${pad(day)} ` +
     23     `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`
     24 }
     25 
     26 export default function ThreadCommentView (props: ThreadCommentViewProps) {
     27   return (
     28     <div className={styles['comment']}>
     29       <div className={styles['meta']}>
     30         <span className={styles['idx']}>{props.index + 1}</span>
     31 
     32         <Link className={styles['author']} href={`/users/${props.comment.authorId}`}>
     33           {props.comment.authorName}
     34         </Link>
     35 
     36         <span className={styles['date']}>{formatDate(props.comment.createdAt)}</span>
     37       </div>
     38 
     39       <div className={styles['body']}>
     40         {props.comment.content}
     41       </div>
     42     </div>
     43   )
     44 }