mirror of
https://github.com/luminous-devs/lume.git
synced 2024-09-19 11:43:30 +00:00
added note connector (wip)
This commit is contained in:
parent
a5b116dae0
commit
f4b5764db6
@ -35,9 +35,10 @@ CREATE TABLE
|
||||
CREATE TABLE
|
||||
cache_notes (
|
||||
id TEXT PRIMARY KEY,
|
||||
note JSON,
|
||||
pubkey TEXT NOT NULL,
|
||||
created_at TEXT,
|
||||
kind INTEGER NOT NULL DEFAULT 1,
|
||||
is_multi BOOLEAN DEFAULT 0,
|
||||
created_at DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
updated_at DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP
|
||||
tags TEXT NOT NULL,
|
||||
content TEXT NOT NULL,
|
||||
is_multi BOOLEAN DEFAULT 0
|
||||
);
|
58
src/components/connectors/note.tsx
Normal file
58
src/components/connectors/note.tsx
Normal file
@ -0,0 +1,58 @@
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
import { DatabaseContext } from '@components/contexts/database';
|
||||
import { RelayContext } from '@components/contexts/relay';
|
||||
|
||||
import { hoursAgo } from '@utils/getDate';
|
||||
|
||||
import { follows } from '@stores/follows';
|
||||
import { relays } from '@stores/relays';
|
||||
|
||||
import { useStore } from '@nanostores/react';
|
||||
import { dateToUnix } from 'nostr-react';
|
||||
import { memo, useCallback, useContext, useRef } from 'react';
|
||||
|
||||
export const NoteConnector = memo(function NoteConnector() {
|
||||
const db: any = useContext(DatabaseContext);
|
||||
const relayPool: any = useContext(RelayContext);
|
||||
|
||||
const now = useRef(new Date());
|
||||
|
||||
const $follows = useStore(follows);
|
||||
const $relays = useStore(relays);
|
||||
|
||||
const insertDB = useCallback(
|
||||
async (event: any) => {
|
||||
await db.execute(
|
||||
`INSERT OR IGNORE INTO
|
||||
cache_notes
|
||||
(id, pubkey, created_at, kind, tags, content) VALUES
|
||||
("${event.id}", "${event.pubkey}", "${event.created_at}", "${event.kind}", '${JSON.stringify(event.tags)}', "${event.content}");`
|
||||
);
|
||||
},
|
||||
[db]
|
||||
);
|
||||
|
||||
relayPool.subscribe(
|
||||
[
|
||||
{
|
||||
kinds: [1],
|
||||
authors: $follows,
|
||||
since: dateToUnix(hoursAgo(12, now.current)),
|
||||
},
|
||||
],
|
||||
$relays,
|
||||
(event: any) => {
|
||||
insertDB(event).catch(console.error);
|
||||
},
|
||||
undefined,
|
||||
(events: any, relayURL: any) => {
|
||||
console.log(events, relayURL);
|
||||
}
|
||||
);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<p>Note</p>
|
||||
</div>
|
||||
);
|
||||
});
|
@ -1,5 +1,6 @@
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
import ActiveLink from '@components/activeLink';
|
||||
import { NoteConnector } from '@components/connectors/note';
|
||||
import CreatePost from '@components/navigatorBar/createPost';
|
||||
import { ProfileMenu } from '@components/navigatorBar/profileMenu';
|
||||
|
||||
@ -10,22 +11,20 @@ import { PlusIcon } from '@radix-ui/react-icons';
|
||||
|
||||
export default function NavigatorBar() {
|
||||
const $currentUser: any = useStore(currentUser);
|
||||
const profile =
|
||||
$currentUser.metadata !== undefined
|
||||
? JSON.parse($currentUser.metadata)
|
||||
: { display_name: null, username: null };
|
||||
const profile = $currentUser.metadata !== undefined ? JSON.parse($currentUser.metadata) : { display_name: null, username: null };
|
||||
|
||||
return (
|
||||
<div className="flex h-full flex-col flex-wrap justify-between overflow-hidden px-2 pt-3 pb-4">
|
||||
{/* main */}
|
||||
<div className="flex flex-col gap-4">
|
||||
<div>
|
||||
<NoteConnector />
|
||||
</div>
|
||||
{/* Create post */}
|
||||
<div className="flex flex-col rounded-lg bg-zinc-900 ring-1 ring-white/10">
|
||||
<div className="flex flex-col p-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<h5 className="font-semibold leading-tight text-zinc-100">
|
||||
{profile.display_name || ''}
|
||||
</h5>
|
||||
<h5 className="font-semibold leading-tight text-zinc-100">{profile.display_name || ''}</h5>
|
||||
<ProfileMenu pubkey={$currentUser.pubkey} />
|
||||
</div>
|
||||
<span className="text-sm leading-tight text-zinc-500">@{profile.username || ''}</span>
|
||||
@ -38,9 +37,7 @@ export default function NavigatorBar() {
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="flex items-center justify-between px-2">
|
||||
<h3 className="text-sm font-bold text-zinc-400">Newsfeed</h3>
|
||||
<button
|
||||
type="button"
|
||||
className="group flex h-6 w-6 items-center justify-center rounded-full hover:bg-zinc-900">
|
||||
<button type="button" className="group flex h-6 w-6 items-center justify-center rounded-full hover:bg-zinc-900">
|
||||
<PlusIcon className="h-3 w-3 text-zinc-400 group-hover:text-zinc-100" />
|
||||
</button>
|
||||
</div>
|
||||
@ -65,9 +62,7 @@ export default function NavigatorBar() {
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="flex items-center justify-between px-2">
|
||||
<h3 className="text-sm font-bold text-zinc-400">Direct Messages</h3>
|
||||
<button
|
||||
type="button"
|
||||
className="group flex h-6 w-6 items-center justify-center rounded-full hover:bg-zinc-900">
|
||||
<button type="button" className="group flex h-6 w-6 items-center justify-center rounded-full hover:bg-zinc-900">
|
||||
<PlusIcon className="h-3 w-3 text-zinc-400 group-hover:text-zinc-100" />
|
||||
</button>
|
||||
</div>
|
||||
|
@ -3,56 +3,29 @@ import BaseLayout from '@layouts/baseLayout';
|
||||
import NewsFeedLayout from '@layouts/newsfeedLayout';
|
||||
|
||||
import { DatabaseContext } from '@components/contexts/database';
|
||||
import { RelayContext } from '@components/contexts/relay';
|
||||
import { Placeholder } from '@components/note/placeholder';
|
||||
import { Thread } from '@components/thread';
|
||||
|
||||
import { hoursAgo } from '@utils/getDate';
|
||||
|
||||
import { follows } from '@stores/follows';
|
||||
import { relays } from '@stores/relays';
|
||||
|
||||
import { useStore } from '@nanostores/react';
|
||||
import { dateToUnix } from 'nostr-react';
|
||||
import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, Suspense, useContext, useEffect, useRef, useState } from 'react';
|
||||
|
||||
export default function Page() {
|
||||
const db: any = useContext(DatabaseContext);
|
||||
const relayPool: any = useContext(RelayContext);
|
||||
|
||||
const now = useRef(new Date());
|
||||
|
||||
const $follows = useStore(follows);
|
||||
const $relays = useStore(relays);
|
||||
|
||||
const [events, setEvents] = useState([]);
|
||||
const [data, setData] = useState([]);
|
||||
const limit = useRef(25);
|
||||
|
||||
useEffect(() => {
|
||||
const unsub = relayPool.subscribe(
|
||||
[
|
||||
{
|
||||
kinds: [1],
|
||||
authors: $follows,
|
||||
since: dateToUnix(hoursAgo(12, now.current)),
|
||||
},
|
||||
],
|
||||
$relays,
|
||||
async (event: any) => {
|
||||
setEvents((events) => [event, ...events]);
|
||||
},
|
||||
undefined,
|
||||
(events: any, relayURL: any) => {
|
||||
console.log(events, relayURL);
|
||||
}
|
||||
);
|
||||
const getData = async () => {
|
||||
const result = await db.select(`SELECT * FROM cache_notes ORDER BY created_at DESC LIMIT ${limit.current}`);
|
||||
setData(result);
|
||||
};
|
||||
|
||||
return () => unsub();
|
||||
}, [$follows, $relays, db, relayPool]);
|
||||
getData().catch(console.error);
|
||||
}, [db]);
|
||||
|
||||
return (
|
||||
<div className="h-full w-full">
|
||||
<Suspense fallback={<Placeholder />}>
|
||||
<Thread data={events} />
|
||||
<Thread data={data} />
|
||||
</Suspense>
|
||||
</div>
|
||||
);
|
||||
|
Loading…
Reference in New Issue
Block a user