[V2] Improve WhenVisible component to merge data and params props for a more flexible API

[PedroAugustoRamalhoDuarte]

This PR fixes #2025

Enhancements

• Merge data and params props:
  This PR introduces a more flexible API that merges the data and params props. Now, you can pass both in a single configuration like this:

  <WhenVisible fallback="Loading..." data={["todos", "pagy"]} params={{
    data: {
      teste: true,
      page: pagy.page + 1,
    },
    preserveUrl: true,
  }} />

[PedroAugustoRamalhoDuarte]

@joetannenbaum do you think this pr makes sense?

[joetannenbaum]

Hey @PedroAugustoRamalhoDuarte, thanks for the PR. I'm not sure this makes sense to me to be honest.

The data prop is just shorthand for fetching specific data via the only property of params, if you include a data prop on the component and include a data property in params that seems confusing to me, I wouldn't quite understand what was going on by looking at it.

If it's only data, it indicates "this is the data I'd like". If it's only params, it indicates "I'd like to get more granular about this request," which can itself include an only property.

As a side note, I believe children are currently optional for the component, so that should already work.

[PedroAugustoRamalhoDuarte]

Thanks @joetannenbaum for the response. The major issue that I am trying to solve is that now I cannot send query params with WhenVisible component, and that is very useful for example for pagination.

My ideia for solve this was to merge data and params props, but maybe we can think in other solution

[PedroAugustoRamalhoDuarte]

Hey @PedroAugustoRamalhoDuarte, thanks for the PR. I'm not sure this makes sense to me to be honest.

The data prop is just shorthand for fetching specific data via the only property of params, if you include a data prop on the component and include a data property in params that seems confusing to me, I wouldn't quite understand what was going on by looking at it.

If it's only data, it indicates "this is the data I'd like". If it's only params, it indicates "I'd like to get more granular about this request," which can itself include an only property.

As a side note, I believe children are currently optional for the component, so that should already work.

Thanks for the side note, maybe other PR already made this fix!!

[joetannenbaum]

Why can't you send query params with the component? If the method is get and you fill in the data property if the params prop, is that not working? It should send over query params with your request.

[PedroAugustoRamalhoDuarte]

Yes, that’s exactly it. I think a better API would merge the two, as many people naturally expect that behavior is the past:

• https://discord.com/channels/592327939920494592/915652207859351593/1323349840712699904
• https://discord.com/channels/592327939920494592/592327939920494594/1319401182954917971
• https://discord.com/channels/592327939920494592/592327939920494594/1319401656269668352

However, in the current code (modified in another PR after I created this one), I realized that the data prop is no longer necessary. We can now rely entirely on params, and it works as expected.

Thank you so much for taking the time to review this PR—I truly appreciate it!