@grafana/create-plugin 4.15.0-canary.984.9ef654f.0 → 4.15.0

package/CHANGELOG.md

@@ -1,3 +1,27 @@
+# v4.15.0 (Thu Jul 04 2024)
+
+#### 🚀 Enhancement
+
+- Create Plugin: Dynamic webpack publicPath [#966](https://github.com/grafana/plugin-tools/pull/966) ([@jackw](https://github.com/jackw))
+
+#### Authors: 1
+
+- Jack Westbrook ([@jackw](https://github.com/jackw))
+
+---
+
+# v4.14.1 (Thu Jul 04 2024)
+
+#### 🐛 Bug Fix
+
+- Create Plugin: Fix backend dev env for arm64 hosts [#990](https://github.com/grafana/plugin-tools/pull/990) ([@jackw](https://github.com/jackw))
+
+#### Authors: 1
+
+- Jack Westbrook ([@jackw](https://github.com/jackw))
+
+---
+
 # v4.14.0 (Mon Jul 01 2024)
 
 #### 🚀 Enhancement

package/dist/commands/generate/print-success-message.js

@@ -11,7 +11,7 @@ export function printGenerateSuccessMessage(answers) {
         `- \`${packageManagerName} run dev\` to build (and watch) the plugin frontend code.`,
         ...(answers.hasBackend
             ? [
-                '- `mage -v build:linux` to build the plugin backend code. Rerun this command every time you edit your backend files.',
+                '- `mage -v build:backend` to build the plugin backend code. Rerun this command every time you edit your backend files.',
             ]
             : []),
         '- `docker-compose up` to start a grafana development server.',

package/dist/utils/tests/utils.config.test.js

@@ -8,7 +8,6 @@ import { DEFAULT_FEATURE_FLAGS } from '../../constants.js';
 const mocks = vi.hoisted(() => {
     return {
         commandName: 'generate',
-        argv: {},
     };
 });
 vi.mock('../utils.cli.js', async () => mocks);
@@ -21,7 +20,6 @@ describe('getConfig', () => {
     describe('Command: Generate', () => {
         beforeEach(() => {
             mocks.commandName = 'generate';
-            mocks.argv = {};
         });
         it('should give back a default config', async () => {
             const config = getConfig(tmpDir);
@@ -30,22 +28,10 @@ describe('getConfig', () => {
                 features: DEFAULT_FEATURE_FLAGS,
             });
         });
-        it('should override default feature flags via cli args', async () => {
-            mocks.argv = {
-                useReactRouterV6: false,
-                bundleGrafanaUI: true,
-            };
-            const config = getConfig(tmpDir);
-            expect(config).toEqual({
-                version: getVersion(),
-                features: { ...DEFAULT_FEATURE_FLAGS, ...mocks.argv },
-            });
-        });
     });
     describe('Command: Update', () => {
         beforeEach(() => {
             mocks.commandName = 'update';
-            mocks.argv = {};
         });
         it('should give back the correct config when there are no config files at all', async () => {
             const config = getConfig();

package/dist/utils/utils.config.js

@@ -1,7 +1,7 @@
 import fs from 'node:fs';
 import path from 'node:path';
 import { getVersion } from './utils.version.js';
-import { argv, commandName } from './utils.cli.js';
+import { commandName } from './utils.cli.js';
 import { DEFAULT_FEATURE_FLAGS } from '../constants.js';
 export function getConfig(workDir = process.cwd()) {
     const rootConfig = getRootConfig(workDir);
@@ -58,13 +58,8 @@ function readRCFileSync(path) {
     }
 }
 function createFeatureFlags(flags) {
-    const featureFlags = commandName === 'generate' ? DEFAULT_FEATURE_FLAGS : flags ?? {};
-    return Object.entries(featureFlags).reduce((acc, [flag, value]) => {
-        if (argv.hasOwnProperty(flag)) {
-            return { ...acc, [flag]: argv[flag] };
-        }
-        else {
-            return { ...acc, [flag]: value };
-        }
-    }, {});
+    if (commandName === 'generate') {
+        return DEFAULT_FEATURE_FLAGS;
+    }
+    return flags ?? {};
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grafana/create-plugin",
-  "version": "4.15.0-canary.984.9ef654f.0",
+  "version": "4.15.0",
   "repository": {
     "directory": "packages/create-plugin",
     "url": "https://github.com/grafana/plugin-tools"
@@ -87,5 +87,5 @@
   "engines": {
     "node": ">=20"
   },
-  "gitHead": "9ef654f26eeb66e951aa4cd2cacecbf632295c1e"
+  "gitHead": "10a4a8648f2f2794df271011c3bd062d47e323d6"
 }

package/src/commands/generate/print-success-message.ts

@@ -13,7 +13,7 @@ export function printGenerateSuccessMessage(answers: TemplateData) {
     `- \`${packageManagerName} run dev\` to build (and watch) the plugin frontend code.`,
     ...(answers.hasBackend
       ? [
-          '- `mage -v build:linux` to build the plugin backend code. Rerun this command every time you edit your backend files.',
+          '- `mage -v build:backend` to build the plugin backend code. Rerun this command every time you edit your backend files.',
         ]
       : []),
     '- `docker-compose up` to start a grafana development server.',

package/src/utils/tests/utils.config.test.ts

@@ -9,7 +9,6 @@ import { DEFAULT_FEATURE_FLAGS } from '../../constants.js';
 const mocks = vi.hoisted(() => {
   return {
     commandName: 'generate',
-    argv: {},
   };
 });
 
@@ -26,7 +25,6 @@ describe('getConfig', () => {
   describe('Command: Generate', () => {
     beforeEach(() => {
       mocks.commandName = 'generate';
-      mocks.argv = {};
     });
 
     it('should give back a default config', async () => {
@@ -37,25 +35,11 @@ describe('getConfig', () => {
         features: DEFAULT_FEATURE_FLAGS,
       });
     });
-
-    it('should override default feature flags via cli args', async () => {
-      mocks.argv = {
-        useReactRouterV6: false,
-        bundleGrafanaUI: true,
-      };
-      const config = getConfig(tmpDir);
-
-      expect(config).toEqual({
-        version: getVersion(),
-        features: { ...DEFAULT_FEATURE_FLAGS, ...mocks.argv },
-      });
-    });
   });
 
   describe('Command: Update', () => {
     beforeEach(() => {
       mocks.commandName = 'update';
-      mocks.argv = {};
     });
 
     it('should give back the correct config when there are no config files at all', async () => {

package/src/utils/utils.config.ts

@@ -1,7 +1,7 @@
 import fs from 'node:fs';
 import path from 'node:path';
 import { getVersion } from './utils.version.js';
-import { argv, commandName } from './utils.cli.js';
+import { commandName } from './utils.cli.js';
 import { DEFAULT_FEATURE_FLAGS } from '../constants.js';
 
 export type FeatureFlags = {
@@ -83,16 +83,11 @@ function readRCFileSync(path: string): CreatePluginConfig | undefined {
   }
 }
 
-// This function creates feature flags based on the defaults for generate command else flags read from config.
-// In both cases it will override the flags if any cli args with the same name are passed in.
 function createFeatureFlags(flags?: FeatureFlags): FeatureFlags {
-  const featureFlags = commandName === 'generate' ? DEFAULT_FEATURE_FLAGS : flags ?? {};
+  // Default values for new scaffoldings
+  if (commandName === 'generate') {
+    return DEFAULT_FEATURE_FLAGS;
+  }
 
-  return Object.entries(featureFlags).reduce((acc, [flag, value]) => {
-    if (argv.hasOwnProperty(flag)) {
-      return { ...acc, [flag]: argv[flag] };
-    } else {
-      return { ...acc, [flag]: value };
-    }
-  }, {} as FeatureFlags);
+  return flags ?? {};
 }

package/templates/common/.config/Dockerfile

@@ -4,10 +4,11 @@ ARG grafana_image=grafana-enterprise
 FROM grafana/${grafana_image}:${grafana_version}
 
 ARG development=false
+ARG TARGETARCH
 
 {{#if hasBackend}}
 ARG GO_VERSION=1.21.6
-ARG GO_ARCH=amd64
+ARG GO_ARCH=${TARGETARCH:-amd64}
 {{/if}}
 
 ENV DEV "${development}"

package/templates/common/.config/webpack/publicPath.ts

@@ -0,0 +1,17 @@
+/*
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY `@grafana/create-plugin`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ * This file dynamically sets the public path at runtime based on the location of the plugin's AMD module.
+ * It relies on the magic `module` which is defined by the AMD loader.
+ * https://github.com/requirejs/requirejs/wiki/Differences-between-the-simplified-CommonJS-wrapper-and-standard-AMD-define#module
+ *
+ * We fallback to the plugin root so that older versions of Grafana will continue to load the plugin correctly.
+ */
+
+// @ts-nocheck
+import amdMetaModule from 'amd-module';
+
+__webpack_public_path__ =
+  amdMetaModule && amdMetaModule.uri
+    ? amdMetaModule.uri.slice(0, amdMetaModule.uri.lastIndexOf('/') + 1)
+    : 'public/plugins/{{ pluginId }}/';

package/templates/common/.config/webpack/webpack.config.ts

@@ -36,6 +36,8 @@ const config = async (env): Promise<Configuration> => {
     entry: await getEntries(),
 
     externals: [
+      // Required for dynamic publicPath resolution
+      { 'amd-module': 'module' },
       'lodash',
       'jquery',
       'moment',
@@ -104,6 +106,17 @@ const config = async (env): Promise<Configuration> => {
             },
           },
         },
+        {
+          test: /src\/(?:.*\/)?module\.tsx?$/,
+          use: [
+            {
+              loader: 'imports-loader',
+              options: {
+                imports: `side-effects ${path.join(__dirname, 'publicPath.ts')}`,
+              },
+            },
+          ],
+        },
         {
           test: /\.css$/,
           use: ['style-loader', 'css-loader'],
@@ -116,9 +129,6 @@ const config = async (env): Promise<Configuration> => {
           test: /\.(png|jpe?g|gif|svg)$/,
           type: 'asset/resource',
           generator: {
-            // Keep publicPath relative for host.com/grafana/ deployments
-            publicPath: `public/plugins/${pluginJson.id}/img/`,
-            outputPath: 'img/',
             filename: Boolean(env.production) ? '[hash][ext]' : '[file]',
           },
         },
@@ -126,10 +136,7 @@ const config = async (env): Promise<Configuration> => {
           test: /\.(woff|woff2|eot|ttf|otf)(\?v=\d+\.\d+\.\d+)?$/,
           type: 'asset/resource',
           generator: {
-            // Keep publicPath relative for host.com/grafana/ deployments
-            publicPath: `public/plugins/${pluginJson.id}/fonts/`,
-            outputPath: 'fonts/',
-            filename: Boolean(env.production) ? '[hash][ext]' : '[name][ext]',
+            filename: Boolean(env.production) ? '[hash][ext]' : '[file]',
           },
         },
       ],

package/templates/common/_package.json

@@ -43,6 +43,7 @@
     "fork-ts-checker-webpack-plugin": "^8.0.0",
     "glob": "^10.2.7",
     "identity-obj-proxy": "3.0.0",
+    "imports-loader": "^5.0.0",
     "jest": "^29.5.0",
     "jest-environment-jsdom": "^29.5.0",
     "prettier": "^2.8.7",

package/templates/common/docker-compose.yaml

@@ -3,7 +3,6 @@ services:
     user: root
     container_name: '{{ pluginId }}'
 
-    platform: 'linux/amd64'
     build:
       context: ./.config
       args: