@rancher/create-extension 1.0.0 → 2.0.0

package/migrate/tasks/vueSyntaxUpdates.js

@@ -1,148 +0,0 @@
-const glob = require('glob');
-const { replaceCases } = require('../utils/content');
-const {
-  vueSetReplacement, vueDeleteReplacement, vueKeyReplacement, vueTemplateKeyReplacement, vueTemplateKeyRemoval
-} = require('../utils/vueSyntax');
-
-function vueSyntaxUpdates(params) {
-  const files = glob.sync(
-    params.paths || '**/*.{vue,js,ts}',
-    {
-      ignore: [
-        ...params.ignore,
-        '**/*.spec.ts',
-        '**/*.spec.js',
-        '**/__tests__/**',
-        '**/*.test.ts',
-        'jest.setup.js',
-        '**/*.d.ts',
-        '**/vue-shim.ts',
-      ],
-    }
-  );
-
-  const replacementCases = [
-    // Handle Vue.set and this.$set
-    [/\bVue\.set\(([^,]+),\s*([^,]+),\s*([^)]+)\)/g, (match, obj, prop, val) => vueSetReplacement(match, obj, prop, val), 'Replace Vue.set with direct assignment - https://vuejs.org/guide/extras/reactivity-in-depth.html'],
-    [/\bthis\.\$set\(([^,]+),\s*([^,]+),\s*([^)]+)\)/g, (match, obj, prop, val) => vueSetReplacement(match, obj, prop, val), 'Replace this.$set with direct assignment - https://vuejs.org/guide/extras/reactivity-in-depth.html'],
-
-    // Handle Vue.delete and this.$delete
-    [/\bVue\.delete\(([^,]+),\s*([^)]+)\)/g, (match, obj, prop) => vueDeleteReplacement(match, obj, prop), 'Replace Vue.delete with delete operator - https://vuejs.org/guide/extras/reactivity-in-depth.html'],
-    [/\bthis\.\$delete\(([^,]+),\s*([^)]+)\)/g, (match, obj, prop) => vueDeleteReplacement(match, obj, prop), 'Replace this.$delete with delete operator - https://vuejs.org/guide/extras/reactivity-in-depth.html'],
-
-    // Replace Vue import with createApp and initialize vueApp
-    [/import Vue from 'vue';?/g, `import { createApp } from 'vue';\nconst vueApp = createApp({});`, 'Replace Vue import with createApp - https://v3-migration.vuejs.org/breaking-changes/global-api.html#a-new-global-api-createapp'],
-
-    // Replace new Vue({}) with createApp({})
-    [/new Vue\(/g, 'createApp(', 'Replace new Vue with createApp - https://v3-migration.vuejs.org/breaking-changes/global-api.html#a-new-global-api-createapp'],
-
-    // Replace Vue global methods with vueApp methods
-    [/\bVue\.(config|directive|filter|mixin|component|use|prototype)\b/g, (match, method) => `vueApp.${ method }`, 'Replace Vue global methods with vueApp methods - https://v3-migration.vuejs.org/breaking-changes/global-api.html#a-new-global-api-createapp'],
-
-    // Update Vue.prototype to vueApp.config.globalProperties
-    [/Vue\.prototype/g, 'vueApp.config.globalProperties', 'Update Vue.prototype to vueApp.config.globalProperties - https://v3-migration.vuejs.org/breaking-changes/global-api.html#a-new-global-api-createapp'],
-
-    // Remove Vue.util as it's no longer available
-    [/Vue\.util/g, '', 'Vue.util is private and no longer available - https://v3-migration.vuejs.org/migration-build.html#partially-compatible-with-caveats'],
-
-    // Replace vue-virtual-scroll-list with vue3-virtual-scroll-list
-    [`vue-virtual-scroll-list`, `vue3-virtual-scroll-list`, 'library update'],
-
-    // Update Vue.nextTick
-    [/\bVue\.nextTick\b/g, 'nextTick', 'Update Vue.nextTick to nextTick - https://v3-migration.vuejs.org/breaking-changes/global-api-treeshaking.html#global-api-treeshaking'],
-    [/\bthis\.nextTick\b/g, 'nextTick', 'Update this.nextTick to nextTick - https://v3-migration.vuejs.org/breaking-changes/global-api-treeshaking.html#global-api-treeshaking'],
-    // Note: You may need to import nextTick from 'vue' where used.
-
-    // Update props default function context
-    [/(default)\(\)\s*\{([\s\S]*?)return\s+([\s\S]*?)\}/g, (match, def, middle, retVal) => `${ def }(props) {${ middle }return ${ retVal }}`, 'Update props default function context - https://v3-migration.vuejs.org/breaking-changes/props-default-this.html'],
-
-    // Replace @input with @update:value (excluding plainInputEvent)
-    [/@input="((?!.*plainInputEvent).+?)"/g, (_, handler) => `@update:value="${ handler }"`, 'Update @input to @update:value'],
-
-    // Update v-model syntax
-    [/v-model=/g, 'v-model:value=', 'Update v-model to v-model:value'],
-
-    // Replace .sync modifier with v-model
-    [/:([a-zA-Z0-9_-]+)\.sync=/g, 'v-model:$1=', 'Update .sync modifier to v-model'],
-
-    // Replace click.native with click
-    [/(\b@click)\.native/g, '$1', 'Remove .native modifier from @click'],
-
-    // Remove v-on="$listeners"
-    [/v-on="\$listeners"/g, '', 'Remove v-on="$listeners" as it is no longer needed - https://v3-migration.vuejs.org/breaking-changes/listeners-removed.html'],
-
-    // Update :listeners="$listeners" to v-bind="$attrs"
-    [/:listeners="\$listeners"/g, 'v-bind="$attrs"', 'Update :listeners="$listeners" to v-bind="$attrs" - https://v3-migration.vuejs.org/breaking-changes/listeners-removed.html'],
-
-    // Update $scopedSlots to $slots
-    [/\$scopedSlots/g, '$slots', 'Update $scopedSlots to $slots - https://v3-migration.vuejs.org/breaking-changes/slots-unification.html'],
-
-    // Update slot-scope to v-slot
-    [/slot-scope="([^"]+)"/g, 'v-slot="$1"', 'Update slot-scope to v-slot - https://vuejs.org/guide/components/slots.html#scoped-slots'],
-
-    // Update this.$slots['name'] to this.$slots.name()
-    [/this\.\$slots\['([^']+)'\]/g, `this.$slots[\'$1\']()`, `Update this.$slots['name'] to this.$slots.name() - https://vuejs.org/guide/components/slots.html#scoped-slots`],
-
-    // Remove portal-vue components (now use Teleport)
-    [/<\/?portal(-target)?\b[^>]*>/g, '', 'Remove portal components (use Teleport instead) - https://v3.vuejs.org/guide/teleport.html'],
-
-    // Add :key to <template v-for> elements if missing
-    [
-      /(<template\b[^>]*v-for="([^"]*)"[^>]*)(>)/g,
-      (match, beforeTagEnd, vForContent, tagClose) => vueKeyReplacement(match, beforeTagEnd, vForContent, tagClose),
-      'Add :key to <template v-for> elements if missing, using existing variables',
-    ],
-
-    // Move :key from child elements to <template v-for>
-    [
-      /(<template\b[^>]*v-for="[^"]*"[^>]*>)([\s\S]*?)(<\/template>)/g,
-      (match, templateStart, templateContent, templateEnd) => vueTemplateKeyReplacement(match, templateStart, templateContent, templateEnd),
-      'Move :key from child elements to <template v-for>',
-    ],
-
-    // Remove any remaining :key from child elements within <template v-for>
-    [
-      /(<template\b[^>]*v-for="[^"]*"[^>]*>)([\s\S]*?)(<\/template>)/g,
-      (match, templateStart, templateContent, templateEnd) => vueTemplateKeyRemoval(match, templateStart, templateContent, templateEnd),
-      'Remove any remaining :key from child elements within <template v-for>',
-    ],
-
-    // For other elements with v-for (excluding <template>), ensure :key is present
-    [
-      /(<(?!template\b)\w+[^>]*v-for="([^"]*)"[^>]*)(>)/g,
-      (match, beforeTagEnd, vForContent, tagClose) => vueKeyReplacement(match, beforeTagEnd, vForContent, tagClose),
-      'Add :key to elements with v-for that lack it, using existing variables (excluding <template>)',
-    ],
-
-    // Update custom directives hooks
-    [/\binserted\s*\(/g, 'mounted(', 'Update inserted hook to mounted - https://v3-migration.vuejs.org/breaking-changes/custom-directives.html'],
-    [/\bcomponentUpdated\s*\(/g, 'updated(', 'Update componentUpdated hook to updated - https://v3-migration.vuejs.org/breaking-changes/custom-directives.html'],
-    [/\bunbind\b/g, 'unmounted', 'Update unbind hook to unmounted - https://v3-migration.vuejs.org/breaking-changes/custom-directives.html'],
-
-    // Update hook events
-    [/@hook:/g, '@vue:', 'Update @hook: events to @vue: - https://v3-migration.vuejs.org/breaking-changes/vnode-lifecycle-events.html'],
-
-    // Remove events API ($on, $off, $once)
-    [/\$on\(/g, '', 'Remove $on as the events API has been removed - https://v3-migration.vuejs.org/breaking-changes/events-api.html'],
-    [/\$off\(/g, '', 'Remove $off as the events API has been removed - https://v3-migration.vuejs.org/breaking-changes/events-api.html'],
-    [/\$once\(/g, '', 'Remove $once as the events API has been removed - https://v3-migration.vuejs.org/breaking-changes/events-api.html'],
-
-    // Update Vuex store creation
-    [/new Vuex\.Store\(/g, 'createStore(', 'Update Vuex store creation - https://vuex.vuejs.org/guide/migrating-to-4-0-from-3-x.html#installation-process'],
-    [/import Vuex from 'vuex'/g, `import { createStore } from 'vuex'`, 'Update Vuex import - https://vuex.vuejs.org/guide/migrating-to-4-0-from-3-x.html#installation-process'],
-
-    // Replace n-link with router-link
-    [/<\/?n-link(\s|>)/g, (match) => match.replace('n-link', 'router-link'), 'Replace n-link with router-link'],
-
-    // Replace v-popover with VDropdown
-    [/\bv-popover\b/g, 'VDropdown', 'Replace v-popover with VDropdown'],
-    [/<template\s+#popover>/g, '<template #popper>', 'Update slot name from #popover to #popper'],
-
-    // Extra cases TBD (it seems like we already use the suggested way for arrays)
-    // watch option used on arrays not triggered by mutations - https://v3-migration.vuejs.org/breaking-changes/watch.html
-  ];
-
-  replaceCases('vueSyntax', files, replacementCases, 'Updating Vue syntax', params);
-}
-
-module.exports = vueSyntaxUpdates;

package/migrate/utils/content.js

@@ -1,165 +0,0 @@
-/* eslint-disable no-console */
-const fs = require('fs');
-const { createPatch } = require('diff');
-const stats = require('../stats');
-const {
-  isDry, isSuggest, isVerbose, removePlaceholder
-} = require('../config');
-
-const diffOutput = [];
-
-function printUsage() {
-  console.log(`
-Usage: node index.js [options]
-
-Options:
-
-  --dry                 Dry Run Mode: Run the script without making any changes to your files.
-  --verbose             Verbose Output: Enable detailed logging.
-  --suggest             Suggest Mode: Generate a 'suggested_changes.diff' file with proposed changes.
-  --paths=<path>        Specify Paths: Limit migration to specific paths or files (accepts glob patterns).
-  --ignore=<patterns>   Ignore Patterns: Exclude specific files or directories (accepts comma-separated glob patterns).
-  --files               Output Modified Files: List all files modified during the migration.
-  --log                 Generate Log File: Write detailed migration statistics to 'stats.json'.
-  --help, -h            Display this help message and exit.
-  `);
-}
-
-function writeContent(file, content, originalContent) {
-  if (!isDry && !isSuggest) {
-    fs.writeFileSync(file, content);
-  } else if (isSuggest) {
-    if (typeof originalContent === 'undefined') {
-      originalContent = fs.readFileSync(file, 'utf8');
-    }
-    const diff = createPatch(file, originalContent, content, '', '', { context: 3 });
-
-    if (diff.trim()) {
-      diffOutput.push({ file, diff });
-    }
-  }
-}
-
-function printContent(...args) {
-  if (isVerbose) {
-    console.log(...args);
-  }
-}
-
-function escapeRegExp(string) {
-  return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-}
-
-function setParams(params) {
-  const args = process.argv.slice(2);
-  const paramKeys = ['paths', 'ignore'];
-
-  args.forEach((val) => {
-    paramKeys.forEach((key) => {
-      if (val.startsWith(`--${ key }=`)) {
-        const value = val.split('=')[1];
-
-        if (key === 'ignore') {
-          params.ignorePatterns = value.split(',').map((pattern) => pattern.trim());
-        } else {
-          params[key] = value;
-        }
-      }
-    });
-  });
-
-  // Add user-specified ignore patterns
-  if (params.ignorePatterns.length > 0) {
-    params.ignore = params.ignore.concat(params.ignorePatterns);
-  }
-}
-
-function printLog() {
-  if (process.argv.includes('--files')) {
-    console.dir(stats, { compact: true });
-  }
-
-  const statsCount = Object.entries(stats).reduce(
-    (acc, [key, value]) => ({
-      ...acc,
-      [key]: value.length,
-    }),
-    {}
-  );
-
-  console.table(statsCount);
-
-  if (isSuggest && diffOutput.length > 0) {
-    const diffFile = 'suggested_changes.diff';
-    let diffContent = '';
-
-    diffOutput.forEach(({ file, diff }) => {
-      diffContent += `--- ${ file }\n+++ ${ file }\n${ diff }\n`;
-    });
-
-    fs.writeFileSync(diffFile, diffContent);
-    console.log(`\nSuggested changes have been written to ${ diffFile }`);
-  }
-
-  if (process.argv.includes('--log')) {
-    fs.writeFileSync('stats.json', JSON.stringify(stats, null, 2));
-  }
-}
-
-function replaceCases(fileType, files, replacementCases, printText, params) {
-  files.forEach((file) => {
-    const originalContent = fs.readFileSync(file, 'utf8');
-    let content = originalContent;
-    const matchedCases = [];
-
-    replacementCases.forEach(([pattern, replacement, notes]) => {
-      let matches = false;
-
-      if (typeof pattern === 'string') {
-        const regex = new RegExp(escapeRegExp(pattern), 'g');
-
-        if (regex.test(content)) {
-          matches = true;
-
-          // Exclude cases without replacement
-          if (replacement) {
-            // Remove discontinued functionalities which do not break
-            content = content.replace(regex, replacement === removePlaceholder ? '' : replacement);
-          }
-        }
-      } else if (pattern.test(content)) {
-        matches = true;
-
-        // Exclude cases without replacement
-        if (replacement) {
-          content = content.replace(pattern, replacement === removePlaceholder ? '' : replacement);
-        }
-      }
-
-      if (matches) {
-        matchedCases.push({
-          pattern: pattern.toString(),
-          replacement,
-          notes,
-        });
-      }
-    });
-
-    if (matchedCases.length) {
-      writeContent(file, content, originalContent);
-      printContent(file, printText, matchedCases);
-      stats[fileType].push(file);
-      stats.total.push(file);
-    }
-  });
-}
-
-module.exports = {
-  printUsage,
-  writeContent,
-  printContent,
-  escapeRegExp,
-  setParams,
-  printLog,
-  replaceCases
-};

package/migrate/utils/index.js

@@ -1,4 +0,0 @@
-const vueSyntax = require('./vueSyntax');
-const utils = require('./content');
-
-module.exports = { vueSyntax, utils };

package/migrate/utils/vueSyntax.js

@@ -1,126 +0,0 @@
-/*
-* Vue syntax specific utilities
-*/
-const isSimpleIdentifier = (str) => /^[a-zA-Z_$][0-9a-zA-Z_$]*$/.test(str.trim());
-const isBracketedExpression = (str) => str.trim().startsWith('[') && str.trim().endsWith(']');
-const isStringLiteral = (str) => /^['"].*['"]$/.test(str.trim());
-// Extracts the key expression from a v-for directive.
-const extractKeyExpression = (vForContent) => {
-  const vForMatch = vForContent.match(/^\s*\(([^,]+),\s*([^)]+)\)\s+in\s+(.*)$/);
-  let keyExpression = null;
-
-  if (vForMatch) {
-    // v-for="(item, key) in items"
-    keyExpression = vForMatch[2].trim();
-  } else {
-    const simpleVForMatch = vForContent.match(/^\s*([^\s]+)\s+in\s+(.*)$/);
-
-    if (simpleVForMatch) {
-      // v-for="item in items"
-      // Use 'item' as key if it's a simple identifier
-      keyExpression = isSimpleIdentifier(simpleVForMatch[1].trim()) ? simpleVForMatch[1].trim() : null;
-    }
-  }
-
-  return keyExpression;
-};
-// Adds the :key attribute to a tag if it doesn't already have one.
-const addKeyAttribute = (tag, keyExpression) => {
-  // Add space if necessary
-  const space = tag.endsWith(' ') ? '' : ' ';
-
-  return `${ tag }${ space }:key="${ keyExpression }"`;
-};
-const vueSetReplacement = (match, obj, prop, val) => {
-  prop = prop.trim();
-  obj = obj.trim();
-  val = val.trim();
-
-  if (isBracketedExpression(prop)) {
-    return `${ obj }${ prop } = ${ val }`;
-  } else if (isStringLiteral(prop)) {
-    return `${ obj }[${ prop }] = ${ val }`;
-  } else if (isSimpleIdentifier(prop)) {
-    return `${ obj }.${ prop } = ${ val }`;
-  } else {
-    return `${ obj }[${ prop }] = ${ val }`;
-  }
-};
-const vueDeleteReplacement = (match, obj, prop) => {
-  prop = prop.trim();
-  obj = obj.trim();
-
-  if (isBracketedExpression(prop)) {
-    return `delete ${ obj }${ prop }`;
-  } else if (isStringLiteral(prop)) {
-    return `delete ${ obj }[${ prop }]`;
-  } else if (isSimpleIdentifier(prop)) {
-    return `delete ${ obj }.${ prop }`;
-  } else {
-    return `delete ${ obj }[${ prop }]`;
-  }
-};
-const vueKeyReplacement = (match, beforeTagEnd, vForContent, tagClose) => {
-  // Check if :key exists in the tag
-  if (beforeTagEnd.includes(':key=')) {
-    return match; // :key already exists, do not modify
-  }
-
-  const keyExpression = extractKeyExpression(vForContent);
-
-  if (keyExpression) {
-    const updatedTag = addKeyAttribute(beforeTagEnd, keyExpression);
-
-    return `${ updatedTag }${ tagClose }`;
-  } else {
-  // Cannot safely determine a key, so do not add one
-    return match;
-  }
-};
-const vueTemplateKeyReplacement = (match, templateStart, templateContent, templateEnd) => {
-  // Check if :key is on the <template> tag
-  const hasKeyOnTemplate = /:key=/.test(templateStart);
-
-  // Find any :key on direct child elements
-  const childWithKeyRegex = /(<\w+[^>]*)(\s+:key="([^"]+)")([^>]*>)/g;
-  let updatedContent = templateContent;
-  let movedKey = null;
-
-  updatedContent = updatedContent.replace(childWithKeyRegex, (childMatch, beforeKey, keyAttr, keyValue, afterKey) => {
-    if (!hasKeyOnTemplate && !movedKey) {
-    // Move the first encountered :key to the template
-      movedKey = keyValue;
-    }
-
-    // Remove :key from child element
-    return `${ beforeKey }${ afterKey }`;
-  });
-
-  if (!hasKeyOnTemplate && movedKey) {
-  // Add :key to the <template> tag
-    const updatedTemplateStart = `${ addKeyAttribute(templateStart.replace(/>$/, ''), movedKey) }>`;
-
-    return `${ updatedTemplateStart }${ updatedContent }${ templateEnd }`;
-  }
-
-  return `${ templateStart }${ updatedContent }${ templateEnd }`;
-};
-const vueTemplateKeyRemoval = (match, templateStart, templateContent, templateEnd) => {
-  const childWithKeyRegex = /(<\w+[^>]*)(\s+:key="[^"]+")([^>]*>)/g;
-  const updatedContent = templateContent.replace(childWithKeyRegex, '$1$3');
-
-  return `${ templateStart }${ updatedContent }${ templateEnd }`;
-};
-
-module.exports = {
-  isSimpleIdentifier,
-  isBracketedExpression,
-  isStringLiteral,
-  extractKeyExpression,
-  addKeyAttribute,
-  vueSetReplacement,
-  vueDeleteReplacement,
-  vueKeyReplacement,
-  vueTemplateKeyReplacement,
-  vueTemplateKeyRemoval
-};