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

chore: clean up

Browse Source
This commit is contained in:
reya
2024-04-03 07:29:46 +07:00
parent 89bb8d88f6
commit 763cb10e85
42 changed files with 104 additions and 532 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/ark/src/context.ts
View File

@@ -1,4 +0,0 @@
import { createContext } from "react";
import { type Ark } from "./ark";
export const ArkContext = createContext<Ark | null>(undefined);

10
packages/ark/src/hooks/useArk.ts
View File

@@ -1,10 +0,0 @@
import { useContext } from "react";
import { ArkContext } from "../context";
export const useArk = () => {
const context = useContext(ArkContext);
if (context === undefined) {
throw new Error("useArk must be used within an ArkProvider");
}
return context;
};

11
packages/ark/src/hooks/useEvent.ts
View File

@@ -1,13 +1,18 @@
import { Event } from "@lume/types";
import { useQuery } from "@tanstack/react-query";
import { useArk } from "./useArk";
import { invoke } from "@tauri-apps/api/core";
export function useEvent(id: string) {
const ark = useArk();
const { isLoading, isError, data } = useQuery({
queryKey: ["event", id],
queryFn: async () => {
try {
const event = await ark.get_event(id);
const eventId: string = id
.replace("nostr:", "")
.split("'")[0]
.split(".")[0];
const cmd: string = await invoke("get_event", { id: eventId });
const event: Event = JSON.parse(cmd);
return event;
} catch (e) {
throw new Error(e);

48
packages/ark/src/hooks/useEvents.ts
View File

@@ -1,48 +0,0 @@
import { useInfiniteQuery } from "@tanstack/react-query";
import { useArk } from "./useArk";
const FETCH_LIMIT = 20;
const QUERY_KEY = "local";
const DEDUP = true;
export function useEvents(key: string, account?: string) {
const ark = useArk();
const {
data,
isError,
isLoading,
isRefetching,
isFetchingNextPage,
hasNextPage,
fetchNextPage,
} = useInfiniteQuery({
queryKey: [key, account],
initialPageParam: 0,
queryFn: async ({ pageParam }: { pageParam: number }) => {
const events = await ark.get_events(
QUERY_KEY,
FETCH_LIMIT,
pageParam,
DEDUP,
);
return events;
},
getNextPageParam: (lastPage) => {
const lastEvent = lastPage?.at(-1);
if (!lastEvent) return;
return lastEvent.created_at - 1;
},
select: (data) => data?.pages.flatMap((page) => page),
refetchOnWindowFocus: false,
});
return {
data,
isError,
isLoading,
isRefetching,
isFetchingNextPage,
hasNextPage,
fetchNextPage,
};
}

14
packages/ark/src/hooks/useProfile.ts
View File

@@ -1,8 +1,8 @@
import { useQuery } from "@tanstack/react-query";
import { useArk } from "./useArk";
import { Metadata } from "@lume/types";
import { invoke } from "@tauri-apps/api/core";
export function useProfile(pubkey: string) {
const ark = useArk();
const {
isLoading,
isError,
@@ -11,8 +11,14 @@ export function useProfile(pubkey: string) {
queryKey: ["user", pubkey],
queryFn: async () => {
try {
const profile = await ark.get_profile(pubkey);
return profile;
const id = pubkey
.replace("nostr:", "")
.split("'")[0]
.split(".")[0]
.split(",")[0]
.split("?")[0];
const cmd: Metadata = await invoke("get_profile", { id });
return cmd;
} catch (e) {
throw new Error(e);
}

2
packages/ark/src/index.ts
View File

@@ -1,6 +1,4 @@
export * from "./ark";
export * from "./context";
export * from "./hooks/useArk";
export * from "./hooks/useEvent";
export * from "./hooks/useEvents";
export * from "./hooks/useProfile";

53
packages/ui/src/note/appHandler.tsx
View File

@@ -1,53 +0,0 @@
import { useArk } from "@lume/ark";
import { useQuery } from "@tanstack/react-query";
export function AppHandler({ tag }: { tag: string[] }) {
const ark = useArk();
const { isLoading, isError, data } = useQuery({
queryKey: ["app-handler", tag[1]],
queryFn: async () => {
const ref = tag[1].split(":");
const event = await ark.getEventByFilter({
filter: {
kinds: [Number(ref[0])],
authors: [ref[1]],
"#d": [ref[2]],
},
});
if (!event) return null;
const app = NDKAppHandlerEvent.from(event);
return await app.fetchProfile();
},
refetchOnWindowFocus: false,
});
if (isLoading) {
<div>Loading...</div>;
}
if (isError || !data) {
return <div>Error</div>;
}
return (
<div className="flex items-center gap-2 rounded-md bg-neutral-200 p-2 hover:ring-1 hover:ring-blue-500 dark:bg-neutral-800">
<img
src={data?.picture || data?.image}
alt={data.pubkey}
decoding="async"
className="h-9 w-9 shrink-0 rounded-lg bg-white object-cover ring-1 ring-neutral-200/50 dark:ring-neutral-800/50"
/>
<div className="flex flex-col">
<div className="max-w-[15rem] truncate font-semibold text-neutral-950 dark:text-neutral-50">
{data.name}
</div>
<div className="line-clamp-1 text-sm text-neutral-600 dark:text-neutral-400">
{data.about}
</div>
</div>
</div>
);
}

8
packages/ui/src/note/buttons/downvote.tsx
View File

@@ -1,13 +1,13 @@
import { ArrowDownIcon, ArrowUpIcon, LoaderIcon } from "@lume/icons";
import { ArrowDownIcon, LoaderIcon } from "@lume/icons";
import { useState } from "react";
import { useNoteContext } from "../provider";
import { useArk } from "@lume/ark";
import { cn } from "@lume/utils";
import * as Tooltip from "@radix-ui/react-tooltip";
import { useTranslation } from "react-i18next";
import { useRouteContext } from "@tanstack/react-router";
export function NoteDownvote() {
const ark = useArk();
const ark = useRouteContext({ strict: false });
const event = useNoteContext();
const [t] = useTranslation();
@@ -48,7 +48,7 @@ export function NoteDownvote() {
</button>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade inline-flex h-7 select-none items-center justify-center rounded-md bg-neutral-950 px-3.5 text-sm text-neutral-50 will-change-[transform,opacity] dark:bg-neutral-50 dark:text-neutral-950">
<Tooltip.Content className="inline-flex h-7 select-none items-center justify-center rounded-md bg-neutral-950 px-3.5 text-sm text-neutral-50 will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade dark:bg-neutral-50 dark:text-neutral-950">
{t("note.buttons.downvote")}
<Tooltip.Arrow className="fill-neutral-950 dark:fill-neutral-50" />
</Tooltip.Content>

6
packages/ui/src/note/buttons/reply.tsx
View File

@@ -2,12 +2,12 @@ import { ReplyIcon } from "@lume/icons";
import * as Tooltip from "@radix-ui/react-tooltip";
import { useTranslation } from "react-i18next";
import { useNoteContext } from "../provider";
import { useArk } from "@lume/ark";
import { useRouteContext } from "@tanstack/react-router";
export function NoteReply() {
const ark = useArk();
const event = useNoteContext();
const { ark } = useRouteContext({ strict: false });
const { t } = useTranslation();
return (
@@ -23,7 +23,7 @@ export function NoteReply() {
</button>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade inline-flex h-7 select-none items-center justify-center rounded-md bg-neutral-950 px-3.5 text-sm text-neutral-50 will-change-[transform,opacity] dark:bg-neutral-50 dark:text-neutral-950">
<Tooltip.Content className="inline-flex h-7 select-none items-center justify-center rounded-md bg-neutral-950 px-3.5 text-sm text-neutral-50 will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade dark:bg-neutral-50 dark:text-neutral-950">
{t("note.menu.viewThread")}
<Tooltip.Arrow className="fill-neutral-950 dark:fill-neutral-50" />
</Tooltip.Content>

8
packages/ui/src/note/buttons/repost.tsx
View File

@@ -1,4 +1,4 @@
import { LoaderIcon, QuoteIcon, ReplyIcon, RepostIcon } from "@lume/icons";
import { LoaderIcon, QuoteIcon, RepostIcon } from "@lume/icons";
import { cn } from "@lume/utils";
import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
import * as Tooltip from "@radix-ui/react-tooltip";
@@ -6,10 +6,10 @@ import { useState } from "react";
import { useTranslation } from "react-i18next";
import { toast } from "sonner";
import { useNoteContext } from "../provider";
import { useArk } from "@lume/ark";
import { useRouteContext } from "@tanstack/react-router";
export function NoteRepost() {
const ark = useArk();
const { ark } = useRouteContext({ strict: false });
const event = useNoteContext();
const [t] = useTranslation();
@@ -59,7 +59,7 @@ export function NoteRepost() {
</Tooltip.Trigger>
</DropdownMenu.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade inline-flex h-7 select-none items-center justify-center rounded-md bg-neutral-950 px-3.5 text-sm text-neutral-50 will-change-[transform,opacity] dark:bg-neutral-50 dark:text-neutral-950">
<Tooltip.Content className="inline-flex h-7 select-none items-center justify-center rounded-md bg-neutral-950 px-3.5 text-sm text-neutral-50 will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade dark:bg-neutral-50 dark:text-neutral-950">
{t("note.buttons.repost")}
<Tooltip.Arrow className="fill-neutral-950 dark:fill-neutral-50" />
</Tooltip.Content>

6
packages/ui/src/note/buttons/upvote.tsx
View File

@@ -1,13 +1,13 @@
import { ArrowUpIcon, LoaderIcon } from "@lume/icons";
import { useState } from "react";
import { useNoteContext } from "../provider";
import { useArk } from "@lume/ark";
import { cn } from "@lume/utils";
import * as Tooltip from "@radix-ui/react-tooltip";
import { useTranslation } from "react-i18next";
import { useRouteContext } from "@tanstack/react-router";
export function NoteUpvote() {
const ark = useArk();
const { ark } = useRouteContext({ strict: false });
const event = useNoteContext();
const [t] = useTranslation();
@@ -48,7 +48,7 @@ export function NoteUpvote() {
</button>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade inline-flex h-7 select-none items-center justify-center rounded-md bg-neutral-950 px-3.5 text-sm text-neutral-50 will-change-[transform,opacity] dark:bg-neutral-50 dark:text-neutral-950">
<Tooltip.Content className="inline-flex h-7 select-none items-center justify-center rounded-md bg-neutral-950 px-3.5 text-sm text-neutral-50 will-change-[transform,opacity] data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade dark:bg-neutral-50 dark:text-neutral-950">
{t("note.buttons.upvote")}
<Tooltip.Arrow className="fill-neutral-950 dark:fill-neutral-50" />
</Tooltip.Content>

6
packages/ui/src/note/buttons/zap.tsx
View File

@@ -1,13 +1,11 @@
import { useArk } from "@lume/ark";
import { ZapIcon } from "@lume/icons";
import { toast } from "sonner";
import { useNoteContext } from "../provider";
import { useSearch } from "@tanstack/react-router";
import { useRouteContext, useSearch } from "@tanstack/react-router";
export function NoteZap() {
const ark = useArk();
const event = useNoteContext();
const { ark } = useRouteContext({ strict: false });
const { account } = useSearch({ strict: false });
const zap = async () => {

5
packages/ui/src/note/content.tsx
View File

@@ -7,7 +7,6 @@ import {
VIDEOS,
cn,
} from "@lume/utils";
import { NIP89 } from "./nip89";
import { useNoteContext } from "./provider";
import { ReactNode, useMemo } from "react";
import { nanoid } from "nanoid";
@@ -136,10 +135,6 @@ export function NoteContent({
}
}, []);
if (event.kind !== Kind.Text) {
return <NIP89 className={className} />;
}
return (
<div className={cn("select-text", className)}>
<div className="content-break whitespace-pre-line text-balance leading-normal">

6
packages/ui/src/note/mentions/note.tsx
View File

@@ -1,7 +1,8 @@
import { useTranslation } from "react-i18next";
import { User } from "../../user";
import { useArk, useEvent } from "@lume/ark";
import { useEvent } from "@lume/ark";
import { LinkIcon } from "@lume/icons";
import { useRouteContext } from "@tanstack/react-router";
export function MentionNote({
eventId,
@@ -10,8 +11,7 @@ export function MentionNote({
eventId: string;
openable?: boolean;
}) {
const ark = useArk();
const { ark } = useRouteContext({ strict: false });
const { t } = useTranslation();
const { isLoading, isError, data } = useEvent(eventId);

5
packages/ui/src/note/mentions/user.tsx
View File

@@ -1,8 +1,9 @@
import { useArk, useProfile } from "@lume/ark";
import { useProfile } from "@lume/ark";
import { displayNpub } from "@lume/utils";
import { useRouteContext } from "@tanstack/react-router";
export function MentionUser({ pubkey }: { pubkey: string }) {
const ark = useArk();
const { ark } = useRouteContext({ strict: false });
const { isLoading, isError, profile } = useProfile(pubkey);
return (

4
packages/ui/src/note/menu.tsx
View File

@@ -3,13 +3,13 @@ import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
import { writeText } from "@tauri-apps/plugin-clipboard-manager";
import { useTranslation } from "react-i18next";
import { useNoteContext } from "./provider";
import { useArk } from "@lume/ark";
import { toast } from "sonner";
import { useRouteContext } from "@tanstack/react-router";
export function NoteMenu() {
const ark = useArk();
const event = useNoteContext();
const { ark } = useRouteContext({ strict: false });
const { t } = useTranslation();
const copyID = async () => {

55
packages/ui/src/note/nip89.tsx
View File

@@ -1,55 +0,0 @@
import { useQuery } from "@tanstack/react-query";
import { useTranslation } from "react-i18next";
import { AppHandler } from "./appHandler";
import { useNoteContext } from "./provider";
import { useArk } from "@lume/ark";
export function NIP89({ className }: { className?: string }) {
const ark = useArk();
const event = useNoteContext();
const { t } = useTranslation();
const { isLoading, isError, data } = useQuery({
queryKey: ["app-recommend", event.id],
queryFn: () => {
return ark.getAppRecommend({
unknownKind: event.kind.toString(),
author: event.pubkey,
});
},
refetchOnWindowFocus: false,
refetchOnMount: false,
staleTime: Infinity,
});
if (isLoading) {
<div>Loading...</div>;
}
if (isError || !data) {
return <div>Error</div>;
}
return (
<div className={className}>
<div className="flex flex-col rounded-lg bg-neutral-100 dark:bg-neutral-900">
<div className="inline-flex h-10 shrink-0 items-center justify-between border-b border-neutral-200 px-3 dark:border-neutral-800">
<p className="text-sm font-medium text-amber-400">
{t("nip89.unsupported")}
</p>
<p className="text-sm text-neutral-600 dark:text-neutral-400">
{event.kind}
</p>
</div>
<div className="flex flex-1 flex-col gap-2 px-3 py-3">
<span className="text-sm font-medium uppercase text-neutral-600 dark:text-neutral-400">
{t("nip89.openWith")}
</span>
{data.map((item) => (
<AppHandler key={item[1]} tag={item} />
))}
</div>
</div>
</div>
);
}

5
packages/ui/src/note/primitives/repost.tsx
View File

@@ -5,7 +5,7 @@ import { useQuery } from "@tanstack/react-query";
import { useTranslation } from "react-i18next";
import { Note } from "..";
import { User } from "../../user";
import { useArk } from "@lume/ark";
import { useRouteContext } from "@tanstack/react-router";
export function RepostNote({
event,
@@ -14,8 +14,7 @@ export function RepostNote({
event: Event;
className?: string;
}) {
const ark = useArk();
const { ark } = useRouteContext({ strict: false });
const { t } = useTranslation();
const {
isLoading,

4
packages/ui/src/note/thread.tsx
View File

@@ -2,11 +2,11 @@ import { cn } from "@lume/utils";
import { useTranslation } from "react-i18next";
import { Note } from ".";
import { useNoteContext } from "./provider";
import { useArk } from "@lume/ark";
import { LinkIcon } from "@lume/icons";
import { useRouteContext } from "@tanstack/react-router";
export function NoteThread({ className }: { className?: string }) {
const ark = useArk();
const { ark } = useRouteContext({ strict: false });
const event = useNoteContext();
const thread = ark.parse_event_thread({
content: event.content,

6
packages/ui/src/note/user.tsx
View File

@@ -2,10 +2,10 @@ import { cn } from "@lume/utils";
import * as HoverCard from "@radix-ui/react-hover-card";
import { User } from "../user";
import { useNoteContext } from "./provider";
import { useArk } from "@lume/ark";
import { useRouteContext } from "@tanstack/react-router";
export function NoteUser({ className }: { className?: string }) {
const ark = useArk();
const { ark } = useRouteContext({ strict: false });
const event = useNoteContext();
return (
@@ -32,7 +32,7 @@ export function NoteUser({ className }: { className?: string }) {
</User.Root>
<HoverCard.Portal>
<HoverCard.Content
className="data-[side=bottom]:animate-slideUpAndFade w-[300px] rounded-xl bg-black p-3 data-[state=open]:transition-all dark:bg-white dark:shadow-none"
className="w-[300px] rounded-xl bg-black p-3 data-[side=bottom]:animate-slideUpAndFade data-[state=open]:transition-all dark:bg-white dark:shadow-none"
sideOffset={5}
>
<div className="flex flex-col gap-2">

4
packages/ui/src/user/followButton.tsx
View File

@@ -1,12 +1,12 @@
import { useArk } from "@lume/ark";
import { LoaderIcon } from "@lume/icons";
import { cn } from "@lume/utils";
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { useUserContext } from "./provider";
import { useRouteContext } from "@tanstack/react-router";
export function UserFollowButton({ className }: { className?: string }) {
const ark = useArk();
const { ark } = useRouteContext({ strict: false });
const user = useUserContext();
const [t] = useTranslation();

4
packages/ui/src/user/nip05.tsx
View File

@@ -2,12 +2,12 @@ import { VerifiedIcon } from "@lume/icons";
import { cn, displayLongHandle, displayNpub } from "@lume/utils";
import { useQuery } from "@tanstack/react-query";
import { useUserContext } from "./provider";
import { useArk } from "@lume/ark";
import { useRouteContext } from "@tanstack/react-router";
export function UserNip05({ className }: { className?: string }) {
const ark = useArk();
const user = useUserContext();
const { ark } = useRouteContext({ strict: false });
const { isLoading, data: verified } = useQuery({
queryKey: ["nip05", user?.pubkey],
queryFn: async () => {