) => {
+ if (!q) {
+ return { ...prevSearch, tags: undefined, q: undefined }
+ }
+
+ if (q.startsWith("#")) {
+ const parts = q.split(" ")
+ let searchTermBegin = -1
+ for (let i = 0; i < parts.length; ++i) {
+ if (!parts[i].startsWith("#")) {
+ searchTermBegin = i
+ break
+ }
+ }
+ const tags = (searchTermBegin >= 0 ? parts.slice(0, searchTermBegin) : parts)
+ .map((tag) => tag.substring(1))
+ .join(",")
+ const query = searchTermBegin >= 0 ? parts.slice(searchTermBegin).join(" ") : ""
+
+ if (query) {
+ return { ...prevSearch, tags, q: query }
+ }
+
+ return { ...prevSearch, tags, q: undefined }
+ }
+
+ return { ...prevSearch, tags: undefined, q }
+ },
+ })
+ }, 500)
+ }
+
+ function closeSearchBar() {
+ setActionBarContent({ kind: ActionBarContentKind.Normal })
+ }
+
+ return (
+
+
+
+
+
+ )
+}
+
+function ActionButtons() {
+ const setActiveDialog = useBookmarkPageStore((state) => state.setActiveDialog)
+ const setActionBarContent = useBookmarkPageStore((state) => state.setActionBarContent)
+
+ useMnemonics(
+ {
+ a: addBookmark,
+ s: openSearchBar,
+ },
+ { ignore: useCallback(() => useBookmarkPageStore.getState().dialog.kind !== DialogKind.None, []) },
+ )
+
+ function addBookmark() {
+ setActiveDialog({ kind: DialogKind.AddBookmark })
+ }
+
+ function openSearchBar() {
+ setActionBarContent({ kind: ActionBarContentKind.SearchBar })
+ }
+
+ return (
+
+
+
+
+
+ )
+}
+function LogOutButton() {
+ const logOutMutation = useLogOut()
+ const navigate = useNavigate()
+
+ function logOut() {
+ logOutMutation.mutate()
+ navigate({ to: "/", replace: true })
+ }
+
+ return (
+
+ )
+}
+
+export { BookmarkListActionBar }
diff --git a/packages/web/src/hooks/use-mnemonics.ts b/packages/web/src/hooks/use-mnemonics.ts
index 7c8ec3c..b30a993 100644
--- a/packages/web/src/hooks/use-mnemonics.ts
+++ b/packages/web/src/hooks/use-mnemonics.ts
@@ -1,4 +1,4 @@
-import { useEffect, useRef } from "react"
+import { useEffect } from "react"
function useMnemonics(
mnemonicMap: Record void>,
@@ -6,7 +6,7 @@ function useMnemonics(
) {
useEffect(() => {
function onKeyDown(event: KeyboardEvent) {
- if (!ignore(event)) {
+ if (event.key === "Escape" || document.activeElement?.tagName !== "INPUT") {
mnemonicMap[event.key]?.(event)
}
}
@@ -14,7 +14,7 @@ function useMnemonics(
return () => {
document.removeEventListener("keydown", onKeyDown)
}
- }, [mnemonicMap, ignore])
+ }, [mnemonicMap])
}
export { useMnemonics }