added database provider & refactor sql execute

This commit is contained in:
Ren Amamiya
2023-02-26 21:21:35 +07:00
parent 690d55e0eb
commit 18900f1410
9 changed files with 161 additions and 113 deletions

View File

@@ -2,84 +2,79 @@
import BaseLayout from '@layouts/baseLayout';
import OnboardingLayout from '@layouts/onboardingLayout';
import { currentUser } from '@stores/currentUser';
import { DatabaseContext } from '@components/contexts/database';
import { RelayContext } from '@components/contexts/relay';
import { currentUser } from '@stores/currentUser';
import { relays } from '@stores/relays';
import { useStore } from '@nanostores/react';
import { EyeClosedIcon, EyeOpenIcon } from '@radix-ui/react-icons';
import { motion } from 'framer-motion';
import Image from 'next/image';
import { useRouter } from 'next/router';
import { dateToUnix, useNostr } from 'nostr-react';
import { generatePrivateKey, getEventHash, getPublicKey, nip19, signEvent } from 'nostr-tools';
import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useState } from 'react';
import Database from 'tauri-plugin-sql-api';
import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useContext, useState } from 'react';
import { Config, names, uniqueNamesGenerator } from 'unique-names-generator';
const config: Config = {
dictionaries: [names],
};
const defaultAvatars = [
'https://bafybeidfsbrzqbvontmucteomoz2rkrxugu462l5hyhh6uioslkfzzs4oq.ipfs.w3s.link/avatar-11.png',
'https://bafybeid7mrvznbnd6r2ju2iu7lsxkcikufys6z6ssy5ldxrxq5qh3yqf4u.ipfs.w3s.link/avatar-12.png',
'https://bafybeih5gpwu53ohui6p7scekjpxjk2d4lusq2jqohqhjsvhfkeu56ea4e.ipfs.w3s.link/avatar-13.png',
'https://bafybeibpbvrpuphkerjygdbnh26av5brqggzunbbbmfl3ozlvcn2mj6zxa.ipfs.w3s.link/avatar-14.png',
'https://bafybeia4ue4loinuflu7y5q3xu6hcvt653mzw5yorw25oarf2wqksig4ma.ipfs.w3s.link/avatar-15.png',
'https://bafybeib3gzl6n2bebiru2cpkdljmlzbtqfsl6xcnqtabxt6jrpj7l7ltm4.ipfs.w3s.link/avatar-16.png',
];
const defaultBanners = [
'https://bafybeiacwit7hjmdefqggxqtgh6ht5dhth7ndptwn2msl5kpkodudsr7py.ipfs.w3s.link/banner-1.jpg',
'https://bafybeiderllqadxsikh3envikobmyka3uwgojriwh6epctqartq2loswyi.ipfs.w3s.link/banner-2.jpg',
'https://bafybeiba4tifde2kczvd26vxhbb5jpqi3wmgvccpkcrle4hse2cqrwlwiy.ipfs.w3s.link/banner-3.jpg',
'https://bafybeifqpny2eom7ccvmaguxxxfajutmn5h3fotaasga7gce2xfx37p6oy.ipfs.w3s.link/banner-4.jpg',
];
export default function Page() {
const db: any = useContext(DatabaseContext);
const router = useRouter();
const { publish } = useNostr();
const relayPool: any = useContext(RelayContext);
const $relays = useStore(relays);
const [type, setType] = useState('password');
const [loading, setLoading] = useState(false);
const [privKey] = useState(() => generatePrivateKey());
const [name] = useState(() => uniqueNamesGenerator(config).toString());
const [avatar] = useState(() => defaultAvatars[Math.floor(Math.random() * defaultAvatars.length)]);
const [banner] = useState(() => defaultBanners[Math.floor(Math.random() * defaultBanners.length)]);
const pubKey = getPublicKey(privKey);
const npub = nip19.npubEncode(pubKey);
const nsec = nip19.nsecEncode(privKey);
const showPrivateKey = () => {
if (type === 'password') {
setType('text');
} else {
setType('password');
}
};
// auto-generated profile
const data = {
display_name: name,
name: name,
username: name.toLowerCase(),
picture: avatar,
banner: banner,
picture: 'https://bafybeidfsbrzqbvontmucteomoz2rkrxugu462l5hyhh6uioslkfzzs4oq.ipfs.w3s.link/avatar-11.png',
banner: 'https://bafybeiacwit7hjmdefqggxqtgh6ht5dhth7ndptwn2msl5kpkodudsr7py.ipfs.w3s.link/banner-1.jpg',
};
const createAccount = async () => {
setLoading(true);
// publish account to relays
// build event
const event: any = {
content: JSON.stringify(data),
created_at: dateToUnix(),
created_at: Math.floor(Date.now() / 1000),
kind: 0,
pubkey: pubKey,
tags: [],
};
event.id = getEventHash(event);
event.sig = signEvent(event, privKey);
publish(event);
// publish to relays
relayPool.publish(event, $relays);
// save account to database
const db = await Database.load('sqlite:lume.db');
await db.execute(
`INSERT INTO accounts (id, privkey, npub, nsec, metadata) VALUES ("${pubKey}", "${privKey}", "${npub}", "${nsec}", '${JSON.stringify(data)}')`
);
await db.close();
// set currentUser in global state
currentUser.set({
@@ -96,14 +91,6 @@ export default function Page() {
}, 1500);
};
const showNsec = () => {
if (type === 'password') {
setType('text');
} else {
setType('password');
}
};
return (
<div className="flex h-full flex-col justify-between px-8">
<div>{/* spacer */}</div>
@@ -137,7 +124,9 @@ export default function Page() {
value={nsec}
className="relative w-full rounded-lg border border-black/5 px-3.5 py-2 shadow-input shadow-black/5 !outline-none placeholder:text-zinc-400 dark:bg-zinc-800 dark:text-zinc-200 dark:shadow-black/10 dark:placeholder:text-zinc-600"
/>
<button onClick={() => showNsec()} className="group absolute right-2 top-1/2 -translate-y-1/2 transform rounded p-1 hover:bg-zinc-700">
<button
onClick={() => showPrivateKey()}
className="group absolute right-2 top-1/2 -translate-y-1/2 transform rounded p-1 hover:bg-zinc-700">
{type === 'password' ? (
<EyeClosedIcon className="h-5 w-5 text-zinc-500 group-hover:text-zinc-200" />
) : (

View File

@@ -2,42 +2,52 @@
import BaseLayout from '@layouts/baseLayout';
import OnboardingLayout from '@layouts/onboardingLayout';
import { DatabaseContext } from '@components/contexts/database';
import { RelayContext } from '@components/contexts/relay';
import { relays } from '@stores/relays';
import { useStore } from '@nanostores/react';
import { motion } from 'framer-motion';
import { useRouter } from 'next/router';
import { useNostrEvents } from 'nostr-react';
import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useEffect, useState } from 'react';
import Database from 'tauri-plugin-sql-api';
import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useContext, useEffect, useState } from 'react';
export default function Page() {
const [follows, setFollows] = useState([null]);
const [loading, setLoading] = useState(false);
const db: any = useContext(DatabaseContext);
const relayPool: any = useContext(RelayContext);
const $relays = useStore(relays);
const router = useRouter();
const { pubkey }: any = router.query;
const { onEvent } = useNostrEvents({
filter: {
authors: [pubkey],
kinds: [3],
},
});
const [follows, setFollows] = useState([null]);
const [loading, setLoading] = useState(false);
onEvent((rawMetadata) => {
try {
setFollows(rawMetadata.tags);
} catch (err) {
console.error(err, rawMetadata);
relayPool.subscribe(
[
{
authors: [pubkey],
kinds: [0],
since: 0,
},
],
$relays,
(event: any) => {
setFollows(event.tags);
},
undefined,
(events: any, relayURL: any) => {
console.log(events, relayURL);
}
});
);
useEffect(() => {
setLoading(true);
const insertDB = async () => {
const db = await Database.load('sqlite:lume.db');
follows.forEach(async (item) => {
if (item) {
await db.execute(`INSERT OR IGNORE INTO follows (pubkey, account) VALUES ("${item[1]}", "${pubkey}")`);
await db.execute(`INSERT OR IGNORE INTO follows (pubkey, account, kind) VALUES ("${item[1]}", "${pubkey}", "0")`);
}
});
};
@@ -52,7 +62,7 @@ export default function Page() {
})
.catch(console.error);
}
}, [follows, pubkey, router]);
}, [db, follows, pubkey, router]);
return (
<div className="flex h-full flex-col justify-between px-8">

View File

@@ -2,14 +2,22 @@
import BaseLayout from '@layouts/baseLayout';
import OnboardingLayout from '@layouts/onboardingLayout';
import { DatabaseContext } from '@components/contexts/database';
import { RelayContext } from '@components/contexts/relay';
import { relays } from '@stores/relays';
import { useStore } from '@nanostores/react';
import { motion } from 'framer-motion';
import { useRouter } from 'next/router';
import { useNostrEvents } from 'nostr-react';
import { getPublicKey, nip19 } from 'nostr-tools';
import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useCallback, useEffect, useState } from 'react';
import Database from 'tauri-plugin-sql-api';
import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useCallback, useContext, useEffect, useState } from 'react';
export default function Page() {
const db: any = useContext(DatabaseContext);
const relayPool: any = useContext(RelayContext);
const $relays = useStore(relays);
const router = useRouter();
const { privkey }: any = router.query;
@@ -20,31 +28,32 @@ export default function Page() {
const npub = privkey ? nip19.npubEncode(pubkey) : null;
const nsec = privkey ? nip19.nsecEncode(privkey) : null;
const { onEvent } = useNostrEvents({
filter: {
authors: [pubkey],
kinds: [0],
},
});
onEvent((rawMetadata) => {
try {
const metadata: any = JSON.parse(rawMetadata.content);
relayPool.subscribe(
[
{
authors: [pubkey],
kinds: [0],
},
],
$relays,
(event: any) => {
const metadata = JSON.parse(event.content);
setAccount(metadata);
} catch (err) {
console.error(err, rawMetadata);
},
undefined,
(events: any, relayURL: any) => {
console.log(events, relayURL);
}
});
);
const insertDB = useCallback(async () => {
// save account to database
const db = await Database.load('sqlite:lume.db');
const metadata = JSON.stringify(account);
await db.execute(
`INSERT INTO accounts (id, privkey, npub, nsec, metadata) VALUES ("${pubkey}", "${privkey}", "${npub}", "${nsec}", '${metadata}')`
);
await db.close();
}, [account, npub, nsec, privkey, pubkey]);
}, [account, db, npub, nsec, privkey, pubkey]);
useEffect(() => {
setLoading(true);

View File

@@ -2,6 +2,8 @@
import BaseLayout from '@layouts/baseLayout';
import OnboardingLayout from '@layouts/onboardingLayout';
import { DatabaseContext } from '@components/contexts/database';
import { truncate } from '@utils/truncate';
import { currentUser } from '@stores/currentUser';
@@ -14,11 +16,12 @@ import { motion } from 'framer-motion';
import Image from 'next/image';
import { useRouter } from 'next/router';
import { nip19 } from 'nostr-tools';
import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useState } from 'react';
import Database from 'tauri-plugin-sql-api';
import { JSXElementConstructor, ReactElement, ReactFragment, ReactPortal, useContext, useState } from 'react';
export default function Page() {
const db: any = useContext(DatabaseContext);
const router = useRouter();
const shuffle = (arr) => [...arr].sort(() => Math.random() - 0.5);
const [follow, setFollow] = useState([]);
@@ -32,13 +35,12 @@ export default function Page() {
};
const insertDB = async () => {
const db = await Database.load('sqlite:lume.db');
// self follow
await db.execute(`INSERT INTO follows (pubkey, account) VALUES ("${$currentUser.pubkey}", "${$currentUser.pubkey}")`);
await db.execute(`INSERT INTO follows (pubkey, account, kind) VALUES ("${$currentUser.pubkey}", "${$currentUser.pubkey}", "0")`);
// follow selected
follow.forEach(async (npub) => {
const { data } = nip19.decode(npub);
await db.execute(`INSERT INTO follows (pubkey, account) VALUES ("${data}", "${$currentUser.pubkey}")`);
await db.execute(`INSERT INTO follows (pubkey, account, kind) VALUES ("${data}", "${$currentUser.pubkey}", "0")`);
});
};