+1
-18
src/components/search.tsx
+1
-18
src/components/search.tsx
···
1
import { resolveHandle } from "../utils/api.js";
2
import { A, useNavigate } from "@solidjs/router";
3
import Tooltip from "./tooltip.jsx";
4
-
import { createSignal, onCleanup, onMount, Show } from "solid-js";
5
import { agent, loginState } from "../components/login.jsx";
6
import { Handle } from "@atcute/lexicons";
7
-
8
-
const isTouchDevice = "ontouchstart" in window || navigator.maxTouchPoints > 1;
9
10
const Search = () => {
11
const navigate = useNavigate();
···
45
navigate(`/at://${did}${uriParts.length > 1 ? `/${uriParts.slice(1).join("/")}` : ""}`);
46
};
47
48
-
onMount(() => window.addEventListener("keydown", keyEvent));
49
-
onCleanup(() => window.removeEventListener("keydown", keyEvent));
50
-
51
-
const keyEvent = (event: KeyboardEvent) => {
52
-
if (event.key == "/" && document.activeElement !== searchInput) {
53
-
event.preventDefault();
54
-
searchInput.focus();
55
-
}
56
-
if (event.key == "Escape" && document.activeElement === searchInput) {
57
-
event.preventDefault();
58
-
searchInput.blur();
59
-
}
60
-
};
61
-
62
return (
63
<form
64
class="flex w-full max-w-[21rem] flex-col sm:max-w-[24rem]"
···
77
spellcheck={false}
78
ref={searchInput}
79
id="input"
80
-
placeholder={isTouchDevice ? "" : "Type / to search"}
81
class="grow focus:outline-none"
82
/>
83
<Show when={loading()}>
···
1
import { resolveHandle } from "../utils/api.js";
2
import { A, useNavigate } from "@solidjs/router";
3
import Tooltip from "./tooltip.jsx";
4
+
import { createSignal, Show } from "solid-js";
5
import { agent, loginState } from "../components/login.jsx";
6
import { Handle } from "@atcute/lexicons";
7
8
const Search = () => {
9
const navigate = useNavigate();
···
43
navigate(`/at://${did}${uriParts.length > 1 ? `/${uriParts.slice(1).join("/")}` : ""}`);
44
};
45
46
return (
47
<form
48
class="flex w-full max-w-[21rem] flex-col sm:max-w-[24rem]"
···
61
spellcheck={false}
62
ref={searchInput}
63
id="input"
64
class="grow focus:outline-none"
65
/>
66
<Show when={loading()}>