Add re;ays to every naddr encode, fix layout fo details pages, fix text overflow for nostr comments

This commit is contained in:
austinkelsay 2024-09-14 17:39:01 -05:00
parent 8b782ffc60
commit 38244a8da7
15 changed files with 122 additions and 91 deletions

View File

@ -51,7 +51,7 @@ const ZapThreadsWrapper = ({ anchor, relays, disable }) => {
}, [anchor, relays, disable]); }, [anchor, relays, disable]);
// Render a <div> element and attach the zapRef to it // Render a <div> element and attach the zapRef to it
return <div ref={zapRef} />; return <div className="overflow-x-hidden" ref={zapRef} />;
}; };
export default ZapThreadsWrapper; export default ZapThreadsWrapper;

View File

@ -11,6 +11,7 @@ import { useRouter } from "next/router";
import { formatTimestampToHowLongAgo } from "@/utils/time"; import { formatTimestampToHowLongAgo } from "@/utils/time";
import { ProgressSpinner } from "primereact/progressspinner"; import { ProgressSpinner } from "primereact/progressspinner";
import GenericButton from "@/components/buttons/GenericButton"; import GenericButton from "@/components/buttons/GenericButton";
import { defaultRelayUrls } from "@/context/NDKContext";
export function CourseTemplate({ course }) { export function CourseTemplate({ course }) {
const { zaps, zapsLoading, zapsError } = useZapsSubscription({ event: course }); const { zaps, zapsLoading, zapsError } = useZapsSubscription({ event: course });
@ -40,6 +41,7 @@ export function CourseTemplate({ course }) {
pubkey: course.pubkey, pubkey: course.pubkey,
kind: course.kind, kind: course.kind,
identifier: course.id, identifier: course.id,
relayUrls: defaultRelayUrls
}); });
setNAddress(nAddress); setNAddress(nAddress);
} }

View File

@ -10,6 +10,7 @@ import { formatTimestampToHowLongAgo } from "@/utils/time";
import { nip19 } from "nostr-tools"; import { nip19 } from "nostr-tools";
import { Tag } from "primereact/tag"; import { Tag } from "primereact/tag";
import GenericButton from "@/components/buttons/GenericButton"; import GenericButton from "@/components/buttons/GenericButton";
import { defaultRelayUrls } from "@/context/NDKContext";
export function DocumentTemplate({ document }) { export function DocumentTemplate({ document }) {
const { zaps, zapsLoading, zapsError } = useZapsSubscription({ event: document }); const { zaps, zapsLoading, zapsError } = useZapsSubscription({ event: document });
@ -24,6 +25,7 @@ export function DocumentTemplate({ document }) {
pubkey: document.pubkey, pubkey: document.pubkey,
kind: document.kind, kind: document.kind,
identifier: document.id, identifier: document.id,
relayUrls: defaultRelayUrls
}); });
setNAddress(nAddress); setNAddress(nAddress);
} }

View File

@ -11,6 +11,7 @@ import { nip19 } from "nostr-tools";
import { formatTimestampToHowLongAgo } from "@/utils/time"; import { formatTimestampToHowLongAgo } from "@/utils/time";
import { Tag } from "primereact/tag"; import { Tag } from "primereact/tag";
import GenericButton from "@/components/buttons/GenericButton"; import GenericButton from "@/components/buttons/GenericButton";
import { defaultRelayUrls } from "@/context/NDKContext";
export function VideoTemplate({ video }) { export function VideoTemplate({ video }) {
const { zaps, zapsLoading, zapsError } = useZapsSubscription({ event: video }); const { zaps, zapsLoading, zapsError } = useZapsSubscription({ event: video });
@ -23,7 +24,8 @@ export function VideoTemplate({ video }) {
const addr = nip19.naddrEncode({ const addr = nip19.naddrEncode({
pubkey: video.pubkey, pubkey: video.pubkey,
kind: video.kind, kind: video.kind,
identifier: video.id identifier: video.id,
relayUrls: defaultRelayUrls
}) })
setNAddress(addr); setNAddress(addr);
}, [video]); }, [video]);

