I’ve continued down the data browser rabbit hole and still have not yet built the pathing visualisation which was the purpose of its creation.

spacetraders data browser - market screenshot
spacetraders data browser - market

Instead, I’ve built out most of the ship and system waypoint views and surfaced a good chunk of the api data. Considering most of the api calls are very similar, I was able to create a few components that can be reused across the different views.

All API calls the data browser makes are via async jotai atoms. Most of them use loadable and so I wrote RenderLoadableAtom to take care of the loading, error and success states of components that display that data.

All of the actual calls these atoms make are via the same api factory I wrote over the generated openapi output. This factory wraps every call with bottleneck to globally rate limit any call and retryable from the async library to handle and retry any 429s. This allows logic in both my automated backend and the standalone data browser to make requests without needing to worry about rate limiting or retries.

spacetraders data browser - ship screenshot
spacetraders data browser - ship

Finally, I added a TabStructure component to split data returned by endpoints into tabs and hooked it into react router. This component is also dependent on a loadable atom and includes an automatically appended Raw tab which displays the raw json returned by the api - this comes in handy when viewing data that hasn’t been bound to a component yet.

With easy data access and a reusable component pattern I’ve ended up spending too much time building it out rather than focusing on the path visualisation which will be my next task.