@rancher/create-extension 0.1.0 → 1.0.0-rc.1

package/app/app.package.json

@@ -3,12 +3,29 @@
   "version": "0.1.0",
   "private": false,
   "engines": {
-    "node": ">=12"
+    "node": ">=20"
+  },
+  "dependencies": {
+    "cache-loader": "^4.1.0",
+    "color": "4.2.3",
+    "ip": "2.0.1",
+    "node-polyfill-webpack-plugin": "^3.0.0"
   },
-  "dependencies": {},
   "resolutions": {
-    "**/webpack": "4",
-    "@types/node": "^16",
-    "glob": "7.2.3"
-  }  
+    "@types/node": "~20.10.0",
+    "d3-color": "3.1.0",
+    "ejs": "3.1.9",
+    "follow-redirects": "1.15.2",
+    "glob": "7.2.3",
+    "glob-parent": "6.0.2",
+    "json5": "2.2.3",
+    "@types/lodash": "4.17.5",
+    "merge": "2.1.1",
+    "node-forge": "1.3.1",
+    "nth-check": "2.1.1",
+    "qs": "6.11.1",
+    "roarr": "7.0.4",
+    "semver": "7.5.4",
+    "@vue/cli-service/html-webpack-plugin": "^5.0.0"
+  }
 }

package/app/files/.eslintrc.js

@@ -4,17 +4,19 @@ module.exports = {
     browser: true,
     node:    true
   },
-  globals: { NodeJS: true, Timer: true },
+  globals: {
+    NodeJS: true,
+    Timer:  true
+  },
   extends: [
     'standard',
     'eslint:recommended',
     'plugin:@typescript-eslint/recommended',
     '@vue/standard',
     '@vue/typescript/recommended',
-    'plugin:vue/recommended',
-    'plugin:cypress/recommended',
+    'plugin:vue/vue3-recommended',
+    'plugin:cypress/recommended'
   ],
-  // add your custom rules here
   rules: {
     'dot-notation':             'off',
     'generator-star-spacing':   'off',
@@ -34,141 +36,207 @@ module.exports = {
     'vue/no-unused-components': 'warn',
     'vue/no-v-html':            'error',
     'wrap-iife':                'off',
-
-    'array-bracket-spacing':             'warn',
-    'arrow-parens':                      'warn',
-    'arrow-spacing':                     ['warn', { before: true, after: true }],
-    'block-spacing':                     ['warn', 'always'],
-    'brace-style':                       ['warn', '1tbs'],
-    'comma-dangle':                      ['warn', 'only-multiline'],
-    'comma-spacing':                     'warn',
-    curly:                               'warn',
-    eqeqeq:                              'warn',
-    'func-call-spacing':                 ['warn', 'never'],
-    'implicit-arrow-linebreak':          'warn',
-    indent:                              ['warn', 2],
-    'keyword-spacing':                   'warn',
-    'lines-between-class-members':       ['warn', 'always', { exceptAfterSingleLine: true }],
-    'multiline-ternary':                 ['warn', 'never'],
-    'newline-per-chained-call':          ['warn', { ignoreChainWithDepth: 4 }],
-    'no-caller':                         'warn',
-    'no-cond-assign':                    ['warn', 'except-parens'],
-    'no-console':                        'warn',
-    'no-debugger':                       'warn',
-    'no-eq-null':                        'warn',
-    'no-eval':                           'warn',
-    'no-trailing-spaces':                'warn',
-    'no-undef':                          'warn',
-    'no-unused-vars':                    'warn',
-    'no-whitespace-before-property':     'warn',
-    'object-curly-spacing':              ['warn', 'always'],
-    'object-property-newline':           'warn',
-    'object-shorthand':                  'warn',
-    'padded-blocks':                     ['warn', 'never'],
-    'prefer-arrow-callback':             'warn',
-    'prefer-template':                   'warn',
-    'quote-props':                       'warn',
-    'rest-spread-spacing':               'warn',
-    semi:                                ['warn', 'always'],
-    'space-before-function-paren':       ['warn', 'never'],
-    'space-infix-ops':                   'warn',
-    'spaced-comment':                    'warn',
-    'switch-colon-spacing':              'warn',
-    'template-curly-spacing':            ['warn', 'always'],
-    'yield-star-spacing':                ['warn', 'both'],
-
-    'key-spacing':              ['warn', {
-      align: {
-        beforeColon: false,
-        afterColon:  true,
-        on:          'value',
-        mode:        'minimum'
-      },
-      multiLine: {
-        beforeColon: false,
-        afterColon:  true
-      },
-    }],
-
-    'object-curly-newline':          ['warn', {
-      ObjectExpression:  {
-        multiline:     true,
-        minProperties: 3
-      },
-      ObjectPattern:     {
-        multiline:     true,
-        minProperties: 4
-      },
-      ImportDeclaration: {
-        multiline:     true,
-        minProperties: 5
-      },
-      ExportDeclaration: {
-        multiline:     true,
-        minProperties: 3
+    'array-bracket-spacing':    'warn',
+    'arrow-parens':             'warn',
+    'arrow-spacing':            [
+      'warn',
+      {
+        before: true,
+        after:  true
       }
-    }],
-
+    ],
+    'block-spacing': [
+      'warn',
+      'always'
+    ],
+    'brace-style': [
+      'warn',
+      '1tbs'
+    ],
+    'comma-dangle': [
+      'warn',
+      'only-multiline'
+    ],
+    'comma-spacing':     'warn',
+    curly:               'warn',
+    eqeqeq:              'warn',
+    'func-call-spacing': [
+      'warn',
+      'never'
+    ],
+    'implicit-arrow-linebreak': 'warn',
+    indent:                     [
+      'warn',
+      2
+    ],
+    'keyword-spacing':             'warn',
+    'lines-between-class-members': [
+      'warn',
+      'always',
+      { exceptAfterSingleLine: true }
+    ],
+    'multiline-ternary': [
+      'warn',
+      'never'
+    ],
+    'newline-per-chained-call': [
+      'warn',
+      { ignoreChainWithDepth: 4 }
+    ],
+    'no-caller':      'warn',
+    'no-cond-assign': [
+      'warn',
+      'except-parens'
+    ],
+    'no-console':                    'warn',
+    'no-debugger':                   'warn',
+    'no-eq-null':                    'warn',
+    'no-eval':                       'warn',
+    'no-trailing-spaces':            'warn',
+    'no-undef':                      'warn',
+    'no-unused-vars':                'warn',
+    'no-whitespace-before-property': 'warn',
+    'object-curly-spacing':          [
+      'warn',
+      'always'
+    ],
+    'object-property-newline': 'warn',
+    'object-shorthand':        'warn',
+    'padded-blocks':           [
+      'warn',
+      'never'
+    ],
+    'prefer-arrow-callback': 'warn',
+    'prefer-template':       'warn',
+    'quote-props':           'warn',
+    'rest-spread-spacing':   'warn',
+    semi:                    [
+      'warn',
+      'always'
+    ],
+    'space-before-function-paren': [
+      'warn',
+      'never'
+    ],
+    'space-infix-ops':        'warn',
+    'spaced-comment':         'warn',
+    'switch-colon-spacing':   'warn',
+    'template-curly-spacing': [
+      'warn',
+      'always'
+    ],
+    'yield-star-spacing': [
+      'warn',
+      'both'
+    ],
+    'key-spacing': [
+      'warn',
+      {
+        align: {
+          beforeColon: false,
+          afterColon:  true,
+          on:          'value',
+          mode:        'minimum'
+        },
+        multiLine: {
+          beforeColon: false,
+          afterColon:  true
+        }
+      }
+    ],
+    'object-curly-newline': [
+      'warn',
+      {
+        ObjectExpression: {
+          multiline:     true,
+          minProperties: 3
+        },
+        ObjectPattern: {
+          multiline:     true,
+          minProperties: 4
+        },
+        ImportDeclaration: {
+          multiline:     true,
+          minProperties: 5
+        },
+        ExportDeclaration: {
+          multiline:     true,
+          minProperties: 3
+        }
+      }
+    ],
     'padding-line-between-statements': [
       'warn',
       {
         blankLine: 'always',
         prev:      '*',
-        next:      'return',
+        next:      'return'
       },
       {
         blankLine: 'always',
         prev:      'function',
-        next:      'function',
+        next:      'function'
       },
-      // This configuration would require blank lines after every sequence of variable declarations
       {
         blankLine: 'always',
-        prev:      ['const', 'let', 'var'],
-        next:      '*'
+        prev:      [
+          'const',
+          'let',
+          'var'
+        ],
+        next: '*'
       },
       {
         blankLine: 'any',
-        prev:      ['const', 'let', 'var'],
-        next:      ['const', 'let', 'var']
+        prev:      [
+          'const',
+          'let',
+          'var'
+        ],
+        next: [
+          'const',
+          'let',
+          'var'
+        ]
       }
     ],
-
     quotes: [
       'warn',
       'single',
       {
         avoidEscape:           true,
         allowTemplateLiterals: true
-      },
+      }
     ],
-
     'space-unary-ops': [
       'warn',
       {
         words:    true,
-        nonwords: false,
+        nonwords: false
       }
     ],
-
-    // FIXME: The following is disabled due to new linter and old JS code. These should all be enabled and underlying issues fixed
-    'vue/order-in-components':              'off',
-    'vue/no-lone-template':                 'off',
-    'vue/v-slot-style':                     'off',
-    'vue/component-tags-order':             'off',
-    'vue/no-mutating-props':                'off',
-    '@typescript-eslint/no-unused-vars':    'off',
-    'array-callback-return':                'off',
+    'vue/order-in-components':           'off',
+    'vue/no-lone-template':              'off',
+    'vue/v-slot-style':                  'off',
+    'vue/component-tags-order':          'off',
+    'vue/no-mutating-props':             'off',
+    '@typescript-eslint/no-unused-vars': 'off',
+    'array-callback-return':             'off',
+    'vue/one-component-per-file':        'off',
+    'vue/no-deprecated-slot-attribute':  'off',
+    'vue/require-explicit-emits':        'off',
+    'vue/v-on-event-hyphenation':        'off'
   },
   overrides: [
     {
-      files: ['*.js'],
+      files: [
+        '*.js'
+      ],
       rules: {
-        // FIXME: The following is disabled due to new linter and old JS code. These should all be enabled and underlying issues fixed
         'prefer-regex-literals':                'off',
         'vue/component-definition-name-casing': 'off',
         'no-unreachable-loop':                  'off',
-        'computed-property-spacing':            'off',
+        'computed-property-spacing':            'off'
       }
     }
   ]

package/app/files/.yarnrc.yml

@@ -0,0 +1,2 @@
+nodeLinker: node-modules
+pnpMode: false

package/app/files/tsconfig.json

@@ -10,7 +10,7 @@
     ],
     "esModuleInterop": true,
     "allowJs": true,
