@grafana/create-plugin 6.7.1-canary.2370.20798217827.0 → 6.8.0-canary.2356.20813734793.0

package/src/codemods/utils.externals.ts

@@ -0,0 +1,181 @@
+import * as recast from 'recast';
+import * as typeScriptParser from 'recast/parsers/typescript.js';
+
+import type { Context } from './context.js';
+import { additionsDebug } from './utils.js';
+
+/**
+ * Utility for updating externals arrays in plugin bundler configurations.
+ *
+ * This utility is needed because the location of externals configuration has changed over time:
+ * - **New plugins** (created with recent versions of @grafana/create-plugin): Externals are defined
+ *   in a separate file at `.config/bundler/externals.ts`
+ * - **Older plugins** (created with earlier versions): Externals are defined inline within
+ *   `.config/webpack/webpack.config.ts` as part of the webpack Configuration object
+ *
+ * This utility handles both cases automatically, preferring the modern structure when both exist,
+ * to ensure additions and migrations work correctly regardless of when the plugin was created.
+ */
+
+/**
+ * Type for a function that modifies an externals array
+ * @param externalsArray - The AST node representing the externals array
+ * @returns true if changes were made, false otherwise
+ */
+export type ExternalsArrayModifier = (externalsArray: recast.types.namedTypes.ArrayExpression) => boolean;
+
+const EXTERNALS_PATH = '.config/bundler/externals.ts';
+const WEBPACK_CONFIG_PATH = '.config/webpack/webpack.config.ts';
+
+/**
+ * Updates the externals array in either .config/bundler/externals.ts (preferred) or
+ * .config/webpack/webpack.config.ts (legacy fallback).
+ *
+ * @param context - The codemod context
+ * @param modifier - A function that modifies the externals array and returns true if changes were made
+ * @returns true if changes were made to any file, false otherwise
+ */
+export function updateExternalsArray(context: Context, modifier: ExternalsArrayModifier): boolean {
+  // Try new structure first: .config/bundler/externals.ts
+  if (context.doesFileExist(EXTERNALS_PATH)) {
+    additionsDebug(`Found ${EXTERNALS_PATH}, updating externals array...`);
+    const externalsContent = context.getFile(EXTERNALS_PATH);
+    if (externalsContent) {
+      try {
+        const ast = recast.parse(externalsContent, {
+          parser: typeScriptParser,
+        });
+
+        let hasChanges = false;
+
+        recast.visit(ast, {
+          visitVariableDeclarator(path) {
+            const { node } = path;
+
+            if (
+              node.id.type === 'Identifier' &&
+              node.id.name === 'externals' &&
+              node.init &&
+              node.init.type === 'ArrayExpression'
+            ) {
+              additionsDebug('Found externals array in externals.ts');
+              if (modifier(node.init)) {
+                hasChanges = true;
+              }
+            }
+
+            return this.traverse(path);
+          },
+        });
+
+        if (hasChanges) {
+          const output = recast.print(ast, {
+            tabWidth: 2,
+            trailingComma: true,
+            lineTerminator: '\n',
+          });
+          context.updateFile(EXTERNALS_PATH, output.code);
+          additionsDebug(`Updated ${EXTERNALS_PATH}`);
+          return true;
+        }
+        return false;
+      } catch (error) {
+        additionsDebug(`Error updating ${EXTERNALS_PATH}:`, error);
+        return false;
+      }
+    }
+  }
+
+  // Fall back to legacy structure: .config/webpack/webpack.config.ts with inline externals
+  additionsDebug(`Checking for ${WEBPACK_CONFIG_PATH}...`);
+  if (context.doesFileExist(WEBPACK_CONFIG_PATH)) {
+    additionsDebug(`Found ${WEBPACK_CONFIG_PATH}, checking for inline externals...`);
+    const webpackContent = context.getFile(WEBPACK_CONFIG_PATH);
+    if (webpackContent) {
+      try {
+        const ast = recast.parse(webpackContent, {
+          parser: typeScriptParser,
+        });
+
+        let hasChanges = false;
+        let foundExternals = false;
+
+        recast.visit(ast, {
+          visitObjectExpression(path) {
+            const { node } = path;
+            const properties = node.properties;
+
+            if (properties) {
+              for (const prop of properties) {
+                if (prop && (prop.type === 'Property' || prop.type === 'ObjectProperty')) {
+                  const key = 'key' in prop ? prop.key : null;
+                  const value = 'value' in prop ? prop.value : null;
+
+                  if (
+                    key &&
+                    key.type === 'Identifier' &&
+                    key.name === 'externals' &&
+                    value &&
+                    value.type === 'ArrayExpression'
+                  ) {
+                    foundExternals = true;
+                    additionsDebug('Found externals property in webpack.config.ts');
+                    if (modifier(value)) {
+                      hasChanges = true;
+                    }
+                  }
+                }
+              }
+            }
+
+            return this.traverse(path);
+          },
+          visitProperty(path) {
+            const { node } = path;
+
+            // Also check properties directly (fallback)
+            if (
+              node.key &&
+              node.key.type === 'Identifier' &&
+              node.key.name === 'externals' &&
+              node.value &&
+              node.value.type === 'ArrayExpression'
+            ) {
+              if (!foundExternals) {
+                foundExternals = true;
+                additionsDebug('Found externals property in webpack.config.ts (via visitProperty)');
+              }
+              if (modifier(node.value)) {
+                hasChanges = true;
+              }
+            }
+
+            return this.traverse(path);
+          },
+        });
+
+        if (!foundExternals) {
+          additionsDebug('No externals property found in webpack.config.ts');
+        }
+
+        if (hasChanges) {
+          const output = recast.print(ast, {
+            tabWidth: 2,
+            trailingComma: true,
+            lineTerminator: '\n',
+          });
+          context.updateFile(WEBPACK_CONFIG_PATH, output.code);
+          additionsDebug(`Updated ${WEBPACK_CONFIG_PATH}`);
+          return true;
+        }
+        return false;
+      } catch (error) {
+        additionsDebug(`Error updating ${WEBPACK_CONFIG_PATH}:`, error);
+        return false;
+      }
+    }
+  }
+
+  additionsDebug('No externals configuration found');
+  return false;
+}

