@rancher/shell 3.0.1-rc.3 → 3.0.1

package/components/ResourceYaml.vue

@@ -205,58 +205,6 @@ export default {
       cm.getMode().fold = saved;
     },
 
-    onChanges(cm, changes) {
-      if ( changes.length !== 1 ) {
-        return;
-      }
-
-      const change = changes[0];
-
-      if ( change.from.line !== change.to.line ) {
-        return;
-      }
-
-      let line = change.from.line;
-      let str = cm.getLine(line);
-      let maxIndent = indentChars(str);
-
-      if ( maxIndent === null ) {
-        return;
-      }
-
-      cm.replaceRange('', { line, ch: 0 }, { line, ch: 1 }, '+input');
-
-      while ( line > 0 ) {
-        line--;
-        str = cm.getLine(line);
-        const indent = indentChars(str);
-
-        if ( indent === null ) {
-          break;
-        }
-
-        if ( indent < maxIndent ) {
-          cm.replaceRange('', { line, ch: 0 }, { line, ch: 1 }, '+input');
-
-          if ( indent === 0 ) {
-            break;
-          }
-
-          maxIndent = indent;
-        }
-      }
-
-      function indentChars(str) {
-        const match = str.match(/^#(\s+)/);
-
-        if ( match ) {
-          return match[1].length;
-        }
-
-        return null;
-      }
-    },
-
     updateValue(value) {
       this.$refs.yamleditor.updateValue(value);
     },
@@ -354,7 +302,6 @@ export default {
       class="yaml-editor flex-content"
       :editor-mode="editorMode"
       @onReady="onReady"
-      @onChanges="onChanges"
     />
     <slot
       name="yamlFooter"

package/components/SortableTable/index.vue

@@ -361,7 +361,13 @@ export default {
     externalPaginationResult: {
       type:    Object,
       default: null
+    },
+
+    manualRefreshButtonSize: {
+      type:    String,
+      default: ''
     }
+
   },
 
   data() {
@@ -1140,8 +1146,8 @@ export default {
           <slot name="header-right" />
           <AsyncButton
             v-if="isTooManyItemsToAutoUpdate"
-            class="manual-refresh"
             mode="manual-refresh"
+            :size="manualRefreshButtonSize"
             :current-phase="refreshButtonPhase"
             @click="debouncedRefreshTableData"
           />
@@ -1568,10 +1574,6 @@ export default {
     opacity: 0.5;
     pointer-events: none;
   }
-
-  .manual-refresh {
-    height: 40px;
-  }
   .advanced-filter-group {
     position: relative;
     margin-left: 10px;
@@ -1672,7 +1674,7 @@ export default {
         margin-right: 10px;
         font-size: 11px;
       }
-     .cross {
+      .cross {
         font-size: 12px;
         font-weight: bold;
         cursor: pointer;

package/components/Tabbed/index.vue

@@ -4,10 +4,15 @@ import isEmpty from 'lodash/isEmpty';
 import { addObject, removeObject, findBy } from '@shell/utils/array';
 import { sortBy } from '@shell/utils/sort';
 import findIndex from 'lodash/findIndex';
+import { ExtensionPoint, TabLocation } from '@shell/core/types';
+import { getApplicableExtensionEnhancements } from '@shell/core/plugin-helpers';
+import Tab from '@shell/components/Tabbed/Tab';
 
 export default {
   name: 'Tabbed',
 
+  components: { Tab },
+
   emits: ['changed', 'addTab', 'removeTab'],
 
   props: {
@@ -82,9 +87,19 @@ export default {
   },
 
   data() {
+    const extensionTabs = getApplicableExtensionEnhancements(this, ExtensionPoint.TAB, TabLocation.RESOURCE_DETAIL, this.$route, this, this.extensionParams) || [];
+
+    const parsedExtTabs = extensionTabs.map((item) => {
+      return {
+        ...item,
+        active: false
+      };
+    });
+
     return {
-      tabs:          [],
-      activeTabName: null,
+      tabs:          [...parsedExtTabs],
+      extensionTabs: parsedExtTabs,
+      activeTabName: null
     };
   },
 
@@ -320,6 +335,24 @@ export default {
       }"
     >
       <slot />
+      <!-- Extension tabs -->
+      <Tab
+        v-for="tab, i in extensionTabs"
+        :key="`${tab.name}${i}`"
+        :name="tab.name"
+        :label="tab.label"
+        :label-key="tab.labelKey"
+        :weight="tab.weight"
+        :tooltip="tab.tooltip"
+        :show-header="tab.showHeader"
+        :display-alert-icon="tab.displayAlertIcon"
+        :error="tab.error"
+        :badge="tab.badge"
+      >
+        <component
+          :is="tab.component"
+        />
+      </Tab>
     </div>
   </div>
 </template>

package/components/form/ResourceLabeledSelect.vue

@@ -52,14 +52,14 @@ export enum RESOURCE_LABEL_SELECT_MODE {
 }
 
 /**
- * Convience wrapper around the LabelSelect component to support pagination
+ * Convenience  wrapper around the LabelSelect component to support pagination
  *
  * Handles
  *
  * 1) Conditionally enabling the pagination feature given system settings
  * 2) Helper function to fetch the pagination result
  *
- * A number of ways can be provided to override the convienences (see props)
+ * A number of ways can be provided to override the conveniences (see props)
  */
 export default defineComponent({
   name: 'ResourceLabeledSelect',

package/components/form/ResourceTabs/index.vue

@@ -11,8 +11,6 @@ import { EVENT } from '@shell/config/types';
 import SortableTable from '@shell/components/SortableTable';
 import { _VIEW } from '@shell/config/query-params';
 import RelatedResources from '@shell/components/RelatedResources';
-import { ExtensionPoint, TabLocation } from '@shell/core/types';
-import { getApplicableExtensionEnhancements } from '@shell/core/plugin-helpers';
 import { isConditionReadyAndWaiting } from '@shell/plugins/dashboard-store/resource-class';
 
 export default {
@@ -77,7 +75,6 @@ export default {
       allEvents:      [],
       selectedTab:    this.defaultTab,
       didLoadEvents:  false,
-      extensionTabs:  getApplicableExtensionEnhancements(this, ExtensionPoint.TAB, TabLocation.RESOURCE_DETAIL, this.$route, this, this.extensionParams),
       inStore,
       showConditions: false,
     };
@@ -246,25 +243,5 @@ export default {
         direction="to"
       />
     </Tab>
-
-    <!-- Extension tabs -->
-    <Tab
-      v-for="tab, i in extensionTabs"
-      :key="`${tab.name}${i}`"
-      :name="tab.name"
-      :label="tab.label"
-      :label-key="tab.labelKey"
-      :weight="tab.weight"
-      :tooltip="tab.tooltip"
-      :show-header="tab.showHeader"
-      :display-alert-icon="tab.displayAlertIcon"
-      :error="tab.error"
-      :badge="tab.badge"
-    >
-      <component
-        :is="tab.component"
-        :resource="value"
-      />
-    </Tab>
   </Tabbed>
 </template>

package/components/form/Taints.vue

@@ -71,7 +71,7 @@ export default {
       :preserve-keys="['effect']"
       :add-label="t('labels.addTaint')"
       :disabled="disabled"
-      @update:value="$emit('input', $event)"
+      @update:value="(e) => $emit('update:value', e)"
     >
       <template #label:effect>
         {{ t('tableHeaders.effect') }}

package/components/form/UnitInput.vue

@@ -6,7 +6,7 @@ import { _EDIT } from '@shell/config/query-params';
 export default {
   components: { LabeledInput },
 
-  emits: ['update:value'],
+  emits: ['update:value', 'update:validation', 'change', 'blur'],
 
   props: {
     /**

package/components/form/__tests__/UnitInput.test.ts

@@ -184,7 +184,7 @@ describe('component: UnitInput', () => {
     input.trigger('blur');
 
     expect(wrapper.emitted('update:value')).toBeTruthy();
-    expect(wrapper.emitted('update:value')[4][0]).toBe(value);
+    expect(wrapper.emitted('update:value')[3][0]).toBe(value);
   });
 
   describe.each([