index.tsx raw

   1  import { ScrollArea, ScrollBar } from '@/components/ui/scroll-area'
   2  import { Separator } from '@/components/ui/separator'
   3  import { Event } from 'nostr-tools'
   4  import { useState } from 'react'
   5  import HideUntrustedContentButton from '../HideUntrustedContentButton'
   6  import QuoteList from '../QuoteList'
   7  import ReactionList from '../ReactionList'
   8  import ReplyNoteList from '../ReplyNoteList'
   9  import RepostList from '../RepostList'
  10  import ZapList from '../ZapList'
  11  import { Tabs, TTabValue } from './Tabs'
  12  
  13  export default function NoteInteractions({ event, navIndexOffset = 0 }: { event: Event; navIndexOffset?: number }) {
  14    const [type, setType] = useState<TTabValue>('replies')
  15    let list
  16    switch (type) {
  17      case 'replies':
  18        list = <ReplyNoteList stuff={event} navIndexOffset={navIndexOffset} />
  19        break
  20      case 'quotes':
  21        list = <QuoteList stuff={event} />
  22        break
  23      case 'reactions':
  24        list = <ReactionList stuff={event} />
  25        break
  26      case 'reposts':
  27        list = <RepostList event={event} />
  28        break
  29      case 'zaps':
  30        list = <ZapList event={event} />
  31        break
  32      default:
  33        break
  34    }
  35  
  36    return (
  37      <>
  38        <div className="flex items-center justify-between">
  39          <ScrollArea className="flex-1 w-0">
  40            <Tabs selectedTab={type} onTabChange={setType} />
  41            <ScrollBar orientation="horizontal" className="opacity-0 pointer-events-none" />
  42          </ScrollArea>
  43          <Separator orientation="vertical" className="h-6" />
  44          <div className="size-10 flex items-center justify-center">
  45            <HideUntrustedContentButton type="interactions" />
  46          </div>
  47        </div>
  48        <Separator />
  49        {list}
  50      </>
  51    )
  52  }
  53