@rancher/shell 0.1.2 → 0.1.3

package/pkg/auto-import.js

@@ -1,6 +1,6 @@
 const fs = require('fs');
 const path = require('path');
-const contextFolders = ['chart', 'cloud-credential', 'content', 'detail', 'edit', 'list', 'machine-config', 'models', 'promptRemove', 'l10n', 'windowComponents', 'formatters'];
+const contextFolders = ['chart', 'cloud-credential', 'content', 'detail', 'edit', 'list', 'machine-config', 'models', 'promptRemove', 'l10n', 'windowComponents', 'dialog', 'formatters'];
 const contextMap = contextFolders.reduce((map, obj) => {
   map[obj] = true;
 
@@ -11,6 +11,19 @@ function replaceAll(str, find, replace) {
   return str.split(find).join(replace);
 }
 
+function registerFile(file, type, pkg, f) {
+  const importType = (f === 'models') ? 'require' : 'import';
+  const chunkName = (f === 'l10n') ? '' : `/* webpackChunkName: "${ f }" */`;
+
+  return `  $plugin.register('${ f }', '${ type }', () => ${ importType }(${ chunkName }'${ pkg }/${ f }/${ file }'));\n`;
+}
+
+function register(file, pkg, f) {
+  const name = file.replace(/\.[^/.]+$/, '');
+
+  return registerFile(file, name, pkg, f);
+}
+
 // This function is used to generate the code to register models, edit, detail, list etc for a type
 // This is used when building as a library - it does not use require.context - it scans the file system and build time.
 // This ensures that the webpackChunkName is respected (require.context does not support this) - so when build as a library
@@ -20,13 +33,34 @@ function generateTypeImport(pkg, dir) {
 
   // Auto-import if the folder exists
   contextFolders.forEach((f) => {
-    if (fs.existsSync(path.join(dir, f))) {
+    const filePath = path.join(dir, f);
+
+    if (fs.existsSync(filePath)) {
       fs.readdirSync(path.join(dir, f)).forEach((file) => {
-        const name = file.replace(/\.[^/.]+$/, '');
-        const importType = (f === 'models') ? 'require' : 'import';
-        const chunkName = (f === 'l10n') ? '' : `/* webpackChunkName: "${ f }" */`;
+        const fileStat = fs.lstatSync(path.join(filePath, file));
+
+        // Directories are special cases
+        if (fileStat.isDirectory()) {
+          // This might be a <type>/index.vue (aka nested component)
+          const indexFilePath = path.join(file, 'index.vue');
+          const fullIndexFilePath = path.join(filePath, indexFilePath);
 
-        content += `  $plugin.register('${ f }', '${ name }', () => ${ importType }(${ chunkName }'${ pkg }/${ f }/${ file }'));\n`;
+          if (fs.existsSync(fullIndexFilePath)) {
+            content += registerFile(indexFilePath, file, pkg, f);
+
+            return;
+          }
+
+          // This might be a <store name>/<model name|type>.js file (aka nested model)
+          if (f === 'models') {
+            fs.readdirSync(path.join(filePath, file)).forEach((store) => {
+              content += register(path.join(file, store), pkg, f);
+            });
+          }
+        } else {
+          // This is a simple <resource type>.<file type> file
+          content += register(file, pkg, f);
+        }
       });
     }
   });
@@ -48,7 +82,10 @@ function generateDynamicTypeImport(pkg, dir) {
   // Auto-import if the folder exists
   contextFolders.forEach((f) => {
     if (fs.existsSync(path.join(dir, f))) {
-      let genImport = replaceAll(template, 'NAME', f);
+      const safeName = f.replace(/\/|-/g, '_');
+      let genImport = replaceAll(template, 'NAME', safeName);
+
+      genImport = replaceAll(genImport, 'DIR', f );
       const importType = (f === 'models') ? 'require' : 'import';
       // Ensure i18n chunks are named with the request name (which will be the locale)
       const chunk = (f === 'l10n') ? '[request]' : f;

package/pkg/dynamic-plugin-loader.js

@@ -0,0 +1,28 @@
+
+/**
+ * Some plugins won't be bundled with the dashboard build but loaded on demand at run time.
+ * This file allows 'manager' style plugins to defined how to determine if a unknown route
+ * belongs to one of their associated plugins and how that plugin can be loaded
+ */
+class DynamicPluginLoader {
+  dynamicPluginLoaders = [];
+
+  register(reg) {
+    this.dynamicPluginLoaders.push(reg);
+  }
+
+  async check({ route, store }) {
+    for (const dpl of this.dynamicPluginLoaders) {
+      // Check that the route is valid and then load the plugin associated with it
+      const res = await dpl.load({ route, store });
+
+      if (res) {
+        return res;
+      }
+    }
+  }
+}
+
+const dynamicPluginLoader = new DynamicPluginLoader();
+
+export default dynamicPluginLoader;

package/pkg/import.js

@@ -1,4 +1,4 @@
-const _NAME = require.context('BASE/NAME', true, /\.(vue|js|yaml)$/).keys();
+const _NAME = require.context('BASE/DIR', true, /\.(vue|js|yaml)$/).keys();
 
 _NAME.forEach((f) => {
   let name = f.substr(2);
@@ -6,5 +6,5 @@ _NAME.forEach((f) => {
 
   name = name.substr(0, ext);
 
-  $plugin.register('NAME', name, () => REQUIRE(CHUNK`BASE/NAME/${ name }EXT`)); // eslint-disable-line no-undef
+  $plugin.register('DIR', name, () => REQUIRE(CHUNK`BASE/DIR/${ name }EXT`)); // eslint-disable-line no-undef
 });

package/pkg/model-loader-require.lib.js

@@ -0,0 +1,3 @@
+export default function modelLoaderRequire(type) {
+  return null;
+}

package/pkg/vue.config.js

@@ -46,20 +46,23 @@ module.exports = function(dir) {
       config.resolve.alias['~pkg'] = dir;
       delete config.resolve.alias['@'];
 
-      // Prevent the dynamic importer and the model-loader from importing anything dynamically - we don't want all of the
+      // Prevent the dynamic importer and the model-loader-require from importing anything dynamically - we don't want all of the
       // models etc when we build as a library
-      const dynamicImporterOveride = new webpack.NormalModuleReplacementPlugin(/dynamic-importer$/, (resource) => {
+      const dynamicImporterOverride = new webpack.NormalModuleReplacementPlugin(/dynamic-importer$/, (resource) => {
         resource.request = path.join(__dirname, 'dynamic-importer.lib.js');
       });
-      const modelLoaderImporterOveride = new webpack.NormalModuleReplacementPlugin(/model-loader$/, (resource) => {
-        resource.request = path.join(__dirname, 'model-loader.lib.js');
+      const modelLoaderImporterOverride = new webpack.NormalModuleReplacementPlugin(/model-loader-require$/, (resource) => {
+        const fileName = 'model-loader-require.lib.js';
+        const pkgModelLoaderRequire = path.join(dir, fileName);
+
+        resource.request = fs.existsSync(pkgModelLoaderRequire) ? pkgModelLoaderRequire : path.join(__dirname, fileName);
       });
 
       // Auto-generate module to import the types (model, detail, edit etc)
       const autoImportPlugin = new VirtualModulesPlugin({ 'node_modules/@rancher/auto-import': generateTypeImport('@pkg', dir) });
 
-      config.plugins.unshift(dynamicImporterOveride);
-      config.plugins.unshift(modelLoaderImporterOveride);
+      config.plugins.unshift(dynamicImporterOverride);
+      config.plugins.unshift(modelLoaderImporterOverride);
       config.plugins.unshift(autoImportPlugin);
       // config.plugins.unshift(debug);
 

package/plugins/dashboard-store/model-loader-require.js

@@ -0,0 +1,12 @@
+/**
+ * Fetch a model from the dashboard's local model's folder
+ *
+ * Splitting this out into a separate function means packages can
+ * override this to ensure dashboard models aren't bundled with it
+ *
+ * @param {string} type
+ * @returns Model for the given type
+ */
+export default function modelLoaderRequire(type) {
+  return require(`@shell/models/${ type }`);
+}

package/plugins/dashboard-store/model-loader.js

@@ -1,4 +1,5 @@
 import { normalizeType } from './normalize';
+import modelLoaderRequire from './model-loader-require';
 
 const cache = {};
 
@@ -16,7 +17,9 @@ function find(cache, type, rootState) {
     let base;
 
     if (!pluginModel) {
-      base = require(`@shell/models/${ type }`);
+      // Model hasn't come from a plugin, fall back on something reasonable
+      // by default this is the dashboard's local models folder
+      base = modelLoaderRequire(type);
     } else if (typeof pluginModel === 'function') {
       // pluginModel could be an object in the case the plugin is built-in
       base = pluginModel();

package/plugins/dashboard-store/resource-class.js

@@ -24,7 +24,7 @@ import {
   validateDnsLikeTypes,
   validateLength,
 } from '@shell/utils/validators';
-import formRulesGenerator from '@shell/utils/validators/formRules';
+import formRulesGenerator from '@shell/utils/validators/formRules/index';
 import jsyaml from 'js-yaml';
 import compact from 'lodash/compact';
 import forIn from 'lodash/forIn';
@@ -1587,8 +1587,15 @@ export default class Resource {
           if (!isEmpty(validatorName) && validatorExists) {
             CustomValidators[validatorName](pathValue, this.$rootGetters, errors, validatorArgs, displayKey, data);
           } else if (!isEmpty(validatorName) && !validatorExists) {
-            // eslint-disable-next-line
-            console.warn(this.t('validation.custom.missing', { validatorName }));
+            // Check if validator is imported from plugin
+            const pluginValidator = this.$rootState.$plugin?.getValidator(validatorName);
+
+            if (pluginValidator) {
+              pluginValidator(pathValue, this.$rootGetters, errors, validatorArgs, displayKey, data);
+            } else {
+              // eslint-disable-next-line
+              console.warn(this.t('validation.custom.missing', { validatorName }));
+            }
           }
         });
       });

package/plugins/steve/actions.js

@@ -178,7 +178,7 @@ export default {
         const res = err.response;
 
         // Go to the logout page for 401s, unless redirectUnauthorized specifically disables (for the login page)
-        if ( opt.redirectUnauthorized !== false && process.client && res.status === 401 ) {
+        if ( opt.redirectUnauthorized !== false && res.status === 401 ) {
           dispatch('auth/logout', opt.logoutOnError, { root: true });
         }
 

package/plugins/steve/index.js

@@ -10,7 +10,7 @@ import getters, { STEVE_MODEL_TYPES } from './getters';
 import mutations from './mutations';
 import actions from './actions';
 
-function SteveFactory(namespace, baseUrl) {
+export function SteveFactory(namespace, baseUrl) {
   return {
     ...coreStoreModule,
 
@@ -50,6 +50,10 @@ function SteveFactory(namespace, baseUrl) {
   };
 }
 
+export const steveStoreInit = (store, ctx) => {
+  createWorker(store, ctx);
+};
+
 export default (config) => {
   config.namespace = config.namespace || '';
 
@@ -67,8 +71,6 @@ export default (config) => {
   return coreStore(
     SteveFactory(config.namespace, config.baseUrl),
     config,
-    (store, ctx) => {
-      createWorker(store, ctx);
-    }
+    steveStoreInit
   );
 };

package/plugins/steve/subscribe.js

@@ -1,6 +1,7 @@
 import { addObject, clear, removeObject } from '@shell/utils/array';
 import { get } from '@shell/utils/object';
-import { COUNT, SCHEMA } from '@shell/config/types';
+import { COUNT, MANAGEMENT, SCHEMA } from '@shell/config/types';
+import { SETTING } from '@shell/config/settings';
 import Socket, {
   EVENT_CONNECTED,
   EVENT_DISCONNECTED,
@@ -456,28 +457,38 @@ export const actions = {
     clearTimeout(state.queueTimer);
     state.queueTimer = null;
     if (e.type === EVENT_DISCONNECT_ERROR) {
-      // do not send a growl notification unless the socket stays disconnected for more than MINIMUM_TIME_DISCONNECTED
-      setTimeout(() => {
-        if (state.socket.isConnected()) {
-          return;
-        }
-        const dateFormat = escapeHtml( rootGetters['prefs/get'](DATE_FORMAT));
-        const timeFormat = escapeHtml( rootGetters['prefs/get'](TIME_FORMAT));
-        const time = e?.srcElement?.disconnectedAt || Date.now();
-
-        const timeFormatted = `${ day(time).format(`${ dateFormat } ${ timeFormat }`) }`;
-        const url = e?.srcElement?.url;
-
-        const t = rootGetters['i18n/t'];
-
-        dispatch('growl/error', {
-          title:         t('growl.disconnected.title'),
-          message:       t('growl.disconnected.message', { url, time: timeFormatted }, { raw: true }),
-          icon:          'error',
-          earliestClose: time + MINIMUM_TIME_NOTIFIED + MINIMUM_TIME_DISCONNECTED,
-          url
-        }, { root: true });
-      }, MINIMUM_TIME_DISCONNECTED);
+      // determine if websocket notifications are disabled
+      const perfSetting = rootGetters['management/byId'](MANAGEMENT.SETTING, SETTING.UI_PERFORMANCE);
+      let disableGrowl = false;
+
+      if ( perfSetting?.value ) {
+        disableGrowl = JSON.parse(perfSetting.value).disableWebsocketNotification || false;
+      }
+
+      if ( !disableGrowl ) {
+        // do not send a growl notification unless the socket stays disconnected for more than MINIMUM_TIME_DISCONNECTED
+        setTimeout(() => {
+          if (state.socket.isConnected()) {
+            return;
+          }
+          const dateFormat = escapeHtml( rootGetters['prefs/get'](DATE_FORMAT));
+          const timeFormat = escapeHtml( rootGetters['prefs/get'](TIME_FORMAT));
+          const time = e?.srcElement?.disconnectedAt || Date.now();
+
+          const timeFormatted = `${ day(time).format(`${ dateFormat } ${ timeFormat }`) }`;
+          const url = e?.srcElement?.url;
+
+          const t = rootGetters['i18n/t'];
+
+          dispatch('growl/error', {
+            title:         t('growl.disconnected.title'),
+            message:       t('growl.disconnected.message', { url, time: timeFormatted }, { raw: true }),
+            icon:          'error',
+            earliestClose: time + MINIMUM_TIME_NOTIFIED + MINIMUM_TIME_DISCONNECTED,
+            url
+          }, { root: true });
+        }, MINIMUM_TIME_DISCONNECTED);
+      }
     } else {
       // if the error is not a disconnect error, the socket never worked: log whether the current browser is safari
       console.error(`WebSocket Connection Error [${ getters.storeName }]`, e.detail); // eslint-disable-line no-console

package/rancher-components/Form/Checkbox/Checkbox.test.ts

@@ -0,0 +1,77 @@
+import { shallowMount } from '@vue/test-utils';
+import { Checkbox } from './index';
+
+describe('Checkbox.vue', () => {
+  it('is unchecked by default', () => {
+    const wrapper = shallowMount(Checkbox);
+    const cbInput = wrapper.find('input[type="checkbox"]').element as HTMLInputElement;
+
+    expect(cbInput.checked).toBe(false);
+  });
+
+  it('renders a true value', () => {
+    const wrapper = shallowMount(Checkbox, { propsData: { value: true } });
+    const cbInput = wrapper.find('input[type="checkbox"]').element as HTMLInputElement;
+
+    expect(cbInput.checked).toBe(true);
+  });
+
+  it('updates from false to true when props change', async () => {
+    const wrapper = shallowMount(Checkbox);
+    const cbInput = wrapper.find('input[type="checkbox"]').element as HTMLInputElement;
+
+    expect(cbInput.checked).toBe(false);
+
+    await wrapper.setProps({ value: true });
+
+    expect(cbInput.checked).toBe(true);
+  });
+
+  it('emits an input event with a true value', async () => {
+    const wrapper = shallowMount(Checkbox);
+    const event = {
+      target: { tagName: 'input', href: null },
+      stopPropagation: () => { },
+      preventDefault: () => { }
+    };
+
+    (wrapper.vm as any).clicked(event);
+    await wrapper.vm.$nextTick();
+
+    expect(wrapper.emitted().input?.length).toBe(1);
+    expect(wrapper.emitted().input?.[0][0]).toBe(true);
+  });
+
+  it('emits an input event with a custom valueWhenTrue', async () => {
+    const valueWhenTrue = 'BIG IF TRUE';
+    const event = {
+      target: { tagName: 'input', href: null },
+      stopPropagation: () => { },
+      preventDefault: () => { }
+    };
+
+    const wrapper = shallowMount(Checkbox, { propsData: { value: false, valueWhenTrue } });
+
+    (wrapper.vm as any).clicked(event);
+    await wrapper.vm.$nextTick();
+
+    expect(wrapper.emitted().input?.length).toBe(1);
+    expect(wrapper.emitted().input?.[0][0]).toBe(valueWhenTrue);
+  });
+
+  it('updates from valueWhenTrue to falsy', async () => {
+    const valueWhenTrue = 'REAL HUGE IF FALSE';
+    const event = {
+      target: { tagName: 'input', href: null },
+      stopPropagation: () => { },
+      preventDefault: () => { }
+    };
+
+    const wrapper = shallowMount(Checkbox, { propsData: { value: valueWhenTrue, valueWhenTrue } });
+
+    (wrapper.vm as any).clicked(event);
+    await wrapper.vm.$nextTick();
+
+    expect(wrapper.emitted().input?.[0][0]).toBe(null);
+  })
+});

package/rancher-components/Form/Checkbox/Checkbox.vue

@@ -9,7 +9,7 @@ export default Vue.extend({
      * The checkbox value.
      */
     value: {
-      type:    [Boolean, Array] as PropType<boolean | boolean[]>,
+      type:    [Boolean, Array, String] as PropType<boolean | boolean[] | string>,
       default: false
     },
 
@@ -169,6 +169,12 @@ export default Vue.extend({
           addObject(this.value, this.valueWhenTrue);
         }
         this.$emit('input', this.value);
+      } else if (this.isString(this.valueWhenTrue)) {
+        if (this.isChecked) {
+          this.$emit('input', null);
+        } else {
+          this.$emit('input', this.valueWhenTrue);
+        }
       } else {
         this.$emit('input', !this.value);
         this.$el.dispatchEvent(click);
@@ -178,10 +184,14 @@ export default Vue.extend({
     /**
      * Determines if there are multiple values for the checkbox.
      */
-    isMulti(value: boolean | boolean[]): value is boolean[] {
+    isMulti(value: boolean | boolean[] | string): value is boolean[] {
       return Array.isArray(value);
     },
 
+    isString(value: boolean | number | string): value is boolean {
+      return typeof value === 'string';
+    },
+
     /**
      * Finds the first true value for multiple checkboxes.
      * @param value A collection of values for the checkbox.

package/scripts/build-pkg.sh

@@ -4,6 +4,20 @@ SCRIPT_DIR="$( cd -- "$( dirname -- "${BASH_SOURCE[0]}" )" &> /dev/null && pwd )
 BASE_DIR="$( cd $SCRIPT_DIR && cd ../.. & pwd)"
 SHELL_DIR=$BASE_DIR/shell/
 EXIT_CODE=0
+FORMATS="umd-min"
+
+while getopts "df:" opt; do
+  case $opt in
+    d)
+      FORMATS="umd"
+      ;;
+    f)
+      FORMATS=$OPTARG
+      ;;      
+  esac
+done
+
+shift $((OPTIND-1))
 
 # Use shell folder in node modules when we have @rancher/shell installed as a node module
 # rather than the use-case of the mono-repo with the shell folder at the top-level
@@ -12,7 +26,12 @@ if [ ! -d ${SHELL_DIR} ]; then
   SHELL_DIR=$(cd -P ${SHELL_DIR} && pwd)
 fi
 
-VERSION=$(cd pkg/$1; node -p -e "require('./package.json').version")
+CREATE_TARBALL=${2}
+
+if [ -z "$VERSION" ]; then
+  VERSION=$(cd pkg/$1; node -p -e "require('./package.json').version")
+fi
+
 NAME=${1}-${VERSION}
 PKG_DIST=${BASE_DIR}/dist-pkg/${NAME}
 
@@ -20,6 +39,7 @@ if [ -d "${BASE_DIR}/pkg/${1}" ]; then
   echo "Building UI Package $1"
   echo "  Package name:    ${NAME}"
   echo "  Package version: ${VERSION}"
+  echo "  Output formats:  ${FORMATS}"
   rm -rf ${PKG_DIST}
   mkdir -p ${PKG_DIST}
 
@@ -42,7 +62,11 @@ if [ -d "${BASE_DIR}/pkg/${1}" ]; then
     FILE=index.ts
   fi
 
-  ${BASE_DIR}/node_modules/.bin/vue-cli-service build --name ${NAME} --target lib ${FILE} --dest ${PKG_DIST} --formats umd-min --filename ${NAME}
+  if [ -n "$COMMIT" ]; then
+    echo ${COMMIT} > ${PKG_DIST}/version
+  fi
+
+  ${BASE_DIR}/node_modules/.bin/vue-cli-service build --name ${NAME} --target lib ${FILE} --dest ${PKG_DIST} --formats ${FORMATS} --filename ${NAME}
   EXIT_CODE=$?
   cp -f ./package.json ${PKG_DIST}/package.json
   node ${SCRIPT_DIR}/pkgfile.js ${PKG_DIST}/package.json
@@ -52,4 +76,26 @@ if [ -d "${BASE_DIR}/pkg/${1}" ]; then
   popd  
 fi
 
+if [ $EXIT_CODE -ne 0 ]; then
+  exit $EXIT_CODE
+fi
+
+
+if [ -n "${CREATE_TARBALL}" ]; then
+  echo $COMMIT $COMMIT_BRANCH > ${PKG_DIST}/version-commit.txt
+
+  TARBALL=${NAME}.tar.gz
+
+  pushd ${PKG_DIST}
+
+  rm -f ../$TARBALL
+
+  echo "Compressing to ${TARBALL}..."
+
+  tar -czf ../${TARBALL} .
+
+  popd
+
+fi
+
 exit $EXIT_CODE

package/scripts/drone-build-pkg.sh

@@ -0,0 +1,31 @@
+#!/usr/bin/env bash
+
+yarn --pure-lockfile install
+
+source scripts/version
+
+if [[ $COMMIT_BRANCH == "master" ]]; then
+  VERSION="latest"
+else
+  VERSION=$(cd pkg/$1; node -p -e "require('./package.json').version")
+fi
+
+echo "Drone Build Args"
+echo "COMMIT: ${COMMIT}"
+echo "COMMIT_BRANCH: ${COMMIT_BRANCH}"
+echo "VERSION: ${VERSION}"
+echo ""
+
+# package, override version, commit for file in pkg root
+# Note - in the future env vars should be moved to args and build-pkg should use getopts
+COMMIT=$COMMIT COMMIT_BRANCH=$COMMIT_BRANCH VERSION=$VERSION ./shell/scripts/build-pkg.sh ${1} "true"
+EXIT_CODE=$?
+
+export PKG_NAME=${1}-${VERSION}
+export PKG_TARBALL=${PKG_NAME}.tar.gz
+
+echo "Drone Build Artefacts"
+echo "Package Directory: ${PKG_NAME}"
+echo "Package Tarball: ${PKG_TARBALL}"
+
+exit $EXIT_CODE

package/scripts/publish-shell.sh

@@ -1,7 +1,10 @@
 #!/usr/bin/env bash
 
-SCRIPT_DIR="$( cd -- "$( dirname -- "${BASH_SOURCE[0]}" )" &> /dev/null && pwd )"
-BASE_DIR="$( cd $SCRIPT_DIR && cd ../.. & pwd)"
+SCRIPT_DIR="$(cd -- "$(dirname -- "${BASH_SOURCE[0]}")" &>/dev/null && pwd)"
+BASE_DIR="$(
+  cd $SCRIPT_DIR && cd ../.. &
+  pwd
+)"
 SHELL_DIR=$BASE_DIR/shell/
 PUBLISH_ARGS="--no-git-tag-version --access public"
 
@@ -18,10 +21,10 @@ mkdir -p ${PKG_DIST}
 rm -rf ${PKG_DIST}/app
 rm -rf ${PKG_DIST}/pkg
 
-pushd ${SHELL_DIR} > /dev/null
+pushd ${SHELL_DIR} >/dev/null
 
-PKG_VERSION=`node -p "require('./package.json').version"`
-popd > /dev/null
+PKG_VERSION=$(node -p "require('./package.json').version")
+popd >/dev/null
 
 echo "Publishing version: $PKG_VERSION"
 
@@ -39,7 +42,7 @@ function publish() {
   FOLDER=$2
 
   echo "Publishing ${NAME} from ${FOLDER}"
-  pushd ${FOLDER} > /dev/null
+  pushd ${FOLDER} >/dev/null
 
   # For now, copy the rancher components into the shell and ship them with it
   if [ "$NAME" == "Shell" ]; then
@@ -50,11 +53,7 @@ function publish() {
 
   yarn publish . --new-version ${PKG_VERSION} ${PUBLISH_ARGS}
   RET=$?
-
-  # Remove the rancher-components folder if we created it
-  rm -rf ${SHELL_DIR}/rancher-components
-
-  popd > /dev/null
+  popd >/dev/null
 
   if [ $RET -ne 0 ]; then
     echo "Error publishing package ${NAME}"

package/scripts/serve-pkgs

@@ -9,13 +9,14 @@ const dir = path.resolve('.');
 const pkgs = path.join(dir, 'dist-pkg');
 let port = 4500;
 
-var express = require('express')
-var serveStatic = require('serve-static');
- 
-var app = express()
+const express = require('express');
+const serveStatic = require('serve-static');
+
+const app = express();
 
 function catalog(res) {
   const response = [];
+
   fs.readdirSync(pkgs).forEach((f) => {
     const pkgFile = path.join(pkgs, f, 'package.json');
 
@@ -27,7 +28,7 @@ function catalog(res) {
     }
   });
 
-  res.json(response)
+  res.json(response);
 }
 
 app.use('/', (req, res, next) => {
@@ -37,7 +38,7 @@ app.use('/', (req, res, next) => {
 
   return next();
 });
- 
+
 app.use(serveStatic(pkgs));
 
 if (process.env.PORT) {
@@ -47,16 +48,22 @@ if (process.env.PORT) {
 const base = `http://127.0.0.1:${ port }`;
 
 console.log('');
-console.log(`Serving catalog on ${ base }`)
+console.log(`Serving catalog on ${ base }`);
 console.log('');
 console.log(`Serving packages:`);
 console.log('');
 fs.readdirSync(pkgs).forEach((f) => {
-  const main = `${ f }.umd.min.js`;
+  let main = `${ f }.umd.min.js`;
 
   if (fs.existsSync(path.join(pkgs, f, main))) {
     console.log(`  ${ f } available at: ${ base }/${ f }/${ main }`);
+  } else {
+    main = `${ f }.umd.js`;
+
+    if (fs.existsSync(path.join(pkgs, f, main))) {
+      console.log(`  ${ f } available at: ${ base }/${ f }/${ main }`);
+    }
   }
 });
- 
-app.listen(port)
+
+app.listen(port);