View File

@ -16,6 +16,7 @@ import { findKind0Fields } from '@/utils/nostr';
import 'primeicons/primeicons.css'; import 'primeicons/primeicons.css';
import CoursePaymentButton from "@/components/bitcoinConnect/CoursePaymentButton"; import CoursePaymentButton from "@/components/bitcoinConnect/CoursePaymentButton";
import { ProgressSpinner } from 'primereact/progressspinner'; import { ProgressSpinner } from 'primereact/progressspinner';
import { defaultRelayUrls } from "@/context/NDKContext";
const MDDisplay = dynamic( const MDDisplay = dynamic(
() => import("@uiw/react-markdown-preview"), () => import("@uiw/react-markdown-preview"),
@ -65,6 +66,7 @@ export default function CourseDetails({ processedEvent, paidCourse, lessons, dec
pubkey: processedEvent.pubkey, pubkey: processedEvent.pubkey,
kind: processedEvent.kind, kind: processedEvent.kind,
identifier: processedEvent.d, identifier: processedEvent.d,
relayUrls: defaultRelayUrls
}); });
setNAddress(naddr); setNAddress(naddr);
} }

View File

@ -15,6 +15,7 @@ import { useSession } from 'next-auth/react';
import useWindowWidth from "@/hooks/useWindowWidth"; import useWindowWidth from "@/hooks/useWindowWidth";
import { useNDKContext } from "@/context/NDKContext"; import { useNDKContext } from "@/context/NDKContext";
import { findKind0Fields } from '@/utils/nostr'; import { findKind0Fields } from '@/utils/nostr';
import { defaultRelayUrls } from "@/context/NDKContext";
const lnAddress = process.env.NEXT_PUBLIC_LIGHTNING_ADDRESS; const lnAddress = process.env.NEXT_PUBLIC_LIGHTNING_ADDRESS;
@ -46,6 +47,7 @@ export default function CourseDetailsNew({ processedEvent, paidCourse, lessons,
pubkey: processedEvent.pubkey, pubkey: processedEvent.pubkey,
kind: processedEvent.kind, kind: processedEvent.kind,
identifier: processedEvent.d, identifier: processedEvent.d,
relayUrls: defaultRelayUrls
}); });
setNAddress(naddr); setNAddress(naddr);
} }
@ -157,14 +159,16 @@ export default function CourseDetailsNew({ processedEvent, paidCourse, lessons,
</div> </div>
<div className='w-full mt-8 flex flex-wrap justify-between items-center'> <div className='w-full mt-8 flex flex-wrap justify-between items-center'>
{renderPaymentMessage()} {renderPaymentMessage()}
{processedEvent?.pubkey === session?.user?.pubkey && ( {processedEvent?.pubkey === session?.user?.pubkey ? (
<div className='flex space-x-2 mt-4 sm:mt-0'> <div className='flex space-x-2 mt-4 sm:mt-0'>
<GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined /> <GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
<GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined /> <GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
<GenericButton outlined icon="pi pi-external-link" onClick={() => window.open(`https://nostr.band/${nAddress}`, '_blank')} tooltip="View Nostr Event" tooltipOptions={{ position: 'right' }} />
</div>
) : (
<div className='flex space-x-2 mt-4 sm:mt-0'>
<GenericButton className='my-2' outlined icon="pi pi-external-link" onClick={() => window.open(`https://nostr.band/${nAddress}`, '_blank')} tooltip="View Nostr Event" tooltipOptions={{ position: paidCourse ? 'left' : 'right' }} />
</div> </div>
)}
{nAddress && (
<GenericButton outlined icon="pi pi-external-link" onClick={() => window.open(`https://nostr.band/${nAddress}`, '_blank')} tooltip="View Nostr Event" tooltipOptions={{ position: paidCourse ? 'left' : 'right' }} />
)} )}
</div> </div>
</div> </div>

View File

@ -9,6 +9,7 @@ import { nip19 } from "nostr-tools";
import { Divider } from "primereact/divider"; import { Divider } from "primereact/divider";
import { getTotalFromZaps } from "@/utils/lightning"; import { getTotalFromZaps } from "@/utils/lightning";
import dynamic from "next/dynamic"; import dynamic from "next/dynamic";
import { defaultRelayUrls } from "@/context/NDKContext";
const MDDisplay = dynamic( const MDDisplay = dynamic(
() => import("@uiw/react-markdown-preview"), () => import("@uiw/react-markdown-preview"),
@ -35,6 +36,7 @@ const DocumentLesson = ({ lesson, course, decryptionPerformed, isPaid }) => {
pubkey: lesson.pubkey, pubkey: lesson.pubkey,
kind: lesson.kind, kind: lesson.kind,
identifier: lesson.d, identifier: lesson.d,
relayUrls: defaultRelayUrls
}) })
setNAddress(addr); setNAddress(addr);
} }

