Improved Documentation for Building Clients

[domoritz]

Create documentation for developers who want to write their own client with React, Svelte, or plain JavaScript. Create example projects that they could use to get started.

[derekperkins]

@tannerlinsley and I were just discussing this last week. We're interested in building an adapter for https://github.com/TanStack/table

[derekperkins]

We're working on a React table client right now. When we're ready, would you like a PR to the main examples directory, or did you have something else in mind?

[domoritz]

For independent clients, it might make sense to maintain them separately and have a page with links similar to https://vega.github.io/vega-lite/ecosystem.html.

[rickiesmooth]

@derekperkins can I maybe have a sneak peek somewhere? Very interested in how you approached this

[matys1]

This. I'm looking for some examples in plain JS (but React would also be nice) to implement own Mosaic Clients. These Clients could be custom D3/Plot components or in React something like visx components. From what I understand this would only require the @uwdata/mosaic-core module and not the entire @uwdata/vgplot module as the visualization will be done by another library as mentioned.

Anyone have any good examples of this?

[rickiesmooth]

@matys1 I thought the Table input gave me a good idea on how to build a client, and in my React app I'm using this hook: #368 which you could hook up to visx

[matys1]

@rickiesmooth I think creating a custom Client subclass itself is perhaps not the biggest problem for me. I was following this template: https://idl.uw.edu/mosaic/why-mosaic/#mosaic-is-extensible. However, I'm a bit confused how to properly manage Selections and Coordinator. I want to:

1. Update Params of Client1 and then when I requestQuery of both Client1 and Client2 I should see the that the result of Client1 stayed the same but the result of Client2 was filtered.
2. Update Params of Client2 and then when I requestQuery of both Client1 and Client2 I should see the that the result of Client1 was filtered but the result of Client2 stayed the same.

Right now 2. works but 1. doesn't. I wonder if its because the "active" clause is Client2.

I opened an issue, maybe you can spot what I'm doing wrong: #437.

It's a shame that all docs and examples are using this vgplot where I think most people looking at this library will want to just hook up their own custom D3/Plot/Visx components and just use this library as an optimized query coordinator for duckdb-wasm.

[jheer]

@matys1 I responded to your issue over on #437. We're also definitely up for adding improved and extended documentation for custom clients. I think some D3 client examples would be a great start. It may be a week or two until I can get to it, but I'll put it in the queue.