You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
55 lines
1.8 KiB
55 lines
1.8 KiB
import React from "react" ;
|
|
import SearchForm from "./SearchForm" ;
|
|
import SearchResults from "./SearchResults" ;
|
|
import "./App.css" ;
|
|
|
|
const axios = require( "axios" ) ;
|
|
const queryString = require( "query-string" ) ;
|
|
|
|
// --------------------------------------------------------------------
|
|
|
|
export default class App extends React.Component
|
|
{
|
|
|
|
constructor( props ) {
|
|
// figure out the base URL of the Flask backend server
|
|
// NOTE: We allow the caller to do this since the test suite will usually spin up
|
|
// it's own Flask server, but talks to an existing React server, so we need some way
|
|
// for pytest to change which Flask server the React frontend code should tak to.
|
|
const args = queryString.parse( window.location.search ) ;
|
|
let baseUrl = process.env.REACT_APP_TEST_MODE ? args._flask : null ;
|
|
if ( ! baseUrl )
|
|
baseUrl = process.env.REACT_APP_FLASK_URL ;
|
|
|
|
super( props ) ;
|
|
this.state = {
|
|
baseUrl: baseUrl,
|
|
searchResults: [],
|
|
seqNo: 0,
|
|
} ;
|
|
}
|
|
|
|
render() {
|
|
return ( <div>
|
|
<SearchForm onSearch={this.onSearch.bind(this)} />
|
|
<SearchResults seqNo={this.state.seqNo} searchResults={this.state.searchResults} />
|
|
</div> ) ;
|
|
}
|
|
|
|
onSearch( query ) {
|
|
// run the search
|
|
console.log( "SEARCH: " + query ) ;
|
|
axios.post( this.state.baseUrl + "/search", {
|
|
query: query
|
|
} )
|
|
.then( resp => {
|
|
console.log( "RESPONSE:", resp.data ) ;
|
|
this.setState( { searchResults: resp.data, seqNo: this.state.seqNo+1 } ) ;
|
|
} )
|
|
.catch( err => {
|
|
console.log( "ERROR:", err ) ;
|
|
this.setState( { searchResults: null, seqNo: this.state.seqNo+1 } ) ;
|
|
} ) ;
|
|
}
|
|
|
|
}
|
|
|