Merge branch 'feat/135835-search-form' into feat/134549-three-types-of-search-execution-buttons

apps/app/src/features/search/client/components/SearchForm.tsx

@@ -3,13 +3,13 @@ import React, {
 } from 'react';
 
 type Props = {
-  searchText: string,
+  searchKeyword: string,
   onChangeSearchText?: (text: string) => void,
   onClickClearButton?: () => void,
 }
 export const SearchForm = (props: Props): JSX.Element => {
   const {
-    searchText, onChangeSearchText, onClickClearButton,
+    searchKeyword, onChangeSearchText, onClickClearButton,
   } = props;
 
   const inputRef = useRef<HTMLInputElement>(null);
@@ -41,8 +41,8 @@ export const SearchForm = (props: Props): JSX.Element => {
         type="text"
         className="form-control"
         placeholder="Search..."
-        value={searchText}
-        onChange={(Element) => { changeSearchTextHandler(Element) }}
+        value={searchKeyword}
+        onChange={(e) => { changeSearchTextHandler(e) }}
       />
 
       <button

apps/app/src/features/search/client/components/SearchModal.tsx

@@ -13,19 +13,19 @@ import { SearchHelp } from './SearchHelp';
 const SearchModal = (): JSX.Element => {
   const { data: searchModalData, close: closeSearchModal } = useSearchModal();
 
-  const [searchText, setSearchText] = useState('');
+  const [searchKeyword, setSearchKeyword] = useState('');
 
   const changeSearchTextHandler = useCallback((searchText: string) => {
-    setSearchText(searchText);
+    setSearchKeyword(searchText);
   }, []);
 
   const clickClearButtonHandler = useCallback(() => {
-    setSearchText('');
+    setSearchKeyword('');
   }, []);
 
   useEffect(() => {
     if (!searchModalData?.isOpened) {
-      setSearchText('');
+      setSearchKeyword('');
     }
   }, [searchModalData?.isOpened]);
 
@@ -33,7 +33,7 @@ const SearchModal = (): JSX.Element => {
     <Modal size="lg" isOpen={searchModalData?.isOpened ?? false} toggle={closeSearchModal}>
       <ModalBody>
         <SearchForm
-          searchText={searchText}
+          searchKeyword={searchKeyword}
           onChangeSearchText={changeSearchTextHandler}
           onClickClearButton={clickClearButtonHandler}
         />