2022-12-18 14:51:47 +00:00
|
|
|
|
import "./Note.css";
|
|
|
|
|
import Event from "../nostr/Event";
|
|
|
|
|
import { useEffect, useState } from "react";
|
|
|
|
|
import { useSelector } from "react-redux";
|
|
|
|
|
import moment from "moment";
|
|
|
|
|
import { useNavigate } from "react-router-dom";
|
|
|
|
|
|
|
|
|
|
export default function Note(props) {
|
|
|
|
|
const navigate = useNavigate();
|
|
|
|
|
const data = props.data;
|
|
|
|
|
const [sig, setSig] = useState(false);
|
|
|
|
|
const user = useSelector(s => s.users?.users[data?.pubkey]);
|
|
|
|
|
const ev = Event.FromObject(data);
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
if (sig === false) {
|
|
|
|
|
verifyEvent();
|
|
|
|
|
}
|
|
|
|
|
}, []);
|
|
|
|
|
|
|
|
|
|
async function verifyEvent() {
|
|
|
|
|
let res = await ev.Verify();
|
|
|
|
|
setSig(res);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function goToProfile(e, id) {
|
|
|
|
|
e.stopPropagation();
|
|
|
|
|
navigate(`/p/${id}`);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function goToEvent(e, id) {
|
|
|
|
|
e.stopPropagation();
|
|
|
|
|
navigate(`/e/${id}`);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function replyTag() {
|
|
|
|
|
let thread = ev.GetThread();
|
|
|
|
|
if (thread === null) {
|
|
|
|
|
return null;
|
|
|
|
|
}
|
|
|
|
|
|
2022-12-18 22:23:52 +00:00
|
|
|
|
let replyId = thread?.ReplyTo?.Event;
|
2022-12-18 14:51:47 +00:00
|
|
|
|
return (
|
|
|
|
|
<div className="reply" onClick={(e) => goToEvent(e, replyId)}>
|
2022-12-18 22:23:52 +00:00
|
|
|
|
➡️ {replyId?.substring(0, 8)}
|
2022-12-18 14:51:47 +00:00
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
|
2022-12-18 22:23:52 +00:00
|
|
|
|
if (!ev.IsContent()) {
|
|
|
|
|
return (
|
|
|
|
|
<>
|
|
|
|
|
<pre>{ev.Id}</pre>
|
|
|
|
|
<pre>Kind: {ev.Kind}</pre>
|
|
|
|
|
<pre>Content: {ev.Content}</pre>
|
|
|
|
|
</>
|
|
|
|
|
);
|
2022-12-18 14:51:47 +00:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div className="note">
|
|
|
|
|
<div className="header">
|
|
|
|
|
<img src={user?.picture} onClick={(e) => goToProfile(e, ev.PubKey)} />
|
|
|
|
|
<div className="name">
|
|
|
|
|
{user?.name ?? ev.PubKey.substring(0, 8)}
|
|
|
|
|
{replyTag()}
|
|
|
|
|
</div>
|
|
|
|
|
<div className="info">
|
|
|
|
|
{moment(ev.CreatedAt * 1000).fromNow()}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div className="body" onClick={(e) => goToEvent(e, ev.Id)}>
|
|
|
|
|
{ev.Content}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
}
|