@rancher/shell 3.0.0-rc.3 → 3.0.0-rc.5

package/config/uiplugins.js

@@ -3,44 +3,36 @@ import semver from 'semver';
 // Version of the plugin API supported
 // here we inject the current shell version that we read in vue.config
 export const UI_EXTENSIONS_API_VERSION = process.env.UI_EXTENSIONS_API_VERSION;
+
 export const UI_PLUGIN_HOST_APP = 'rancher-manager';
 
 export const UI_PLUGIN_BASE_URL = '/v1/uiplugins';
-
 export const UI_PLUGIN_NAMESPACE = 'cattle-ui-plugin-system';
 
 // Annotation name and value that indicate a chart is a UI plugin
-export const UI_PLUGIN_ANNOTATION_NAME = 'catalog.cattle.io/ui-component';
-export const UI_PLUGIN_ANNOTATION_VALUE = 'plugins';
-
-export const UI_PLUGIN_OPERATOR_CRD_CHART_NAME = 'ui-plugin-operator-crd';
-export const UI_PLUGIN_OPERATOR_CHART_NAME = 'ui-plugin-operator';
-
-export const UI_PLUGIN_CHARTS = [
-  UI_PLUGIN_OPERATOR_CHART_NAME,
-  UI_PLUGIN_OPERATOR_CRD_CHART_NAME,
-];
-
-// Expected chart repo name for the UI Plugins operator
-export const UI_PLUGIN_OPERATOR_REPO_NAME = 'rancher-charts';
-
-// Info for the Helm Chart Repository that we will add
-export const UI_PLUGINS_REPO_NAME = 'rancher-ui-plugins';
-
-export const UI_PLUGINS_REPO_URL = 'https://github.com/rancher/ui-plugin-charts';
-export const UI_PLUGINS_REPO_BRANCH = 'main';
-
-// Info for the Helm Chart Repo for Partner Extensions
-export const UI_PLUGINS_PARTNERS_REPO_NAME = 'partner-extensions';
-
-export const UI_PLUGINS_PARTNERS_REPO_URL = 'https://github.com/rancher/partner-extensions';
-export const UI_PLUGINS_PARTNERS_REPO_BRANCH = 'main';
-
-// Info for the Helm Chart Repo for Community Extensions
-export const UI_PLUGINS_COMMUNITY_REPO_NAME = 'community-extensions';
+export const UI_PLUGIN_ANNOTATION = {
+  NAME:  'catalog.cattle.io/ui-component',
+  VALUE: 'plugins',
+};
 
