highperfocused/lume
1
0
Fork 0
mirror of https://github.com/lumehq/lume.git synced 2025-10-11 14:13:14 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: add empty state to search dialog

Browse Source
This commit is contained in:
reya
2024-01-24 13:34:27 +07:00
parent cb71786ac1
commit 057c57b70f
2 changed files with 12 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/ark/src/provider.tsx
View File

@@ -107,7 +107,7 @@ export const LumeProvider = ({ children }: PropsWithChildren<object>) => {
explicitRelayUrls, explicitRelayUrls,
outboxRelayUrls, outboxRelayUrls,
blacklistRelayUrls, blacklistRelayUrls,
enableOutboxModel: false, enableOutboxModel: !storage.settings.lowPower,
autoConnectUserRelays: !storage.settings.lowPower, autoConnectUserRelays: !storage.settings.lowPower,
autoFetchUserMutelist: !storage.settings.lowPower, autoFetchUserMutelist: !storage.settings.lowPower,
// clientName: "Lume", // clientName: "Lume",

14
packages/ui/src/search/dialog.tsx
View File

@@ -1,5 +1,5 @@
import { Note, User, useArk, useColumnContext } from "@lume/ark"; import { Note, User, useArk, useColumnContext } from "@lume/ark";
import { LoaderIcon } from "@lume/icons"; import { LoaderIcon, SearchIcon } from "@lume/icons";
import { COL_TYPES, searchAtom } from "@lume/utils"; import { COL_TYPES, searchAtom } from "@lume/utils";
import { type NDKEvent, NDKKind } from "@nostr-dev-kit/ndk"; import { type NDKEvent, NDKKind } from "@nostr-dev-kit/ndk";
import { useAtom } from "jotai"; import { useAtom } from "jotai";
@@ -96,11 +96,11 @@ export function SearchDialog() {
</div> </div>
<Command.List className="mt-4 h-[500px] px-3 overflow-y-auto w-full flex flex-col"> <Command.List className="mt-4 h-[500px] px-3 overflow-y-auto w-full flex flex-col">
{loading ? ( {loading ? (
<Command.Loading className="flex items-center justify-center h-12"> <Command.Loading className="flex items-center justify-center h-full">
<LoaderIcon className="size-5 animate-spin" /> <LoaderIcon className="size-5 animate-spin" />
</Command.Loading> </Command.Loading>
) : !events.length ? ( ) : !events.length ? (
<Command.Empty className="flex items-center justify-center h-12 text-sm"> <Command.Empty className="flex items-center justify-center h-full text-sm">
No results found. No results found.
</Command.Empty> </Command.Empty>
) : ( ) : (
@@ -156,6 +156,14 @@ export function SearchDialog() {
</Command.Group> </Command.Group>
</> </>
)} )}
{!loading ? (
<div className="h-full flex items-center justify-center flex-col gap-3">
<div className="size-16 bg-blue-100 dark:bg-blue-900 rounded-full inline-flex items-center justify-center text-blue-500">
<SearchIcon className="size-6" />
</div>
Try searching for people, notes, or keywords
</div>
) : null}
</Command.List> </Command.List>
</Command.Dialog> </Command.Dialog>
); );