@rancher/shell 0.1.3 → 0.1.4

package/components/nav/TopLevelMenu.vue

@@ -1,11 +1,10 @@
 <script>
 import BrandImage from '@shell/components/BrandImage';
 import ClusterProviderIcon from '@shell/components/ClusterProviderIcon';
-import LocaleSelector from '@shell/components/LocaleSelector';
 import { mapGetters } from 'vuex';
 import $ from 'jquery';
 import { CAPI, MANAGEMENT } from '@shell/config/types';
-import { mapPref, DEV, MENU_MAX_CLUSTERS } from '@shell/store/prefs';
+import { mapPref, MENU_MAX_CLUSTERS } from '@shell/store/prefs';
 import { sortBy } from '@shell/utils/sort';
 import { ucFirst } from '@shell/utils/string';
 import { KEY } from '@shell/utils/platform';
@@ -20,9 +19,7 @@ const UI_COMMIT = process.env.COMMIT || UNKNOWN;
 
 export default {
 
-  components: {
-    BrandImage, ClusterProviderIcon, LocaleSelector
-  },
+  components: { BrandImage, ClusterProviderIcon },
 
   data() {
     const { displayVersion, fullVersion } = getVersionInfo(this.$store);
@@ -68,9 +65,10 @@ export default {
     clusters() {
       const all = this.$store.getters['management/all'](MANAGEMENT.CLUSTER);
       let kubeClusters = filterHiddenLocalCluster(filterOnlyKubernetesClusters(all), this.$store);
+      let pClusters = null;
 
       if (this.hasProvCluster) {
-        const pClusters = this.$store.getters['management/all'](CAPI.RANCHER_CLUSTER);
+        pClusters = this.$store.getters['management/all'](CAPI.RANCHER_CLUSTER);
         const available = pClusters.reduce((p, c) => {
           p[c.mgmt] = true;
 
@@ -84,10 +82,12 @@ export default {
       }
 
       return kubeClusters.map((x) => {
+        const pCluster = pClusters?.find(c => c.mgmt.id === x.id);
+
         return {
           id:              x.id,
           label:           x.nameDisplay,
-          ready:           x.isReady,
+          ready:           x.isReady && !pCluster?.hasError,
           osLogo:          x.providerOsLogo,
           providerNavLogo: x.providerMenuLogo,
           badge:           x.badge,
@@ -101,13 +101,11 @@ export default {
 
       const out = search ? this.clusters.filter(item => item.label.toLowerCase().includes(search)) : this.clusters;
 
-      const sorted = sortBy(out, ['ready:desc', 'label']);
+      const sorted = sortBy(out, ['name:desc', 'label']);
 
       return sorted;
     },
 
-    dev: mapPref(DEV),
-
     maxClustersToShow: mapPref(MENU_MAX_CLUSTERS),
 
     multiClusterApps() {
@@ -125,22 +123,7 @@ export default {
     configurationApps() {
       const options = this.options;
 
-      const items = options.filter(opt => opt.category === 'configuration');
-
-      // Add plugin page
-      // Ony when developing for now
-      if (process.env.dev) {
-        items.push({
-          label:   'Plugins',
-          inStore: 'management',
-          icon:    'icon-gear',
-          value:   'plugins',
-          weight:  1,
-          to:      { name: 'plugins' },
-        });
-      }
-
-      return items;
+      return options.filter(opt => opt.category === 'configuration');
     },
 
     options() {
@@ -186,7 +169,7 @@ export default {
   watch: {
     $route() {
       this.shown = false;
-    },
+    }
   },
 
   mounted() {
@@ -349,7 +332,6 @@ export default {
               v-html="displayVersion"
             />
           </div>
-          <LocaleSelector></LocaleSelector>
         </div>
       </div>
     </transition>

package/config/footer.js

@@ -1,19 +1,18 @@
 import { DOCS_BASE } from '@shell/config/private-label';
 
-export function options(issues, hideRancher) {
-  if (!issues) {
-    if (hideRancher) {
-      return { };
-    }
-    issues = 'https://github.com/rancher/dashboard/issues/new';
-  } else if (hideRancher) {
-    return { 'footer.issue': issues };
+// Deprecated
+export function options(isSupport, issuesUrl) {
+  const links = {
+    docs:        DOCS_BASE,
+    forums:     'https://forums.rancher.com/',
+    slack:      'https://slack.rancher.io',
+    issues:     !!issuesUrl ? issuesUrl : 'https://github.com/rancher/dashboard/issues/new',
+    getStarted: '/docs/getting-started'
+  };
+
+  if (!isSupport) {
+    links['commercialSupport'] = '/support';
   }
 
-  return {
-    'footer.docs':    DOCS_BASE,
-    'footer.forums': 'https://forums.rancher.com/',
-    'footer.slack':  'https://slack.rancher.io',
-    'footer.issue':  issues,
-  };
+  return links;
 }

package/config/labels-annotations.js

@@ -65,6 +65,7 @@ export const CATALOG = {
   EXPERIMENTAL:  'catalog.cattle.io/experimental',
   NAMESPACE:     'catalog.cattle.io/namespace',
   RELEASE_NAME:  'catalog.cattle.io/release-name',
+  FEATURED:      'catalog.cattle.io/featured',
 
   REQUIRES_GVK:     'catalog.cattle.io/requires-gvr',
   PROVIDES:         'catalog.cattle.io/provides-gvr',
@@ -94,7 +95,7 @@ export const CATALOG = {
   DEPLOYED_OS:   'catalog.cattle.io/deploys-on-os',
 
   MIGRATED: 'apps.cattle.io/migrated',
-  MANAGED:  'catalog.cattle.io/managed'
+  MANAGED:  'catalog.cattle.io/managed',
 };
 
 export const FLEET = {

package/config/product/explorer.js

@@ -58,6 +58,7 @@ export function init(store) {
     'namespaces',
     NODE,
     VIRTUAL_TYPES.CLUSTER_MEMBERS,
+    EVENT,
   ], 'cluster');
   basicType([
     SERVICE,
@@ -142,6 +143,7 @@ export function init(store) {
   configureType(NORMAN.PROJECT_ROLE_TEMPLATE_BINDING, { depaginate: true });
 
   configureType(EVENT, { limit: 500 });
+  weightType(EVENT, -1, true);
 
   // Allow Pods to be grouped by node
   configureType(POD, {
@@ -158,13 +160,12 @@ export function init(store) {
 
   setGroupDefaultType('serviceDiscovery', SERVICE);
 
-  configureType('workload', {
-    displayName: 'Workload',
+  configureType(WORKLOAD, {
+    displayName: store.getters['i18n/t'](`typeLabel.${ WORKLOAD }`, { count: 1 }).trim(),
     location:    {
       name:    'c-cluster-product-resource',
-      params:  { resource: 'workload' },
+      params:  { resource: WORKLOAD },
     },
-    resource: WORKLOAD_TYPES.DEPLOYMENT
   });
 
   headers(PV, [STATE, NAME_COL, RECLAIM_POLICY, PERSISTENT_VOLUME_CLAIM, PERSISTENT_VOLUME_SOURCE, PV_REASON, AGE]);

package/config/product/legacy.js

@@ -46,16 +46,6 @@ export function init(store) {
     exact:          true
   });
 
-  virtualType({
-    labelKey:       'legacy.cis-scans',
-    name:           'v1-cis-scans',
-    group:          'Root',
-    namespaced:     true,
-    weight:         111,
-    route:          { name: 'c-cluster-legacy-pages-page', params: { page: 'cis' } },
-    exact:          true
-  });
-
   virtualType({
     ifHave:     IF_HAVE.PROJECT,
     labelKey:   'legacy.project.label',
@@ -82,7 +72,6 @@ export function init(store) {
     'v1-alerts',
     'v1-catalogs',
     'v1-notifiers',
-    'v1-cis-scans',
     'v1-project-overview'
   ]);
 
@@ -121,17 +110,6 @@ export function init(store) {
     overview:   false,
   });
 
-  virtualType({
-    ifHave:     IF_HAVE.PROJECT,
-    labelKey:   'legacy.logging',
-    namespaced: true,
-    name:       'project-logging',
-    weight:     105,
-    route:      { name: 'c-cluster-legacy-project-page', params: { page: 'logging' } },
-    exact:      true,
-    overview:   false,
-  });
-
   virtualType({
     ifHave:     IF_HAVE.PROJECT,
     labelKey:   'legacy.monitoring',
@@ -143,28 +121,6 @@ export function init(store) {
     overview:   false,
   });
 
-  virtualType({
-    ifHave:     IF_HAVE.PROJECT,
-    labelKey:   'legacy.istio',
-    namespaced: true,
-    name:       'project-istio',
-    weight:     105,
-    route:      { name: 'c-cluster-legacy-project-page', params: { page: 'istio' } },
-    exact:      true,
-    overview:   false,
-  });
-
-  virtualType({
-    ifHave:     IF_HAVE.PROJECT,
-    labelKey:   'legacy.pipelines',
-    namespaced: true,
-    name:       'project-pipelines',
-    weight:     104,
-    route:      { name: 'c-cluster-legacy-project-pipelines' },
-    exact:      true,
-    overview:   false,
-  });
-
   virtualType({
     ifHave:     IF_HAVE.PROJECT,
     labelKey:   'legacy.secrets',
@@ -192,10 +148,7 @@ export function init(store) {
     'project-alerts',
     'project-catalogs',
     'project-config-maps',
-    'project-logging',
-    'project-istio',
     'project-monitoring',
-    'project-pipelines',
     'project-secrets',
   ], 'Project');
 }

package/config/product/multi-cluster-apps.js

@@ -20,17 +20,6 @@ export function init(store) {
     showWorkspaceSwitcher: false,
   });
 
-  virtualType({
-    labelKey:       'legacy.apps',
-    name:           'mc-apps',
-    group:          'Root',
-    namespaced:     false,
-    weight:         112,
-    icon:           'folder',
-    route:          { name: 'c-cluster-mcapps-pages-page', params: { cluster: 'local', page: 'apps' } },
-    exact:          true
-  });
-
   virtualType({
     labelKey:       'legacy.catalogs',
     name:           'mc-catalogs',
@@ -65,7 +54,6 @@ export function init(store) {
   });
 
   basicType([
-    'mc-apps',
     'mc-catalogs',
     'global-dns-entries',
     'global-dns-providers',

package/config/product/settings.js

@@ -90,12 +90,23 @@ export function init(store) {
     route:          { name: 'c-cluster-settings-performance' }
   });
 
+  virtualType({
+    ifHaveType:     MANAGEMENT.SETTING,
+    labelKey:       'customLinks.label',
+    name:           'links',
+    namespaced:     false,
+    weight:         96,
+    icon:           'folder',
+    route:          { name: 'c-cluster-settings-links' }
+  });
+
   basicType([
     'settings',
     'features',
     'brand',
     'banners',
-    'performance'
+    'performance',
+    'links'
   ]);
 
   configureType(MANAGEMENT.SETTING, {

package/config/product/uiplugins.js

@@ -0,0 +1,17 @@
+import { DSL, IF_HAVE } from '@shell/store/type-map';
+
+export const NAME = 'uiplugins';
+
+export function init(store) {
+  const { product } = DSL(store, NAME);
+
+  // Add a product for UI Plugins - will appear in the top-level menu
+  product({
+    ifHave:              IF_HAVE.ADMIN, // Only admins can see the UI Plugin Custom Resource by default
+    inStore:             'management',
+    icon:                'gear',
+    removable:           false,
+    showClusterSwitcher: false,
+    category:            'configuration',
+  });
+}

package/config/settings.js

@@ -55,6 +55,7 @@ export const SETTING = {
   COMMUNITY_LINKS:                      'ui-community-links',
   FAVICON:                              'ui-favicon',
   UI_PERFORMANCE:                       'ui-performance',
+  UI_CUSTOM_LINKS:                      'ui-custom-links',
   /**
    * Allow the backend to force a light/dark theme. Used in non-rancher world and results in the theme used
    * both pre and post log in. If not present defaults to the usual process
@@ -86,7 +87,7 @@ export const ALLOWED_SETTINGS = {
     kind:    'enum',
     options: ['dynamic', 'true', 'false']
   },
-  [SETTING.BRAND]:                          {},
+  [SETTING.BRAND]:                          { canReset: true },
   [SETTING.CLUSTER_TEMPLATE_ENFORCEMENT]:   { kind: 'boolean' },
   [SETTING.TELEMETRY]:                    {
     kind:    'enum',
@@ -104,7 +105,7 @@ export const DEFAULT_PERF_SETTING = {
     enabled:   false,
     threshold: 1500,
   },
-  disableWebsocketNotification: false
+  disableWebsocketNotification: true
 };
 
 export const fetchOrCreateSetting = async(store, id, val, save = true) => {
@@ -135,3 +136,21 @@ export const setSetting = async(store, id, val) => {
 
   return setting;
 };
+
+export const getPerformanceSetting = (rootGetters) => {
+  const perfSetting = rootGetters['management/byId'](MANAGEMENT.SETTING, SETTING.UI_PERFORMANCE);
+  let perfConfig = {};
+
+  if (perfSetting && perfSetting.value) {
+    try {
+      perfConfig = JSON.parse(perfSetting.value);
+    } catch (e) {
+      console.warn('ui-performance setting contains invalid data'); // eslint-disable-line no-console
+    }
+  }
+
+  // Start with the default and overwrite the values from the setting - ensures we have defaults for newly added options
+  perfConfig = Object.assign(DEFAULT_PERF_SETTING, perfConfig);
+
+  return perfConfig;
+};

package/config/types.js

@@ -51,6 +51,7 @@ export const NAMESPACE = 'namespace';
 export const NODE = 'node';
 export const NETWORK_POLICY = 'networking.k8s.io.networkpolicy';
 export const POD = 'pod';
+export const PSP = 'policy.podsecuritypolicy';
 export const PV = 'persistentvolume';
 export const PVC = 'persistentvolumeclaim';
 export const RESOURCE_QUOTA = 'resourcequota';
@@ -80,7 +81,6 @@ export const WORKLOAD_TYPES = {
   STATEFUL_SET:           'apps.statefulset',
   REPLICA_SET:            'apps.replicaset',
   REPLICATION_CONTROLLER: 'replicationcontroller',
-  POD:                    'pod'
 };
 
 const {
@@ -101,6 +101,9 @@ export const CATALOG = {
   REPO:           'catalog.cattle.io.repo',
 };
 
+// UI Plugin type
+export const UI_PLUGIN = 'catalog.cattle.io.uiplugin';
+
 export const HELM = { PROJECTHELMCHART: 'helm.cattle.io.projecthelmchart' };
 
 export const MONITORING = {
@@ -271,6 +274,7 @@ export const HCI = {
   CLUSTER:   'harvesterhci.io.management.cluster',
   DASHBOARD: 'harvesterhci.io.dashboard',
   IMAGE:     'harvesterhci.io.virtualmachineimage',
+  SETTING:   'harvesterhci.io.setting',
 };
 
 export const VIRTUAL_HARVESTER_PROVIDER = 'harvester';

package/config/uiplugins.js

@@ -0,0 +1,60 @@
+import semver from 'semver';
+
+// Version of the plugin API supported
+export const UI_PLUGIN_API_VERSION = '1.0.0';
+
+export const UI_PLUGIN_BASE_URL = '/api/v1/namespaces/cattle-ui-plugin-system/services/http:ui-plugin-operator:80/proxy';
+
+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';
+
+// Plugin Metadata properties
+const UI_PLUGIN_METADATA_API_VERSION = 'apiVersion';
+
+export function isUIPlugin(chart) {
+  return !!chart?.versions.find((v) => {
+    return v.annotations && 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;
+  });
+}
+
+// Should we load a plugin, based on the metadata returned by the backend?
+export function shouldLoadPlugin(plugin) {
+  if (!plugin.name || !plugin.version || !plugin.endpoint) {
+    return false;
+  }
+
+  // Plugin specified a required API version
+  const requiredAPI = plugin.metadata?.[UI_PLUGIN_METADATA_API_VERSION];
+
+  if (requiredAPI) {
+    return semver.satisfies(UI_PLUGIN_API_VERSION, requiredAPI);
+  }
+
+  return true;
+}

package/content/docs/en-us/getting-started.md

@@ -72,11 +72,6 @@ As of version 2.6, Cluster Manager is no longer provided as a separate UI. The d
     <tr class="table-group">
       <td colspan="3">Global</td>
     </tr>
-    <tr>
-      <td>Apps</td>
-      <td>Global → Apps</td>
-      <td>Menu → Multi-cluster Apps → Apps</td>
-    </tr>
     <tr>
       <td>Settings</td>
       <td>Global → Settings</td>
@@ -100,7 +95,7 @@ As of version 2.6, Cluster Manager is no longer provided as a separate UI. The d
     <tr>
       <td>Pod Security Policies</td>
       <td>Global → Security → Pod Security Policies</td>
-      <td>Menu → Cluster Management → Advanced → Pod Security Policies</td>
+      <td>Menu → Cluster Management → Pod Security Policies</td>
     </tr>
     <!-- -->
     <tr class="table-group">
@@ -136,26 +131,11 @@ As of version 2.6, Cluster Manager is no longer provided as a separate UI. The d
       <td>(Cluster) → Tools → Notifiers</td>
       <td>Menu → (Cluster) → Legacy -> Notifiers</td>
     </tr>
-    <tr>
-      <td>Logging (V1)</td>
-      <td>(Cluster) → Tools → Logging</td>
-      <td>Menu → (Cluster) → Cluster Tools -> Logging (Legacy)</td>
-    </tr>
     <tr>
       <td>Monitoring (V1)</td>
       <td>(Cluster) → Tools → Monitoring</td>
       <td>Menu → (Cluster) → Cluster Tools -> Monitoring (Legacy)</td>
     </tr>
-    <tr>
-      <td>Istio (V1)</td>
-      <td>(Cluster) → Tools → Istio</td>
-      <td>Menu → (Cluster) → Cluster Tools -> Istio (Legacy)</td>
-    </tr>
-    <tr>
-      <td>CIS Scans (V1)</td>
-      <td>(Cluster) → Tools → CIS Scans</td>
-      <td>Menu → (Cluster) → Legacy -> CIS Scans</td>
-    </tr>
     <tr class="table-group">
       <td colspan="3">V1 Monitoring</td>
     <tr>
@@ -212,11 +192,6 @@ As of version 2.6, Cluster Manager is no longer provided as a separate UI. The d
       <td>(Cluster) → (Project) → Tools → Monitoring</td>
       <td>Menu → (Cluster) → Legacy → Project → (Project) → Monitoring</td>
     </tr>
-    <tr>
-      <td>Pipeline</td>
-      <td>(Cluster) → (Project) → Tools → Pipeline</td>
-      <td>Menu → (Cluster) → Legacy → Project → (Project) → Pipelines → Configuration</td>
-    </tr>
     <tr class="table-group">
       <td colspan="3">Other</td>
     </tr>

package/core/plugins.js

@@ -2,6 +2,7 @@ import { productsLoaded } from '@shell/store/type-map';
 import { clearModelCache } from '@shell/plugins/dashboard-store/model-loader';
 import { Plugin } from './plugin';
 import { PluginRoutes } from './plugin-routes';
+import { UI_PLUGIN_BASE_URL } from '@shell/config/uiplugins';
 
 const MODEL_TYPE = 'models';
 
@@ -35,6 +36,17 @@ export default function({
       return internal;
     },
 
+    // Load a plugin from a UI package
+    loadAsyncByNameAndVersion(name, version, url) {
+      const id = `${ name }-${ version }`;
+
+      if (!url) {
+        url = `${ UI_PLUGIN_BASE_URL }/${ name }/${ version }/plugin/${ id }.umd.min.js`;
+      }
+
+      return this.loadAsync(id, url);
+    },
+
     // Load a plugin from a UI package
     loadAsync(id, mainFile) {
       return new Promise((resolve, reject) => {

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

@@ -93,7 +93,7 @@ export default {
       fetchOne.snapshots = this.$store.dispatch('management/findAll', { type: SNAPSHOT });
     }
 
-    if ( this.value.isImported || this.value.isCustom || this.value.isAKS || this.value.isEKS ) {
+    if ( this.value.isImported || this.value.isCustom || this.value.isHostedKubernetesProvider ) {
       fetchOne.clusterToken = this.value.getOrCreateToken();
     }
 
@@ -322,7 +322,7 @@ export default {
     },
 
     showEksNodeGroupWarning() {
-      if ( this.value.isEKS ) {
+      if ( this.value.provisioner === 'EKS' ) {
         const desiredTotal = this.value.eksNodeGroups.filter(g => g.desiredSize === 0);
 
         if ( desiredTotal.length === this.value.eksNodeGroups.length ) {
@@ -451,7 +451,7 @@ export default {
         return true;
       }
 
-      if ( ( this.value.isAKS || this.value.isEKS ) && !this.isClusterReady ) {
+      if ( this.value.isHostedKubernetesProvider && !this.isClusterReady ) {
         return true;
       }
 

package/detail/workload/index.vue

@@ -121,7 +121,7 @@ export default {
     },
 
     isPod() {
-      return this.value.type === WORKLOAD_TYPES.POD;
+      return this.value.type === POD;
     },
 
     podSchema() {
@@ -141,7 +141,7 @@ export default {
         return this.value.spec.jobTemplate.spec.template.spec;
       }
 
-      if ( this.value.type === WORKLOAD_TYPES.POD ) {
+      if ( this.value.type === POD ) {
         return this.value;
       }