usememos/memos
1
1
Fork 0
mirror of https://github.com/usememos/memos.git synced 2025-01-02 11:12:27 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix: clear query text (#469)

Browse Source 
* fix: clear query text

* update

* update

Co-authored-by: boojack <stevenlgtm@gmail.com>
This commit is contained in:
Zeng1998 2022-11-15 19:52:16 +08:00 committed by GitHub
parent 5258b0a5b4
commit 906ec7994e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/components/MemoFilter.tsx
View File

@ -61,7 +61,7 @@ const MemoFilter = () => {
<div <div
className={"filter-item-container " + (textQuery ? "" : "!hidden")} className={"filter-item-container " + (textQuery ? "" : "!hidden")}
onClick={() => { onClick={() => {
locationService.setTextQuery(""); locationService.setTextQuery(undefined);
}} }}
> >
<Icon.Search className="icon-text" /> {textQuery} <Icon.Search className="icon-text" /> {textQuery}

10
web/src/components/SearchBar.tsx
View File

@ -1,3 +1,4 @@
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { locationService } from "../services"; import { locationService } from "../services";
import { useAppSelector } from "../store"; import { useAppSelector } from "../store";
@ -8,6 +9,12 @@ import "../less/search-bar.less";
const SearchBar = () => { const SearchBar = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const memoType = useAppSelector((state) => state.location.query?.type); const memoType = useAppSelector((state) => state.location.query?.type);
const [queryText, setQueryText] = useState("");
useEffect(() => {
const text = locationService.getState().query.text;
setQueryText(text === undefined ? "" : text);
}, [locationService.getState().query.text]);
const handleMemoTypeItemClick = (type: MemoSpecType | undefined) => { const handleMemoTypeItemClick = (type: MemoSpecType | undefined) => {
const { type: prevType } = locationService.getState().query ?? {}; const { type: prevType } = locationService.getState().query ?? {};
@ -19,6 +26,7 @@ const SearchBar = () => {
const handleTextQueryInput = (event: React.FormEvent<HTMLInputElement>) => { const handleTextQueryInput = (event: React.FormEvent<HTMLInputElement>) => {
const text = event.currentTarget.value; const text = event.currentTarget.value;
setQueryText(text);
locationService.setTextQuery(text); locationService.setTextQuery(text);
}; };
@ -26,7 +34,7 @@ const SearchBar = () => {
<div className="search-bar-container"> <div className="search-bar-container">
<div className="search-bar-inputer"> <div className="search-bar-inputer">
<Icon.Search className="icon-img" /> <Icon.Search className="icon-img" />
<input className="text-input" type="text" placeholder="" onChange={handleTextQueryInput} /> <input className="text-input" type="text" placeholder="" value={queryText} onChange={handleTextQueryInput} />
</div> </div>
<div className="quickly-action-wrapper"> <div className="quickly-action-wrapper">
<div className="quickly-action-container"> <div className="quickly-action-container">