Remove TruncatedComment

web/components/contract/contract-leaderboard.tsx

@@ -107,7 +107,6 @@ export function ContractTopTrades(props: {
               comment={commentsById[topCommentId]}
               tips={tips[topCommentId]}
               betsBySameUser={[betsById[topCommentId]]}
-              truncate={false}
               smallAvatar={false}
             />
           </div>

web/components/feed/feed-answer-comment-group.tsx

@@ -154,7 +154,6 @@ export function FeedAnswerCommentGroup(props: {
         commentsList={commentsList}
         betsByUserId={betsByUserId}
         smallAvatar={true}
-        truncate={false}
         bets={bets}
         tips={tips}
         scrollAndOpenReplyInput={scrollAndOpenReplyInput}

web/components/feed/feed-comments.tsx

@@ -13,13 +13,11 @@ import { Avatar } from 'web/components/avatar'
 import { UserLink } from 'web/components/user-page'
 import { OutcomeLabel } from 'web/components/outcome-label'
 import { CopyLinkDateTimeComponent } from 'web/components/feed/copy-link-date-time'
-import { contractPath } from 'web/lib/firebase/contracts'
 import { firebaseLogin } from 'web/lib/firebase/users'
 import {
   createCommentOnContract,
   MAX_COMMENT_LENGTH,
 } from 'web/lib/firebase/comments'
-import { SiteLink } from 'web/components/site-link'
 import { BetStatusText } from 'web/components/feed/feed-bets'
 import { Col } from 'web/components/layout/col'
 import { getProbability } from 'common/calculate'
@@ -38,18 +36,9 @@ export function FeedCommentThread(props: {
   tips: CommentTipMap
   parentComment: Comment
   bets: Bet[]
-  truncate?: boolean
   smallAvatar?: boolean
 }) {
-  const {
+  const { contract, comments, bets, tips, smallAvatar, parentComment } = props
-    contract,
-    comments,
-    bets,
-    tips,
-    truncate,
-    smallAvatar,
-    parentComment,
-  } = props
   const [showReply, setShowReply] = useState(false)
   const [replyToUsername, setReplyToUsername] = useState('')
   const betsByUserId = groupBy(bets, (bet) => bet.userId)
@@ -78,7 +67,6 @@ export function FeedCommentThread(props: {
         betsByUserId={betsByUserId}
         tips={tips}
         smallAvatar={smallAvatar}
-        truncate={truncate}
         bets={bets}
         scrollAndOpenReplyInput={scrollAndOpenReplyInput}
       />
@@ -117,14 +105,12 @@ export function CommentRepliesList(props: {
   bets: Bet[]
   treatFirstIndexEqually?: boolean
   smallAvatar?: boolean
-  truncate?: boolean
 }) {
   const {
     contract,
     commentsList,
     betsByUserId,
     tips,
-    truncate,
     smallAvatar,
     bets,
     scrollAndOpenReplyInput,
@@ -164,7 +150,6 @@ export function CommentRepliesList(props: {
                 : undefined
             }
             smallAvatar={smallAvatar}
-            truncate={truncate}
           />
         </div>
       ))}
@@ -178,7 +163,6 @@ export function FeedComment(props: {
   tips: CommentTips
   betsBySameUser: Bet[]
   probAtCreatedTime?: number
-  truncate?: boolean
   smallAvatar?: boolean
   onReplyClick?: (comment: Comment) => void
 }) {
@@ -188,7 +172,6 @@ export function FeedComment(props: {
     tips,
     betsBySameUser,
     probAtCreatedTime,
-    truncate,
     onReplyClick,
   } = props
   const { text, content, userUsername, userName, userAvatarUrl, createdTime } =
@@ -273,11 +256,9 @@ export function FeedComment(props: {
             elementId={comment.id}
           />
         </div>
-        <TruncatedComment
+        <div className="mt-2 text-[15px] text-gray-700">
-          comment={content || text}
+          <Content content={content || text} />
-          moreHref={contractPath(contract)}
+        </div>
-          shouldTruncate={truncate}
-        />
         <Row className="mt-2 items-center gap-6 text-xs text-gray-500">
           <Tipper comment={comment} tips={tips ?? {}} />
           {onReplyClick && (
@@ -528,32 +509,6 @@ export function CommentInputTextArea(props: {
   )
 }
 
-export function TruncatedComment(props: {
-  comment: JSONContent
-  moreHref: string
-  shouldTruncate?: boolean
-}) {
-  const { comment, moreHref, shouldTruncate } = props
-  let truncated = comment
-
-  // TODO: Keep descriptions to at most 80 words (~400 characters)
-  const MAX_CHARS = 400
-
-  return (
-    <div
-      className="mt-2 whitespace-pre-line break-words text-gray-700"
-      style={{ fontSize: 15 }}
-    >
-      <Content content={comment} />
-      {truncated != comment && (
-        <SiteLink href={moreHref} className="text-indigo-700">
-          ... (show more)
-        </SiteLink>
-      )}
-    </div>
-  )
-}
-
 function getBettorsLargestPositionBeforeTime(
   contract: Contract,
   createdTime: number,

web/components/groups/group-chat.tsx

@@ -5,25 +5,19 @@ import React, { useEffect, memo, useState, useMemo } from 'react'
 import { Avatar } from 'web/components/avatar'
 import { Group } from 'common/group'
 import { Comment, createCommentOnGroup } from 'web/lib/firebase/comments'
-import {
+import { CommentInputTextArea } from 'web/components/feed/feed-comments'
-  CommentInputTextArea,
-  TruncatedComment,
-} from 'web/components/feed/feed-comments'
 import { track } from 'web/lib/service/analytics'
 import { firebaseLogin } from 'web/lib/firebase/users'
-
 import { useRouter } from 'next/router'
 import clsx from 'clsx'
 import { UserLink } from 'web/components/user-page'
-
-import { groupPath } from 'web/lib/firebase/groups'
 import { CopyLinkDateTimeComponent } from 'web/components/feed/copy-link-date-time'
 import { CommentTipMap, CommentTips } from 'web/hooks/use-tip-txns'
 import { Tipper } from 'web/components/tipper'
 import { sum } from 'lodash'
 import { formatMoney } from 'common/util/format'
 import { useWindowSize } from 'web/hooks/use-window-size'
-import { useTextEditor } from '../editor'
+import { Content, useTextEditor } from 'web/components/editor'
 
 export function GroupChat(props: {
   messages: Comment[]
@@ -222,15 +216,11 @@ const GroupMessage = memo(function GroupMessage_(props: {
           elementId={id}
         />
       </Row>
-      <Row className={'text-black'}>
+      <div className="mt-2 text-black">
         {comments.map((comment) => (
-          <TruncatedComment
+          <Content content={comment.content || comment.text} />
-            comment={comment.content} // TODO: || comment.text
-            moreHref={groupPath(group.slug)}
-            shouldTruncate={false}
-          />
         ))}
-      </Row>
+      </div>
       <Row>
         {!isCreatorsComment && onReplyClick && (
           <button