@grafana/create-plugin 1.3.0-canary.226.e756884.0 → 1.3.0

package/CHANGELOG.md

@@ -1,3 +1,25 @@
+# v1.3.0 (Fri Apr 28 2023)
+
+#### 🚀 Enhancement
+
+- Create Plugin: Support different Node package managers [#226](https://github.com/grafana/plugin-tools/pull/226) ([@jackw](https://github.com/jackw))
+
+#### 🐛 Bug Fix
+
+- Documentation: Fix path in for template README.md for jest customizations [#218](https://github.com/grafana/plugin-tools/pull/218) ([@briangann](https://github.com/briangann))
+
+#### 🔩 Dependency Updates
+
+- Chore: Update `glob` to v10 [#230](https://github.com/grafana/plugin-tools/pull/230) ([@leventebalogh](https://github.com/leventebalogh))
+
+#### Authors: 3
+
+- Brian Gann ([@briangann](https://github.com/briangann))
+- Jack Westbrook ([@jackw](https://github.com/jackw))
+- Levente Balogh ([@leventebalogh](https://github.com/leventebalogh))
+
+---
+
 # v1.2.1 (Thu Mar 30 2023)
 
 #### 🐛 Bug Fix

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

@@ -15,11 +15,11 @@ var utils_handlebars_1 = require("../../utils/utils.handlebars");
 var utils_packageManager_1 = require("../../utils/utils.packageManager");
 function printGenerateSuccessMessage(answers) {
     var directory = (0, utils_handlebars_1.normalizeId)(answers.pluginName, answers.orgName, answers.pluginType);
-    var packageManager = (0, utils_packageManager_1.getPackageManagerFromUserAgent)().packageManager;
+    var packageManagerName = (0, utils_packageManager_1.getPackageManagerFromUserAgent)().packageManagerName;
     var commands = __spreadArray(__spreadArray([
         "- `cd ./".concat(directory, "`"),
-        "- `".concat(packageManager, " install` to install frontend dependencies."),
-        "- `".concat(packageManager, " run dev` to build (and watch) the plugin frontend code.")
+        "- `".concat(packageManagerName, " install` to install frontend dependencies."),
+        "- `".concat(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.',

package/dist/commands/generate.plopfile.js

@@ -98,17 +98,18 @@ function default_1(plop) {
             var pluginName = _a.pluginName, orgName = _a.orgName, pluginType = _a.pluginType, hasBackend = _a.hasBackend, hasGithubWorkflows = _a.hasGithubWorkflows, hasGithubLevitateWorkflow = _a.hasGithubLevitateWorkflow;
             var exportPath = (0, utils_path_1.getExportPath)(pluginName, orgName, pluginType);
             var pluginId = (0, utils_handlebars_1.normalizeId)(pluginName, orgName, pluginType);
-            var _b = (0, utils_packageManager_1.getPackageManagerFromUserAgent)(), packageManager = _b.packageManager, packageManagerVersion = _b.version;
-            var packageManagerInstallCmd = (0, utils_packageManager_1.getPackageManagerInstallCmd)(packageManager);
+            var _b = (0, utils_packageManager_1.getPackageManagerFromUserAgent)(), packageManagerName = _b.packageManagerName, packageManagerVersion = _b.packageManagerVersion;
+            var packageManagerInstallCmd = (0, utils_packageManager_1.getPackageManagerInstallCmd)(packageManagerName);
+            var templateData = {
+                pluginId: pluginId,
+                packageManagerName: packageManagerName,
+                packageManagerInstallCmd: packageManagerInstallCmd,
+                packageManagerVersion: packageManagerVersion
+            };
             var commonActions = getActionsForTemplateFolder({
                 folderPath: constants_1.TEMPLATE_PATHS.common,
                 exportPath: exportPath,
-                templateData: {
-                    pluginId: pluginId,
-                    packageManager: packageManager,
-                    packageManagerInstallCmd: packageManagerInstallCmd,
-                    packageManagerVersion: packageManagerVersion
-                }
+                templateData: templateData
             });
             var pluginTypeSpecificActions = getActionsForTemplateFolder({
                 folderPath: constants_1.TEMPLATE_PATHS[pluginType],
@@ -130,17 +131,17 @@ function default_1(plop) {
                 ? getActionsForTemplateFolder({
                     folderPath: constants_1.TEMPLATE_PATHS.ciWorkflows,
                     exportPath: exportPath,
-                    templateData: {
-                        packageManager: packageManager,
-                        packageManagerInstallCmd: packageManagerInstallCmd,
-                        packageManagerVersion: packageManagerVersion
-                    }
+                    templateData: templateData
                 })
                 : [];
             var isCompatibleWorkflowActions = hasGithubLevitateWorkflow
-                ? getActionsForTemplateFolder({ folderPath: constants_1.TEMPLATE_PATHS.isCompatibleWorkflow, exportPath: exportPath })
+                ? getActionsForTemplateFolder({
+                    folderPath: constants_1.TEMPLATE_PATHS.isCompatibleWorkflow,
+                    exportPath: exportPath,
+                    templateData: templateData
+                })
                 : [];
-            var readmeActions = getActionsForReadme({ exportPath: exportPath });
+            var readmeActions = getActionsForReadme({ exportPath: exportPath, templateData: templateData });
             return __spreadArray(__spreadArray(__spreadArray(__spreadArray(__spreadArray([], pluginActions, true), ciWorkflowActions, true), readmeActions, true), isCompatibleWorkflowActions, true), [
                 {
                     type: 'updateGoSdkAndModules'
@@ -154,26 +155,30 @@ function default_1(plop) {
 }
 exports["default"] = default_1;
 function getActionsForReadme(_a) {
-    var exportPath = _a.exportPath;
+    var exportPath = _a.exportPath, templateData = _a.templateData;
     return [
-        replacePatternWithTemplateInReadme('-- INSERT FRONTEND GETTING STARTED --', 'frontend-getting-started.md', exportPath),
-        replacePatternWithTemplateInReadme('-- INSERT BACKEND GETTING STARTED --', 'backend-getting-started.md', exportPath),
-        replacePatternWithTemplateInReadme('-- INSERT DISTRIBUTING YOUR PLUGIN --', 'distributing-your-plugin.md', exportPath),
+        replacePatternWithTemplateInReadme('-- INSERT FRONTEND GETTING STARTED --', 'frontend-getting-started.md', exportPath, templateData),
+        replacePatternWithTemplateInReadme('-- INSERT BACKEND GETTING STARTED --', 'backend-getting-started.md', exportPath, templateData),
+        replacePatternWithTemplateInReadme('-- INSERT DISTRIBUTING YOUR PLUGIN --', 'distributing-your-plugin.md', exportPath, templateData),
     ];
 }
-function replacePatternWithTemplateInReadme(pattern, partialsFile, exportPath) {
+function replacePatternWithTemplateInReadme(pattern, partialsFile, exportPath, templateData) {
+    if (templateData === void 0) { templateData = {}; }
     return {
         type: 'modify',
         path: path_1["default"].join(exportPath, 'README.md'),
         pattern: pattern,
         template: undefined,
         templateFile: path_1["default"].join(constants_1.PARTIALS_DIR, partialsFile),
-        data: constants_1.EXTRA_TEMPLATE_VARIABLES
+        data: __assign(__assign({}, constants_1.EXTRA_TEMPLATE_VARIABLES), templateData)
     };
 }
 function getActionsForTemplateFolder(_a) {
     var folderPath = _a.folderPath, exportPath = _a.exportPath, _b = _a.templateData, templateData = _b === void 0 ? {} : _b;
     var files = glob_1["default"].sync("".concat(folderPath, "/**"), { dot: true });
+    if (templateData.packageManagerName !== 'pnpm') {
+        files = files.filter(function (file) { return path_1["default"].basename(file) !== 'npmrc'; });
+    }
     function getExportFileName(f) {
         if (path_1["default"].basename(f) === 'gitignore') {
             return '.gitignore';
@@ -186,11 +191,6 @@ function getActionsForTemplateFolder(_a) {
     function getExportPath(f) {
         return path_1["default"].relative(folderPath, path_1["default"].dirname(f));
     }
-    if (templateData.packageManager !== 'pnpm') {
-        files = files.filter(function (file) {
-            return path_1["default"].basename(file) !== 'npmrc';
-        });
-    }
     return files.filter(isFile).map(function (f) { return ({
         type: 'add',
         templateFile: f,

package/dist/commands/migrate.command.js

@@ -122,7 +122,7 @@ var migrate = function () { return __awaiter(void 0, void 0, void 0, function ()
                     (0, utils_console_1.printMessage)(constants_1.TEXT.updateNpmScriptsAborted);
                 }
                 packageManager = (0, utils_packageManager_1.getPackageManagerWithFallback)();
-                (0, utils_npm_1.writePackageManager)(packageManager);
+                (0, utils_npm_1.writePackageManagerInPackageJson)(packageManager);
                 (0, utils_npm_1.cleanUpPackageJson)();
                 (0, utils_console_1.printSuccessMessage)(constants_1.TEXT.migrationCommandSuccess);
                 return [3, 12];

package/dist/commands/update.command.js

@@ -95,7 +95,7 @@ var update = function () { return __awaiter(void 0, void 0, void 0, function ()
                     (0, utils_console_1.printMessage)(constants_1.TEXT.updateNpmScriptsAborted);
                 }
                 packageManager = (0, utils_packageManager_1.getPackageManagerWithFallback)();
-                (0, utils_npm_1.writePackageManager)(packageManager);
+                (0, utils_npm_1.writePackageManagerInPackageJson)(packageManager);
                 (0, utils_console_1.printSuccessMessage)(constants_1.TEXT.updateCommandSuccess);
                 return [3, 6];
             case 5:

package/dist/utils/utils.npm.js

@@ -14,7 +14,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-exports.cleanUpPackageJson = exports.writePackageManager = exports.updateNpmScripts = exports.removeNpmDependencies = exports.getRemovableNpmDependencies = exports.getUpdatableNpmDependencies = exports.getPackageJsonUpdates = exports.updateNpmDependencies = exports.updatePackageJson = exports.hasNpmDependenciesToUpdate = exports.getPackageJsonUpdatesAsText = exports.getNpmDependencyUpdatesAsText = exports.writePackageJson = exports.getLatestPackageJson = exports.getPackageJson = void 0;
+exports.cleanUpPackageJson = exports.writePackageManagerInPackageJson = exports.updateNpmScripts = exports.removeNpmDependencies = exports.getRemovableNpmDependencies = exports.getUpdatableNpmDependencies = exports.getPackageJsonUpdates = exports.updateNpmDependencies = exports.updatePackageJson = exports.hasNpmDependenciesToUpdate = exports.getPackageJsonUpdatesAsText = exports.getNpmDependencyUpdatesAsText = exports.writePackageJson = exports.getLatestPackageJson = exports.getPackageJson = void 0;
 var path_1 = __importDefault(require("path"));
 var fs_1 = __importDefault(require("fs"));
 var semver_1 = __importDefault(require("semver"));
@@ -204,15 +204,15 @@ function updateNpmScripts() {
     writePackageJson(packageJson);
 }
 exports.updateNpmScripts = updateNpmScripts;
-function writePackageManager(_a) {
-    var packageManager = _a.packageManager, version = _a.version;
+function writePackageManagerInPackageJson(_a) {
+    var packageManagerName = _a.packageManagerName, packageManagerVersion = _a.packageManagerVersion;
     var packageJson = getPackageJson();
     if (!packageJson.packageManager) {
-        packageJson.packageManager = "".concat(packageManager, "@").concat(version);
+        packageJson.packageManager = "".concat(packageManagerName, "@").concat(packageManagerVersion);
         writePackageJson(packageJson);
     }
 }
-exports.writePackageManager = writePackageManager;
+exports.writePackageManagerInPackageJson = writePackageManagerInPackageJson;
 function cleanUpPackageJson() {
     var packageJson = getPackageJson();
     packageJson.scripts = sortKeysAlphabetically(packageJson.scripts);

package/dist/utils/utils.packageManager.js

@@ -9,15 +9,15 @@ var NPM_LOCKFILE = 'package-lock.json';
 var PNPM_LOCKFILE = 'pnpm-lock.yaml';
 var YARN_LOCKFILE = 'yarn.lock';
 var SUPPORTED_PACKAGE_MANAGERS = ['npm', 'yarn', 'pnpm'];
-var LEGACY_PACKAGE_MANAGER = { packageManager: 'yarn', version: '1.22.19' };
+var DEFAULT_PACKAGE_MANAGER = { packageManagerName: 'yarn', packageManagerVersion: '1.22.19' };
 function getPackageManagerFromUserAgent() {
     var agent = process.env.npm_config_user_agent;
-    var _a = agent.split('/'), packageManager = _a[0], versionWithText = _a[1];
+    var _a = agent.split('/'), name = _a[0], versionWithText = _a[1];
     var version = versionWithText.split(' ')[0];
-    if (SUPPORTED_PACKAGE_MANAGERS.includes(packageManager)) {
-        return { packageManager: packageManager, version: version.trimEnd() };
+    if (SUPPORTED_PACKAGE_MANAGERS.includes(name)) {
+        return { packageManagerName: name, packageManagerVersion: version.trimEnd() };
     }
-    return LEGACY_PACKAGE_MANAGER;
+    return DEFAULT_PACKAGE_MANAGER;
 }
 exports.getPackageManagerFromUserAgent = getPackageManagerFromUserAgent;
 function getPackageManagerWithFallback() {
@@ -29,11 +29,11 @@ function getPackageManagerWithFallback() {
     if (packageManagerFromLockFile) {
         return packageManagerFromLockFile;
     }
-    return LEGACY_PACKAGE_MANAGER;
+    return DEFAULT_PACKAGE_MANAGER;
 }
 exports.getPackageManagerWithFallback = getPackageManagerWithFallback;
-function getPackageManagerInstallCmd(packageManager) {
-    switch (packageManager) {
+function getPackageManagerInstallCmd(packageManagerName) {
+    switch (packageManagerName) {
         case 'yarn':
             return 'yarn install --immutable --prefer-offline';
         case 'pnpm':
@@ -54,35 +54,35 @@ function getPackageManagerFromLockFile() {
             var npmVersionCommand = (0, child_process_1.spawnSync)('npm', ['--version'], {
                 shell: true
             });
-            var version = npmVersionCommand.stdout.toString().trimEnd();
-            return { packageManager: 'npm', version: version };
+            var packageManagerVersion = npmVersionCommand.stdout.toString().trimEnd();
+            return { packageManagerName: 'npm', packageManagerVersion: packageManagerVersion };
         }
         if (closestLockfile === PNPM_LOCKFILE) {
             var pnpmVersionCommand = (0, child_process_1.spawnSync)('pnpm', ['--version'], {
                 shell: true
             });
-            var version = pnpmVersionCommand.stdout.toString().trimEnd();
-            return { packageManager: 'pnpm', version: version };
+            var packageManagerVersion = pnpmVersionCommand.stdout.toString().trimEnd();
+            return { packageManagerName: 'pnpm', packageManagerVersion: packageManagerVersion };
         }
         if (closestLockfile === YARN_LOCKFILE) {
             var yarnVersionCommand = (0, child_process_1.spawnSync)('yarn', ['--version'], {
                 shell: true
             });
-            var version = yarnVersionCommand.stdout.toString().trimEnd();
-            return { packageManager: 'yarn', version: version };
+            var packageManagerVersion = yarnVersionCommand.stdout.toString().trimEnd();
+            return { packageManagerName: 'yarn', packageManagerVersion: packageManagerVersion };
         }
         return undefined;
     }
     catch (error) {
-        console.error('Failed to find package manager from lock file');
+        console.error('Failed to find package manager from lock file. Have you installed dependencies?');
         throw Error(error);
     }
 }
 function getPackageManagerFromPackageJson() {
     var packageJson = (0, utils_npm_1.getPackageJson)();
     if (packageJson.hasOwnProperty('packageManager')) {
-        var _a = packageJson.packageManager.split('@'), packageManager = _a[0], version = _a[1];
-        return { packageManager: packageManager, version: version };
+        var _a = packageJson.packageManager.split('@'), packageManagerName = _a[0], packageManagerVersion = _a[1];
+        return { packageManagerName: packageManagerName, packageManagerVersion: packageManagerVersion };
     }
     return undefined;
 }

package/dist/utils/utils.templates.js

@@ -73,7 +73,7 @@ exports.renderTemplateFromFile = renderTemplateFromFile;
 function getTemplateData() {
     var _a, _b, _c;
     var pluginJson = (0, utils_plugin_1.getPluginJson)();
-    var _d = (0, utils_packageManager_1.getPackageManagerWithFallback)(), packageManager = _d.packageManager, packageManagerVersion = _d.version;
-    return __assign(__assign({}, constants_1.EXTRA_TEMPLATE_VARIABLES), { pluginId: pluginJson.id, pluginName: pluginJson.name, pluginDescription: (_a = pluginJson.info) === null || _a === void 0 ? void 0 : _a.description, hasBackend: Boolean(pluginJson.backend), orgName: (_c = (_b = pluginJson.info) === null || _b === void 0 ? void 0 : _b.author) === null || _c === void 0 ? void 0 : _c.name, pluginType: pluginJson.type, packageManager: packageManager, packageManagerVersion: packageManagerVersion });
+    var _d = (0, utils_packageManager_1.getPackageManagerWithFallback)(), packageManagerName = _d.packageManagerName, packageManagerVersion = _d.packageManagerVersion;
+    return __assign(__assign({}, constants_1.EXTRA_TEMPLATE_VARIABLES), { pluginId: pluginJson.id, pluginName: pluginJson.name, pluginDescription: (_a = pluginJson.info) === null || _a === void 0 ? void 0 : _a.description, hasBackend: Boolean(pluginJson.backend), orgName: (_c = (_b = pluginJson.info) === null || _b === void 0 ? void 0 : _b.author) === null || _c === void 0 ? void 0 : _c.name, pluginType: pluginJson.type, packageManagerName: packageManagerName, packageManagerVersion: packageManagerVersion });
 }
 exports.getTemplateData = getTemplateData;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grafana/create-plugin",
-  "version": "1.3.0-canary.226.e756884.0",
+  "version": "1.3.0",
   "main": "index.js",
   "repository": {
     "directory": "packages/create-plugin",
@@ -64,5 +64,5 @@
   "engines": {
     "node": ">=16"
   },
-  "gitHead": "e7568843214a01dd1a86c2bb24d9a77e01982bdb"
+  "gitHead": "75bcdffdcffa1302a0ef270e149c58c4f921a7a7"
 }

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

@@ -5,11 +5,11 @@ import { CliArgs } from '../types';
 
 export function printGenerateSuccessMessage(answers: CliArgs) {
   const directory = normalizeId(answers.pluginName, answers.orgName, answers.pluginType);
-  const { packageManager } = getPackageManagerFromUserAgent();
+  const { packageManagerName } = getPackageManagerFromUserAgent();
   const commands = [
     `- \`cd ./${directory}\``,
-    `- \`${packageManager} install\` to install frontend dependencies.`,
-    `- \`${packageManager} run dev\` to build (and watch) the plugin frontend code.`,
+    `- \`${packageManagerName} install\` to install frontend dependencies.`,
+    `- \`${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.',

package/src/commands/generate.plopfile.ts

@@ -86,19 +86,19 @@ export default function (plop: NodePlopAPI) {
       const exportPath = getExportPath(pluginName, orgName, pluginType);
       const pluginId = normalizeId(pluginName, orgName, pluginType);
       // Support the users package manager of choice.
-      const { packageManager, version: packageManagerVersion } = getPackageManagerFromUserAgent();
-      const packageManagerInstallCmd = getPackageManagerInstallCmd(packageManager);
-
+      const { packageManagerName, packageManagerVersion } = getPackageManagerFromUserAgent();
+      const packageManagerInstallCmd = getPackageManagerInstallCmd(packageManagerName);
+      const templateData = {
+        pluginId,
+        packageManagerName,
+        packageManagerInstallCmd,
+        packageManagerVersion,
+      };
       // Copy over files that are shared between plugins types
       const commonActions = getActionsForTemplateFolder({
         folderPath: TEMPLATE_PATHS.common,
         exportPath,
-        templateData: {
-          pluginId,
-          packageManager,
-          packageManagerInstallCmd,
-          packageManagerVersion,
-        },
+        templateData,
       });
 
       // Copy over files from the plugin type specific folder, e.g. "templates/app" for "app" plugins ("app" | "panel" | "datasource").
@@ -132,20 +132,20 @@ export default function (plop: NodePlopAPI) {
         ? getActionsForTemplateFolder({
             folderPath: TEMPLATE_PATHS.ciWorkflows,
             exportPath,
-            templateData: {
-              packageManager,
-              packageManagerInstallCmd,
-              packageManagerVersion,
-            },
+            templateData,
           })
         : [];
 
       const isCompatibleWorkflowActions = hasGithubLevitateWorkflow
-        ? getActionsForTemplateFolder({ folderPath: TEMPLATE_PATHS.isCompatibleWorkflow, exportPath })
+        ? getActionsForTemplateFolder({
+            folderPath: TEMPLATE_PATHS.isCompatibleWorkflow,
+            exportPath,
+            templateData,
+          })
         : [];
 
       // Replace conditional bits in the Readme files
-      const readmeActions = getActionsForReadme({ exportPath });
+      const readmeActions = getActionsForReadme({ exportPath, templateData });
 
       return [
         ...pluginActions,
@@ -163,22 +163,31 @@ export default function (plop: NodePlopAPI) {
   });
 }
 
-function getActionsForReadme({ exportPath }: { exportPath: string }): ModifyActionConfig[] {
+function getActionsForReadme({
+  exportPath,
+  templateData,
+}: {
+  exportPath: string;
+  templateData: Record<string, string>;
+}): ModifyActionConfig[] {
   return [
     replacePatternWithTemplateInReadme(
       '-- INSERT FRONTEND GETTING STARTED --',
       'frontend-getting-started.md',
-      exportPath
+      exportPath,
+      templateData
     ),
     replacePatternWithTemplateInReadme(
       '-- INSERT BACKEND GETTING STARTED --',
       'backend-getting-started.md',
-      exportPath
+      exportPath,
+      templateData
     ),
     replacePatternWithTemplateInReadme(
       '-- INSERT DISTRIBUTING YOUR PLUGIN --',
       'distributing-your-plugin.md',
-      exportPath
+      exportPath,
+      templateData
     ),
   ];
 }
@@ -186,7 +195,8 @@ function getActionsForReadme({ exportPath }: { exportPath: string }): ModifyActi
 function replacePatternWithTemplateInReadme(
   pattern: string,
   partialsFile: string,
-  exportPath: string
+  exportPath: string,
+  templateData: Record<string, string> = {}
 ): ModifyActionConfig {
   return {
     type: 'modify',
@@ -195,7 +205,10 @@ function replacePatternWithTemplateInReadme(
     // @ts-ignore
     template: undefined,
     templateFile: path.join(PARTIALS_DIR, partialsFile),
-    data: EXTRA_TEMPLATE_VARIABLES,
+    data: {
+      ...EXTRA_TEMPLATE_VARIABLES,
+      ...templateData,
+    },
   };
 }
 
@@ -210,6 +223,12 @@ function getActionsForTemplateFolder({
   templateData?: Record<string, string>;
 }) {
   let files = glob.sync(`${folderPath}/**`, { dot: true });
+
+  // The npmrc file is only useful for `pnpm` settings. We can remove it for other package managers.
+  if (templateData.packageManagerName !== 'pnpm') {
+    files = files.filter((file) => path.basename(file) !== 'npmrc');
+  }
+
   function getExportFileName(f: string) {
     // yarn and npm packing will not include `.gitignore` files
     // so we have to manually rename them to add the dot prefix
@@ -222,17 +241,11 @@ function getActionsForTemplateFolder({
 
     return path.extname(f) === '.hbs' ? path.basename(f, '.hbs') : path.basename(f);
   }
+
   function getExportPath(f: string) {
     return path.relative(folderPath, path.dirname(f));
   }
 
-  // Remove the npmrc file if not running `pnpm`.
-  if (templateData.packageManager !== 'pnpm') {
-    files = files.filter((file) => {
-      return path.basename(file) !== 'npmrc';
-    });
-  }
-
   return files.filter(isFile).map((f) => ({
     type: 'add',
     templateFile: f,

package/src/commands/migrate.command.ts

@@ -10,7 +10,7 @@ import {
   removeNpmDependencies,
   updateNpmScripts,
   cleanUpPackageJson,
-  writePackageManager,
+  writePackageManagerInPackageJson,
 } from '../utils/utils.npm';
 import { getPackageManagerWithFallback } from '../utils/utils.packageManager';
 
@@ -97,9 +97,9 @@ export const migrate = async () => {
       printMessage(TEXT.updateNpmScriptsAborted);
     }
 
-    // Guarantee that the package manager property is set in the package.json file
+    // Guarantee that the package manager property is set in the package.json file if it is missing
     const packageManager = getPackageManagerWithFallback();
-    writePackageManager(packageManager);
+    writePackageManagerInPackageJson(packageManager);
 
     // Tidy package.json file so any changed fields are sorted as a
     // package manager would expect.

package/src/commands/update.command.ts

@@ -6,7 +6,7 @@ import {
   hasNpmDependenciesToUpdate,
   getPackageJsonUpdatesAsText,
   updateNpmScripts,
-  writePackageManager,
+  writePackageManagerInPackageJson,
 } from '../utils/utils.npm';
 import { getPackageManagerWithFallback } from '../utils/utils.packageManager';
 
@@ -67,9 +67,9 @@ export const update = async () => {
       printMessage(TEXT.updateNpmScriptsAborted);
     }
 
-    // Guarantee that the package manager property is set in the package.json file
+    // Guarantee that the package manager property is set in the package.json file if it is missing
     const packageManager = getPackageManagerWithFallback();
-    writePackageManager(packageManager);
+    writePackageManagerInPackageJson(packageManager);
 
     // 4. Summary
     // -------------

package/src/utils/utils.npm.ts

@@ -4,6 +4,7 @@ import semver from 'semver';
 import { readJsonFile } from './utils.files';
 import { renderTemplateFromFile, getTemplateData } from './utils.templates';
 import { GRAFANA_FE_PACKAGES, TEMPLATE_PATHS } from '../constants';
+import { PackageManager } from './utils.packageManager';
 
 type UpdateSummary = Record<string, { prev: string | null; next: string | null }>;
 
@@ -237,10 +238,10 @@ export function updateNpmScripts() {
   writePackageJson(packageJson);
 }
 
-export function writePackageManager({ packageManager, version }: { packageManager: string; version: string }) {
+export function writePackageManagerInPackageJson({ packageManagerName, packageManagerVersion }: PackageManager) {
   const packageJson = getPackageJson();
   if (!packageJson.packageManager) {
-    packageJson.packageManager = `${packageManager}@${version}`;
+    packageJson.packageManager = `${packageManagerName}@${packageManagerVersion}`;
     writePackageJson(packageJson);
   }
 }

package/src/utils/utils.packageManager.ts

@@ -7,19 +7,24 @@ const NPM_LOCKFILE = 'package-lock.json';
 const PNPM_LOCKFILE = 'pnpm-lock.yaml';
 const YARN_LOCKFILE = 'yarn.lock';
 const SUPPORTED_PACKAGE_MANAGERS = ['npm', 'yarn', 'pnpm'];
-const LEGACY_PACKAGE_MANAGER = { packageManager: 'yarn', version: '1.22.19' };
+const DEFAULT_PACKAGE_MANAGER = { packageManagerName: 'yarn', packageManagerVersion: '1.22.19' };
 
-export function getPackageManagerFromUserAgent() {
+export type PackageManager = {
+  packageManagerName: string;
+  packageManagerVersion: string;
+};
+
+export function getPackageManagerFromUserAgent(): PackageManager {
   const agent = process.env.npm_config_user_agent;
 
-  const [packageManager, versionWithText] = agent.split('/');
+  const [name, versionWithText] = agent.split('/');
   const [version] = versionWithText.split(' ');
 
-  if (SUPPORTED_PACKAGE_MANAGERS.includes(packageManager)) {
-    return { packageManager, version: version.trimEnd() };
+  if (SUPPORTED_PACKAGE_MANAGERS.includes(name)) {
+    return { packageManagerName: name, packageManagerVersion: version.trimEnd() };
   }
 
-  return LEGACY_PACKAGE_MANAGER;
+  return DEFAULT_PACKAGE_MANAGER;
 }
 
 export function getPackageManagerWithFallback() {
@@ -33,11 +38,11 @@ export function getPackageManagerWithFallback() {
     return packageManagerFromLockFile;
   }
 
-  return LEGACY_PACKAGE_MANAGER;
+  return DEFAULT_PACKAGE_MANAGER;
 }
 
-export function getPackageManagerInstallCmd(packageManager: string) {
-  switch (packageManager) {
+export function getPackageManagerInstallCmd(packageManagerName: string) {
+  switch (packageManagerName) {
     case 'yarn':
       return 'yarn install --immutable --prefer-offline';
 
@@ -49,7 +54,7 @@ export function getPackageManagerInstallCmd(packageManager: string) {
   }
 }
 
-function getPackageManagerFromLockFile() {
+function getPackageManagerFromLockFile(): PackageManager | undefined {
   const closestLockfilePath = findUpSync([YARN_LOCKFILE, PNPM_LOCKFILE, NPM_LOCKFILE]);
   if (!Boolean(closestLockfilePath)) {
     return undefined;
@@ -62,38 +67,38 @@ function getPackageManagerFromLockFile() {
       const npmVersionCommand = spawnSync('npm', ['--version'], {
         shell: true,
       });
-      const version = npmVersionCommand.stdout.toString().trimEnd();
-      return { packageManager: 'npm', version };
+      const packageManagerVersion = npmVersionCommand.stdout.toString().trimEnd();
+      return { packageManagerName: 'npm', packageManagerVersion };
     }
 
     if (closestLockfile === PNPM_LOCKFILE) {
       const pnpmVersionCommand = spawnSync('pnpm', ['--version'], {
         shell: true,
       });
-      const version = pnpmVersionCommand.stdout.toString().trimEnd();
-      return { packageManager: 'pnpm', version };
+      const packageManagerVersion = pnpmVersionCommand.stdout.toString().trimEnd();
+      return { packageManagerName: 'pnpm', packageManagerVersion };
     }
 
     if (closestLockfile === YARN_LOCKFILE) {
       const yarnVersionCommand = spawnSync('yarn', ['--version'], {
         shell: true,
       });
-      const version = yarnVersionCommand.stdout.toString().trimEnd();
-      return { packageManager: 'yarn', version };
+      const packageManagerVersion = yarnVersionCommand.stdout.toString().trimEnd();
+      return { packageManagerName: 'yarn', packageManagerVersion };
     }
 
     return undefined;
   } catch (error) {
-    console.error('Failed to find package manager from lock file');
+    console.error('Failed to find package manager from lock file. Have you installed dependencies?');
     throw Error(error);
   }
 }
 
-function getPackageManagerFromPackageJson() {
+function getPackageManagerFromPackageJson(): PackageManager | undefined {
   const packageJson = getPackageJson();
   if (packageJson.hasOwnProperty('packageManager')) {
-    const [packageManager, version] = packageJson.packageManager.split('@');
-    return { packageManager, version };
+    const [packageManagerName, packageManagerVersion] = packageJson.packageManager.split('@');
+    return { packageManagerName, packageManagerVersion };
   }
 
   return undefined;

package/src/utils/utils.templates.ts

@@ -64,7 +64,7 @@ export function renderTemplateFromFile(templateFile: string, data?: any) {
 
 export function getTemplateData() {
   const pluginJson = getPluginJson();
-  const { packageManager, version: packageManagerVersion } = getPackageManagerWithFallback();
+  const { packageManagerName, packageManagerVersion } = getPackageManagerWithFallback();
 
   return {
     ...EXTRA_TEMPLATE_VARIABLES,
@@ -74,7 +74,7 @@ export function getTemplateData() {
     hasBackend: Boolean(pluginJson.backend),
     orgName: pluginJson.info?.author?.name,
     pluginType: pluginJson.type,
-    packageManager,
+    packageManagerName,
     packageManagerVersion,
   };
 }

package/templates/_partials/frontend-getting-started.md

@@ -3,53 +3,53 @@
 1. Install dependencies
 
    ```bash
-   yarn install
+   {{ packageManagerName }} run install
    ```
 
 2. Build plugin in development mode and run in watch mode
 
    ```bash
-   yarn dev
+   {{ packageManagerName }} run dev
    ```
 
 3. Build plugin in production mode
 
    ```bash
-   yarn build
+   {{ packageManagerName }} run build
    ```
 
 4. Run the tests (using Jest)
 
    ```bash
    # Runs the tests and watches for changes, requires git init first
-   yarn test
-   
+   {{ packageManagerName }} run test
+
    # Exits after running all the tests
-   yarn test:ci
+   {{ packageManagerName }} run test:ci
    ```
 
 5. Spin up a Grafana instance and run the plugin inside it (using Docker)
 
    ```bash
-   yarn server
+   {{ packageManagerName }} run server
    ```
 
 6. Run the E2E tests (using Cypress)
 
    ```bash
-   # Spins up a Grafana instance first that we tests against 
-   yarn server
-   
+   # Spins up a Grafana instance first that we tests against
+   {{ packageManagerName }} run server
+
    # Starts the tests
-   yarn e2e
+   {{ packageManagerName }} run e2e
    ```
 
 7. Run the linter
 
    ```bash
-   yarn lint
-   
+   {{ packageManagerName }} run lint
+
    # or
 
-   yarn lint:fix
+   {{ packageManagerName }} run lint:fix
    ```

package/templates/common/.config/jest/utils.js

@@ -12,6 +12,7 @@ const nodeModulesToTransform = (moduleNames) => `node_modules\/(?!(${moduleNames
 
 // Array of known nested grafana package dependencies that only bundle an ESM version
 const grafanaESModules = [
+  '.pnpm', // Support using pnpm symlinked packages
   'd3',
   'd3-color',
   'd3-force',

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

@@ -1,11 +1,9 @@
 import fs from 'fs';
 import path from 'path';
 import util from 'util';
-import glob from 'glob';
+import { glob } from 'glob';
 import { SOURCE_DIR } from './constants';
 
-const globAsync = util.promisify(glob);
-
 export function getPackageJson() {
   return require(path.resolve(process.cwd(), 'package.json'));
 }
@@ -21,11 +19,11 @@ export function hasReadme() {
 // Support bundling nested plugins by finding all plugin.json files in src directory
 // then checking for a sibling module.[jt]sx? file.
 export async function getEntries(): Promise<Record<string, string>> {
-  const pluginsJson = await globAsync('**/src/**/plugin.json', { absolute: true });
+  const pluginsJson = await glob('**/src/**/plugin.json', { absolute: true });
 
   const plugins = await Promise.all(pluginsJson.map((pluginJson) => {
       const folder = path.dirname(pluginJson);
-      return globAsync(`${folder}/module.{ts,tsx,js,jsx}`, { absolute: true });
+      return glob(`${folder}/module.{ts,tsx,js,jsx}`, { absolute: true });
     })
   );
 

package/templates/common/npmrc

@@ -1,3 +1,14 @@
+# This file is required for PNPM
+
+# PNPM 8 changed the default resolution mode to "lowest-direct" which is not how we expect resolutions to work
+resolution-mode="highest"
+
+# Make sure the default patterns are still included (https://pnpm.io/npmrc#public-hoist-pattern)
+public-hoist-pattern[]="*eslint*"
+public-hoist-pattern[]="*prettier*"
+
+# Hoist all types packages to the root for better TS support
+public-hoist-pattern[]="@types/*"
+
 # @grafana/e2e expects cypress to exist in the root of the node_modules directory
-# pnpm will put it in node_modules/.pnpm by default
-public-hoist-pattern[]=*cypress*
+public-hoist-pattern[]="*cypress*"

package/templates/common/package.json

@@ -9,9 +9,9 @@
     "test:ci": "jest --passWithNoTests --maxWorkers 4",
     "typecheck": "tsc --noEmit",
     "lint": "eslint --cache --ignore-path ./.gitignore --ext .js,.jsx,.ts,.tsx .",
-    "lint:fix": "{{ packageManager }} run lint --fix",
-    "e2e": "{{ packageManager }} exec cypress install && {{ packageManager }} exec grafana-e2e run",
-    "e2e:update": "{{ packageManager }} exec cypress install && {{ packageManager }} exec grafana-e2e run --update-screenshots",
+    "lint:fix": "{{ packageManagerName }} run lint --fix",
+    "e2e": "{{ packageManagerName }} exec cypress install && {{ packageManagerName }} exec grafana-e2e run",
+    "e2e:update": "{{ packageManagerName }} exec cypress install && {{ packageManagerName }} exec grafana-e2e run --update-screenshots",
     "server": "docker-compose up --build",
     "sign": "npx --yes @grafana/sign-plugin@latest"
   },
@@ -23,23 +23,22 @@
     "@grafana/e2e-selectors": "{{ grafanaVersion }}",
     "@grafana/eslint-config": "^5.1.0",
     "@grafana/tsconfig": "^1.2.0-rc1",
-    "@swc/core": "^1.2.144",
-    "@swc/helpers": "^0.4.12",
+    "@swc/core": "^1.3.51",
+    "@swc/helpers": "^0.5.0",
     "@swc/jest": "^0.2.23",
     "@testing-library/jest-dom": "^5.16.2",
     "@testing-library/react": "^12.1.4",
-    "@types/glob": "^8.0.0",
     "@types/jest": "^29.2.2",
     "@types/lodash": "^4.14.188",
+    "@types/node": "^18.11.9",
     "@types/react": "17.0.42",
     "@types/react-dom": "17.0.14",{{#if_eq pluginType "app"}}
     "@types/react-router-dom": "^5.3.3",{{/if_eq}}
-    "@types/node": "^18.11.9",
     "copy-webpack-plugin": "^11.0.0",
     "css-loader": "^6.7.1",
     "eslint-webpack-plugin": "^3.1.1",
     "fork-ts-checker-webpack-plugin": "^7.2.0",
-    "glob": "^8.0.3",
+    "glob": "^10.0.0",
     "identity-obj-proxy": "3.0.0",
     "jest": "^29.3.1",
     "jest-environment-jsdom": "^29.3.1",
@@ -49,8 +48,8 @@
     "sass-loader": "13.2.0",
     "style-loader": "3.3.1",
     "swc-loader": "^0.2.3",
-    "tsconfig-paths": "^4.1.0",
     "ts-node": "^10.5.0",
+    "tsconfig-paths": "^4.1.0",
     "typescript": "^4.4.0",
     "webpack": "^5.69.1",
     "webpack-cli": "^4.9.2",
@@ -66,8 +65,9 @@
     "@grafana/ui": "{{ grafanaVersion }}",
     "react": "17.0.2",
     "react-dom": "17.0.2",{{#if_eq pluginType "app"}}
-    "react-router-dom": "^5.2.0",{{/if_eq}}
+    "react-router-dom": "^5.2.0",
+    "rxjs": "7.5.7",{{/if_eq}}
     "tslib": "2.5.0"
   },
-  "packageManager": "{{ packageManager }}@{{ packageManagerVersion }}"
+  "packageManager": "{{ packageManagerName }}@{{ packageManagerVersion }}"
 }

package/templates/github/ci/.github/workflows/ci.yml

@@ -16,7 +16,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v3
-{{#if_eq packageManager "pnpm"}}
+{{#if_eq packageManagerName "pnpm"}}
       # pnpm action uses the packageManager field in package.json to
       # understand which version to install.
       - uses: pnpm/action-setup@v2
@@ -25,24 +25,25 @@ jobs:
         uses: actions/setup-node@v3
         with:
           node-version: '16'
-          cache: '{{ packageManager }}'
+          cache: '{{ packageManagerName }}'
+
       - name: Install dependencies
         run: {{ packageManagerInstallCmd }}
 
       - name: Check types
-        run: {{ packageManager }} run typecheck
+        run: {{ packageManagerName }} run typecheck
       - name: Lint
-        run: {{ packageManager }} run lint
+        run: {{ packageManagerName }} run lint
       - name: Unit tests
-        run: {{ packageManager }} run test:ci
+        run: {{ packageManagerName }} run test:ci
       - name: Build frontend
-        run: {{ packageManager }} run build
+        run: {{ packageManagerName }} run build
 
       - name: Start grafana docker
         run: docker-compose up -d
 
       - name: Run e2e tests
-        run: {{ packageManager }} run e2e
+        run: {{ packageManagerName }} run e2e
 
       - name: Stop grafana docker
         run: docker-compose down

package/templates/github/ci/.github/workflows/release.yml

@@ -12,16 +12,17 @@ jobs:
     env:
       GRAFANA_API_KEY: $\{{ secrets.GRAFANA_API_KEY }} # Requires a Grafana API key from Grafana.com.
     steps:
-      - uses: actions/checkout@v3{{#if_eq packageManager "pnpm"}}
+      - uses: actions/checkout@v3
+{{#if_eq packageManagerName "pnpm"}}
+      # pnpm action uses the packageManager field in package.json to
+      # understand which version to install.
       - uses: pnpm/action-setup@v2
-        with:
-          version: 7.x.x{{/if_eq}}
-
+{{/if_eq}}
       - name: Setup Node.js environment
         uses: actions/setup-node@v3
         with:
           node-version: '16'
-          cache: '{{ packageManager }}'
+          cache: '{{ packageManagerName }}'
 
       - name: Setup Go environment
         uses: actions/setup-go@v3
@@ -32,7 +33,7 @@ jobs:
         run: {{ packageManagerInstallCmd }}
 
       - name: Build and test frontend
-        run: {{ packageManager }} run build
+        run: {{ packageManagerName }} run build
 
       - name: Check for backend
         id: check-for-backend
@@ -63,7 +64,7 @@ jobs:
         if: $\{{ env.GRAFANA_API_KEY == '' }}
 
       - name: Sign plugin
-        run: {{ packageManager }} run sign
+        run: {{ packageManagerName }} run sign
         if: $\{{ env.GRAFANA_API_KEY != '' }}
 
       - name: Get plugin metadata

package/templates/github/is-compatible/.github/workflows/is-compatible.yml

@@ -6,13 +6,19 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
+{{#if_eq packageManagerName "pnpm"}}
+      # pnpm action uses the packageManager field in package.json to
+      # understand which version to install.
+      - uses: pnpm/action-setup@v2
+{{/if_eq}}
+      - name: Setup Node.js environment
+        uses: actions/setup-node@v3
         with:
           node-version: '16'
-          cache: '{{ packageManager }}'
+          cache: '{{ packageManagerName }}'
       - name: Install dependencies
         run: {{ packageManagerInstallCmd }}
       - name: Build plugin
-        run: {{ packageManager }} run build
+        run: {{ packageManagerName }} run build
       - name: Compatibility check
         run: npx @grafana/levitate@latest is-compatible --path src/module.ts --target @grafana/data,@grafana/ui,@grafana/runtime