degmods.com/src/components/Notes/NoteQuoteRepostPopup.tsx

62 lines
2.2 KiB
TypeScript

import { createPortal } from 'react-dom'
import { PropsWithChildren } from 'react'
import { NDKEvent } from '@nostr-dev-kit/ndk'
import { NoteSubmit } from './NoteSubmit'
interface NoteQuoteRepostPopup {
ndkEvent: NDKEvent
handleClose: () => void
}
export const NoteQuoteRepostPopup = ({
ndkEvent,
handleClose
}: PropsWithChildren<NoteQuoteRepostPopup>) => {
const content = `nostr:${ndkEvent.encode()}`
return createPortal(
<div className='popUpMain'>
<div className='ContainerMain'>
<div className='popUpMainCardWrapper'>
<div className='popUpMainCard'>
<div className='popUpMainCardTop'>
<div className='popUpMainCardTopInfo'>
<h3>Quote Repost</h3>
</div>
<div className='popUpMainCardTopClose' onClick={handleClose}>
<svg
xmlns='http://www.w3.org/2000/svg'
viewBox='-96 0 512 512'
width='1em'
height='1em'
fill='currentColor'
style={{ zIndex: 1 }}
>
<path d='M310.6 361.4c12.5 12.5 12.5 32.75 0 45.25C304.4 412.9 296.2 416 288 416s-16.38-3.125-22.62-9.375L160 301.3L54.63 406.6C48.38 412.9 40.19 416 32 416S15.63 412.9 9.375 406.6c-12.5-12.5-12.5-32.75 0-45.25l105.4-105.4L9.375 150.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L160 210.8l105.4-105.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-105.4 105.4L310.6 361.4z'></path>
</svg>
</div>
</div>
<div className='pUMCB_Zaps'>
<div className='pUMCB_ZapsInside'>
<div className='inputLabelWrapperMain'>
<label
className='form-label labelMain'
style={{ fontWeight: 'bold' }}
>
Quote repost this?
</label>
<NoteSubmit
initialContent={`\n\n:${content}`}
handleClose={handleClose}
/>
</div>
</div>
</div>
</div>
</div>
</div>
</div>,
document.body
)
}