Add traceroute-map-panel plugin

[Gowee]

Hello.

This panel plugin helps visualize traceroute hops on a map as is shown in the README.

I build this project based upon https://github.com/grafana/simple-react-panel and have checked the relevant guidelines. But I am not sure if everything will go well because the new and legacy documents seems a little messy to me. Please let me know if there is something wrong.

Thanks.

[ganadara135]

Place your repo.json info on the top of repo.json. It is the way to pass conflicting repo.json.

[Gowee]

Thanks for reminding me. I have manually resolved those conflicts by rebasing.

[marcusolsson]

Hi @Gowee, and thank you for considering contributing your plugin!

Before we can start review your plugin, we'll need you to fix the issues reported by the plugin validator. You can enter the URL to this PR, or to a specific commit on GitHub.

[Gowee]

Hi, @marcusolsson .

The validator warns that my panel is Missing dist directory, which, in turn, results in the Invalid ID format and Invalid plugin.json error.
However, my project is following the skeleton of the grafana/simple-react-panel where the .gitginore just ignores the dist/ directory. I was expecting that the plugin would be built automatically somehow when being shipped as a plugin in this repository so that dist/ is unnecessary to be tracked by git. Now I realize the workflow differs from what I have expected.
Then, I am not sure what is the best practice to handle this dist/,

• Just remove it from .gitignore and add it to git?
• Or set up a separate release branch to track the dist/ to avoid mess up the version control?

What do you suggest?

Thanks.

[marcusolsson]

As you've noticed, the dist directory needs to be present in the commit. We still have some ways to go when it comes to publishing plugins.

You can find a recommended approach in the tutorial step on how to Publish your plugin.

TL;DR

• Create a release branch
• Run yarn build
• Run git add -f dist to force-add the dist directory

The validator tries to validate the files in the dist directory, but falls back to the src (or root) directory. So the other issues shouldn't be related to the missing dist directory.

[Gowee]

Hmmm. Following the tutorial, I have fixed all the issues reported by the validtor except Invalid ID format & id: Does not match pattern, because I am not sure what is wrong. My panel id is gowee-traceroute-map-panel, where gowee is my registered account on grafana.com.

[marcusolsson]

The plugin ID needs to be 2 or 3 text segments separated by hyphens (yours has 4). A valid ID in your case would be one of these two:

• gowee-panel
• gowee-traceroutemap-panel

[Gowee]

Got it. That might be because I saw there are a few plugins that have 4 segments in their IDs in repo.json (for history reason I guess?).

Now changed to gowee-traceroutemap-panel.

[marcusolsson]

Yes, unfortunately a few (including one of my own 😅) plugins have slipped through the review process in the past. Hopefully, the review process will be more consistent and fair as we start automating more of it. Sorry for the confusion!

[marcusolsson]

Just tested the plugin, and it looks like it's working as intended!

Just an FYI: As long as the data frame has the correct schema, you can use any data source. You might want to document the expected data frame in your README. For example, I tested with the Static data source.

[marcusolsson]

I'd like to congratulate you on finding a gap in the plugin validator! 🎉 😄

I tried publishing your plugin, but wasn't able to. In plugin.json, the screenshot refers to a path in the root directory. When the plugin is built, all required plugin assets needs to be included in the dist directory.

Can I ask that you move the screenshot to the src/img directory (which will be included in the production build)? I'll make sure to add a check in the validator for the future.

[Gowee]

It is a little disappointing that the congratulation is not about my plugin would finally work. 🤣

Certainly, I have corrected the screenshot path. Also, I have updated the README to include the expected data schema. Thanks again for your time and detailed advice.

[Gowee]

It seems that I accidentally include some commits / file changes from #705. It is unexpected and I have no idea how to resolve that. My previous git pull (rebase) trick also does not help. Please let me know if other actions are needed before merging. I think raising a new PR might be a feasible solution?

(Update: Problem solved by some dirty tricks. Now it looks good, at least. )

[marcusolsson]

I promise we'll get there :)

I can see that you've moved the screenshot to src/img, which is great! Unfortunately however, it doesn't seem to be included in dist/img. Did you run yarn build after you moved it? Did you check in the updated dist directory?

It's a really cool plugin, can't wait to publish it!

[Gowee]

I did rebuild and git add -u after merging changes from the master to the release branch. But I forget to git add -f dist/ again, resulting in the screenshot.png is not tracked. Hope there is no omission this time. :-)

[marcusolsson]

Hm. I'm still getting Not Found for the screenshot when I try to publish the plugin. I think it might be because the ./ prefix (which seems silly if it is). I'll ask around to see if this is supported or not. I think it ought to be, but if you don't mind, could you change ./img/screenshot.png to img/screenshot.png?

Thank you for your patience! 🙏

[Gowee]

No problem at all. Updated. 🙂

Gowee/traceroute-map-panel@a59eb13

[marcusolsson]

That was fast! And it indeed did the trick! I'm happy to finally be able to congratulate you on having published your first plugin! 🎉

You can find it here:
https://grafana.com/grafana/plugins/gowee-traceroutemap-panel

Thanks again for your patience and for your contribution! ❤️