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

feat: polish

Browse Source
This commit is contained in:
reya
2024-01-18 07:37:40 +07:00
parent 47800bd2ff
commit d13e7b3ef6
15 changed files with 146 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/ark/src/ark.ts
View File

@@ -109,6 +109,7 @@ export class Ark {
.replace("nostr:", "")
.split("'")[0]
.split(".")[0]
.split(",")[0]
.split("?")[0];
if (

2
packages/ark/src/components/note/primitives/repost.tsx
View File

@@ -99,7 +99,7 @@ export function RepostNote({
<Note.Content />
<div className="flex items-center justify-between h-14">
<Note.Pin />
<div className="inline-flex items-center gap-10">
<div className="inline-flex items-center gap-4">
<Note.Reply />
<Note.Repost />
<Note.Zap />

2
packages/ark/src/components/note/primitives/text.tsx
View File

@@ -22,7 +22,7 @@ export function TextNote({
<Note.Content className="min-w-0 px-3" />
<div className="flex items-center justify-between px-3 h-14">
<Note.Pin />
<div className="inline-flex items-center gap-10">
<div className="inline-flex items-center gap-4">
<Note.Reply />
<Note.Repost />
<Note.Zap />

28
packages/ark/src/components/user/cover.tsx Normal file
View File

@@ -0,0 +1,28 @@
import { cn } from "@lume/utils";
import { useUserContext } from "./provider";
export function UserCover({ className }: { className?: string }) {
const user = useUserContext();
if (!user) {
return (
<div
className={cn(
"animate-pulse bg-neutral-300 dark:bg-neutral-700",
className,
)}
/>
);
}
return (
<img
src={user.banner || user.cover}
alt="banner"
loading="lazy"
decoding="async"
style={{ contentVisibility: "auto" }}
className={cn("object-cover", className)}
/>
);
}

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

@@ -1,5 +1,6 @@
import { UserAbout } from "./about";
import { UserAvatar } from "./avatar";
import { UserCover } from "./cover";
import { UserFollowButton } from "./followButton";
import { UserName } from "./name";
import { UserNip05 } from "./nip05";
@@ -11,6 +12,7 @@ export const User = {
Provider: UserProvider,
Root: UserRoot,
Avatar: UserAvatar,
Cover: UserCover,
Name: UserName,
NIP05: UserNip05,
Time: UserTime,

2
packages/ndk-cache-tauri/index.ts
View File

@@ -394,7 +394,7 @@ export class NDKCacheAdapterTauri implements NDKCacheAdapter {
const events = await this.#storage.getCacheEvents(eventIds);
for (const event of events) {
let rawEvent;
let rawEvent: NostrEvent;
try {
rawEvent = JSON.parse(event.event);

2
packages/ui/src/account/active.tsx
View File

@@ -24,7 +24,7 @@ export function ActiveAccount() {
return (
<DropdownMenu.Root>
<DropdownMenu.Trigger asChild>
<div>
<div className="relative">
<Avatar.Root>
<Avatar.Image
src={user?.picture || user?.image}

32
packages/ui/src/account/more.tsx
View File

@@ -1,32 +0,0 @@
import { HorizontalDotsIcon } from "@lume/icons";
import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
import { Link } from "react-router-dom";
import { Logout } from "./logout";
export function AccountMoreActions() {
return (
<DropdownMenu.Root>
<DropdownMenu.Trigger asChild>
<button
type="button"
className="inline-flex items-center justify-center rounded-md"
>
<HorizontalDotsIcon className="h-4 w-4" />
</button>
</DropdownMenu.Trigger>
<DropdownMenu.Portal>
<DropdownMenu.Content className="ml-2 flex w-[200px] flex-col overflow-hidden rounded-xl bg-blue-500 p-2 focus:outline-none">
<DropdownMenu.Item asChild>
<Link
to="/settings/"
className="inline-flex h-10 items-center rounded-lg px-2 text-sm font-medium text-white hover:bg-blue-600 focus:outline-none"
>
Settings
</Link>
</DropdownMenu.Item>
<Logout />
</DropdownMenu.Content>
</DropdownMenu.Portal>
</DropdownMenu.Root>
);
}

4
packages/ui/src/index.ts
View File

@@ -1,9 +1,6 @@
export * from "./account/active";
export * from "./account/logout";
export * from "./account/more";
export * from "./navigation";
export * from "./nip05";
export * from "./user";
export * from "./titlebar";
export * from "./layouts/app";
export * from "./layouts/auth";
@@ -15,3 +12,4 @@ export * from "./emptyFeed";
export * from "./routes/event";
export * from "./routes/user";
export * from "./translateRegisterModal";
export * from "./user";

7
packages/ui/src/onboarding/finish.tsx
View File

@@ -15,12 +15,7 @@ export function OnboardingFinishScreen() {
const finish = async () => {
setLoading(true);
const queryCache = queryClient.getQueryCache();
const queryKeys = queryCache.getAll().map((cache) => cache.queryKey);
for (const key of queryKeys) {
await queryClient.refetchQueries({ queryKey: key });
}
await queryClient.refetchQueries({ queryKey: ["timeline-9999"] });
setLoading(false);
setOnboarding(false);

44
packages/ui/src/onboarding/follow.tsx
View File

@@ -1,4 +1,4 @@
import { useArk } from "@lume/ark";
import { User, useArk } from "@lume/ark";
import {
ArrowLeftIcon,
CancelIcon,
@@ -14,7 +14,6 @@ import { nip19 } from "nostr-tools";
import { useState } from "react";
import { useNavigate } from "react-router-dom";
import { toast } from "sonner";
import { User } from "../user";
const POPULAR_USERS = [
"npub180cvv07tjdrrgpa0j7j7tmnyl2yr6yr7l8j4s3evf6u64th6gkwsyjh6w6",
@@ -66,6 +65,7 @@ export function OnboardingFollowScreen() {
const submit = async () => {
try {
setLoading(true);
if (!follows.length) return navigate("/finish");
const publish = await ark.newContactList({
@@ -118,7 +118,18 @@ export function OnboardingFollowScreen() {
key={pubkey}
className="flex h-max w-full shrink-0 flex-col my-3 gap-4 overflow-hidden rounded-lg bg-white dark:bg-black"
>
<User pubkey={pubkey} variant="large" />
<User.Provider pubkey={pubkey}>
<User.Root>
<User.Cover className="h-20 w-full rounded-t-lg" />
<div className="flex h-full w-full flex-col gap-2.5 px-3 -mt-6">
<User.Avatar className="size-10 shrink-0 rounded-lg" />
<div className="flex flex-col items-start text-start">
<User.Name className="max-w-[15rem] truncate text-lg font-semibold leadning-tight" />
<User.About className="break-p text-neutral-700 dark:text-neutral-600 max-w-none select-text whitespace-pre-line" />
</div>
</div>
</User.Root>
</User.Provider>
<div className="h-16 shrink-0 px-3 flex items-center border-t border-neutral-100 dark:border-neutral-900">
<button
type="button"
@@ -172,7 +183,18 @@ export function OnboardingFollowScreen() {
key={item.pubkey}
className="flex h-max w-full shrink-0 flex-col my-3 gap-4 overflow-hidden rounded-lg bg-white dark:bg-black"
>
<User pubkey={item.pubkey} variant="large" />
<User.Provider pubkey={item.pubkey}>
<User.Root>
<User.Cover className="h-20 w-full rounded-t-lg" />
<div className="flex h-full w-full flex-col gap-2.5 px-3 -mt-6">
<User.Avatar className="size-10 shrink-0 rounded-lg" />
<div className="flex flex-col items-start text-start">
<User.Name className="max-w-[15rem] truncate text-lg font-semibold leadning-tight" />
<User.About className="break-p text-neutral-700 dark:text-neutral-600 max-w-none select-text whitespace-pre-line" />
</div>
</div>
</User.Root>
</User.Provider>
<div className="h-16 shrink-0 px-3 flex items-center border-t border-neutral-100 dark:border-neutral-900">
<button
type="button"
@@ -196,6 +218,7 @@ export function OnboardingFollowScreen() {
</>
)}
</button>
UU
</div>
</div>
))
@@ -218,7 +241,18 @@ export function OnboardingFollowScreen() {
key={pubkey}
className="flex h-max w-full shrink-0 flex-col my-3 gap-4 overflow-hidden rounded-lg bg-white dark:bg-black"
>
<User pubkey={pubkey} variant="large" />
<User.Provider pubkey={pubkey}>
<User.Root>
<User.Cover className="h-20 w-full rounded-t-lg" />
<div className="flex h-full w-full flex-col gap-2.5 px-3 -mt-6">
<User.Avatar className="size-10 shrink-0 rounded-lg" />
<div className="flex flex-col items-start text-start">
<User.Name className="max-w-[15rem] truncate text-lg font-semibold leadning-tight" />
<User.About className="break-p text-neutral-700 dark:text-neutral-600 max-w-none select-text whitespace-pre-line" />
</div>
</div>
</User.Root>
</User.Provider>
<div className="h-16 shrink-0 px-3 flex items-center border-t border-neutral-100 dark:border-neutral-900">
<button
type="button"

2
packages/ui/src/onboarding/profileSettings.tsx
View File

@@ -43,8 +43,8 @@ export function OnboardingProfileSettingsScreen() {
nip05: oldProfile?.nip05 || "",
display_name: data.name,
bio: data.about,
image: picture,
picture: picture,
avatar: picture,
};
const publish = await ark.createEvent({

4
packages/ui/src/replyList.tsx
View File

@@ -60,11 +60,11 @@ export function ReplyList({
className="py-4 border-t border-neutral-100 dark:border-neutral-900"
/>
{!data ? (
<div className="pt-4 flex h-16 items-center justify-center rounded-xl bg-neutral-50 p-3 dark:bg-neutral-950">
<div className="mt-4 flex h-16 items-center justify-center p-3">
<LoaderIcon className="h-5 w-5 animate-spin" />
</div>
) : data.length === 0 ? (
<div className="pt-4 flex w-full items-center justify-center bg-neutral-50 dark:bg-neutral-950 rounded-lg">
<div className="mt-4 flex w-full items-center justify-center">
<div className="flex flex-col items-center justify-center gap-2 py-6">
<h3 className="text-3xl">👋</h3>
<p className="leading-none text-neutral-600 dark:text-neutral-400">