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

wip

Browse Source
This commit is contained in:
Ren Amamiya
2023-10-09 15:17:15 +07:00
parent 140b8a47bf
commit 8930300fb5
45 changed files with 606 additions and 740 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -55,17 +55,17 @@ export function ActiveAccount() {
}
return (
<div className="flex flex-col gap-1">
<div className="flex flex-col gap-1 rounded-lg bg-zinc-100 p-1 hover:bg-zinc-200 dark:bg-zinc-900 dark:hover:bg-zinc-800">
<Link to={`/users/${db.account.pubkey}`} className="relative inline-block">
<Image
src={user?.picture || user?.image}
alt={db.account.npub}
className="aspect-square h-full w-full rounded-lg"
className="aspect-square h-full w-full rounded-md"
/>
<span className="absolute bottom-0 right-0 block h-2 w-2 rounded-full bg-green-400 ring-2 ring-zinc-50 dark:ring-zinc-950" />
</Link>
<div className="inline-flex items-center justify-center rounded-md bg-zinc-100 hover:bg-zinc-200 dark:bg-zinc-900 dark:hover:bg-zinc-800">
<HorizontalDotsIcon className="h-5 w-5" />
<div className="inline-flex items-center justify-center rounded-md">
<HorizontalDotsIcon className="h-4 w-4" />
</div>
</div>
);

2
src/shared/composer/composer.tsx
View File