package/src/constants.ts

@@ -49,7 +49,6 @@ export const EXTRA_TEMPLATE_VARIABLES = {
 };
 
 export const DEFAULT_FEATURE_FLAGS = {
-  bundleGrafanaUI: false,
   useExperimentalRspack: false,
   useExperimentalUpdates: true,
 };

package/src/types.ts

@@ -21,7 +21,6 @@ export type TemplateData = {
   isAppType: boolean;
   isNPM: boolean;
   version: string;
-  bundleGrafanaUI: boolean;
   scenesVersion: string;
   useExperimentalRspack: boolean;
   pluginExecutable?: string;

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

@@ -46,13 +46,13 @@ describe('getConfig', () => {
 
     it('should override default feature flags via cli args', async () => {
       mocks.argv = {
-        'feature-flags': 'bundleGrafanaUI',
+        'feature-flags': 'useExperimentalRspack',
       };
       const config = getConfig(tmpDir);
 
       expect(config).toEqual({
         version: CURRENT_APP_VERSION,
-        features: { ...DEFAULT_FEATURE_FLAGS, bundleGrafanaUI: true },
+        features: { ...DEFAULT_FEATURE_FLAGS, useExperimentalRspack: true },
       });
     });
   });
@@ -94,7 +94,7 @@ describe('getConfig', () => {
       const userConfigPath = path.join(tmpDir, '.cprc.json');
       const userConfig: UserConfig = {
         features: {
-          bundleGrafanaUI: true,
+          useExperimentalRspack: true,
         },
       };
 
@@ -107,27 +107,5 @@ describe('getConfig', () => {
         features: userConfig.features,
       });
     });
-
-    it('should give back the correct config when config files exist', async () => {
-      const rootConfigPath = path.join(tmpDir, '.config', '.cprc.json');
-      const userConfigPath = path.join(tmpDir, '.cprc.json');
-      const rootConfig: CreatePluginConfig = {
-        version: '1.0.0',
-        features: {},
-      };
-      const userConfig: UserConfig = {
-        features: {
-          bundleGrafanaUI: false,
-        },
-      };
-
-      await fs.mkdir(path.dirname(rootConfigPath), { recursive: true });
-      await fs.writeFile(rootConfigPath, JSON.stringify(rootConfig));
-      await fs.writeFile(userConfigPath, JSON.stringify(userConfig));
-
-      const config = getConfig(tmpDir);
-
-      expect(config).toEqual({ ...rootConfig, ...userConfig });
-    });
   });
 });

