[Hotfix/searchbar] 추천되지 않는 raw text를 검색창에 넣는 로직 (#176)

* Handling non-indexed search input * Change and add annotation APIs for local develop Co-authored-by: Simon Seo <[email protected]>
osamhack2021 · Oct 13, 2021 · dff0422 · dff0422
1 parent 9ebb777
commit dff0422
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 11 deletions.
diff --git a/WEB/frontend/src/atoms/appliedFilterMapState.js b/WEB/frontend/src/atoms/appliedFilterMapState.js
@@ -24,6 +24,7 @@ const initialState = {
   PLT: [],
   MAT: [],
   TRM: [],
+  ETC: [], // (=search_text)
 };
 // ['GP/GOP', '정체단', '사이버작전센터'];
 

diff --git a/WEB/frontend/src/components/SearchBar.js b/WEB/frontend/src/components/SearchBar.js
@@ -1,18 +1,11 @@
-import { useState, useEffect } from 'react';
-import {
-  useRecoilState,
-  useRecoilValue,
-  useResetRecoilState,
-  useSetRecoilState,
-} from 'recoil';
+import { useRecoilValue, useSetRecoilState } from 'recoil';
 import { autoCompleteFilterState } from '../atoms/searchState';
 import {
   appliedFilterMapState,
   appliedAutoCompleteFilterState,
 } from '../atoms/appliedFilterMapState';
-import useSearchInitEffect from '../hooks/useSearchInitEffect';
 
-import { Autocomplete, Box, Button, Chip, TextField } from '@mui/material';
+import { Autocomplete, Chip, TextField } from '@mui/material';
 // mui icons
 import PersonIcon from '@mui/icons-material/Person';
 import PlaceIcon from '@mui/icons-material/Place';
@@ -44,17 +37,24 @@ export default function SearchBar({ setValue }) {
 
   const onTagsChange = (event, values) => {
     let format = {};
+    let lst = values[values.length - 1];
+    if (typeof lst === 'string' || lst instanceof String)
+      // label search_text to ETC.. (구현 시간이 없어서 로직이 맘대로인 점 죄송합니다.)
+      values[values.length - 1] = { word: lst, label: 'ETC' };
+
     for (let { word, label } of values) {
       if (!format[label]) format[label] = [word];
       else if (!format[label].includes(word)) format[label].push(word);
     }
+    console.log(values);
     setAppliedFilterMap(format);
     setValue('search', values);
   };
 
   return (
     <Autocomplete
       multiple
+      freeSolo
       mt={2}
       value={appliedAutoCompleteFilter}
       options={autoCompleteFilter}

diff --git a/WEB/frontend/src/components/SearchForm.js b/WEB/frontend/src/components/SearchForm.js
@@ -13,13 +13,24 @@ export default function SearchForm() {
   const { handleSubmit, register, setValue, control } = useForm({});
   const setSearch = useSetRecoilState(searchState);
   const searchSetting = useRecoilValue(searchSettingState);
-  const onSubmit = async ({ category, type, period }) => {
+  const onSubmit = async ({ category, type, period, searchText }) => {
     // TODO 검색 api와 연동
-    console.log('[Fetching with Form]...');
+    /*
+    {
+      "category": "news",
+      "period": 0,
+      "tags": { "PER": ["김정은"], "LOC": ["서해"] },
+      "search_text": "",
+      "limit": 5,
+      "offset": 0
+    }
+    */
+    console.log('[+] Fetching with Form');
     console.log('category', category);
     console.log('period', period);
     console.log('tags', searchSetting);
     console.log('type', type);
+    console.log('search_text', searchSetting.tags.ETC);
 
     const response = await axios.get(`/static/search.json`);
     console.log(response.data);