bluejoyq

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
}
......
This diff is collapsed. Click to expand it.
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,9 +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=()=>{
const voiceRecognition = () => {
Alert.alert(
'음성 인식',
'아직 구현 못함',
......@@ -12,58 +13,35 @@ const voiceRecognition=()=>{
{text: '확인', onPress: () => {}},
],
)
}
};
class SearchBar extends React.Component {
constructor(props){
super(props);
this.state = {
query: '',
};
}
queryChange=(query)=>{
this.setState({ query: query });
}
const SearchBar = ({ query, change, submit }) => {
return(
<>
<View>
<Searchbar
placeholder="검색할 질문을 입력하세요."
onChangeText={change}
value={query}
icon='microphone'
onIconPress={voiceRecognition}
onSubmitEditing={submit}
/>
</View>
</>
)
};
submit=()=>{
this.props.toggleLoading();
setTimeout(()=>{this.props.toggleLoading()},1000);
this.setState({query:''});
}
voiceRecognition=()=>{
Alert.alert(
'음성 인식',
'아직 구현 못함',
[
{text: '확인', onPress: () => {}},
],
)
}
const SearchBarContainer = ({ query, change, submit }) => {
return(<SearchBar query={query} change={change} submit={submit} />)
};
render(){
return(
<>
<View>
<Searchbar
placeholder="검색할 질문을 입력하세요."
onChangeText={this.queryChange}
value={this.state.query}
icon='microphone'
onIconPress={voiceRecognition}
onSubmitEditing={this.submit}
/>
</View>
</>
)
export default connect(
({search})=> ({
query: search.query
}),
{
change,submit
}
}
const SearchBarContainer = ({toggle}) => {
return(<SearchBar toggleLoading={toggle} />)
}
const mapDispatchToProps = (dispatch) => ({toggle : ()=>{ dispatch( toggle() )}});
export default connect(null,mapDispatchToProps)(SearchBarContainer);
\ No newline at end of file
)(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:''});
}
......