package/src/utils/utils.config.ts

@@ -10,7 +10,6 @@ import { writeFile } from 'node:fs/promises';
 import { EOL } from 'node:os';
 
 export type FeatureFlags = {
-  bundleGrafanaUI?: boolean;
   useExperimentalRspack?: boolean;
   useExperimentalUpdates?: boolean;
 };

package/src/utils/utils.templates.ts

@@ -1,10 +1,4 @@
-import {
-  DEFAULT_FEATURE_FLAGS,
-  EXPORT_PATH_PREFIX,
-  EXTRA_TEMPLATE_VARIABLES,
-  PLUGIN_TYPES,
-  TEMPLATE_PATHS,
-} from '../constants.js';
+import { EXPORT_PATH_PREFIX, EXTRA_TEMPLATE_VARIABLES, PLUGIN_TYPES, TEMPLATE_PATHS } from '../constants.js';
 import { GenerateCliArgs, TemplateData } from '../types.js';
 import { filterOutCommonFiles, isFile, isFileStartingWith } from './utils.files.js';
 import {
@@ -95,7 +89,6 @@ export function renderTemplateFromFile(templateFile: string, data?: any) {
 export function getTemplateData(cliArgs?: GenerateCliArgs): TemplateData {
   const { features } = getConfig();
   const currentVersion = CURRENT_APP_VERSION;
-  const bundleGrafanaUI = features.bundleGrafanaUI ?? DEFAULT_FEATURE_FLAGS.bundleGrafanaUI;
   const isAppType = (pluginType: string) => pluginType === PLUGIN_TYPES.app || pluginType === PLUGIN_TYPES.scenes;
   const isNPM = (packageManagerName: string) => packageManagerName === 'npm';
   const frontendBundler = features.useExperimentalRspack ? 'rspack' : 'webpack';
@@ -120,7 +113,6 @@ export function getTemplateData(cliArgs?: GenerateCliArgs): TemplateData {
       isAppType: isAppType(cliArgs.pluginType),
       isNPM: isNPM(packageManagerName),
       version: currentVersion,
-      bundleGrafanaUI,
       scenesVersion: '^6.10.4',
       useExperimentalRspack: Boolean(features.useExperimentalRspack),
       frontendBundler,
@@ -144,7 +136,6 @@ export function getTemplateData(cliArgs?: GenerateCliArgs): TemplateData {
       isAppType: isAppType(pluginJson.type),
       isNPM: isNPM(packageManagerName),
       version: currentVersion,
-      bundleGrafanaUI,
       scenesVersion: '^6.10.4',
       pluginExecutable: pluginJson.executable,
       useExperimentalRspack: Boolean(features.useExperimentalRspack),

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

@@ -1,4 +1,4 @@
-import webpack from 'webpack';
+import webpack, { type Compiler } from 'webpack';
 
 const PLUGIN_NAME = 'BuildModeWebpack';
 

package/templates/common/.cprc.json

@@ -1,6 +1,10 @@
 {
   "features": {
+<<<<<<< HEAD
     "bundleGrafanaUI": {{ bundleGrafanaUI }},
+=======
+    "useReactRouterV6": {{ useReactRouterV6 }},
+>>>>>>> 91a41873 (renome var)
     "useExperimentalRspack": {{ useExperimentalRspack }}
   }
 }