reya/lume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update ndk

Browse Source
This commit is contained in:
Ren Amamiya
2023-06-11 09:34:13 +07:00
parent 38558280ba
commit 6dab0d5e44
10 changed files with 190 additions and 252 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/channel/layout.tsx
View File

@@ -4,7 +4,7 @@ import { Navigation } from "@shared/navigation";
export function LayoutChannel({ children }: { children: React.ReactNode }) {
return (
<div className="flex w-screen h-screen">
<div className="relative flex flex-row flex-wrap shrink-0">
<div className="relative flex flex-row shrink-0">
<MultiAccounts />
<Navigation />
</div>

2
src/app/chat/layout.tsx
View File

@@ -4,7 +4,7 @@ import { Navigation } from "@shared/navigation";
export function LayoutChat({ children }: { children: React.ReactNode }) {
return (
<div className="flex w-screen h-screen">
<div className="relative flex flex-row flex-wrap shrink-0">
<div className="relative flex flex-row shrink-0">
<MultiAccounts />
<Navigation />
</div>

5
src/app/note/components/parent.tsx
View File

@@ -37,7 +37,10 @@ export const NoteParent = memo(function NoteParent({ id }: { id: string }) {
</div>
</div>
)}
<NoteMetadata id={data.id} eventPubkey={data.pubkey} />
<NoteMetadata
id={data.event_id || data.id}
eventPubkey={data.pubkey}
/>
</div>
</>
) : (

3
src/app/note/layout.tsx
View File

@@ -1,11 +1,10 @@
import { AppHeader } from "@shared/appHeader";
import { MultiAccounts } from "@shared/multiAccounts";
import { Navigation } from "@shared/navigation";
export function LayoutNewsfeed({ children }: { children: React.ReactNode }) {
return (
<div className="flex w-screen h-screen">
<div className="relative flex flex-row flex-wrap shrink-0">
<div className="relative flex flex-row shrink-0">
<MultiAccounts />
<Navigation />
</div>

2
src/app/space/layout.tsx
View File

@@ -5,7 +5,7 @@ import { SWRConfig } from "swr";
export function LayoutSpace({ children }: { children: React.ReactNode }) {
return (
<div className="flex w-screen h-screen">
<div className="relative flex flex-row flex-wrap shrink-0">
<div className="relative flex flex-row shrink-0">
<MultiAccounts />
<Navigation />
</div>

83
src/shared/accounts/active.tsx
View File

@@ -4,7 +4,6 @@ import { useActiveAccount } from "@stores/accounts";
import { useChannels } from "@stores/channels";
import { useChatMessages, useChats } from "@stores/chats";
import { DEFAULT_AVATAR } from "@stores/constants";
import { usePageContext } from "@utils/hooks/usePageContext";
import { useProfile } from "@utils/hooks/useProfile";
import { sendNativeNotification } from "@utils/notification";
import { useContext } from "react";
@@ -12,14 +11,6 @@ import useSWRSubscription from "swr/subscription";
export function ActiveAccount({ data }: { data: any }) {
const ndk = useContext(RelayContext);
const account = useActiveAccount((state: any) => state.account);
const pageContext = usePageContext();
const pathname: any = pageContext.urlParsed.pathname;
const isChatPage = pathname.includes("/chat");
const isChannelPage = pathname.includes("/channel");
// const notSpacePage = pathnames.includes("/space") ? false : true;
const lastLogin = useActiveAccount((state: any) => state.lastLogin);
const notifyChat = useChats((state: any) => state.add);
@@ -28,46 +19,46 @@ export function ActiveAccount({ data }: { data: any }) {
const { user } = useProfile(data.pubkey);
useSWRSubscription(
user && lastLogin > 0 ? ["activeAccount", data.pubkey] : null,
() => {
const follows = JSON.parse(account.follows);
// subscribe to channel
const sub = ndk.subscribe({
useSWRSubscription(user ? ["activeAccount", data.pubkey] : null, () => {
const since = lastLogin > 0 ? lastLogin : Math.floor(Date.now() / 1000);
// subscribe to channel
const sub = ndk.subscribe(
{
kinds: [4, 42],
"#p": [data.pubkey],
since: lastLogin,
});
since: since,
},
{
closeOnEose: false,
},
);
sub.addListener("event", (event) => {
switch (event.kind) {
case 4:
if (!isChatPage) {
// save
saveChat(data.pubkey, event);
// update state
notifyChat(event.pubkey);
// send native notifiation
sendNativeNotification("You've received new message");
}
break;
case 42:
if (!isChannelPage) {
// update state
notifyChannel(event);
// send native notifiation
sendNativeNotification(event.content);
}
break;
default:
break;
}
});
sub.addListener("event", (event) => {
console.log(event);
switch (event.kind) {
case 4:
// save
saveChat(data.pubkey, event);
// update state
notifyChat(event.pubkey);
// send native notifiation
sendNativeNotification("You've received new message");
break;
case 42:
// update state
notifyChannel(event);
// send native notifiation
sendNativeNotification(event.content);
break;
default:
break;
}
});
return () => {
sub.stop();
};
},
);
return () => {
sub.stop();
};
});
return (
<button type="button" className="relative h-11 w-11 overflow-hidden">

168
src/shared/navigation.tsx
View File

@@ -8,93 +8,95 @@ import { NavArrowDownIcon, SpaceIcon, WorldIcon } from "@shared/icons";
export function Navigation() {
return (
<div className="flex w-[232px] h-full flex-col gap-3 border-r border-zinc-900">
<div className="flex w-[232px] flex-col gap-3 border-r border-zinc-900">
<AppHeader />
<div className="flex h-8 px-3.5">
<ComposerModal />
</div>
{/* Newsfeed */}
<div className="flex flex-col gap-0.5 px-1.5">
<div className="px-2.5">
<h3 className="text-[11px] font-bold uppercase tracking-widest text-zinc-600">
Feeds
</h3>
<div className="flex flex-col gap-3 h-full overflow-y-auto scrollbar-hide">
<div className="inlin-lflex h-8 px-3.5">
<ComposerModal />
</div>
<div className="flex flex-col gap-1">
<ActiveLink
href="/app/space"
className="flex h-8 items-center gap-2.5 rounded-md px-2.5 text-zinc-200 hover:text-white"
activeClassName="bg-zinc-900/50 hover:bg-zinc-900"
>
<span className="inline-flex h-5 w-5 items-center justify-center rounded bg-zinc-900">
<SpaceIcon width={12} height={12} className="text-white" />
</span>
<span className="font-medium">Space</span>
</ActiveLink>
<ActiveLink
href="/app/trending"
className="flex h-8 items-center gap-2.5 rounded-md px-2.5 text-zinc-200 hover:text-white"
activeClassName="bg-zinc-900/50 hover:bg-zinc-900"
>
<span className="inline-flex h-5 w-5 items-center justify-center rounded bg-zinc-900">
<WorldIcon width={12} height={12} className="text-white" />
</span>
<span className="font-medium">Trending</span>
</ActiveLink>
{/* Newsfeed */}
<div className="flex flex-col gap-0.5 px-1.5">
<div className="px-2.5">
<h3 className="text-[11px] font-bold uppercase tracking-widest text-zinc-600">
Feeds
</h3>
</div>
<div className="flex flex-col gap-1">
<ActiveLink
href="/app/space"
className="flex h-8 items-center gap-2.5 rounded-md px-2.5 text-zinc-200 hover:text-white"
activeClassName="bg-zinc-900/50 hover:bg-zinc-900"
>
<span className="inline-flex h-5 w-5 items-center justify-center rounded bg-zinc-900">
<SpaceIcon width={12} height={12} className="text-white" />
</span>
<span className="font-medium">Space</span>
</ActiveLink>
<ActiveLink
href="/app/trending"
className="flex h-8 items-center gap-2.5 rounded-md px-2.5 text-zinc-200 hover:text-white"
activeClassName="bg-zinc-900/50 hover:bg-zinc-900"
>
<span className="inline-flex h-5 w-5 items-center justify-center rounded bg-zinc-900">
<WorldIcon width={12} height={12} className="text-white" />
</span>
<span className="font-medium">Trending</span>
</ActiveLink>
</div>
</div>
{/* Channels */}
<Disclosure defaultOpen={true}>
{({ open }) => (
<div className="flex flex-col gap-0.5 px-1.5">
<Disclosure.Button className="flex items-center gap-1 px-2.5">
<div
className={`inline-flex h-5 w-5 transform items-center justify-center transition-transform duration-150 ease-in-out ${
open ? "" : "rotate-180"
}`}
>
<NavArrowDownIcon
width={12}
height={12}
className="text-zinc-700"
/>
</div>
<h3 className="text-[11px] font-bold uppercase tracking-widest text-zinc-600">
Channels
</h3>
</Disclosure.Button>
<Disclosure.Panel>
<ChannelsList />
</Disclosure.Panel>
</div>
)}
</Disclosure>
{/* Chats */}
<Disclosure defaultOpen={true}>
{({ open }) => (
<div className="flex flex-col gap-0.5 px-1.5">
<Disclosure.Button className="flex items-center gap-1 px-2.5">
<div
className={`inline-flex h-5 w-5 transform items-center justify-center transition-transform duration-150 ease-in-out ${
open ? "" : "rotate-180"
}`}
>
<NavArrowDownIcon
width={12}
height={12}
className="text-zinc-700"
/>
</div>
<h3 className="text-[11px] font-bold uppercase tracking-widest text-zinc-600">
Chats
</h3>
</Disclosure.Button>
<Disclosure.Panel>
<ChatsList />
</Disclosure.Panel>
</div>
)}
</Disclosure>
</div>
{/* Channels */}
<Disclosure defaultOpen={true}>
{({ open }) => (
<div className="flex flex-col gap-0.5 px-1.5">
<Disclosure.Button className="flex items-center gap-1 px-2.5">
<div
className={`inline-flex h-5 w-5 transform items-center justify-center transition-transform duration-150 ease-in-out ${
open ? "" : "rotate-180"
}`}
>
<NavArrowDownIcon
width={12}
height={12}
className="text-zinc-700"
/>
</div>
<h3 className="text-[11px] font-bold uppercase tracking-widest text-zinc-600">
Channels
</h3>
</Disclosure.Button>
<Disclosure.Panel>
<ChannelsList />
</Disclosure.Panel>
</div>
)}
</Disclosure>
{/* Chats */}
<Disclosure defaultOpen={true}>
{({ open }) => (
<div className="flex flex-col gap-0.5 px-1.5">
<Disclosure.Button className="flex items-center gap-1 px-2.5">
<div
className={`inline-flex h-5 w-5 transform items-center justify-center transition-transform duration-150 ease-in-out ${
open ? "" : "rotate-180"
}`}
>
<NavArrowDownIcon
width={12}
height={12}
className="text-zinc-700"
/>
</div>
<h3 className="text-[11px] font-bold uppercase tracking-widest text-zinc-600">
Chats
</h3>
</Disclosure.Button>
<Disclosure.Panel>
<ChatsList />
</Disclosure.Panel>
</div>
)}
</Disclosure>
</div>
);
}

2
src/utils/hooks/useProfile.tsx
View File

@@ -33,7 +33,7 @@ export function useProfile(key: string) {
const { data, error, isLoading } = useSWR(["profile", ndk, key], fetcher, {
revalidateIfStale: false,
revalidateOnFocus: false,
revalidateOnReconnect: true,
revalidateOnReconnect: false,
});
return {