Remove some divs and so on

web/components/avatar.tsx

@@ -47,14 +47,21 @@ export function Avatar(props: {
   )
 }
 
-export function EmptyAvatar(props: { size?: number; multi?: boolean }) {
+export function EmptyAvatar(props: {
-  const { size = 8, multi } = props
+  className?: string
+  size?: number
+  multi?: boolean
+}) {
+  const { className, size = 8, multi } = props
   const insize = size - 3
   const Icon = multi ? UsersIcon : UserIcon
 
   return (
     <div
-      className={`flex flex-shrink-0 h-${size} w-${size} items-center justify-center rounded-full bg-gray-200`}
+      className={clsx(
+        `flex flex-shrink-0 h-${size} w-${size} items-center justify-center rounded-full bg-gray-200`,
+        className
+      )}
     >
       <Icon className={`h-${insize} w-${insize} text-gray-500`} aria-hidden />
     </div>

web/components/feed/feed-bets.tsx

@@ -36,7 +36,6 @@ export function FeedBet(props: {
   const isSelf = user?.id === userId
 
   return (
-    <>
     <Row className={'flex w-full gap-2 pt-3'}>
       {isSelf ? (
         <Avatar
@@ -53,21 +52,17 @@ export function FeedBet(props: {
           username={bettor.username}
         />
       ) : (
-          <div className="relative px-1">
+        <EmptyAvatar className="mx-1" />
-            <EmptyAvatar />
-          </div>
       )}
-        <div className={'min-w-0 flex-1 py-1.5'}>
       <BetStatusText
         bet={bet}
         contract={contract}
         isSelf={isSelf}
         bettor={bettor}
         hideOutcome={hideOutcome}
+        className="min-w-0 flex-1 py-1.5"
       />
-        </div>
     </Row>
-    </>
   )
 }
 
@@ -77,8 +72,9 @@ export function BetStatusText(props: {
   isSelf: boolean
   bettor?: User
   hideOutcome?: boolean
+  className?: string
 }) {
-  const { bet, contract, bettor, isSelf, hideOutcome } = props
+  const { bet, contract, bettor, isSelf, hideOutcome, className } = props
   const { outcomeType } = contract
   const isPseudoNumeric = outcomeType === 'PSEUDO_NUMERIC'
   const isFreeResponse = outcomeType === 'FREE_RESPONSE'
@@ -123,7 +119,7 @@ export function BetStatusText(props: {
       : formatPercent(bet.limitProb ?? bet.probAfter)
 
   return (
-    <div className="text-sm text-gray-500">
+    <div className={clsx('text-sm text-gray-500', className)}>
       {bettor ? (
         <UserLink name={bettor.name} username={bettor.username} />
       ) : (