@rancher/shell 0.1.0 → 0.1.1

package/config/settings.js

@@ -1,96 +1,99 @@
 // Settings
 import { MANAGEMENT } from './types';
-
 // Adapted from: https://github.com/rancher/ui/blob/08c379a9529f740666a704b52522a468986c3520/lib/shared/addon/utils/constants.js#L564
-
 // Setting IDs
 export const SETTING = {
   VERSION_RANCHER:                  'server-version',
   VERSION_CLI:                      'cli-version',
   VERSION_MACHINE:                  'machine-version',
   VERSION_HELM:                     'helm-version',
-
   CLI_URL:                          {
     DARWIN:                         'cli-url-darwin',
     WINDOWS:                        'cli-url-windows',
     LINUX:                          'cli-url-linux',
   },
-
   API_HOST:                         'api-host',
   CA_CERTS:                         'cacerts',
 
   // Allow the local cluste to be hidden
-  HIDE_LOCAL_CLUSTER:               'hide-local-cluster',
-  AUTH_TOKEN_MAX_TTL_MINUTES:       'auth-token-max-ttl-minutes',
-  KUBECONFIG_GENERATE_TOKEN:        'kubeconfig-generate-token',
-  KUBECONFIG_TOKEN_TTL_MINUTES:     'kubeconfig-token-ttl-minutes',
-  ENGINE_URL:                       'engine-install-url',
-  ENGINE_ISO_URL:                   'engine-iso-url',
-  FIRST_LOGIN:                      'first-login',
-  INGRESS_IP_DOMAIN:                'ingress-ip-domain',
-  SERVER_URL:                       'server-url',
-  RKE_METADATA_CONFIG:              'rke-metadata-config',
-  TELEMETRY:                        'telemetry-opt',
-  EULA_AGREED:                      'eula-agreed',
-  AUTH_USER_INFO_MAX_AGE_SECONDS:   'auth-user-info-max-age-seconds',
-  AUTH_USER_SESSION_TTL_MINUTES:    'auth-user-session-ttl-minutes',
-  AUTH_USER_INFO_RESYNC_CRON:       'auth-user-info-resync-cron',
-  AUTH_LOCAL_VALIDATE_DESC:         'auth-password-requirements-description',
-  CLUSTER_TEMPLATE_ENFORCEMENT:     'cluster-template-enforcement',
-  UI_INDEX:                         'ui-index',
-  UI_DASHBOARD_INDEX:               'ui-dashboard-index',
-  UI_OFFLINE_PREFERRED:             'ui-offline-preferred',
-  SYSTEM_DEFAULT_REGISTRY:          'system-default-registry',
-  UI_ISSUES:                        'ui-issues',
-  PL:                               'ui-pl',
-  PL_RANCHER_VALUE:                 'rancher',
-  SUPPORTED:                        'has-support',
-  BANNERS:                          'ui-banners',
-  ISSUES:                           'ui-issues',
-  BRAND:                            'ui-brand',
-  LOGO_LIGHT:                       'ui-logo-light',
-  LOGO_DARK:                        'ui-logo-dark',
-  PRIMARY_COLOR:                    'ui-primary-color',
-  LINK_COLOR:                       'ui-link-color',
-  COMMUNITY_LINKS:                  'ui-community-links',
-  SYSTEM_NAMESPACES:                 'system-namespaces'
+  HIDE_LOCAL_CLUSTER:                   'hide-local-cluster',
+  AUTH_TOKEN_MAX_TTL_MINUTES:           'auth-token-max-ttl-minutes',
+  KUBECONFIG_GENERATE_TOKEN:            'kubeconfig-generate-token',
+  KUBECONFIG_TOKEN_TTL_MINUTES:         'kubeconfig-token-ttl-minutes',
+  KUBECONFIG_DEFAULT_TOKEN_TTL_MINUTES:       'kubeconfig-default-token-ttl-minutes',
+  ENGINE_URL:                           'engine-install-url',
+  ENGINE_ISO_URL:                       'engine-iso-url',
+  FIRST_LOGIN:                          'first-login',
+  INGRESS_IP_DOMAIN:                    'ingress-ip-domain',
+  SERVER_URL:                           'server-url',
+  RKE_METADATA_CONFIG:                  'rke-metadata-config',
+  TELEMETRY:                            'telemetry-opt',
+  EULA_AGREED:                          'eula-agreed',
+  AUTH_USER_INFO_MAX_AGE_SECONDS:       'auth-user-info-max-age-seconds',
+  AUTH_USER_SESSION_TTL_MINUTES:        'auth-user-session-ttl-minutes',
+  AUTH_USER_INFO_RESYNC_CRON:           'auth-user-info-resync-cron',
+  AUTH_LOCAL_VALIDATE_DESC:             'auth-password-requirements-description',
+  CLUSTER_TEMPLATE_ENFORCEMENT:         'cluster-template-enforcement',
+  UI_INDEX:                             'ui-index',
+  UI_DASHBOARD_INDEX:                   'ui-dashboard-index',
+  UI_OFFLINE_PREFERRED:                 'ui-offline-preferred',
+  SYSTEM_DEFAULT_REGISTRY:              'system-default-registry',
+  UI_ISSUES:                            'ui-issues',
+  PL:                                   'ui-pl',
+  PL_RANCHER_VALUE:                     'rancher',
+  SUPPORTED:                            'has-support',
+  BANNERS:                              'ui-banners',
+  ISSUES:                               'ui-issues',
+  BRAND:                                'ui-brand',
+  LOGO_LIGHT:                           'ui-logo-light',
+  LOGO_DARK:                            'ui-logo-dark',
+  PRIMARY_COLOR:                        'ui-primary-color',
+  LINK_COLOR:                           'ui-link-color',
+  COMMUNITY_LINKS:                      'ui-community-links',
+  FAVICON:                              'ui-favicon',
+  UI_PERFORMANCE:                       'ui-performance',
+  /**
+   * 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
+   */
+  THEME:                                'ui-theme',
+  SYSTEM_NAMESPACES:                    'system-namespaces'
 };
 
 // These are the settings that are allowed to be edited via the UI
 export const ALLOWED_SETTINGS = {
-  [SETTING.CA_CERTS]:                       { kind: 'multiline', readOnly: true },
+  [SETTING.CA_CERTS]:                             { kind: 'multiline', readOnly: true },
   // [SETTING.CLUSTER_DEFAULTS]:            { kind: 'json' },
-  [SETTING.ENGINE_URL]:                     {},
-  [SETTING.ENGINE_ISO_URL]:                 {},
+  [SETTING.ENGINE_URL]:                           {},
+  [SETTING.ENGINE_ISO_URL]:                       {},
   // [SETTING.PL]:                             {},
   // [SETTING.ISSUES]:                         {},
-  [SETTING.INGRESS_IP_DOMAIN]:              {},
-  [SETTING.AUTH_USER_INFO_MAX_AGE_SECONDS]: {},
-  [SETTING.AUTH_USER_SESSION_TTL_MINUTES]:  {},
-  [SETTING.AUTH_TOKEN_MAX_TTL_MINUTES]:     {},
-  [SETTING.KUBECONFIG_GENERATE_TOKEN]:      { kind: 'boolean' },
-  [SETTING.KUBECONFIG_TOKEN_TTL_MINUTES]:   {},
-  [SETTING.AUTH_USER_INFO_RESYNC_CRON]:     {},
-  [SETTING.SERVER_URL]:                     { kind: 'url', canReset: true },
-  [SETTING.RKE_METADATA_CONFIG]:            { kind: 'json' },
+  [SETTING.INGRESS_IP_DOMAIN]:                    {},
+  [SETTING.AUTH_USER_INFO_MAX_AGE_SECONDS]:       {},
+  [SETTING.AUTH_USER_SESSION_TTL_MINUTES]:        {},
+  [SETTING.AUTH_TOKEN_MAX_TTL_MINUTES]:           {},
+  [SETTING.KUBECONFIG_GENERATE_TOKEN]:            { kind: 'boolean' },
+  [SETTING.KUBECONFIG_TOKEN_TTL_MINUTES]:         {},
+  [SETTING.KUBECONFIG_DEFAULT_TOKEN_TTL_MINUTES]: { kind: 'integer' },
+  [SETTING.AUTH_USER_INFO_RESYNC_CRON]:           {},
+  [SETTING.SERVER_URL]:                           { kind: 'url', canReset: true },
+  [SETTING.RKE_METADATA_CONFIG]:                  { kind: 'json' },
   // [SETTING.BANNERS]:                        { kind: 'json' },
-  [SETTING.SYSTEM_DEFAULT_REGISTRY]:        {},
-  [SETTING.UI_INDEX]:                       {},
-  [SETTING.UI_DASHBOARD_INDEX]:             {},
-  [SETTING.UI_OFFLINE_PREFERRED]:           {
+  [SETTING.SYSTEM_DEFAULT_REGISTRY]:              {},
+  [SETTING.UI_INDEX]:                             {},
+  [SETTING.UI_DASHBOARD_INDEX]:                   {},
+  [SETTING.UI_OFFLINE_PREFERRED]:                 {
     kind:    'enum',
     options: ['dynamic', 'true', 'false']
   },
   [SETTING.BRAND]:                          {},
   [SETTING.CLUSTER_TEMPLATE_ENFORCEMENT]:   { kind: 'boolean' },
-
-  [SETTING.TELEMETRY]: {
+  [SETTING.TELEMETRY]:                    {
     kind:    'enum',
     options: ['prompt', 'in', 'out']
   },
   [SETTING.HIDE_LOCAL_CLUSTER]: { kind: 'boolean' },
 };
-
 // harvester Settings ID
 export const HCI_SETTING = {
   BACKUP_TARGET:                    'backup-target',
@@ -117,7 +120,6 @@ export const HCI_SETTING = {
   RANCHER_MONITORING:               'fleet-local/rancher-monitoring',
   RELEASE_DOWNLOAD_URL:             'release-download-url'
 };
-
 export const HCI_ALLOWED_SETTINGS = {
   [HCI_SETTING.BACKUP_TARGET]: { kind: 'json', from: 'import' },
   [HCI_SETTING.LOG_LEVEL]:     {
@@ -152,7 +154,6 @@ export const HCI_ALLOWED_SETTINGS = {
   },
   [HCI_SETTING.RELEASE_DOWNLOAD_URL]: { kind: 'url' },
 };
-
 export const HCI_SINGLE_CLUSTER_ALLOWED_SETTING = {
   [HCI_SETTING.UI_SOURCE]: {
     kind:    'enum',
@@ -161,7 +162,6 @@ export const HCI_SINGLE_CLUSTER_ALLOWED_SETTING = {
   [HCI_SETTING.UI_INDEX]:                 { kind: 'url' },
   [HCI_SETTING.CLUSTER_REGISTRATION_URL]: { kind: 'url' },
 };
-
 export const fetchOrCreateSetting = async(store, id, val, save = true) => {
   let setting;
 
@@ -174,7 +174,6 @@ export const fetchOrCreateSetting = async(store, id, val, save = true) => {
     setting = await store.dispatch('management/create', {
       type: MANAGEMENT.SETTING, metadata: { name: id }, value: val, default: val || ''
     });
-
     if ( save ) {
       await setting.save({ url });
     }
@@ -182,12 +181,10 @@ export const fetchOrCreateSetting = async(store, id, val, save = true) => {
 
   return setting;
 };
-
 export const setSetting = async(store, id, val) => {
   const setting = await fetchOrCreateSetting(store, id, val, false);
 
   setting.value = val;
-
   await setting.save();
 
   return setting;

package/config/table-headers.js

@@ -151,6 +151,7 @@ export const NODE = {
   name:          'node',
   labelKey:      'tableHeaders.node',
   value:         'spec.nodeName',
+  getValue:      row => row.spec?.nodeName,
   sort:          'spec.nodeName',
   formatter:     'LinkName',
   formatterOpts: { type: NODE_TYPE },
@@ -161,6 +162,7 @@ export const NODE_NAME = {
   labelKey:  'tableHeaders.nodeName',
   sort:      'name',
   value:     'name',
+  getValue:  row => row.name,
   formatter: 'LinkDetail',
 };
 
@@ -212,7 +214,7 @@ export const PODS = {
   labelKey:  'tableHeaders.pods',
   sort:      'podConsumed',
   search:    false,
-  value:     'podConsumedUsage',
+  value:     row => row.podConsumedUsage,
   formatter: 'PercentageBar',
   width:     120,
 };
@@ -220,9 +222,9 @@ export const PODS = {
 export const AGE = {
   name:      'age',
   labelKey:  'tableHeaders.age',
-  value:     'metadata.creationTimestamp',
-  getValue:  row => row.metadata?.creationTimestamp,
-  sort:      'metadata.creationTimestamp:desc',
+  value:     'creationTimestamp',
+  getValue:  row => row.creationTimestamp,
+  sort:      'creationTimestamp:desc',
   search:    false,
   formatter: 'LiveDate',
   width:     100,
@@ -231,6 +233,7 @@ export const AGE = {
 
 export const AGE_NORMAN = {
   ...AGE,
+  getValue:  row => row.created,
   value:     'created',
   sort:      'created:desc',
 };
@@ -264,14 +267,20 @@ export const POD_IMAGES = {
   value:     'imageNames',
   getValue:  row => row.imageNames,
   sort:      'imageNames',
-  search:    'imageNames',
+  // search:    'imageNames',
   formatter: 'PodImages'
 };
 
 export const POD_RESTARTS = {
-  name:      'pod_restarts',
-  labelKey:  'tableHeaders.podRestarts',
-  value:     'restartCount'
+  name:         'pod_restarts',
+  labelKey:     'tableHeaders.podRestarts',
+  formatter:    'LivePodRestarts',
+  delayLoading: true,
+  value:        'restartCount',
+  getValue:     row => row.restartCount,
+  // This column is expensive to compute, so don't make it searchable
+  search:       false,
+  liveUpdates:  true
 };
 
 export const ENDPOINTS = {
@@ -414,6 +423,7 @@ export const TYPE = {
   name:     'type',
   labelKey: 'tableHeaders.type',
   value:    'typeDisplay',
+  getValue: row => row.typeDisplay,
   sort:     ['typeDisplay'],
   width:    100,
 };
@@ -527,6 +537,13 @@ export const API_GROUP = {
   sort:     ['apiGroups']
 };
 
+export const INGRESS_CLASS = {
+  name:      'ingressClassName',
+  labelKey:  'tableHeaders.ingressClass',
+  value:     `$['spec']['ingressClassName']`,
+  sort:      `$['spec']['ingressClassName']`,
+};
+
 export const INGRESS_DEFAULT_BACKEND = {
   name:      'ingressDefaultBackend',
   labelKey:  'tableHeaders.ingressDefaultBackend',
@@ -636,9 +653,13 @@ export const WORKLOAD_HEALTH_SCALE = {
   name:         'workloadHealthScale',
   labelKey:     'tableHeaders.health',
   formatter:    'WorkloadHealthScale',
+  getValue:     () => undefined,
   width:        150,
   skipSelect:   true,
   delayLoading: true,
+  // This column is expensive to compute, so don't make it searchable
+  search:       false,
+  liveUpdates:  true,
 };
 
 export const FLEET_SUMMARY = {
@@ -873,19 +894,21 @@ export const KUBE_NODE_OS = {
 };
 
 export const MACHINE_NODE_OS = {
-  name:      'operating-system',
-  labelKey:  'tableHeaders.operatingSystem',
-  value:     'operatingSystem',
-  sort:      ['operatingSystem'],
-  formatter: 'Capitalize'
+  name:        'operating-system',
+  labelKey:    'tableHeaders.operatingSystem',
+  value:       'operatingSystem',
+  sort:        ['operatingSystem'],
+  formatter:   'Capitalize',
+  dashIfEmpty: true,
 };
 
 export const MANAGEMENT_NODE_OS = {
-  name:      'operating-system',
-  labelKey:  'tableHeaders.operatingSystem',
-  value:     'status.internalNodeStatus.nodeInfo.operatingSystem',
-  sort:      ['status.internalNodeStatus.nodeInfo.operatingSystem'],
-  formatter: 'Capitalize'
+  name:        'operating-system',
+  labelKey:    'tableHeaders.operatingSystem',
+  value:       'status.internalNodeStatus.nodeInfo.operatingSystem',
+  sort:        ['status.internalNodeStatus.nodeInfo.operatingSystem'],
+  formatter:   'Capitalize',
+  dashIfEmpty: true,
 };
 
 // FLEET
@@ -906,3 +929,9 @@ export const FLEET_BUNDLE_TYPE = {
   sort:     ['bundleType'],
   width:    100,
 };
+
+export const IP_ADDRESS = {
+  name:          'ipaddress',
+  value:         'ipaddress',
+  labelKey:      'tableHeaders.ipaddress',
+};

package/config/types.js

@@ -46,6 +46,7 @@ export const EVENT = 'event';
 export const ENDPOINTS = 'endpoints';
 export const HPA = 'autoscaling.horizontalpodautoscaler';
 export const INGRESS = 'networking.k8s.io.ingress';
+export const INGRESS_CLASS = 'networking.k8s.io.ingressclass';
 export const NAMESPACE = 'namespace';
 export const NODE = 'node';
 export const NETWORK_POLICY = 'networking.k8s.io.networkpolicy';
@@ -166,7 +167,9 @@ export const MANAGEMENT = {
   GLOBAL_ROLE:                   'management.cattle.io.globalrole',
   GLOBAL_ROLE_BINDING:           'management.cattle.io.globalrolebinding',
   POD_SECURITY_POLICY_TEMPLATE:  'management.cattle.io.podsecuritypolicytemplate',
-  MANAGED_CHART:                 'management.cattle.io.managedchart'
+  MANAGED_CHART:                 'management.cattle.io.managedchart',
+  USER_NOTIFICATION:             'management.cattle.io.rancherusernotification',
+  GLOBAL_DNS_PROVIDER:           'management.cattle.io.globaldnsprovider'
 };
 
 export const CAPI = {
@@ -184,13 +187,14 @@ export const CAPI = {
 // Base: /k8s/clusters/<id>/v1/
 
 export const FLEET = {
-  BUNDLE:        'fleet.cattle.io.bundle',
-  CLUSTER:       'fleet.cattle.io.cluster',
-  CLUSTER_GROUP: 'fleet.cattle.io.clustergroup',
-  DASHBOARD:     'fleet.cattle.io.dashboard',
-  GIT_REPO:      'fleet.cattle.io.gitrepo',
-  WORKSPACE:     'management.cattle.io.fleetworkspace',
-  TOKEN:         'fleet.cattle.io.clusterregistrationtoken',
+  BUNDLE:            'fleet.cattle.io.bundle',
+  BUNDLE_DEPLOYMENT: 'fleet.cattle.io.bundledeployment',
+  CLUSTER:           'fleet.cattle.io.cluster',
+  CLUSTER_GROUP:     'fleet.cattle.io.clustergroup',
+  DASHBOARD:         'fleet.cattle.io.dashboard',
+  GIT_REPO:          'fleet.cattle.io.gitrepo',
+  WORKSPACE:         'management.cattle.io.fleetworkspace',
+  TOKEN:             'fleet.cattle.io.clusterregistrationtoken',
 };
 
 export const GATEKEEPER = {
@@ -289,4 +293,16 @@ export const HCI = {
 
 export const VIRTUAL_HARVESTER_PROVIDER = 'harvester';
 
+export const ADDRESSES = {
+  HOSTNAME:    'Hostname',
+  INTERNAL_IP: 'InternalIP'
+};
+
 export const DEFAULT_WORKSPACE = 'fleet-default';
+
+export const AUTH_TYPE = {
+  _NONE:  '_none',
+  _BASIC: '_basic',
+  _SSH:   '_ssh',
+  _S3:    '_S3'
+};

package/content/docs/en-us/whats-new.md

@@ -2,6 +2,31 @@
 title: What's New in 2.6
 ---
 
+
+## New in 2.6.7
+
+### Amazon Billing in the Marketplace
+
+- You can now purchase support for Rancher directly through the AWS Marketplace: https://rancher.com/docs/rancher/v2.6/en/installation/cloud-marketplace/aws/
+
+### Ability to configure Azure AD with MSAL
+
+- Microsoft has deprecated the Azure AD Graph API that Rancher had been using for authentication via Azure AD. A configuration update is necessary to make sure users can still use Rancher with Azure AD. For more details, see: https://rancher.com/docs/rancher/v2.6/en/admin-settings/authentication/azure-ad/#migrating-from-azure-ad-graph-api-to-microsoft-graph-api
+
+### Kubernetes 1.24
+
+- Kubernetes 1.24 is now a supported Kubernetes version for running Rancher as well as for provisioned and imported RKE1/RKE2/k3s clusters.
+
+### RKE2 Encryption Key Rotation
+
+- RKE2 encrypts secret data at rest by default. You can now rotate the key used for this encryption for Rancher-provisioned RKE2 clusters with supported k8s versions.
+
+
+## New in 2.6.6
+
+- 2.6.6 was released to account for a major performance issue. The issue occurred when Rancher was attempting to control large volumes of traffic from downstream clusters. This mechanism was not handling disconnects properly and would result in indefinite locks but this is now fixed in this version.
+
+
 ## New in 2.6.5
 
 ### NeuVector Integration

package/core/plugin.ts

@@ -1,10 +1,10 @@
 import { RouteConfig } from 'vue-router';
 import { DSL as STORE_DSL } from '@shell/store/type-map';
 import { IPlugin } from './types';
-import coreStore, { coreStoreModule, coreStoreState } from '@/shell/plugins/dashboard-store';
+import coreStore, { coreStoreModule, coreStoreState } from '@shell/plugins/dashboard-store';
 import {
   PluginRouteConfig, RegisterStore, UnregisterStore, CoreStoreSpecifics, CoreStoreConfig, OnNavToPackage, OnNavAwayFromPackage, OnLogOut
-} from '@/shell/core/types';
+} from '@shell/core/types';
 
 export class Plugin implements IPlugin {
   public id: string;
@@ -164,6 +164,16 @@ export class Plugin implements IPlugin {
   }
 
   public register(type: string, name: string, fn: Function) {
+    const nparts = name.split('/');
+
+    // Support components in a sub-folder - component_name/index.vue (and ignore other componnets in that folder)
+    if (nparts.length === 2) {
+      if (nparts[1] !== 'index') {
+        return;
+      }
+      name = nparts[0];
+    }
+
     // Accumulate l10n resources rather than replace
     if (type === 'l10n') {
       if (!this.l10n[name]) {

package/creators/app/init

@@ -7,6 +7,7 @@ const exec = require('child_process').exec;
 const targets = {
   'dev': './node_modules/.bin/nuxt dev',
   'nuxt': './node_modules/.bin/nuxt',
+  'build': './node_modules/.bin/nuxt build'
 };
 
 const files = [
@@ -64,7 +65,12 @@ Object.keys(targets).forEach((target) => {
 });
 
 // Add dependencies
-pkg.dependencies['@rancher/shell'] = '^0.6.16';
+// Use the same shell version as this app creator
+
+const creatorPkgData = fs.readFileSync(path.join(__dirname, 'package.json'));
+const creatorPkg = JSON.parse(creatorPkgData);
+
+pkg.dependencies['@rancher/shell'] = `^${ creatorPkg.version }`;
 pkg.dependencies['core-js'] = '^3.20.3';
 pkg.dependencies['css-loader'] = '4.3.0';
 

package/creators/pkg/tsconfig.json

@@ -32,7 +32,7 @@
       ],
       "@shell/store/*": [
         "../../node_modules/@rancher/shell/store/*"
-      ],
+      ]
     }
   },
   "include": [
@@ -40,8 +40,7 @@
     "**/*.tsx",
     "**/*.vue",
     "../../node_modules/@rancher/shell/types/*.d.ts",
-    "../../node_modules/@rancher/shell/core/*.ts",
-    "../../node_modules/@rancher/shell/config/**/*.js"
+    "../../node_modules/@rancher/shell/core/types.ts"
   ],
   "exclude": [
     "node_modules"

package/detail/catalog.cattle.io.app.vue

@@ -4,7 +4,7 @@ import Loading from '@shell/components/Loading';
 import Markdown from '@shell/components/Markdown';
 import Tabbed from '@shell/components/Tabbed';
 import Tab from '@shell/components/Tabbed/Tab';
-import Banner from '@shell/components/Banner';
+import { Banner } from '@components/Banner';
 import RelatedResources from '@shell/components/RelatedResources';
 import jsyaml from 'js-yaml';
 import merge from 'lodash/merge';

package/detail/cis.cattle.io.clusterscan.vue

@@ -1,7 +1,7 @@
 <script>
 import Date from '@shell/components/formatter/Date';
 import SortableTable from '@shell/components/SortableTable';
-import Banner from '@shell/components/Banner';
+import { Banner } from '@components/Banner';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 import Loading from '@shell/components/Loading';
 import day from 'dayjs';

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

@@ -1,16 +1,14 @@
 <script>
 import { FLEET } from '@shell/config/types';
 import FleetBundleResources from '@shell/components/fleet/FleetBundleResources.vue';
-import Tabbed from '@shell/components/Tabbed';
-import Tab from '@shell/components/Tabbed/Tab';
+import SortableTable from '@shell/components/SortableTable';
 
 export default {
   name: 'FleetBundleDetail',
 
   components: {
-    Tabbed,
-    Tab,
     FleetBundleResources,
+    SortableTable,
   },
   props:      {
     value: {
@@ -27,30 +25,53 @@ export default {
     const { namespace, labels } = this.value.metadata;
     const repoName = `${ namespace }/${ labels['fleet.cattle.io/repo-name'] }`;
 
-    this.repo = await this.$store.dispatch('management/find', { type: FLEET.GIT_REPO, id: repoName });
+    if (this.hasRepoLabel) {
+      this.repo = await this.$store.dispatch('management/find', { type: FLEET.GIT_REPO, id: repoName });
+    }
   },
 
   computed: {
-
+    hasRepoLabel() {
+      return !!(this.value?.metadata?.labels && this.value?.metadata?.labels['fleet.cattle.io/repo-name']);
+    },
     bundleResources() {
-      const bundleResourceIds = this.bundleResourceIds;
+      if (this.hasRepoLabel) {
+        const bundleResourceIds = this.bundleResourceIds;
 
-      return this.repo?.status?.resources.filter((resource) => {
-        return bundleResourceIds.includes(resource.name);
-      });
-    },
+        return this.repo?.status?.resources.filter((resource) => {
+          return bundleResourceIds.includes(resource.name);
+        });
+      } else if (this.value?.spec?.resources?.length) {
+        return this.value?.spec?.resources.map((item) => {
+          return {
+            content: item.content,
+            name:    item.name.includes('.') ? item.name.split('.')[0] : item.name
+          };
+        });
+      }
 
+      return [];
+    },
+    resourceHeaders() {
+      return [
+        {
+          name:      'name',
+          value:     'name',
+          sort:      ['name'],
+          labelKey:  'tableHeaders.name',
+        },
+      ];
+    },
+    resourceCount() {
+      return (this.bundleResources && this.bundleResources.length) || this.value?.spec?.resources?.length;
+    },
     bundleResourceIds() {
       if (this.value.status?.resourceKey) {
         return this.value?.status?.resourceKey.map(item => item.name);
       }
 
       return [];
-    },
-
-    repoSchema() {
-      return this.$store.getters['management/schemaFor'](FLEET.GIT_REPO);
-    },
+    }
   }
 };
 
@@ -58,10 +79,41 @@ export default {
 
 <template>
   <div>
-    <Tabbed>
-      <Tab label="Resources" name="resources" :weight="30">
-        <FleetBundleResources :value="bundleResources" />
-      </Tab>
-    </Tabbed>
+    <div class="bundle-title mt-20 mb-20">
+      <h2>{{ t('fleet.bundles.resources') }}</h2>
+      <span>{{ resourceCount }}</span>
+    </div>
+    <FleetBundleResources
+      v-if="hasRepoLabel"
+      :value="bundleResources"
+    />
+    <SortableTable
+      v-else
+      :rows="bundleResources"
+      :headers="resourceHeaders"
+      :table-actions="false"
+      :row-actions="false"
+      key-field="tableKey"
+      default-sort-by="state"
+      :paged="true"
+    />
   </div>
 </template>
+
+<style lang="scss" scoped>
+.bundle-title {
+  display: flex;
+  align-items: center;
+
+  h2 {
+    margin: 0 10px 0 0;
+  }
+
+  span {
+    background-color: var(--darker);
+    color: var(--default);
+    padding: 5px 10px;
+    border-radius: 15px;
+  }
+}
+</style>