saulteafarmer/plebdevs
1
0
Fork 0
mirror of https://github.com/AustinKelsay/plebdevs.git synced 2025-06-06 18:31:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/ZapThreadsWrapper.js
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;

2
src/components/content/carousels/newTemplates/CourseTemplate.js
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);
} }

2
src/components/content/carousels/newTemplates/DocumentTemplate.js
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);
} }

4
src/components/content/carousels/newTemplates/VideoTemplate.js
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]);

2
src/components/content/courses/CourseDetails.js
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);
} }

12
src/components/content/courses/CourseDetailsNew.js
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>

2
src/components/content/courses/DocumentLesson.js
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);
} }

2
src/components/content/courses/DraftCourseDetails.js
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}`);

2
src/components/content/courses/VideoLesson.js
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]);

60
src/components/content/documents/DocumentDetails.js
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>
@ -94,9 +100,10 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
onSuccess={handlePaymentSuccess} onSuccess={handlePaymentSuccess}
onError={handlePaymentError} onError={handlePaymentError}
resourceId={processedEvent.d} resourceId={processedEvent.d}
/> />
</div> </div>
</div> </div>
</div>
); );
} }
if (processedEvent?.content) { if (processedEvent?.content) {
@ -151,30 +158,39 @@ const DocumentDetails = ({ processedEvent, topics, title, summary, image, price,
zapsLoading={zapsLoading && zapAmount === 0} zapsLoading={zapsLoading && zapAmount === 0}
/> />
</div> </div>
<div className="w-full flex flex-row justify-end"> <div className='w-full mt-8 flex flex-wrap justify-between items-center'>
<GenericButton {renderPaymentMessage()}
tooltip={`View Nostr Note`} {authorView ? (
tooltipOptions={{ position: 'left' }} <div className='flex space-x-2 mt-4 sm:mt-0'>
icon="pi pi-external-link" <GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
outlined <GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
onClick={() => { <GenericButton
window.open(`https://nostr.com/${nAddress}`, '_blank'); 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">
<GenericButton
tooltip={`View Nostr Note`}
tooltipOptions={{ position: 'left' }}
icon="pi pi-external-link"
outlined
onClick={() => {
window.open(`https://nostr.com/${nAddress}`, '_blank');
}}
/>
</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>
) )
} }

95
src/components/content/videos/VideoDetails.js
View File

@ -118,63 +118,56 @@ const VideoDetails = ({ processedEvent, topics, title, summary, image, price, au
<div className="w-full"> <div className="w-full">
{renderContent()} {renderContent()}
<div className="bg-gray-800/90 rounded-lg p-4 m-4"> <div className="bg-gray-800/90 rounded-lg p-4 m-4">
<div className="w-full flex flex-col items-start justify-start mt-2 px-2"> <div className="w-full flex flex-col items-start justify-start mt-2 px-2">
<div className="flex flex-row items-center gap-2 w-full"> <div className="flex flex-row items-center gap-2 w-full">
<h1 className='text-4xl'>{title}</h1> <h1 className='text-4xl'>{title}</h1>
{topics && topics.length > 0 && ( {topics && topics.length > 0 && (
topics.map((topic, index) => ( topics.map((topic, index) => (
<Tag className='mt-2 text-white' key={index} value={topic}></Tag> <Tag className='mt-2 text-white' key={index} value={topic}></Tag>
)) ))
) )
} }
</div> </div>
<div className='flex flex-row items-center justify-between w-full'> <div className='flex flex-row items-center justify-between w-full'>
<p className='text-xl mt-4'>{summary}</p> <p className='text-xl mt-4'>{summary}</p>
<ZapDisplay <ZapDisplay
zapAmount={zapAmount} zapAmount={zapAmount}
event={processedEvent} event={processedEvent}
zapsLoading={zapsLoading && zapAmount === 0} zapsLoading={zapsLoading && zapAmount === 0}
/> />
</div>
</div> </div>
</div> <div className='w-full flex flex-col space-y-4 mt-4'>
<div className='w-full flex flex-col space-y-4 mt-4'> <div className='flex flex-row justify-between items-center'>
<div className='flex flex-row justify-between items-center'> <div className='flex flex-row w-fit items-center'>
<div className='flex flex-row w-fit items-center'> <Image
<Image alt="avatar image"
alt="avatar image" src={returnImageProxy(author?.avatar, author?.username)}
src={returnImageProxy(author?.avatar, author?.username)} width={50}
width={50} height={50}
height={50} className="rounded-full mr-4"
className="rounded-full mr-4"
/> />
<p className='text-lg'> <p className='text-lg'>
Created by{' '} Created by{' '}
<a rel='noreferrer noopener' target='_blank' className='text-blue-500 hover:underline'> <a rel='noreferrer noopener' target='_blank' className='text-blue-500 hover:underline'>
{author?.username} {author?.username}
</a> </a>
</p> </p>
</div>
<GenericButton
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'>
<GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
<GenericButton onClick={handleDelete} label="Delete" severity='danger' outlined />
</div> </div>
)} {authorView ? (
</div> <div className='flex flex-row justify-center items-center space-x-2'>
<div className='w-full flex flex-row justify-between'> <GenericButton onClick={() => router.push(`/details/${processedEvent.id}/edit`)} label="Edit" severity='warning' outlined />
{renderPaymentMessage()} <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> </div>
</div>
</div> </div>
) )
} }

21
src/components/feeds/messages/CommunityMessage.js
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,20 +80,21 @@ 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">
{platform !== "nostr" ? ( {platform !== "nostr" ? (
<p className="rounded-lg text-sm text-gray-300"> <p className="rounded-lg text-sm text-gray-300">
{new Date(message.timestamp).toLocaleString()} {new Date(message.timestamp).toLocaleString()}
</p> </p>
) : <div></div>} ) : <div></div>}
<GenericButton <GenericButton
label={windowWidth > 768 ? `View in ${platform}` : null} label={windowWidth > 768 ? `View in ${platform}` : null}

1
src/components/sidebar/Sidebar.js
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={() => {

2
src/pages/details/[slug]/index.js
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);
} }

2
src/pages/draft/[slug]/index.js
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}`);