@@ -124,7 +124,7 @@ export function Composer() {
autoCorrect="off"
autoCapitalize="off"
className={twMerge(
'scrollbar-hide markdown max-h-[500px] overflow-y-auto break-all pr-2 outline-none',
'scrollbar-none markdown max-h-[500px] overflow-y-auto break-all pr-2 outline-none',
expand ? 'min-h-[500px]' : reply.id ? 'min-h-min' : 'min-h-[120px]'
)}
/>

18
src/shared/composer/modal.tsx
View File

@@ -34,21 +34,19 @@ export function ComposerModal() {
</button>
</Dialog.Trigger>
<Dialog.Portal>
<Dialog.Overlay className="fixed inset-0 z-50 bg-black/80 backdrop-blur-2xl" />
<Dialog.Overlay className="fixed inset-0 z-50 bg-white dark:bg-black" />
<Dialog.Content className="fixed inset-0 z-50 flex min-h-full items-center justify-center">
<div
className={twMerge(
'relative h-min w-full rounded-xl bg-white/10 backdrop-blur-xl',
'relative h-min w-full rounded-xl bg-zinc-100 dark:bg-zinc-900',
expand ? 'max-w-4xl' : 'max-w-2xl'
)}
>
<div className="flex items-center justify-between px-4 py-4">
<div className="flex items-center gap-2">
<ComposerUser pubkey={db.account.pubkey} />
<span>
<ChevronRightIcon className="h-4 w-4 text-white/50" />
</span>
<div className="inline-flex h-7 w-max items-center justify-center gap-0.5 rounded bg-white/10 pl-3 pr-1.5 text-sm font-medium text-white backdrop-blur-xl">
<ChevronRightIcon className="h-4 w-4 text-zinc-400 dark:text-zinc-600" />
<div className="inline-flex h-7 w-max items-center justify-center gap-0.5 rounded bg-zinc-200 pl-3 pr-1.5 text-sm font-medium text-zinc-900 dark:bg-zinc-800 dark:text-zinc-100">
New Post
<ChevronDownIcon className="h-4 w-4" />
</div>
@@ -57,12 +55,12 @@ export function ComposerModal() {
<button
type="button"
onClick={() => toggleExpand()}
className="inline-flex h-10 w-10 items-center justify-center rounded-lg backdrop-blur-xl hover:bg-white/10"
className="inline-flex h-10 w-10 items-center justify-center rounded-lg text-zinc-400 hover:bg-zinc-200 hover:text-zinc-500 dark:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-400"
>
<ExpandIcon className="h-5 w-5 text-white/50" />
<ExpandIcon className="h-5 w-5" />
</button>
<Dialog.Close className="inline-flex h-10 w-10 items-center justify-center rounded-lg backdrop-blur-xl hover:bg-white/10">
<CancelIcon className="h-5 w-5 text-white/50" />
<Dialog.Close className="inline-flex h-10 w-10 items-center justify-center rounded-lg text-zinc-400 hover:bg-zinc-200 hover:text-zinc-500 dark:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-400">
<CancelIcon className="h-5 w-5" />
</Dialog.Close>
</div>
</div>

4
src/shared/composer/user.tsx
View File

@@ -13,8 +13,8 @@ export function ComposerUser({ pubkey }: { pubkey: string }) {
alt={pubkey}
className="h-10 w-10 shrink-0 rounded-lg"
/>
<h5 className="text-base font-semibold leading-none text-white">
{user?.name || user?.display_name || user?.displayName || displayNpub(pubkey, 16)}
<h5 className="font-medium text-white">
{user?.display_name || user?.name || user?.displayName || displayNpub(pubkey, 16)}
</h5>
</div>
);

7
src/shared/icons/compose.tsx
View File

@@ -11,11 +11,8 @@ export function ComposeIcon(props: JSX.IntrinsicAttributes & SVGProps<SVGSVGElem
{...props}
>
<path
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth="1.5"
d="M21 18s-1.334 1.544-2.834 1.544-2.707-1.429-4.18-1.429c-1.472 0-2.326.671-3.236 1.635m6.957-16.293l1.836 1.836a1 1 0 010 1.414l-13.25 13.25a1 1 0 01-.707.293H2.75v-2.836a1 1 0 01.293-.707l13.25-13.25a1 1 0 011.414 0z"
fill="currentColor"
d="M19.121 3.707a3 3 0 00-4.242 0l-12 12A3 3 0 002 17.828V20a1 1 0 001 1h2.172a3 3 0 002.12-.879l12-12a3 3 0 000-4.243l-.17-.171zM21.67 18.749a7.14 7.14 0 01-.93.827c-.58.43-1.503.968-2.574.968-1.006 0-1.878-.463-2.503-.796l-.066-.035c-.723-.384-1.168-.598-1.61-.598-1.057 0-1.732.558-2.26 1.116a1 1 0 11-1.454-1.373c.654-.692 1.824-1.743 3.714-1.743.986 0 1.85.46 2.468.79l.08.042c.717.38 1.172.598 1.631.598.429 0 .923-.234 1.384-.576a5.148 5.148 0 00.694-.624 1.01 1.01 0 011.41-.102c.476.412.418 1.076.017 1.506z"
></path>
</svg>
);

10
src/shared/icons/nwc.tsx
View File

@@ -12,15 +12,7 @@ export function NwcIcon(props: JSX.IntrinsicAttributes & SVGProps<SVGSVGElement>
>
<path
fill="currentColor"
fillRule="evenodd"
d="M5.496 12.886a1 1 0 011.008 0l3 1.75A1 1 0 0110 15.5V19a1 1 0 01-.496.864l-3 1.75a1 1 0 01-1.008 0l-3-1.75A1 1 0 012 19v-3.5a1 1 0 01.496-.864l3-1.75zM4 16.074v2.352l2 1.166 2-1.166v-2.352l-2-1.166-2 1.166z"
clipRule="evenodd"
></path>
<path
fill="currentColor"
fillRule="evenodd"
d="M17 8a4 4 0 014 4v5a4 4 0 01-4 4h-5v-5.5a3 3 0 00-1.488-2.591l-3-1.75a3 3 0 00-3.024 0L3 12.027V6.5A3.5 3.5 0 016.5 3H14a3 3 0 013 3v2zM6.5 5a1.5 1.5 0 100 3H15V6a1 1 0 00-1-1H6.5zm9 11a1.5 1.5 0 100-3 1.5 1.5 0 000 3z"
clipRule="evenodd"
d="M14.002 2.401c0-1.484-1.925-2.066-2.748-.832L3.188 13.668c-.665.997.05 2.332 1.248 2.332h5.566V21.6c0 1.484 1.925 2.067 2.748.832l8.066-12.099C21.48 9.335 20.766 8 19.568 8h-5.566V2.401z"
></path>
</svg>
);

2
src/shared/layouts/auth.tsx
View File

@@ -3,7 +3,7 @@ import { WindowTitlebar } from 'tauri-controls';
export function AuthLayout() {
return (
<div className="relative h-screen w-screen">
<div className="relative h-screen w-screen bg-zinc-50 dark:bg-zinc-950">
<WindowTitlebar />
<div className="bg-zinc-50 dark:bg-zinc-950">
<Outlet />

2
src/shared/layouts/settings.tsx
View File

@@ -8,7 +8,7 @@ export function SettingsLayout() {
<div className="flex h-screen w-screen">
<div className="relative flex h-full w-[232px] flex-col">
<div data-tauri-drag-region className="h-11 w-full shrink-0" />
<div className="scrollbar-hide flex h-full flex-1 flex-col gap-2 overflow-y-auto pb-32">
<div className="scrollbar-none flex h-full flex-1 flex-col gap-2 overflow-y-auto pb-32">
<div className="inline-flex items-center gap-2 border-l-2 border-transparent pl-4">
<Link
to="/"

9
src/shared/navigation.tsx
View File

@@ -1,4 +1,4 @@
import { NavLink } from 'react-router-dom';
import { Link, NavLink } from 'react-router-dom';
import { twMerge } from 'tailwind-merge';
import { ActiveAccount } from '@shared/accounts/active';
@@ -8,6 +8,7 @@ import {
CommunityIcon,
ExploreIcon,
HomeIcon,
NwcIcon,
RelayIcon,
} from '@shared/icons';
@@ -123,6 +124,12 @@ export function Navigation() {
</div>
<div className="flex shrink-0 flex-col gap-3 p-1">
<ComposerModal />
<Link
to="/nwc"
className="flex aspect-square h-full w-full items-center justify-center rounded-lg bg-zinc-100 hover:bg-interor-600 dark:bg-zinc-900 dark:hover:bg-interor-600"
>
<NwcIcon className="h-5 w-5" />
</Link>
<ActiveAccount />
</div>
</div>

2
src/shared/widgets/global/articles.tsx
View File

@@ -67,7 +67,7 @@ export function GlobalArticlesWidget({ params }: { params: Widget }) {
</div>
</div>
) : (
<VList className="scrollbar-hide h-full">
<VList className="scrollbar-none h-full">
{data.map((item) => renderItem(item))}
<div className="h-16" />
</VList>

2
src/shared/widgets/global/files.tsx
View File

@@ -69,7 +69,7 @@ export function GlobalFilesWidget({ params }: { params: Widget }) {
</div>
</div>
) : (
<VList className="scrollbar-hide h-full">
<VList className="scrollbar-none h-full">
{data.map((item) => renderItem(item))}
<div className="h-16" />
</VList>

2
src/shared/widgets/global/hashtag.tsx
View File

@@ -99,7 +99,7 @@ export function GlobalHashtagWidget({ params }: { params: Widget }) {
</div>
</div>
) : (
<VList className="scrollbar-hide h-full">
<VList className="scrollbar-none h-full">
{data.map((item) => renderItem(item))}
<div className="h-16" />
</VList>

2
src/shared/widgets/local/articles.tsx
View File

@@ -69,7 +69,7 @@ export function LocalArticlesWidget({ params }: { params: Widget }) {
</div>
</div>
) : (
<VList className="scrollbar-hide h-full">
<VList className="scrollbar-none h-full">
{dbEvents.map((item) => renderItem(item))}
<div className="flex items-center justify-center px-3 py-1.5">
{dbEvents.length > 0 ? (

2
src/shared/widgets/local/feeds.tsx
View File

@@ -105,7 +105,7 @@ export function LocalFeedsWidget({ params }: { params: Widget }) {
</div>
</div>
) : (
<VList className="scrollbar-hide h-full">
<VList className="scrollbar-none h-full">
{dbEvents.map((item) => renderItem(item))}
<div className="flex items-center justify-center px-3 py-1.5">
{dbEvents.length > 0 ? (

2
src/shared/widgets/local/files.tsx
View File

@@ -69,7 +69,7 @@ export function LocalFilesWidget({ params }: { params: Widget }) {
</div>
</div>
) : (
<VList className="scrollbar-hide h-full">
<VList className="scrollbar-none h-full">
{dbEvents.map((item) => renderItem(item))}
<div className="flex items-center justify-center px-3 py-1.5">
{dbEvents.length > 0 ? (

2
src/shared/widgets/local/follows.tsx
View File

@@ -104,7 +104,7 @@ export function LocalFollowsWidget({ params }: { params: Widget }) {
</div>
</div>
) : (
<VList className="scrollbar-hide h-full">
<VList className="scrollbar-none h-full">
{dbEvents.map((item) => renderItem(item))}
<div className="flex items-center justify-center px-3 py-1.5">
{dbEvents.length > 0 ? (

2
src/shared/widgets/local/network.tsx
View File

@@ -113,7 +113,7 @@ export function LocalNetworkWidget() {
) : dbEvents.length === 0 ? (
<EventLoader firstTime={true} />
) : (
<VList className="scrollbar-hide h-full">
<VList className="scrollbar-none h-full">
{!isFetched ? <EventLoader firstTime={false} /> : null}
{dbEvents.map((item) => renderItem(item))}
<div className="flex items-center justify-center px-3 py-1.5">

2
src/shared/widgets/local/thread.tsx
View File

@@ -44,7 +44,7 @@ export function LocalThreadWidget({ params }: { params: Widget }) {
return (
<WidgetWrapper>
<TitleBar id={params.id} title={params.title} />
<div className="scrollbar-hide h-full overflow-y-auto">
<div className="scrollbar-none h-full overflow-y-auto">
{status === 'loading' ? (
<div className="px-3 py-1.5">
<div className="rounded-xl bg-zinc-100 px-3 py-3 dark:bg-zinc-900">

2
src/shared/widgets/local/user.tsx
View File

@@ -81,7 +81,7 @@ export function LocalUserWidget({ params }: { params: Widget }) {
return (
<WidgetWrapper>
<TitleBar id={params.id} title={params.title} />
<div className="scrollbar-hide h-full overflow-y-auto">
<div className="scrollbar-none h-full overflow-y-auto">
<div className="px-3 pt-1.5">
<UserProfile pubkey={params.content} />
</div>

2
src/shared/widgets/nostrBand/trendingAccounts.tsx
View File

@@ -57,7 +57,7 @@ export function TrendingAccountsWidget({ params }: { params: Widget }) {
</div>
</div>
) : (
<VList className="scrollbar-hide h-full">
<VList className="scrollbar-none h-full">
{data.map((item: Profile) => (
<NostrBandUserProfile key={item.pubkey} data={item} />
))}

2
src/shared/widgets/nostrBand/trendingNotes.tsx
View File

@@ -58,7 +58,7 @@ export function TrendingNotesWidget({ params }: { params: Widget }) {
</div>
</div>
) : (
<VList className="scrollbar-hide h-full">
<VList className="scrollbar-none h-full">
{data.map((item) => (
<NoteWrapper key={item.event.id} event={item.event}>
<TextNote content={item.event.content} />

2
src/shared/widgets/other/learnNostr.tsx
View File

@@ -24,7 +24,7 @@ export function LearnNostrWidget({ params }: { params: Widget }) {
return (
<WidgetWrapper>
<TitleBar id={params.id} title="The Joy of Nostr" />
<div className="scrollbar-hide h-full overflow-y-auto px-3 pb-20">
<div className="scrollbar-none h-full overflow-y-auto px-3 pb-20">
{resources.map((resource, index) => (
<div key={index} className="mb-6">
<h3 className="mb-2 text-sm font-medium text-zinc-500 dark:text-zinc-400">

2
src/shared/widgets/tmp/feeds.tsx
View File

@@ -56,7 +56,7 @@ export function XfeedsWidget({ params }: { params: Widget }) {
className="relative h-11 w-full rounded-lg bg-zinc-200 px-3 py-1 text-zinc-900 !outline-none placeholder:text-zinc-500 dark:bg-zinc-800 dark:text-zinc-100 dark:placeholder:text-zinc-300"
/>
</div>
<div className="scrollbar-hide flex h-[500px] w-full flex-col overflow-y-auto rounded-lg bg-zinc-200 py-2 dark:bg-zinc-800">
<div className="scrollbar-none flex h-[500px] w-full flex-col overflow-y-auto rounded-lg bg-zinc-200 py-2 dark:bg-zinc-800">
{db.account.network.map((item: string) => (
<button
key={item}