View File

@ -15,6 +15,7 @@ import { findKind0Fields } from '@/utils/nostr';
import { useToast } from '@/hooks/useToast'; import { useToast } from '@/hooks/useToast';
import { formatDateTime } from '@/utils/time'; import { formatDateTime } from '@/utils/time';
import { validateEvent } from '@/utils/nostr'; import { validateEvent } from '@/utils/nostr';
import { defaultRelayUrls } from "@/context/NDKContext";
import 'primeicons/primeicons.css'; import 'primeicons/primeicons.css';
const MDDisplay = dynamic( const MDDisplay = dynamic(
@ -109,6 +110,7 @@ export default function DraftCourseDetails({ processedEvent, draftId, lessons })
pubkey: resource.pubkey, pubkey: resource.pubkey,
kind: resource.kind, kind: resource.kind,
identifier: dTag, identifier: dTag,
relayUrls: defaultRelayUrls
}); });
const userResponse = await axios.get(`/api/users/${user.pubkey}`); const userResponse = await axios.get(`/api/users/${user.pubkey}`);

View File

@ -9,6 +9,7 @@ import { nip19 } from "nostr-tools";
import { getTotalFromZaps } from "@/utils/lightning"; import { getTotalFromZaps } from "@/utils/lightning";
import dynamic from "next/dynamic"; import dynamic from "next/dynamic";
import { Divider } from "primereact/divider"; import { Divider } from "primereact/divider";
import { defaultRelayUrls } from "@/context/NDKContext";
const MDDisplay = dynamic( const MDDisplay = dynamic(
() => import("@uiw/react-markdown-preview"), () => import("@uiw/react-markdown-preview"),
@ -34,6 +35,7 @@ const VideoLesson = ({ lesson, course, decryptionPerformed, isPaid }) => {
pubkey: lesson.pubkey, pubkey: lesson.pubkey,
kind: lesson.kind, kind: lesson.kind,
identifier: lesson.d, identifier: lesson.d,
relayUrls: defaultRelayUrls
}); });
setNAddress(addr); setNAddress(addr);
}, [lesson]); }, [lesson]);

View File

