From 1a4a674cf664d7cc70e3ba98c33f385deb611934 Mon Sep 17 00:00:00 2001
From: developomp <developomp@gmail.com>
Date: Wed, 1 Sep 2021 14:38:19 +0900
Subject: [PATCH] fixed tags automatically adding on enter press

---
 source/src/pages/Search.tsx | 35 +++++++++++++++++++----------------
 1 file changed, 19 insertions(+), 16 deletions(-)

diff --git a/source/src/pages/Search.tsx b/source/src/pages/Search.tsx
index fad7699..b361549 100644
--- a/source/src/pages/Search.tsx
+++ b/source/src/pages/Search.tsx
@@ -34,7 +34,7 @@ const StyledSearchContainer = styled.div`
 	}
 `
 
-const StyledSearchControlContainer = styled.form`
+const StyledSearchControlContainer = styled.div`
 	width: 100%;
 	margin-left: 1rem;
 
@@ -80,6 +80,7 @@ const StyledSearchBar = styled.input`
 		})};
 `
 
+// check if post date is withing the range
 function isDateInRange(
 	dateToCompare: string,
 	from: string,
@@ -135,7 +136,8 @@ function _Search() {
 
 	function doSearch() {
 		// remove focus from search bar to prevent accidental multiple search
-		if (inputRef.current) inputRef.current.blur()
+		if (document.activeElement instanceof HTMLElement)
+			document.activeElement.blur()
 
 		_history.push({
 			pathname: "/search",
@@ -207,7 +209,6 @@ function _Search() {
 						moveRangeOnFirstSelection={false}
 						retainEndDateOnFirstSelection={true}
 						ranges={dateRange}
-						// eslint-disable-next-line @typescript-eslint/no-explicit-any
 						onChange={(item: OnDateRangeChangeProps) => {
 							const historyToPush = {
 								...(query.query && {
@@ -247,7 +248,6 @@ function _Search() {
 					<StyledSearchControlContainer
 						onSubmit={(event) => {
 							event.preventDefault()
-							if (searchInput) doSearch()
 						}}
 					>
 						<StyledSearchBar
@@ -258,6 +258,9 @@ function _Search() {
 							onChange={(event) =>
 								setSearchInput(event.target.value)
 							}
+							onKeyPress={(e) =>
+								e.key === "Enter" && searchInput && doSearch()
+							}
 						/>
 						<br />
 						<br />
@@ -274,8 +277,7 @@ function _Search() {
 						<br />
 						date to: {query.to}
 						<br />
-						<input
-							type="submit"
+						<button
 							onClick={() => {
 								_history.push({
 									pathname: "/search",
@@ -293,11 +295,11 @@ function _Search() {
 									}),
 								})
 							}}
-							value="Search test 1"
-						/>
+						>
+							Search test 1
+						</button>
 						|
-						<input
-							type="submit"
+						<button
 							onClick={() => {
 								_history.push({
 									pathname: "/search",
@@ -315,11 +317,11 @@ function _Search() {
 									}),
 								})
 							}}
-							value="Search test 2"
-						/>
+						>
+							Search test 2
+						</button>
 						<br />
-						<input
-							type="submit"
+						<button
 							onClick={() => {
 								_history.push({
 									pathname: "/search",
@@ -335,8 +337,9 @@ function _Search() {
 
 								setDateRange(defaultDateRange)
 							}}
-							value="clear date"
-						/>
+						>
+							Clear date
+						</button>
 						<br />
 					</StyledSearchControlContainer>
 				</StyledSearchContainer>