-export const UI_PLUGINS_COMMUNITY_REPO_URL = 'https://github.com/rancher/community-extensions';
-export const UI_PLUGINS_COMMUNITY_REPO_BRANCH = 'main';
+// Info for the Helm Chart Repositories
+export const UI_PLUGINS_REPOS = {
+  OFFICIAL: {
+    NAME:   'rancher-ui-plugins',
+    URL:    'https://github.com/rancher/ui-plugin-charts',
+    BRANCH: 'main',
+  },
+  PARTNERS: {
+    NAME:   'partner-extensions',
+    URL:    'https://github.com/rancher/partner-extensions',
+    BRANCH: 'main',
+  },
+  COMMUNITY: {
+    NAME:   'community-extensions',
+    URL:    'https://github.com/rancher/community-extensions',
+    BRANCH: 'main',
+  },
+};
 
 // Chart annotations
 export const UI_PLUGIN_CHART_ANNOTATIONS = {
@@ -57,171 +49,222 @@ export const UI_PLUGIN_CHART_ANNOTATIONS = {
 export const UI_PLUGIN_LABELS = {
   CATALOG_IMAGE: 'catalog.cattle.io/ui-extensions-catalog-image',
   REPOSITORY:    'catalog.cattle.io/ui-extensions-repository',
-  CATALOG:       'catalog.cattle.io/ui-extensions-catalog'
+  CATALOG:       'catalog.cattle.io/ui-extensions-catalog',
+};
+
+export const EXTENSIONS_INCOMPATIBILITY_TYPES = {
+  UI:                     'uiVersion',
+  EXTENSIONS_API_MISSING: 'extensionsApiVersionMissing',
+  EXTENSIONS_API:         'extensionsApiVersion',
+  KUBE:                   'kubeVersion',
+  HOST:                   'host',
 };
 
-// Plugin Metadata properties
-export const UI_PLUGIN_METADATA = {
-  RANCHER_VERSION:   'rancherVersion',
-  EXTENSION_VERSION: 'extVersion',
-  EXTENSIONS_HOST:   'host',
-  DISPLAY_NAME:      'displayName',
+export const EXTENSIONS_INCOMPATIBILITY_DATA = {
+  UI: {
+    type:           EXTENSIONS_INCOMPATIBILITY_TYPES.UI,
+    cardMessageKey: 'plugins.incompatibleRancherVersion',
+    tooltipKey:     'plugins.info.requiresRancherVersion',
+  },
+  EXTENSIONS_API_MISSING: {
+    type:           EXTENSIONS_INCOMPATIBILITY_TYPES.EXTENSIONS_API_MISSING,
+    cardMessageKey: 'plugins.incompatibleUiExtensionsApiVersionMissing',
+    tooltipKey:     'plugins.info.requiresExtensionApiVersionMissing',
+  },
+  EXTENSIONS_API: {
+    type:           EXTENSIONS_INCOMPATIBILITY_TYPES.EXTENSIONS_API,
+    cardMessageKey: 'plugins.incompatibleUiExtensionsApiVersion',
+    tooltipKey:     'plugins.info.requiresExtensionApiVersion',
+  },
+  KUBE: {
+    type:           EXTENSIONS_INCOMPATIBILITY_TYPES.KUBE,
+    cardMessageKey: 'plugins.incompatibleKubeVersion',
+    tooltipKey:     'plugins.info.requiresKubeVersion',
+  },
+  HOST: {
+    type:           EXTENSIONS_INCOMPATIBILITY_TYPES.HOST,
+    cardMessageKey: 'plugins.incompatibleHost',
+    tooltipKey:     'plugins.info.requiresHost',
+    mainHost:       UI_PLUGIN_HOST_APP,
+  },
 };
 
 export function isUIPlugin(chart) {
-  return !!chart?.versions.find((v) => {
-    return v.annotations && v.annotations[UI_PLUGIN_ANNOTATION_NAME] === UI_PLUGIN_ANNOTATION_VALUE;
-  });
+  return !!chart?.versions.find((v) => v.annotations?.[UI_PLUGIN_ANNOTATION.NAME] === UI_PLUGIN_ANNOTATION.VALUE);
 }
 
 export function uiPluginHasAnnotation(chart, name, value) {
-  return !!chart?.versions.find((v) => {
-    return v.annotations && v.annotations[name] === value;
-  });
+  return !!chart?.versions.find((v) => v.annotations?.[name] === value);
 }
 
 /**
- * Get value of the annotation from teh latest version for a chart
+ * Get value of the annotation from the latest version for a chart
  */
 export function uiPluginAnnotation(chart, name) {
-  if (chart?.versions?.length > 0) {
-    return chart.versions[0].annotations?.[name];
+  return chart?.versions?.[0]?.annotations?.[name];
+}
+
+/**
+ * Parse the Rancher version string
+ */
+function parseRancherVersion(v) {
+  let parsedVersion = semver.coerce(v)?.version;
+  const splitArr = parsedVersion?.split('.');
+
+  // this is a scenario where we are on a "head" version of some sort... we can't infer the patch version from it
+  // so we apply a big patch version number to make sure we follow through with the minor
+  if (v.includes('-') && splitArr?.length === 3) {
+    parsedVersion = `${ splitArr[0] }.${ splitArr[1] }.999`;
   }
 
-  return undefined;
+  return parsedVersion;
 }
 
-// i18n-uses plugins.error.generic, plugins.error.api, plugins.error.host
+/**
+ * Check if a version is incompatible with the current environment
+ */
+function checkIncompatibility(currentVersion, requiredVersion, incompatibilityData, returnObj, versionObj) {
+  if ((incompatibilityData.type === EXTENSIONS_INCOMPATIBILITY_TYPES.EXTENSIONS_API_MISSING && !requiredVersion) || (requiredVersion && !semver.satisfies(currentVersion, requiredVersion))) {
+    if (!returnObj) {
+      return false;
+    }
+    versionObj.isVersionCompatible = false;
+    versionObj.versionIncompatibilityData = { ...incompatibilityData, required: requiredVersion };
+
+    return versionObj;
+  }
 
-// Should we load a plugin, based on the metadata returned by the backend?
-// Returns error key string or false
-export function shouldNotLoadPlugin(plugin, rancherVersion, loadedPlugins) {
-  if (!plugin.name || !plugin.version || !plugin.endpoint) {
+  return true;
+}
+
+// i18n-uses plugins.error.generic, plugins.error.api, plugins.error.host, plugins.error.kubeVersion, plugins.error.version, plugins.error.developerPkg, plugins.error.apiAnnotationMissing
+
+/**
+ * Whether an extension should be loaded based on the metadata returned by the backend in the UIPlugins resource instance
+ * The output will be used to PREVENT loading of an extension that is already installed but isn't compatible with the system
+ *
+ * String output will display a message on the extension card to notify users on why the extension was not loaded
+ *
+ * @returns String | Boolean
+ */
+export function shouldNotLoadPlugin(UIPluginResource, { rancherVersion, kubeVersion }, loadedPlugins) {
+  if (!UIPluginResource.name || !UIPluginResource.version || !UIPluginResource.endpoint) {
     return 'plugins.error.generic';
   }
 
-  // Plugin specified a required extension API version
+  // Extension chart specified a required extension API version
   // we are propagating the annotations in pkg/package.json for any extension
   // inside the "spec.plugin.metadata" property of UIPlugin resource
-  const requiredAPI = plugin.spec?.plugin?.metadata?.[UI_PLUGIN_CHART_ANNOTATIONS.EXTENSIONS_VERSION];
-
-  if (requiredAPI && !semver.satisfies(UI_EXTENSIONS_API_VERSION, requiredAPI)) {
+  const requiredUiExtensionsVersion = UIPluginResource.metadata?.[UI_PLUGIN_CHART_ANNOTATIONS.EXTENSIONS_VERSION];
+  // semver.coerce will get rid of any suffix on the version numbering (-rc, -head, etc)
+  const parsedUiExtensionsApiVersion = semver.coerce(UI_EXTENSIONS_API_VERSION)?.version;
+  const parsedRancherVersion = rancherVersion ? parseRancherVersion(rancherVersion) : '';
+  const parsedKubeVersion = kubeVersion ? semver.coerce(kubeVersion)?.version : '';
+
+  if (!requiredUiExtensionsVersion) {
+    return 'plugins.error.apiAnnotationMissing';
+  } else if (requiredUiExtensionsVersion && !semver.satisfies(parsedUiExtensionsApiVersion, requiredUiExtensionsVersion)) {
     return 'plugins.error.api';
   }
 
   // Host application
-  const requiredHost = plugin.metadata?.[UI_PLUGIN_METADATA.EXTENSIONS_HOST];
+  const requiredHost = UIPluginResource.metadata?.[UI_PLUGIN_CHART_ANNOTATIONS.EXTENSIONS_HOST];
 
   if (requiredHost && requiredHost !== UI_PLUGIN_HOST_APP) {
     return 'plugins.error.host';
   }
 
+  // Kube version
+  if (parsedKubeVersion) {
+    const requiredKubeVersion = UIPluginResource.metadata?.[UI_PLUGIN_CHART_ANNOTATIONS.KUBE_VERSION];
+
+    if (requiredKubeVersion && !semver.satisfies(parsedKubeVersion, requiredKubeVersion)) {
+      return 'plugins.error.kubeVersion';
+    }
+  }
+
   // Rancher version
-  if (rancherVersion) {
-    const requiredRancherVersion = plugin.metadata?.[UI_PLUGIN_METADATA.RANCHER_VERSION];
+  if (parsedRancherVersion) {
+    const requiredRancherVersion = UIPluginResource.metadata?.[UI_PLUGIN_CHART_ANNOTATIONS.RANCHER_VERSION];
 
-    if (requiredRancherVersion && !semver.satisfies(rancherVersion, requiredRancherVersion)) {
+    if (requiredRancherVersion && !semver.satisfies(parsedRancherVersion, requiredRancherVersion)) {
       return 'plugins.error.version';
     }
   }
 
   // check if a builtin extension has been loaded before - improve developer experience
-  const checkLoaded = loadedPlugins.find((p) => p?.name === plugin?.name);
+  const checkLoaded = loadedPlugins.find((p) => p?.name === UIPluginResource?.name);
 
   if (checkLoaded && checkLoaded.builtin) {
     return 'plugins.error.developerPkg';
   }
 
-  if (plugin.metadata?.[UI_PLUGIN_LABELS.CATALOG]) {
+  if (UIPluginResource.metadata?.[UI_PLUGIN_LABELS.CATALOG]) {
     return true;
   }
 
   return false;
 }
 
-// Can a chart version be used for this Rancher (based on the annotations on the chart)?
-export function isSupportedChartVersion(versionsData) {
-  const { version, rancherVersion, kubeVersion } = versionsData;
-
-  // Plugin specified a required extension API version
-  const requiredAPI = version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.EXTENSIONS_VERSION];
-
-  if (requiredAPI && !semver.satisfies(UI_EXTENSIONS_API_VERSION, requiredAPI)) {
-    return false;
-  }
-
-  // Host application
-  const requiredHost = version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.EXTENSIONS_HOST];
-
-  if (requiredHost && requiredHost !== UI_PLUGIN_HOST_APP) {
-    return false;
-  }
-
-  // Rancher version
-  if (rancherVersion) {
-    const requiredRancherVersion = version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.RANCHER_VERSION];
-
-    if (requiredRancherVersion && !semver.satisfies(rancherVersion, requiredRancherVersion)) {
-      return false;
-    }
-  }
-
-  // Kube version
-  if (kubeVersion) {
-    const requiredKubeVersion = version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.KUBE_VERSION];
-
-    if (requiredKubeVersion && !semver.satisfies(kubeVersion, requiredKubeVersion)) {
-      return false;
-    }
-  }
-
-  return true;
-}
-
-export function isChartVersionAvailableForInstall(versionsData, returnObj = false) {
-  const { version, rancherVersion, kubeVersion } = versionsData;
-
-  const parsedRancherVersion = rancherVersion.split('-')?.[0];
-  const regexHashString = new RegExp('^[A-Za-z0-9]{9}$');
-  const isRancherVersionHashStringOrHead = regexHashString.test(rancherVersion) || rancherVersion.includes('head');
-  const requiredUiVersion = version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.UI_VERSION];
-  const requiredKubeVersion = version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.KUBE_VERSION];
-  const versionObj = { ...version };
-
-  versionObj.isCompatibleWithUi = true;
-  versionObj.isCompatibleWithKubeVersion = true;
-
-  // if it's a head version of Rancher, then we skip the validation and enable them all
-  if (!isRancherVersionHashStringOrHead && requiredUiVersion && !semver.satisfies(parsedRancherVersion, requiredUiVersion)) {
-    if (!returnObj) {
-      return false;
-    }
-    versionObj.isCompatibleWithUi = false;
-    versionObj.requiredUiVersion = requiredUiVersion;
-
-    if (returnObj) {
-      return versionObj;
-    }
-  }
-
-  // check kube version
-  if (kubeVersion && requiredKubeVersion && !semver.satisfies(kubeVersion, requiredKubeVersion)) {
-    if (!returnObj) {
-      return false;
-    }
-    versionObj.isCompatibleWithKubeVersion = false;
-    versionObj.requiredKubeVersion = requiredKubeVersion;
-
-    if (returnObj) {
-      return versionObj;
+/**
+ * Wether an extension version is available to be installed, based on the annotations present in the Helm chart version
+ * backend may not automatically "limit" a particular version but dashboard will disable that version for install with this check
+ *
+ * The output will be used to display a message on the extension card to notify users if a LATEST version of an extension is available but isn't compatible (cardMessageKey)
+ * The output will also disable the buttons in the slide-in panel with extension details, displaying a tooltip message with the reason (tooltipKey)
+ *
+ * @returns Boolean | Object
+ */
+export function isSupportedChartVersion(versionData, returnObj = false) {
+  const { version, rancherVersion, kubeVersion } = versionData;
+  const versionObj = {
+    ...version, isVersionCompatible: true, versionIncompatibilityData: {}
+  };
+  const parsedRancherVersion = rancherVersion ? parseRancherVersion(rancherVersion) : '';
+  const parsedUiExtensionsApiVersion = semver.coerce(UI_EXTENSIONS_API_VERSION)?.version;
+
+  const checks = [
+    {
+      currentVersion:      kubeVersion,
+      requiredVersion:     version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.KUBE_VERSION],
+      incompatibilityData: EXTENSIONS_INCOMPATIBILITY_DATA.KUBE,
+    },
+    {
+      currentVersion:      parsedRancherVersion,
+      requiredVersion:     version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.RANCHER_VERSION],
+      incompatibilityData: EXTENSIONS_INCOMPATIBILITY_DATA.UI,
+    },
+    {
+      currentVersion:      parsedRancherVersion,
+      requiredVersion:     version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.UI_VERSION],
+      incompatibilityData: EXTENSIONS_INCOMPATIBILITY_DATA.UI,
+    },
+    {
+      currentVersion:      parsedUiExtensionsApiVersion,
+      requiredVersion:     version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.EXTENSIONS_VERSION],
+      incompatibilityData: EXTENSIONS_INCOMPATIBILITY_DATA.EXTENSIONS_API_MISSING,
+    },
+    {
+      currentVersion:      parsedUiExtensionsApiVersion,
+      requiredVersion:     version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.EXTENSIONS_VERSION],
+      incompatibilityData: EXTENSIONS_INCOMPATIBILITY_DATA.EXTENSIONS_API,
+    },
+    {
+      currentVersion:      UI_PLUGIN_HOST_APP,
+      requiredVersion:     version.annotations?.[UI_PLUGIN_CHART_ANNOTATIONS.EXTENSIONS_HOST],
+      incompatibilityData: EXTENSIONS_INCOMPATIBILITY_DATA.HOST,
+    },
+  ];
+
+  for (const { currentVersion, requiredVersion, incompatibilityData } of checks) {
+    const result = checkIncompatibility(currentVersion, requiredVersion, incompatibilityData, returnObj, versionObj);
+
+    if (result !== true) {
+      return result;
     }
   }
 
-  if (returnObj) {
-    return versionObj;
-  }
-
-  return true;
+  return returnObj ? versionObj : true;
 }
 
 export function isChartVersionHigher(versionA, versionB) {

package/config/version.js

@@ -2,6 +2,7 @@
  * Store version data retrieved from the backend /rancherversion API
  */
 let _versionData = { RancherPrime: 'false' };
+let _kubeVersionData = {};
 
 export function isRancherPrime() {
   return _versionData.RancherPrime?.toLowerCase() === 'true';
@@ -15,3 +16,12 @@ export function setVersionData(v) {
   // Remove any properties on 'v' we don't want
   _versionData = JSON.parse(JSON.stringify(v));
 }
+
+export function getKubeVersionData() {
+  return _kubeVersionData;
+}
+
+export function setKubeVersionData(v) {
+  // Remove any properties on 'v' we don't want
+  _kubeVersionData = JSON.parse(JSON.stringify(v));
+}

package/detail/autoscaling.horizontalpodautoscaler/index.vue

@@ -10,6 +10,8 @@ import { findBy } from '@shell/utils/array';
 import { get } from '@shell/utils/object';
 
 export default {
+  emits: ['input'],
+
   components: {
     InfoBox,
     ResourceTabs,

package/detail/configmap.vue

@@ -5,6 +5,8 @@ import Tab from '@shell/components/Tabbed/Tab';
 import { base64Decode } from '@shell/utils/crypto';
 
 export default {
+  emits: ['input'],
+
   components: {
     ResourceTabs,
     DetailText,

package/detail/fleet.cattle.io.cluster.vue

@@ -10,6 +10,8 @@ import { FLEET as FLEET_LABELS } from '@shell/config/labels-annotations';
 export default {
   name: 'FleetDetailCluster',
 
+  emits: ['input'],
+
   components: {
     Loading,
     ResourcesSummary,

package/detail/fleet.cattle.io.clustergroup.vue

@@ -10,6 +10,8 @@ import { allHash } from '@shell/utils/promise';
 export default {
   name: 'DetailClusterGroup',
 
+  emits: ['input'],
+
   components: {
     Loading,
     ResourceTabs,

package/detail/fleet.cattle.io.gitrepo.vue

@@ -14,6 +14,8 @@ import { checkSchemasForFindAllHash } from '@shell/utils/auth';
 export default {
   name: 'DetailGitRepo',
 
+  emits: ['input'],
+
   components: {
     Loading,
     FleetResources,

package/detail/harvesterhci.io.management.cluster.vue

@@ -6,6 +6,8 @@ import Tab from '@shell/components/Tabbed/Tab';
 import { allHash } from '@shell/utils/promise';
 
 export default {
+  emits: ['input'],
+
   components: {
     Loading,
     ResourceTabs,

package/detail/management.cattle.io.roletemplate.vue

@@ -1,11 +1,11 @@
 <script>
 import RoleDetailEdit from '@shell/components/auth/RoleDetailEdit';
 
-export default { components: { RoleDetailEdit } };
+export default { emits: ['set-subtype'], components: { RoleDetailEdit } };
 </script>
 <template>
-  <RoleDetailEdit
-    v-bind="$attrs"
-    @set-subtype="$emit('set-subtype', $event)"
+  <RoleDetailEdit
+    v-bind="$attrs"
+    @set-subtype="$emit('set-subtype', $event)"
   />
 </template>

package/detail/management.cattle.io.user.vue

@@ -8,6 +8,8 @@ import Loading from '@shell/components/Loading';
 import { NAME } from '@shell/config/table-headers';
 
 export default {
+  emits: ['input'],
+
   components: {
     Tab,
     ResourceTabs,

package/detail/namespace.vue

@@ -15,6 +15,8 @@ import {
 } from 'lodash';
 
 export default {
+  emits: ['input'],
+
   components: {
     ResourcesSummary,
     ResourceTable,

package/detail/networking.k8s.io.ingress.vue

@@ -10,6 +10,7 @@ import { FilterArgs, PaginationParamFilter } from '@shell/types/store/pagination
 
 export default {
   name:       'CRUIngress',
+  emits:      ['input'],
   components: {
     ResourceTabs,
     Rules,

package/detail/node.vue

@@ -27,6 +27,8 @@ const NODE_METRICS_SUMMARY_URL = '/api/v1/namespaces/cattle-monitoring-system/se
 export default {
   name: 'DetailNode',
 
+  emits: ['input'],
+
   components: {
     Alert,
     ConsumptionGauge,

package/detail/provisioning.cattle.io.cluster.vue

@@ -57,6 +57,8 @@ class EmptyCapiMachineDeployment extends CapiMachineDeployment {
 }
 
 export default {
+  emits: ['input'],
+
   components: {
     Loading,
     Banner,

package/detail/secret.vue

@@ -18,6 +18,8 @@ const registryAddresses = [
 ];
 
 export default {
+  emits: ['input'],
+
   components: {
     ResourceTabs,
     DetailText,

package/detail/service.vue

@@ -14,6 +14,8 @@ import { POD } from '@shell/config/types';
 import { findBy } from '@shell/utils/array';
 
 export default {
+  emits: ['input'],
+
   components: {
     ResourceTable,
     ResourceTabs,

package/detail/workload/index.vue

@@ -197,7 +197,7 @@ export default {
     },
 
     podHeaders() {
-      return this.$store.getters['type-map/headersFor'](this.podSchema).filter((h) => h !== NAMESPACE_COL);
+      return this.$store.getters['type-map/headersFor'](this.podSchema).filter((h) => !h.name || h.name !== NAMESPACE_COL.name);
     },
 
     graphVarsWorkload() {

package/dialog/AddClusterMemberDialog.vue

@@ -3,6 +3,8 @@ import { Card } from '@components/Card';
 import ClusterPermissionsEditor from '@shell/components/form/Members/ClusterPermissionsEditor';
 
 export default {
+  emits: ['close'],
+
   components: {
     Card,
     ClusterPermissionsEditor

package/dialog/AddCustomBadgeDialog.vue

@@ -17,7 +17,9 @@ import { _CREATE, _EDIT } from '@shell/config/query-params';
 import ClusterIconMenu from '@shell/components/ClusterIconMenu';
 
 export default {
-  name:       'AddCustomBadgeDialog',
+  name:  'AddCustomBadgeDialog',
+  emits: ['close'],
+
   components: {
     Card,
     AsyncButton,

package/dialog/AddProjectMemberDialog.vue

@@ -6,6 +6,8 @@ import Banner from '@components/Banner/Banner.vue';
 import { NORMAN } from '@shell/config/types';
 
 export default {
+  emits: ['close'],
+
   components: {
     Card,
     ProjectMemberEditor,

package/dialog/AddonConfigConfirmationDialog.vue

@@ -3,6 +3,8 @@ import AsyncButton from '@shell/components/AsyncButton';
 import { Card } from '@components/Card';
 
 export default {
+  emits: ['close'],
+
   components: {
     Card,
     AsyncButton,

package/dialog/DeactivateDriverDialog.vue

@@ -7,6 +7,8 @@ import { resourceNames } from '@shell/utils/string';
 import { mapGetters } from 'vuex';
 
 export default {
+  emits: ['close'],
+
   components: {
     Card,
     AsyncButton,

package/dialog/DiagnosticTimingsDialog.vue

@@ -6,6 +6,8 @@ import { Card } from '@components/Card';
 import { Banner } from '@components/Banner';
 
 export default {
+  emits: ['close'],
+
   components: {
     Card,
     AsyncButton,

package/dialog/DrainNode.vue

@@ -9,6 +9,8 @@ import { _EDIT, _VIEW } from '@shell/config/query-params';
 import { exceptionToErrorsArray } from '@shell/utils/error';
 
 export default {
+  emits: ['close'],
+
   components: {
     AsyncButton,
     Banner,