ResultsLoader does not work!!!

[hauph]

I added component ResultsLoader to my app.

const InitialLoaderComponent = () => {
    return <div>Loading...</div>
}

<ResultsLoader renderElement={InitialLoaderComponent}/>

The document is very confused, to be honest. It is written that the ResultsLoader component only has one prop, which is renderElement to override the default rendered component. However, my code did not work. It kept saying that:

Uncaught Error: ResultsLoader(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.

Even if I removed prop renderElement and just use <ResultsLoader />, it still showed the same error

[lnielsen]

Ping @zzacharo

[zzacharo]

Hey @hauph can you please provide some more detailed description on how you used the ResultsLoader component? The renderElement property is just a way to define your own implementation of a loader component. I think is better to give you an example on the behaviour of the component:

Let's take the example described in one of our demo applications:

Here the ResultsLoader component wraps our OnResults component so the latter is rendered only when the results are fetched. With that said, the ResultsLoader is rendering whatever is passed as child to it when the results are fetched. Note here that the renderElement property will just render a different component as long as the results are not yet fetched.

So coming back to your example I see that you are using the component without passing any child component. You need to use this component as:

const InitialLoaderComponent = () => {
    return <div>Loading...</div>
}

<ResultsLoader renderElement={InitialLoaderComponent}>
    <MyResultsComponent />
</ResultsLoader>

To summarise, I would like to say that this module is not officially released and maybe some things in the documentation are missing or they are not well done. Your feedback is much appreciated! I created an issue #97 to track this. Let me know if you have any other question. Also I would encourage you to check our demos and how we use these components in practice!

[hauph]

Thank you for your reply.
However, I have decided to make my own React component to handle ElasticSearch, so I am no longer using your library.
Anyway, you are doing great job! Thank you for your hard work on making this library.