Source code linking issues

[MiraeKim1031]

Hi, I'm trying to integrate the grafana-dashboard-reporter-app into my local grafana. But it failed.

How I did it:

1. unzip the source code to grafana's plugins folder.
2. unzip app(mahendrapaipurii-dashboardreporter-app-1.4.1.zip) to grafana's plugins folder
3. create a new folder in the plugins folder of grafana and unzip the source code and app together
4. link the source code with grafana's dist and provisioning with a symbolic link to the source code

If I modify the go file or tsx file inside the source code, I want it to be applied to my local grafana. However, only if I modify the module file will the screen be modified as well. I want to modify the grafana-dashboard-reporter-app project and use it inside my local grafana. Any help would be greatly appreciated.

Sincerely, mirae

[mahendrapaipuri]

Hello @MiraeKim1031, thanks for your interest.

You can look into Devlopment readme to setup your local test environment.

Currently the test environment does not support dynamic compilation of Go package. Everytime you change go source files, you will need to recompile the go package and restart the container. However you can dynamically compile the frontend code by using yarn dev command. Every time you change tsx files, yarn dev command will transpile the code and by doing browser refresh, you will see the changes applied.

[MiraeKim1031]

Hello, @mahendrapaipuri Thank you for your kind and quick response.

My local Grafana folder struct: data ├── plugins/ │ ├── ... │ ├── mahendrapaipuri-dashboardreporter-app │ │ ├──.ci │ │ ├──.config │ │ ├──.github │ │ ├──pkg │ │ ├──provisioning │ │ ├──src │ │ ├──module.js.map │ │ ├──module.js │ │ └── ...

As you can see above, I've unzipped the source code and the plugin app into one folder. However, when I modify the tsx file and run yarn dev, it doesn't get applied to the screen. You need to modify the module file before it will be applied to the screen. I think, it's the module that is currently connected to my local grafana, not the source code. That's why I'm asking how to link this source code with my local grafana. I linked the provisioning with my local grafana, but even then I had to modify the module to get it to the screen.

[mahendrapaipuri]

I would recommend you clone the repository outside Grafana data dir, say, /var/lib/grafana and build the plugin using command yarn build:plugin. It will create a dist folder in the repository which contains all the artifacts of the plugin. You can symlink the dist folder to /var/lib/grafana/plugins/mahendrapaipuri-dashboardreport-app. Now you can run yarn dev command in one terminal and the changes you make to tsx files will be shown in the Grafana instance.

The key take away here is the Grafana will read the contents of dist folder that is created when you run yarn build:plugin and by symlinking it, Grafana will load the correct plugin artifacts