Fix missing icon assets (#2985)

* Serve Grafana icons via CDN

* Improve comment

* Improve Grafana assets CDN url

* Bundle icons from @grafana/ui

* Reformat with prettier

Author: aleks-p

public/app/app.tsx

@@ -23,6 +23,17 @@ const root = ReactDOM.createRoot(container);
 
 setupReduxQuerySync();
 
+declare global {
+  interface Window {
+    __grafana_public_path__: string;
+  }
+}
+
+if (typeof window !== 'undefined') {
+  // Icons from @grafana/ui are not bundled, this forces them to be loaded via a CDN instead.
+  window.__grafana_public_path__ = 'assets/grafana/';
+}
+
 function App() {
   useSelectFirstApp();
 

scripts/webpack/webpack.common.js

@@ -1,17 +1,7 @@
-const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
 const path = require('path');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
-//const { dependencies: pyroOSSDeps } = require('../../og/package.json');
-const webpack = require('webpack');
-const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
-
-// this is so that we don't import dependencies twice, once from pyroscope-oss and another from here
-// const deps = Object.entries(pyroOSSDeps).reduce((prev, [name]) => {
-//   return {
-//     ...prev,
-//     [name]: path.resolve(__dirname, `../../node_modules/${name}`),
-//   };
-// }, {});
 
 module.exports = {
   target: 'web',
@@ -58,6 +48,14 @@ module.exports = {
     new MiniCssExtractPlugin({
       filename: '[name].[contenthash].css',
     }),
+    new CopyWebpackPlugin({
+      patterns: [
+        {
+          from: 'node_modules/@grafana/ui/dist/public/img/icons',
+          to: 'grafana/img/icons/',
+        },
+      ],
+    }),
   ],
   module: {
     rules: [

scripts/webpack/webpack.dev.js

@@ -13,6 +13,11 @@ module.exports = merge(common, {
     proxy: {
       '/pyroscope': 'http://localhost:4040',
       '/querier.v1.QuerierService': 'http://localhost:4040',
+      '/assets/grafana/*': {
+        target: 'http://localhost:4041',
+        pathRewrite: { '^/assets': '' },
+        logLevel: 'debug',
+      },
     },
   },
   optimization: {