-    "sourceMap": true,
+    "sourceMap": false,
     "strict": true,
     "noEmit": true,
     "baseUrl": ".",
@@ -28,7 +28,7 @@
     "typeRoots": [
       "./node_modules",
       "./node_modules/@rancher/shell/types"
-    ],    
+    ],
     "types": [
       "@types/node",
       "cypress",

package/app/init

@@ -1,7 +1,6 @@
 #!/usr/bin/env node
 /* eslint-disable no-console */
 
-const { execSync } = require('child_process');
 const path = require('path');
 const fs = require('fs-extra');
 
@@ -14,9 +13,10 @@ const targets = {
 const files = [
   'tsconfig.json',
   'vue.config.js',
-  '.gitignore',
+  'gitignore',
   '.eslintignore',
   '.eslintrc.js',
+  '.yarnrc.yml',
   'babel.config.js',
   '.vscode/settings.json'
 ];
@@ -26,6 +26,7 @@ console.log('Creating Skeleton Application');
 
 const args = process.argv;
 let appFolder = path.resolve('.');
+let shellVersion = '';
 
 if ( args.length > 2 ) {
   const name = args[2];
@@ -40,7 +41,9 @@ let addGitlabWorkflow = false;
 let addWorkflowFolder = true;
 
 // Check for Gitlab integration option
-if ( args.length > 3 ) {
+if ( args.length >= 3 ) {
+  shellVersion = args[3];
+
   for (let i = 3; i < args.length; i++) {
     switch (args[i]) {
     case '-l':
@@ -95,10 +98,7 @@ Object.keys(targets).forEach((target) => {
 const creatorPkgData = fs.readFileSync(path.join(__dirname, 'package.json'));
 const creatorPkg = JSON.parse(creatorPkgData);
 
-// Fetch the latest version of @rancher/shell
-const shellVersion = execSync('npm view @rancher/shell version').toString().trim();
-
-// Set the latest version of @rancher/shell in the dependencies
+// Set the package version of @rancher/shell in the dependencies
 pkg.dependencies['@rancher/shell'] = `^${ shellVersion }`;
 
 // Rest of dependencies are in the _pkgs property of package.json - copy then across
@@ -138,8 +138,9 @@ if ( addWorkflowFolder ) {
 
 // Copy base files
 files.forEach((file) => {
+  const destinationFile = file === 'gitignore' ? '.gitignore' : file;
   const src = path.join(__dirname, 'files', file);
-  const dest = path.join(appFolder, file);
+  const dest = path.join(appFolder, destinationFile);
 
   if (!fs.existsSync(dest)) {
     console.log(`  Adding file: ${ file }`);

package/app/package.json

@@ -11,7 +11,7 @@
     "init"
   ],
   "engines": {
-    "node": ">=12"
+    "node": ">=20.0.0"
   },
   "_requires": [
     "core-js",

package/init

@@ -4,6 +4,7 @@
 const { execSync } = require('child_process');
 const fs = require('fs');
 const path = require('path');
+const creatorPkg = require('./package.json');
 
 const args = process.argv.slice(2);
 let extensionName = '';
@@ -11,6 +12,7 @@ let appName = '';
 let updateOnly = false;
 let skeletonOnly = false;
 let ignoreShellDepCheck = false;
+let tagUsed = ''; // To store the inferred tag
 
 args.forEach((arg, index) => {
   switch (arg) {
@@ -47,6 +49,45 @@ if ( !extensionName && !updateOnly && !skeletonOnly ) {
   process.exit(1);
 }
 
+// Infer the tag used based on the installed version and dist-tags
+try {
+  const packageName = creatorPkg.name;
+  const currentVersion = creatorPkg.version;
+
+  // Fetch the dist-tags from npm
+  const distTags = JSON.parse(execSync(`npm view ${ packageName } dist-tags --json`).toString());
+
+  // Find the tag matching the current version
+  tagUsed = Object.keys(distTags).find((tag) => distTags[tag] === currentVersion) || 'latest';
+
+  console.log(`Inferred tag used: ${ tagUsed }`);
+} catch (error) {
+  console.error('Error inferring tag:', error.message);
+  process.exit(1);
+}
+
+// Now, check the version of `@rancher/shell` package based on the inferred tag
+let shellVersion = 'latest';
+const shellPackageName = '@rancher/shell';
+
+try {
+  // Fetch the version of the `@rancher/shell` package that corresponds to the inferred tag
+  const tagVersion = execSync(`npm view ${ shellPackageName } dist-tags.${ tagUsed }`).toString().trim();
+
+  if (tagVersion) {
+    shellVersion = tagVersion;
+  } else {
+    const latestVersion = execSync(`npm view ${ shellPackageName } version`).toString().trim();
+
+    shellVersion = latestVersion;
+  }
+} catch (error) {
+  console.error(`  Failed to determine version for ${ shellPackageName }:`, error.message);
+  process.exit(1);
+}
+
+console.log(`  Using version ${ shellVersion } for ${ shellPackageName }`);
+
 const basePath = process.cwd();
 let skeletonPath;
 let isInsideSkeleton = false;
@@ -98,7 +139,7 @@ try {
   if ( !isInsideSkeleton && !skeletonExists ) {
     console.log(`Creating skeleton application: ${ appName }...`);
     // Pass all arguments to the app/init script
-    execSync(`node ${ path.join(__dirname, 'app', 'init') } ${ appName } ${ args.join(' ') }`, { stdio: 'inherit' });
+    execSync(`node ${ path.join(__dirname, 'app', 'init') } ${ appName }  ${ shellVersion } ${ args.join(' ') }`, { stdio: 'inherit' });
 
     // Ensure the skeleton path directory is created before attempting to change directory
     if ( !fs.existsSync(skeletonPath) ) {
@@ -124,7 +165,7 @@ try {
   // Check for package existence and create it if necessary
   if ( !pkgExists ) {
     console.log(`Creating package: ${ extensionName }...`);
-    execSync(`node ${ path.join(__dirname, 'pkg', 'init') } ${ extensionName } ${ args.join(' ') }`, { stdio: 'inherit' });
+    execSync(`node ${ path.join(__dirname, 'pkg', 'init') } ${ extensionName } ${ shellVersion } ${ args.join(' ') }`, { stdio: 'inherit' });
   }
 
   if ( args.includes('--update') || args.includes('-u') ) {

package/package.json

@@ -1,25 +1,27 @@
 {
   "name": "@rancher/create-extension",
   "description": "Rancher UI Extension generator",
-  "version": "0.1.0",
+  "version": "1.0.0-rc.1",
   "license": "Apache-2.0",
   "author": "SUSE",
-  "private": false,
-  "bin": "./init",
+  "packageManager": "yarn@4.4.1",
+  "bin": {
+    "create-extension": "./init"
+  },
   "files": [
     "**/*",
     "init"
   ],
   "engines": {
-    "node": ">=12"
+    "node": ">=20"
   },
   "dependencies": {
     "fs-extra": "^10.0.0"
   },
   "_pkgs": {
-    "core-js": "3.21.1",
+    "core-js": "3.25.3",
     "css-loader": "6.7.3",
     "@types/lodash": "4.14.184",
-    "@rancher/components": "0.2.1-alpha.0"
+    "@rancher/components": "0.3.0-alpha.1"
   }
 }

package/pkg/init

@@ -36,10 +36,13 @@ const args = process.argv;
 const name = args[2];
 const folder = path.resolve('.');
 const pkgFolder = path.join(folder, 'pkg', name);
+let shellVersion = '';
 
 let addTypeFolders = true;
 
-if ( args.length > 3 ) {
+if ( args.length >= 3 ) {
+  shellVersion = args[3];
+
   for ( let i = 3; i < args.length; i++ ) {
     switch (args[i]) {
     case '--skip-templates':
@@ -115,20 +118,12 @@ function fetchLatestVersion() {
 
           pkg.rancher = { annotations: { 'catalog.cattle.io/rancher-version': `>= ${ release.tag_name }` } };
 
-          // Fetch the latest version of @rancher/shell
-          const latestShellVersion = execSync('npm view @rancher/shell version').toString().trim() || null;
-
-          if (!latestShellVersion) {
+          if ( !shellVersion ) {
             console.log('Could not get a shell version from npm, skipping adding catalog.cattle.io/ui-extensions-version annotation to package.json');
           } else {
-            const splitShellVersion = latestShellVersion.split('.');
-            const majorVersion = splitShellVersion[0];
-            const minorVersion = splitShellVersion[1];
-            const parsedShellVersion = `${ majorVersion }.${ minorVersion }.0`;
-
-            console.log(`  Adding catalog.cattle.io/ui-extensions-version '>= ${ parsedShellVersion }' to package.json`);
+            console.log(`  Adding catalog.cattle.io/ui-extensions-version '>= ${ shellVersion }' to package.json`);
 
-            pkg.rancher.annotations['catalog.cattle.io/ui-extensions-version'] = `>= ${ parsedShellVersion }`;
+            pkg.rancher.annotations['catalog.cattle.io/ui-extensions-version'] = `>= ${ shellVersion }`;
           }
 
           writePackageJson();

package/pkg/package.json

@@ -11,7 +11,23 @@
     "init"
   ],
   "engines": {
-    "node": ">=12"
+    "node": ">=20.0.0"
+  },
+  "resolutions": {
+    "d3-color": "3.1.0",
+    "ejs": "3.1.9",
+    "follow-redirects": "1.15.2",
+    "glob": "7.2.3",
+    "glob-parent": "6.0.2",
+    "json5": "2.2.3",
+    "@types/lodash": "4.17.5",
+    "merge": "2.1.1",
+    "node-forge": "1.3.1",
+    "nth-check": "2.1.1",
+    "qs": "6.11.1",
+    "roarr": "7.0.4",
+    "semver": "7.5.4",
+    "@vue/cli-service/html-webpack-plugin": "^5.0.0"
   },
   "dependencies": {
     "fs-extra": "^10.0.0"

package/pkg/pkg.package.json

@@ -6,12 +6,31 @@
   "rancher": true,
   "scripts": {},
   "engines": {
-    "node": ">=12"
+    "node": ">=16"
   },
   "devDependencies": {
-    "@vue/cli-plugin-babel": "4.5.18",
-    "@vue/cli-service": "4.5.18",
-    "@vue/cli-plugin-typescript": "4.5.18"
+    "@vue/cli-plugin-babel": "~5.0.0",
+    "@vue/cli-service": "~5.0.0",
+    "@vue/cli-plugin-typescript": "~5.0.0",
+    "cache-loader": "^4.1.0",
+    "color": "4.2.3",
+    "ip": "2.0.1",
+    "node-polyfill-webpack-plugin": "^3.0.0"
+  },
+  "resolutions": {
+    "d3-color": "3.1.0",
+    "ejs": "3.1.9",
+    "follow-redirects": "1.15.2",
+    "glob": "7.2.3",
+    "glob-parent": "6.0.2",
+    "json5": "2.2.3",
+    "merge": "2.1.1",
+    "node-forge": "1.3.1",
+    "nth-check": "2.1.1",
+    "qs": "6.11.1",
+    "roarr": "7.0.4",
+    "semver": "7.5.4",
+    "@vue/cli-service/html-webpack-plugin": "^5.0.0"
   },
   "browserslist": [
     "> 1%",

package/update/package.json

@@ -12,7 +12,7 @@
     "upgrade"
   ],
   "engines": {
-    "node": ">=12"
+    "node": ">=20.0.0"
   },
   "dependencies": {
     "fs-extra": "^10.0.0"