FR: Hide contract activity on mobile when betting

web/components/answers/answer-item.tsx

@@ -86,6 +86,7 @@ export function AnswerItem(props: {
 
         {isBetting && (
           <ContractActivity
+            className="hidden md:flex"
             contract={contract}
             bets={[]}
             comments={[]}

web/components/feed/contract-activity.tsx

@@ -19,9 +19,11 @@ export function ContractActivity(props: {
   user: User | null | undefined
   mode: 'only-recent' | 'abbreviated' | 'all'
   filterToOutcome?: string // Which multi-category outcome to filter
+  className?: string
   betRowClassName?: string
 }) {
-  const { contract, user, filterToOutcome, mode, betRowClassName } = props
+  const { contract, user, filterToOutcome, mode, className, betRowClassName } =
+    props
 
   const updatedComments =
     // eslint-disable-next-line react-hooks/rules-of-hooks
@@ -49,6 +51,7 @@ export function ContractActivity(props: {
       contract={contract}
       user={user}
       items={items}
+      className={className}
       betRowClassName={betRowClassName}
     />
   )

web/components/feed/feed-items.tsx

@@ -54,16 +54,17 @@ export function FeedItems(props: {
   contract: Contract
   user: User | null | undefined
   items: ActivityItem[]
+  className?: string
   betRowClassName?: string
 }) {
-  const { contract, user, items, betRowClassName } = props
+  const { contract, user, items, className, betRowClassName } = props
   const { outcomeType } = contract
 
   const ref = useRef<HTMLDivElement | null>(null)
   useSaveSeenContract(ref, contract, user)
 
   return (
-    <div className="flow-root pr-2 md:pr-0" ref={ref}>
+    <div className={clsx('flow-root pr-2 md:pr-0', className)} ref={ref}>
       <div className={clsx(tradingAllowed(contract) ? '' : '-mb-6')}>
         {items.map((item, activityItemIdx) => (
           <div key={item.id} className="relative pb-6">