Code cleanups

web/components/contract-feed.tsx

@@ -12,53 +12,9 @@ import { User } from '../lib/firebase/users'
 import { Linkify } from './linkify'
 dayjs.extend(relativeTime)
 
-const activity = [
-  {
-    id: 1,
-    type: 'comment',
-    person: { name: 'Eduardo Benz', href: '#' },
-    imageUrl:
-      'https://images.unsplash.com/photo-1520785643438-5bf77931f493?ixlib=rb-=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=8&w=256&h=256&q=80',
-    comment:
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Tincidunt nunc ipsum tempor purus vitae id. Morbi in vestibulum nec varius. Et diam cursus quis sed purus nam. ',
-    date: '6d ago',
-  },
-  {
-    id: 'hifadsdf',
-    type: 'bet',
-    outcome: 'YES',
-    amount: 30,
-    date: '2d ago',
-  },
-  {
-    id: 3,
-    type: 'tags',
-    person: { name: 'Hilary Mahy', href: '#' },
-    tags: [
-      { name: 'Bug', href: '#', color: 'bg-rose-500' },
-      { name: 'Accessibility', href: '#', color: 'bg-indigo-500' },
-    ],
-    date: '6h ago',
-  },
-  {
-    id: 4,
-    type: 'comment',
-    person: { name: 'Jason Meyers', href: '#' },
-    imageUrl:
-      'https://images.unsplash.com/photo-1531427186611-ecfd6d936c79?ixlib=rb-=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=8&w=256&h=256&q=80',
-    comment:
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Tincidunt nunc ipsum tempor purus vitae id. Morbi in vestibulum nec varius. Et diam cursus quis sed purus nam. Scelerisque amet elit non sit ut tincidunt condimentum. Nisl ultrices eu venenatis diam.',
-    date: '2h ago',
-  },
-]
-
-function classNames(...classes) {
-  return classes.filter(Boolean).join(' ')
-}
-
 function FeedComment(props: { activityItem: any }) {
   const { activityItem } = props
-  const { person, text, date, amount, outcome, createdTime } = activityItem
+  const { person, text, amount, outcome, createdTime } = activityItem
   return (
     <>
       <div className="relative">
@@ -83,7 +39,7 @@ function FeedComment(props: { activityItem: any }) {
           </p>
         </div>
         <div className="mt-2 text-sm text-gray-700">
-          <p>
+          <p className="whitespace-pre-wrap">
             <Linkify text={text} />
           </p>
         </div>
@@ -104,13 +60,14 @@ function Timestamp(props: { time: number }) {
   )
 }
 
-function FeedBet(props: { activityItem: any; user: User }) {
+function FeedBet(props: { activityItem: any; user: User | null }) {
   const { activityItem, user } = props
   const { id, contractId, amount, outcome, createdTime } = activityItem
-  const isCreator = user.id == activityItem.userId
+  const isCreator = user?.id == activityItem.userId
 
   const [comment, setComment] = useState('')
   async function submitComment() {
+    if (!user) return
     await createComment(contractId, id, comment, user)
   }
   return (
@@ -153,58 +110,6 @@ function FeedBet(props: { activityItem: any; user: User }) {
   )
 }
 
-function FeedTags(props: { activityItem: any }) {
-  const { activityItem } = props
-  return (
-    <>
-      <div>
-        <div className="relative px-1">
-          <div className="h-8 w-8 bg-gray-100 rounded-full ring-8 ring-white flex items-center justify-center">
-            <TagIcon className="h-5 w-5 text-gray-500" aria-hidden="true" />
-          </div>
-        </div>
-      </div>
-      <div className="min-w-0 flex-1 py-0">
-        <div className="text-sm leading-8 text-gray-500">
-          <span className="mr-0.5">
-            <a
-              href={activityItem.person.href}
-              className="font-medium text-gray-900"
-            >
-              {activityItem.person.name}
-            </a>{' '}
-            added tags
-          </span>{' '}
-          <span className="mr-0.5">
-            {activityItem.tags.map((tag) => (
-              <Fragment key={tag.name}>
-                <a
-                  href={tag.href}
-                  className="relative inline-flex items-center rounded-full border border-gray-300 px-3 py-0.5 text-sm"
-                >
-                  <span className="absolute flex-shrink-0 flex items-center justify-center">
-                    <span
-                      className={classNames(
-                        tag.color,
-                        'h-1.5 w-1.5 rounded-full'
-                      )}
-                      aria-hidden="true"
-                    />
-                  </span>
-                  <span className="ml-3.5 font-medium text-gray-900">
-                    {tag.name}
-                  </span>
-                </a>{' '}
-              </Fragment>
-            ))}
-          </span>
-          <span className="whitespace-nowrap">{activityItem.date}</span>
-        </div>
-      </div>
-    </>
-  )
-}
-
 function toFeedBet(bet: Bet) {
   return {
     id: bet.id,
@@ -270,9 +175,7 @@ export function ContractFeed(props: { contract: Contract }) {
                 {activityItem.type === 'comment' ? (
                   <FeedComment activityItem={activityItem} />
                 ) : activityItem.type === 'bet' ? (
-                  <FeedBet activityItem={activityItem} user={user} />
-                ) : activityItem.type === 'tags' ? (
-                  <FeedTags activityItem={activityItem} />
+                  <FeedBet activityItem={activityItem} user={user || null} />
                 ) : null}
               </div>
             </div>