complete search loading

@@ -2,8 +2,8 @@
   "devToolsPort": 19002,
   "expoServerPort": 19000,
   "packagerPort": 19001,
-  "packagerPid": 14964,
+  "packagerPid": 24884,
   "expoServerNgrokUrl": "https://s4-47j.anonymous.searchguide.exp.direct",
   "packagerNgrokUrl": "https://packager.s4-47j.anonymous.searchguide.exp.direct",
-  "ngrokPid": 3788
+  "ngrokPid": 25980
 }

 import React from 'react';
 import AppTabContainer from '../AppTabContainer/AppTabContainer';
-import Loading from '../Loading/Loading';
 import { connect } from 'react-redux';
+import Loading from '../Loading/Loading';
 
 const Main = ({ isLoading}) => {
     if ( isLoading ) {
@@ -19,11 +19,10 @@ const Main = ({ isLoading}) => {
     } 
 }
 
-
 const MainContainer = ({isLoading}) => {
     return(<Main isLoading={isLoading} />)
 }
   
-const mapStateToProps = (state) => ({isLoading : state.loading.isLoading})
-  
-export default connect(mapStateToProps)(MainContainer);
\ No newline at end of file
+export default connect(
+    ({search})=>({isLoading:search.isLoading})
+)(MainContainer);
\ No newline at end of file

@@ -2,37 +2,10 @@ import React from 'react';
 import {View,Alert} from 'react-native';
 import { Searchbar } from 'react-native-paper';
 import { connect } from 'react-redux';
-import {toggle} from '../../reducers/loading';
+import {change, submit} from '../../reducers/search';
 
-const voiceRecognition=()=>{
-    Alert.alert(
-        '음성 인식',
-        '아직 구현 못함',
-        [
-            {text: '확인', onPress: () => {}},
-        ],
-    )
-}
-
-class SearchBar extends React.Component {
-    constructor(props){
-        super(props);
-        this.state = {
-            query: '',
-        };
-    }
-    
-    queryChange=(query)=>{
-        this.setState({ query: query });
-    }
-
-    submit=()=>{
-        this.props.toggleLoading();
-        setTimeout(()=>{this.props.toggleLoading()},1000);
-        this.setState({query:''});
-    }
 
-    voiceRecognition=()=>{
+const voiceRecognition = () => {
     Alert.alert(
         '음성 인식',
         '아직 구현 못함',
@@ -40,30 +13,35 @@ class SearchBar extends React.Component {
             {text: '확인', onPress: () => {}},
         ],
     )
-    }
+};
 
-    render(){
+const SearchBar = ({ query, change, submit }) => {
     return(
         <>
         <View>
             <Searchbar
             placeholder="검색할 질문을 입력하세요."
-                onChangeText={this.queryChange}
-                value={this.state.query}
+            onChangeText={change}
+            value={query}
             icon='microphone'
             onIconPress={voiceRecognition}
-                onSubmitEditing={this.submit}
+            onSubmitEditing={submit}
             />
         </View>
         </>
     )
-    }
-}
+};
 
-const SearchBarContainer = ({toggle}) => {
-    return(<SearchBar toggleLoading={toggle} />)
-}
 
-const mapDispatchToProps = (dispatch) => ({toggle : ()=>{ dispatch( toggle() )}});
+const SearchBarContainer = ({ query, change, submit }) => {
+    return(<SearchBar query={query} change={change} submit={submit}  />)
+};
 
-export default connect(null,mapDispatchToProps)(SearchBarContainer);
\ No newline at end of file
+export default connect(
+    ({search})=> ({
+        query: search.query
+    }),
+    {
+        change,submit
+    }
+)(SearchBarContainer);
\ No newline at end of file

 const axios = require('axios')
 const filter = require('./filter')
 
-export const SendToApi = async(searchdata) => {
-  console.log(searchdata)
+export const sendSearch = async(searchText) => {
+  console.log(searchText)
     return new Promise((resolve,reject) => {
       let isBlank_reg = "/\s\g"
-      if(searchdata=== "" || searchdata.length > 30 ){
+      if(searchText=== "" || searchText.length > 30 ){
         resolve(JSON.stringify({ "return_code" : -1, "error_code": "검색 단어를 확인해 주세요!" }));
       } else{
         axios(
@@ -17,7 +17,7 @@ export const SendToApi = async(searchdata) => {
             url: 'http://1.201.142.118:80/api/cliConnection',
             data: {
               data:{
-                text: searchdata.replace(/\s{1,}/g,' ')
+                text: searchText.replace(/\s{1,}/g,' ')
               }
             },
             method: "POST",

+import test from '../assets/test.json'
+
+export const readTest = () => {
+    let testResult = test;
+    return testResult;
+}
\ No newline at end of file

@@ -1603,6 +1603,22 @@
       "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz",
       "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg=="
     },
+    "axios": {
+      "version": "0.19.0",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.19.0.tgz",
+      "integrity": "sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==",
+      "requires": {
+        "follow-redirects": "1.5.10",
+        "is-buffer": "^2.0.2"
+      },
+      "dependencies": {
+        "is-buffer": {
+          "version": "2.0.4",
+          "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.4.tgz",
+          "integrity": "sha512-Kq1rokWXOPXWuaMAqZiJW4XxsmD9zGx9q4aePabbn3qCRGedtH7Cm+zV8WETitMfu1wdh+Rvd6w5egwSngUX2A=="
+        }
+      }
+    },
     "babel-plugin-dotenv": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/babel-plugin-dotenv/-/babel-plugin-dotenv-0.1.1.tgz",
@@ -2834,6 +2850,29 @@
         "locate-path": "^2.0.0"
       }
     },
+    "follow-redirects": {
+      "version": "1.5.10",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
+      "integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
+      "requires": {
+        "debug": "=3.1.0"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        },
+        "ms": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
+          "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
+        }
+      }
+    },
     "fontfaceobserver": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/fontfaceobserver/-/fontfaceobserver-2.1.0.tgz",
@@ -5778,6 +5817,11 @@
         "symbol-observable": "^1.2.0"
       }
     },
+    "redux-thunk": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.3.0.tgz",
+      "integrity": "sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw=="
+    },
     "regenerate": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.0.tgz",

@@ -9,6 +9,7 @@
   },
   "dependencies": {
     "1.3.0": "^1.3.0",
+    "axios": "^0.19.0",
     "expo": "^35.0.0",
     "expo-permissions": "~7.0.0",
     "expo-speech": "~7.0.0",
@@ -27,7 +28,8 @@
     "react-navigation-tabs": "^2.5.6",
     "react-redux": "^7.1.3",
     "react-thunk": "^1.0.0",
-    "redux": "^4.0.4"
+    "redux": "^4.0.4",
+    "redux-thunk": "^2.3.0"
   },
   "devDependencies": {
     "babel-preset-expo": "^7.1.0",

-import { createStore, combineReducers } from 'redux';
-import loading from './loading'
+import { createStore, combineReducers, applyMiddleware } from 'redux';
+import ReduxThunk from 'redux-thunk'
+import search from './search';
  
-const store = combineReducers({ loading }); 
+const store = combineReducers({ search }); 
  
-export default createStore(store)
\ No newline at end of file
+export default createStore(store, applyMiddleware(ReduxThunk) );
\ No newline at end of file

+
+
 const TOGGLE = 'loading/TOGGLE';
 
-export const toggle = () => ({ type: TOGGLE,})
+export const toggle = () => ({ type: TOGGLE})
 
 const initialState = {
     isLoading: false,

+import {sendSearch} from '../lib/api'
+import {readTest} from '../lib/readTest';
+
 const CHANGE = 'search/CHANGE';
-const SUBMIT = 'search/SUBMIT';
+const SUCCESS = 'search/SUCCESS';
+const FAILURE = 'search/FAILURE';
+const START = 'search/START';
 
 export const change = (text) => ({ 
     type: CHANGE,
     text,
 })
 
-export const submit = (text) => (dispatch) => ({ 
-    type: CHANGE,
-    text,
-})
+export const submit = (text) => async (dispatch) => { 
+    dispatch( {type:START});
+    try{
+        /*const response = await sendSearch(text);*/
+        const response = await readTest(); // 테스트용입니당~
+        setTimeout(()=>dispatch( { type:SUCCESS, result:response }),1000); // 셋타임아웃도 테스트용
+    }
+    catch(err){
+        dispatch({ type:FAILURE, result:response })
+    }
+}
+
 
 const initialState = {
     query: '',
     searchResult:{},
+    isLoading: false,
 };
    
 export default ToggleLoading = (state = initialState, action) => {
     switch (action.type) {
         case CHANGE:
             return {...state, query: action.text};
-        case SUBMIT:
-            return {...state, query: ''}
+        case SUCCESS:
+            return {...state, isLoading:false,searchResult: action.response};
+        case FAILURE:
+            return {...state, isLoading:false};
+        case START:
+            return {...state, query:'',isLoading:true}
         default:
             return state;
     }
 }
 
-submit=()=>{
-    this.props.toggleLoading();
-    setTimeout(()=>{this.props.toggleLoading()},1000);
-    this.setState({query:''});
-}