feat: improve mobile experience

src/components/NoteStats/ReplyButton.tsx

@@ -1,16 +1,14 @@
-import { useNostr } from '@/providers/NostrProvider'
 import { useNoteStats } from '@/providers/NoteStatsProvider'
 import { MessageCircle } from 'lucide-react'
 import { Event } from 'nostr-tools'
 import { useMemo, useState } from 'react'
-import PostDialog from '../PostDialog'
-import { formatCount } from './utils'
 import { useTranslation } from 'react-i18next'
+import PostEditor from '../PostEditor'
+import { formatCount } from './utils'
 
 export default function ReplyButton({ event }: { event: Event }) {
   const { t } = useTranslation()
   const { noteStatsMap } = useNoteStats()
-  const { pubkey } = useNostr()
   const { replyCount } = useMemo(() => noteStatsMap.get(event.id) ?? {}, [noteStatsMap, event.id])
   const [open, setOpen] = useState(false)
 
@@ -18,7 +16,6 @@ export default function ReplyButton({ event }: { event: Event }) {
     <>
       <button
         className="flex gap-1 items-center text-muted-foreground enabled:hover:text-blue-400"
-        disabled={!pubkey}
         onClick={(e) => {
           e.stopPropagation()
           setOpen(true)
@@ -28,7 +25,7 @@ export default function ReplyButton({ event }: { event: Event }) {
         <MessageCircle size={16} />
         <div className="text-sm">{formatCount(replyCount)}</div>
       </button>
-      <PostDialog parentEvent={event} open={open} setOpen={setOpen} />
+      <PostEditor parentEvent={event} open={open} setOpen={setOpen} />
     </>
   )
 }

src/components/NoteStats/RepostButton.tsx

@@ -13,7 +13,7 @@ import client from '@/services/client.service'
 import { Loader, PencilLine, Repeat } from 'lucide-react'
 import { Event } from 'nostr-tools'
 import { useEffect, useMemo, useState } from 'react'
-import PostDialog from '../PostDialog'
+import PostEditor from '../PostEditor'
 import { formatCount } from './utils'
 import { useTranslation } from 'react-i18next'
 
@@ -111,7 +111,7 @@ export default function RepostButton({
           </DropdownMenuItem>
         </DropdownMenuContent>
       </DropdownMenu>
-      <PostDialog
+      <PostEditor
         open={isPostDialogOpen}
         setOpen={setIsPostDialogOpen}
         defaultContent={'\nnostr:' + getSharableEventId(event)}

src/components/NoteStats/index.tsx

@@ -16,7 +16,7 @@ export default function NoteStats({
 }) {
   return (
     <div className={cn('flex justify-between', className)}>
-      <div className="flex gap-4 h-4 items-center">
+      <div className="flex gap-4 h-4 items-center" onClick={(e) => e.stopPropagation()}>
         <ReplyButton event={event} />
         <RepostButton event={event} canFetch={fetchIfNotExisting} />
         <LikeButton event={event} canFetch={fetchIfNotExisting} />