thanos inspect web command for block states in object storage.

[bwplotka]

@jaseemabid on #thanos-dev slack here:

At Monzo we made some UI for the state of thanos compact because it was getting pretty difficult for us to visualise the progress. We had a huge backlog and our block sizes were pretty big and we weren't making any progress with downsampling. Last weekend is the first time since April we have actually managed to downsample anything and now we are back on track!

See the screenshot along. Old state on top, new state below.
Each new red block is a 2 week long block with 5m resolution.
Each new yellow block is a 2 week long block with 1h resolution. :rocket:

Its slightly interactive; here is a raw html file to play with.
Question for the thanos dev community.

Right now, this is generated by parsing the output of thanos bucket and its pretty brittle and specific to Monzo's setup. How should I think of upstreaming this work if there is sufficient interest?

1. A UI for thanos compact like query? Add a web interface, make it look roughly the same with the same bootstrap libraries?
2. A separate web project? $ thanos bucket web or something?
3. Something else?

The current decision is to fit this into thanos bucket web command as alternative to CLI thanos bucket inspect (:

Thanks @jaseemabid for proposing this.

[metalmatze]

This is now a duplicate of #1248, is it?

[brancz]

1248 is the PR for this issue. Once merged, we can close this I'd say.

[jaseemabid]

Rework thanos bucket UI; notes for a v2

The initial version at #1248 does the job, but leaves a lot desired. I'd love to get it out to a bunch of people, see what works, get some feedback and iterate for a v2. Can use this ticket to track progress.

1. Remove Google charts; its very limited, proprietary and cannot be vendored. It looks like we already pull in d3.js, it would be nice to stick with that and not add a new dependency.
2. Add filtering support for time ranges as well as labels.
3. Make those labels look less horrifying.
4. Explain the color legends.
5. Add all the relevant info to tooltip popup

[Reamer]

Hi @jaseemabid,
Thanks for your work. I tried your web overview service. What is the meaning of the colors? A color legend would be nice.

[jojohappy]

@bwplotka @brancz could we close this issue since #1248 has been merged?

[brancz]

Indeed. Thanks for the awesome and hard work!