@ -39,6 +39,10 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
} }
}, [zaps, processedEvent]); }, [zaps, processedEvent]);
useEffect(() => {
console.log("authorView", authorView);
}, [authorView]);
const handleDelete = async () => { const handleDelete = async () => {
try { try {
const response = await axios.delete(`/api/resources/${processedEvent.d}`); const response = await axios.delete(`/api/resources/${processedEvent.d}`);
@ -80,7 +84,9 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
} }
if (paidResource && !decryptedContent) { if (paidResource && !decryptedContent) {
return ( return (
<div className="w-full p-8 rounded-lg flex flex-col items-center justify-center bg-gray-100 dark:bg-gray-800"> <div className="w-full px-4">
<div className="w-full p-8 rounded-lg flex flex-col items-center justify-center bg-gray-800">
<div className="mx-auto py-auto"> <div className="mx-auto py-auto">
<i className="pi pi-lock text-[60px] text-red-500"></i> <i className="pi pi-lock text-[60px] text-red-500"></i>
</div> </div>
@ -95,6 +101,7 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
onError={handlePaymentError} onError={handlePaymentError}
resourceId={processedEvent.d} resourceId={processedEvent.d}
/> />
</div>
</div> </div>
</div> </div>
); );
@ -151,6 +158,23 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
zapsLoading={zapsLoading && zapAmount === 0} zapsLoading={zapsLoading && zapAmount === 0}
/> />
</div> </div>
<div className='w-full mt-8 flex flex-wrap justify-between items-center'>
{renderPaymentMessage()}
{authorView ? (
<div className='flex space-x-2 mt-4 sm:mt-0'>
<GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
<GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
<GenericButton
tooltip={`View Nostr Note`}
tooltipOptions={{ position: 'left' }}
icon="pi pi-external-link"
outlined
onClick={() => {
window.open(`https://nostr.com/${nAddress}`, '_blank');
}}
/>
</div>
) : (
<div className="w-full flex flex-row justify-end"> <div className="w-full flex flex-row justify-end">
<GenericButton <GenericButton
tooltip={`View Nostr Note`} tooltip={`View Nostr Note`}
@ -162,19 +186,11 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
}} }}
/> />
</div> </div>
)}
</div>
</div> </div>
</div> </div>
{renderContent()} {renderContent()}
<div className='w-full mt-8 flex flex-wrap justify-between items-center'>
{renderPaymentMessage()}
{authorView && (
<div className='flex space-x-2 mt-4 sm:mt-0'>
<GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
<GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
</div>
)}
</div>
</div> </div>
) )
} }

View File

