rerendering react search results via react-router redirect

Question

So, I have a Search component and a Results component. The Search component is rendered in the Header of the site so it is global. When a user enters text within that Search they will be redirected to the Results component. From the Results view, I want the user to be able to do another Search and re-render the Results component.

It's not currently working. Below is my code for the global search bar. As you can see, I use componentWillRecieveProps() and try to reset the state there. I use react-router Redirect.

   class SearchBox extends ComponentBase {

    constructor(props) {
      super(props);


      this.state = {
       fireRedirect: false,
       dropdownOpen: false,
       location: '',
       term: '',
       distance: '50 mi',
       submitted: false,
       results: {}
      };


     this.handleChange = this.handleChange.bind(this);
     this.handleSubmit = this.handleSubmit.bind(this);
     this.select = this.select.bind(this);
     this.toggle = this.toggle.bind(this);  
  }

  componentWillReceiveProps(nextProps) {
   this.setState({ fireRedirect: false })
  }


  componentDidMount() {
   this.setState({
    location: this.props.city
  });


  toggle(e) {
    this.setState({
        dropdownOpen: !this.state.dropdownOpen
    });
   }

  select(event) {
    //let d = event.target.innerText.replace(" mi", "");
    this.setState({
        dropdownOpen: !this.state.dropdownOpen,
        distance: d
    });
 }

 handleChange(e) {
    const {
        name, value
    } = e.target;
    this.setState({
        [name]: value
    });
 }

handleSubmit(e) {
    e.preventDefault();
    this.setState({
        submitted: true,
        fireRedirect: true
    });
    const {
        location, term, distance
    } = this.state;
    const {
        dispatch
    } = this.props;

    if (term && location) {
      let q = "?term=" + term + "&location=" + location + "&distance=" + distance;
      this.setState({referrer: "/results" + q});
      //let q = "/" + term + "/" + location + "/" + distance;
      history.push("/results" + q);
      //history.goForward();
      //dispatch(searchActions.search(location, term, distance));
    }
}

render() {
    const {
        fireRedirect, referrer, location, term, distance
    } = this.state;   

    return ( < form className = "form-inline" >
        < span className = "lead mr-sm-2" > Find < /span> < Input type = "text"
        name = "term"
        id = "query"
        size = "lg"
        className = "form-control mr-sm-2"
        onChange = {
            this.handleChange
        }
        placeholder = "e.g., stationary" / > {
            /*<span>within </span>
                    <DistanceDropdown />
                    <span> of </span> */
        } < span className = "lead mr-sm-2" > Near < /span> < Input type = "text"
        name = "location"
        id = "loc"
        size = "lg"
        className = "form-control mr-sm-2"
        onChange = {
            this.handleChange
        }
        placeholder = "Location"
        value={this.state.location}
      />


        < Button style={{backgroundColor: '#008efe', color: 'white'}}
        size = "lg"
        onClick = {
            this.handleSubmit
        } > < i className = "icon-magnifier" > < /i>&nbsp;Search</Button >
        {fireRedirect && (
        <Redirect to={referrer} />
        )}
         < /form>

      );
  }
 }

This is the error I get

Warning: You tried to redirect to the same route you're currently on: "/results?term=concrete&location=Palo Alto&distance=50 mi"