mirror of
https://github.com/usememos/memos.git
synced 2025-03-15 02:00:09 +01:00
feat: press cmd+f to focus on the search bar (#800)
This commit is contained in:
parent
40f39fd66c
commit
358a5c0ed9
@ -1,6 +1,6 @@
|
||||
import { useEffect, useState } from "react";
|
||||
import { useEffect, useState, useRef } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useLocationStore } from "../store/module";
|
||||
import { useLocationStore, useDialogStore } from "../store/module";
|
||||
import { memoSpecialTypes } from "../helpers/filter";
|
||||
import Icon from "./Icon";
|
||||
import "../less/search-bar.less";
|
||||
@ -8,8 +8,31 @@ import "../less/search-bar.less";
|
||||
const SearchBar = () => {
|
||||
const { t } = useTranslation();
|
||||
const locationStore = useLocationStore();
|
||||
const dialogStore = useDialogStore();
|
||||
const memoType = locationStore.state.query.type;
|
||||
const [queryText, setQueryText] = useState("");
|
||||
const inputRef = useRef<HTMLInputElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
const handleKeyDown = (event: KeyboardEvent) => {
|
||||
if (!inputRef.current) {
|
||||
return;
|
||||
}
|
||||
if (dialogStore.getState().dialogStack.length) {
|
||||
return;
|
||||
}
|
||||
const isMetaKey = event.ctrlKey || event.metaKey;
|
||||
if (isMetaKey && event.key === "f") {
|
||||
event.preventDefault();
|
||||
inputRef.current.focus();
|
||||
return;
|
||||
}
|
||||
};
|
||||
document.body.addEventListener("keydown", handleKeyDown);
|
||||
return () => {
|
||||
document.body.removeEventListener("keydown", handleKeyDown);
|
||||
};
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
const text = locationStore.getState().query.text;
|
||||
@ -39,6 +62,7 @@ const SearchBar = () => {
|
||||
autoComplete="new-password"
|
||||
type="text"
|
||||
placeholder=""
|
||||
ref={inputRef}
|
||||
value={queryText}
|
||||
onChange={handleTextQueryInput}
|
||||
/>
|
||||
|
Loading…
x
Reference in New Issue
Block a user