@ -154,25 +154,18 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
</a> </a>
</p> </p>
</div> </div>
<GenericButton {authorView ? (
tooltip={`View Nostr Note`}
tooltipOptions={{ position: 'left' }}
icon="pi pi-external-link"
outlined
onClick={() => {
window.open(`https://nostr.com/${nAddress}`, '_blank');
}}
/>
{authorView && (
<div className='flex flex-row justify-center items-center space-x-2'> <div className='flex flex-row justify-center items-center space-x-2'>
<GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined /> <GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
<GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined /> <GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
<GenericButton outlined icon="pi pi-external-link" onClick={() => window.open(`https://nostr.band/${nAddress}`, '_blank')} tooltip="View Nostr Event" tooltipOptions={{ position: 'right' }} />
</div>
) : (
<div className='flex flex-row justify-center items-center space-x-2'>
<GenericButton outlined icon="pi pi-external-link" onClick={() => window.open(`https://nostr.band/${nAddress}`, '_blank')} tooltip="View Nostr Event" tooltipOptions={{ position: 'right' }} />
</div> </div>
)} )}
</div> </div>
<div className='w-full flex flex-row justify-between'>
{renderPaymentMessage()}
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -72,7 +72,7 @@ const CommunityMessage = ({ message, searchQuery, windowWidth, platform }) => {
} }
<div className="w-full flex flex-row justify-between items-end"> <div className="w-full flex flex-row justify-between items-end">
{ {
session?.user?.pubkey && platform === 'nostr' ? ( platform === 'nostr' ? (
<Panel <Panel
headerTemplate={() => headerTemplate({ onTogglerClick: () => setCollapsed(!collapsed) }, windowWidth, platform, message.id)} headerTemplate={() => headerTemplate({ onTogglerClick: () => setCollapsed(!collapsed) }, windowWidth, platform, message.id)}
toggleable toggleable
@ -80,13 +80,14 @@ const CommunityMessage = ({ message, searchQuery, windowWidth, platform }) => {
onToggle={(e) => setCollapsed(e.value)} onToggle={(e) => setCollapsed(e.value)}
className="w-full" className="w-full"
> >
<div className="max-w-[100vw]">
<ZapThreadsWrapper <ZapThreadsWrapper
anchor={nip19.noteEncode(message.id)} anchor={nip19.noteEncode(message.id)}
user={npub} user={npub || null}
relays="wss://nos.lol/, wss://relay.damus.io/, wss://relay.snort.social/, wss://relay.nostr.band/, wss://relay.mutinywallet.com/, wss://relay.primal.net/" relays="wss://nos.lol/, wss://relay.damus.io/, wss://relay.snort.social/, wss://relay.nostr.band/, wss://relay.mutinywallet.com/, wss://relay.primal.net/"
disable="" disable=""
/> />
</div>
</Panel> </Panel>
) : ( ) : (
<div className="w-full flex flex-row justify-between items-end"> <div className="w-full flex flex-row justify-between items-end">

View File

@ -99,7 +99,6 @@ const Sidebar = ({ course = false }) => {
<i className="pi pi-arrow-left pl-5" /> <p className="pl-2 rounded-md font-bold text-lg">Home</p> <i className="pi pi-arrow-left pl-5" /> <p className="pl-2 rounded-md font-bold text-lg">Home</p>
</div> </div>
{lessons.map((lesson, index) => ( {lessons.map((lesson, index) => (
console.log(lesson),
<div <div
key={lesson} key={lesson}
onClick={() => { onClick={() => {

View File

@ -9,6 +9,7 @@ import { useNDKContext } from '@/context/NDKContext';
import VideoDetails from '@/components/content/videos/VideoDetails'; import VideoDetails from '@/components/content/videos/VideoDetails';
import DocumentDetails from '@/components/content/documents/DocumentDetails'; import DocumentDetails from '@/components/content/documents/DocumentDetails';
import { ProgressSpinner } from 'primereact/progressspinner'; import { ProgressSpinner } from 'primereact/progressspinner';
import { defaultRelayUrls } from '@/context/NDKContext';
import 'primeicons/primeicons.css'; import 'primeicons/primeicons.css';
const privkey = process.env.NEXT_PUBLIC_APP_PRIV_KEY; const privkey = process.env.NEXT_PUBLIC_APP_PRIV_KEY;
@ -170,6 +171,7 @@ export default function Details() {
pubkey: processedEvent.pubkey, pubkey: processedEvent.pubkey,
kind: processedEvent.kind, kind: processedEvent.kind,
identifier: processedEvent.d, identifier: processedEvent.d,
relayUrls: defaultRelayUrls
}); });
setNAddress(naddr); setNAddress(naddr);
} }

View File

@ -17,6 +17,7 @@ import useResponsiveImageDimensions from '@/hooks/useResponsiveImageDimensions';
import 'primeicons/primeicons.css'; import 'primeicons/primeicons.css';
import dynamic from 'next/dynamic'; import dynamic from 'next/dynamic';
import { validateEvent } from '@/utils/nostr'; import { validateEvent } from '@/utils/nostr';
import { defaultRelayUrls } from '@/context/NDKContext';
const MDDisplay = dynamic( const MDDisplay = dynamic(
() => import("@uiw/react-markdown-preview"), () => import("@uiw/react-markdown-preview"),
@ -120,6 +121,7 @@ export default function Draft() {
pubkey: resource.pubkey, pubkey: resource.pubkey,
kind: resource.kind, kind: resource.kind,
identifier: dTag, identifier: dTag,
relayUrls: defaultRelayUrls
}); });
const userResponse = await axios.get(`/api/users/${user.pubkey}`); const userResponse = await axios.get(`/api/users/${user.pubkey}`);