0

I need a custom component for my Reactive Search setup. It will be a toggle button to filter for todays date. There will also be yesterday, and last week, but I'm just trying to get today working.

My Elastic Search index has a timeSubmitted field that I would like to use. I am using the query produced when I search in Kibana. My code is below:

<ReactiveComponent
    componentId="Today"
    URLParams={true}
    defaultQuery={() => ({
      query: {
        match: {
          timeSubmitted: {
            query: '2019-02-09',
            type: 'phrase',
          },
        },
      },
    })}
  >
    <TodayComponent />
</ReactiveComponent>

class TodayComponent extends Component {
  setValue() {
    this.props.setQuery({
      query: {
        match: {
          timeSubmitted: {
            query: '2019-02-09',
            type: 'phrase',
          },
        },
      },
    });
  }

  render() {
    console.log('props', this.props);
    return (
      <button onClick={() => this.setValue()}>Today</button> 
    );
  }
}

When I click the button, nothing happens at all.

ss_matches
  • 497
  • 2
  • 5
  • 20
  • From a quick look you do not seem to be giving the `` the property `setQuery` that you're calling in your `setValue()` function. Are you setting this property somewhere else? – ApplePearPerson Feb 28 '19 at 16:17
  • no, I'm not. I'm just following this example from ReactiveSearch: https://codesandbox.io/s/github/appbaseio/reactivesearch/tree/dev/packages/web/examples/ReactiveComponent?from-embed – ss_matches Feb 28 '19 at 16:30
  • On a first glance, your snippet looks good.However, there are several things wrong with the setup. Your timeSubmitted field should be of type 'date', it seems to be of type 'text'. You can't run time queries on a text field. Next, in the example here: https://codesandbox.io/s/xrlm1y3y6p, there is a ReactiveList component that reacts to the query of the ReactiveComponent. You don't have that set. – siddharthlatest Mar 31 '19 at 19:30

0 Answers0