@rancher/shell 3.0.1-rc.3 → 3.0.1

package/composables/useLabeledFormElement.ts

@@ -1,4 +1,6 @@
-import { ref, computed, ComputedRef, Ref } from 'vue';
+import {
+  ref, computed, ComputedRef, Ref, defineEmits
+} from 'vue';
 import { _VIEW, _EDIT } from '@shell/config/query-params';
 
 interface LabeledFormElementProps {
@@ -70,7 +72,9 @@ export const labeledFormElementProps = {
   }
 };
 
-export const useLabeledFormElement = (props: LabeledFormElementProps, emit: (event: string, ...args: any[]) => void): UseLabeledFormElement => {
+const labeledFormElementEmits = defineEmits(['update:validation']);
+
+export const useLabeledFormElement = (props: LabeledFormElementProps, emit: typeof labeledFormElementEmits): UseLabeledFormElement => {
   const raised = ref(props.mode === _VIEW || !!`${ props.value }`);
   const focused = ref(false);
   const blurred = ref<number | null>(null);

package/config/pagination-table-headers.js

@@ -17,8 +17,8 @@ export const STEVE_ID_COL = {
   name:     'steve-id',
   labelKey: 'tableHeaders.id',
   value:    'id',
-  sort:     false, // sort:     ['id'], // Pending API support
-  search:   false, // search:   'id', // Pending API support
+  sort:     ['id'],
+  search:   'id',
 };
 
 export const STEVE_STATE_COL = {
@@ -26,8 +26,8 @@ export const STEVE_STATE_COL = {
   // Note, we're show the 'state' as per model, not the 'metadata.state.name' that's available in the model to remotely sort/filter
   // Need to investigate whether we should 'dumb down' the state we show to the native one (tracked via https://github.com/rancher/dashboard/issues/8527)
   // This means we'll show something different to what we sort and filter on.
-  sort:   false, // ['metadata.state.name'], // Pending API support
-  search: false, // 'metadata.state.name', // Pending API support
+  sort:   ['metadata.state.name'],
+  search: 'metadata.state.name',
 };
 
 export const STEVE_AGE_COL = {

package/config/product/explorer.js

@@ -9,6 +9,7 @@ import {
   NORMAN,
   SNAPSHOT,
   VIRTUAL_TYPES,
+  CAPI,
 } from '@shell/config/types';
 
 import {
@@ -60,6 +61,7 @@ export function init(store) {
       [MANAGEMENT.PROJECT_ROLE_TEMPLATE_BINDING]: 'management',
       [NORMAN.CLUSTER_ROLE_TEMPLATE_BINDING]:     'rancher',
       [NORMAN.PROJECT_ROLE_TEMPLATE_BINDING]:     'rancher',
+      [CAPI.RANCHER_CLUSTER]:                     'management',
     }
   });
 

package/config/router/navigation-guards/index.js

@@ -4,7 +4,6 @@ import { install as installAuthentication } from '@shell/config/router/navigatio
 import { install as installRuntimeExtensionRoute } from '@shell/config/router/navigation-guards/runtime-extension-route';
 import { install as installI18N } from '@shell/config/router/navigation-guards/i18n';
 import { install as installProducts } from '@shell/config/router/navigation-guards/products';
-import { install as installHistory } from '@shell/config/router/navigation-guards/history';
 import { install as installClusters } from '@shell/config/router/navigation-guards/clusters';
 import { install as installHandleInstallRedirect } from '@shell/config/router/navigation-guards/install-redirect';
 import { install as installPageTitle } from '@shell/config/router/navigation-guards/page-title';
@@ -17,7 +16,7 @@ export function installNavigationGuards(router, context) {
   // NOTE: the order of the installation matters.
   // Be intentional when adding, removing or modifying the guards that are installed.
 
-  const navigationGuardInstallers = [installLoadInitialSettings, installAttemptFirstLogin, installAuthentication, installProducts, installHistory, installClusters, installRuntimeExtensionRoute, installI18N, installHandleInstallRedirect, installPageTitle, installServerUpgradeGrowl];
+  const navigationGuardInstallers = [installLoadInitialSettings, installAttemptFirstLogin, installAuthentication, installProducts, installClusters, installRuntimeExtensionRoute, installI18N, installHandleInstallRedirect, installPageTitle, installServerUpgradeGrowl];
 
   navigationGuardInstallers.forEach((installer) => installer(router, context));
 }

package/config/router/routes.js

@@ -5,7 +5,7 @@ import { CAPI, MANAGEMENT, BACKUP_RESTORE, CIS } from '@shell/config/types';
 import { NAME as AUTH } from '@shell/config/product/auth';
 
 // All these imports are related to the install-redirect.js navigation guard.
-import { installRedirectRouteMeta } from 'config/router/navigation-guards/install-redirect';
+import { installRedirectRouteMeta } from '@shell/config/router/navigation-guards/install-redirect';
 import { NAME as BACKUP_NAME, CHART_NAME as BACKUP_CHART_NAME } from '@shell/config/product/backup';
 import { NAME as CIS_NAME, CHART_NAME as CIS_CHART_NAME } from '@shell/config/product/cis';
 import { NAME as GATEKEEPER_NAME, CHART_NAME as GATEKEEPER_CHART_NAME } from '@shell/config/product/gatekeeper';

package/config/settings.ts

@@ -1,6 +1,7 @@
 // Settings
 import { GC_DEFAULTS, GC_PREFERENCES } from '@shell/utils/gc/gc-types';
 import { PaginationSettings } from '@shell/types/resources/settings';
+import { CAPI, MANAGEMENT } from '@shell/config/types';
 
 interface GlobalSettingRuleset {
   name: string,
@@ -51,7 +52,6 @@ export const SETTING = {
   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',
@@ -156,12 +156,8 @@ export const ALLOWED_SETTINGS: GlobalSetting = {
   },
   [SETTING.BRAND]:                        { canReset: true },
   [SETTING.CLUSTER_TEMPLATE_ENFORCEMENT]: { kind: 'boolean' },
-  [SETTING.TELEMETRY]:                    {
-    kind:    'enum',
-    options: ['prompt', 'in', 'out']
-  },
-  [SETTING.HIDE_LOCAL_CLUSTER]: { kind: 'boolean' },
-  [SETTING.AGENT_TLS_MODE]:     {
+  [SETTING.HIDE_LOCAL_CLUSTER]:           { kind: 'boolean' },
+  [SETTING.AGENT_TLS_MODE]:               {
     kind:    'enum',
     options: ['strict', 'system-store'],
     warning: 'agent-tls-mode'
@@ -258,8 +254,19 @@ export const DEFAULT_PERF_SETTING: PerfSettings = {
             generic: true,
           }
         }
+      },
+      management: {
+        resources: {
+          enableAll:  false,
+          enableSome: {
+            enabled: [
+              { resource: CAPI.RANCHER_CLUSTER, context: ['home', 'side-bar'] },
+              { resource: MANAGEMENT.CLUSTER, context: ['side-bar'] },
+            ],
+            generic: false,
+          }
+        }
       }
     }
   }
-
 };

package/core/plugin.ts

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/explicit-module-boundary-types */
 import { RouteRecordRaw } from 'vue-router';
 import { DSL as STORE_DSL } from '@shell/store/type-map';
+import { _DETAIL } from '@shell/config/query-params';
 import {
   CoreStoreInit,
   Action,
@@ -11,7 +12,7 @@ import {
   IPlugin,
   LocationConfig,
   ExtensionPoint,
-
+  TabLocation,
   PluginRouteRecordRaw, RegisterStore, UnregisterStore, CoreStoreSpecifics, CoreStoreConfig, OnNavToPackage, OnNavAwayFromPackage, OnLogOut
 } from './types';
 import coreStore, { coreStoreModule, coreStoreState } from '@shell/plugins/dashboard-store';
@@ -162,6 +163,12 @@ export class Plugin implements IPlugin {
    * Adds a tab to the UI
    */
   addTab(where: string, when: LocationConfig | string, tab: Tab): void {
+    // tackling https://github.com/rancher/dashboard/issues/11122, we don't want the tab to added in _EDIT view, unless overriden
+    // on extensions side we won't document the mode param for this extension point
+    if (where === TabLocation.RESOURCE_DETAIL && (typeof when === 'object' && !when.mode)) {
+      when.mode = [_DETAIL];
+    }
+
     this._addUIConfig(ExtensionPoint.TAB, where, when, this._createAsyncComponent(tab));
   }
 

package/core/types-provisioning.ts

@@ -106,6 +106,11 @@ export interface IClusterProvisioner {
    */
   disabled?: boolean;
 
+  /**
+   * Hide the cluster provider card
+   */
+  hidden?: boolean;
+
   /**
    * Custom Dashboard route to navigate to when the cluster provider card is clicked
    */

package/core/types.ts

@@ -237,6 +237,16 @@ export interface ProductOptions {
    */
   to?: PluginRouteRecordRaw;
 
+  /**
+   * Alternative to the icon property. Uses require
+   */
+  svg?: Function;
+
+  /**
+   * Product name
+   */
+  name?: string;
+
   /**
    * Leaving these here for completeness but I don't think these should be advertised as useable to plugin creators.
    */
@@ -373,10 +383,25 @@ export interface ConfigureTypeOptions {
 }
 
 export interface ConfigureVirtualTypeOptions extends ConfigureTypeOptions {
+  /**
+   * Only load the product if the type is present
+   */
+  ifHave?: string;
+
+  /**
+   * Only load the product if the type is present
+   */
+  ifHaveType?: string | RegExp | Object;
+
+  /**
+   * The label that this type should display
+   */
+  label?: string;
+
   /**
    * The translation key displayed anywhere this type is referenced
    */
-  labelKey: string;
+  labelKey?: string;
 
   /**
    * An identifier that should be unique across all types

package/dialog/DrainNode.vue

@@ -146,7 +146,7 @@ export default {
       <div class="pl-10 pr-10">
         <div>
           <RadioGroup
-            v-model="body.deleteLocalData"
+            v-model:value="body.deleteLocalData"
             name="deleteLocalData"
             :options="radioOptions"
             :row="true"
@@ -157,7 +157,7 @@ export default {
             </template>
           </RadioGroup>
           <RadioGroup
-            v-model="body.force"
+            v-model:value="body.force"
             name="force"
             :options="radioOptions"
             :row="true"
@@ -168,7 +168,7 @@ export default {
             </template>
           </RadioGroup>
           <RadioGroup
-            v-model="gracePeriod"
+            v-model:value="gracePeriod"
             name="gracePeriod"
             :options="gracePeriodOptions"
             class="mb-15"
@@ -178,7 +178,7 @@ export default {
             </template>
           </RadioGroup>
           <UnitInput
-            v-model="body.gracePeriod"
+            v-model:value="body.gracePeriod"
             :mode="gracePeriod ? EDIT : VIEW"
             type="number"
             min="1"
@@ -187,7 +187,7 @@ export default {
             class="mb-10"
           />
           <RadioGroup
-            v-model="timeout"
+            v-model:value="timeout"
             name="timeout"
             :options="timeoutOptions"
             class="mb-15"
@@ -197,7 +197,7 @@ export default {
             </template>
           </RadioGroup>
           <UnitInput
-            v-model="body.timeout"
+            v-model:value="body.timeout"
             :mode="timeout ? EDIT : VIEW"
             type="number"
             min="1"

package/edit/catalog.cattle.io.clusterrepo.vue

@@ -9,6 +9,7 @@ import SelectOrCreateAuthSecret from '@shell/components/form/SelectOrCreateAuthS
 import InfoBox from '@shell/components/InfoBox';
 import { Checkbox } from '@components/Form/Checkbox';
 import { MANAGEMENT, NAMESPACE, CLUSTER_REPO_TYPES } from '@shell/config/types';
+import UnitInput from '@shell/components/form/UnitInput.vue';
 
 export default {
   name: 'CruCatalogRepo',
@@ -23,7 +24,8 @@ export default {
     Labels,
     SelectOrCreateAuthSecret,
     InfoBox,
-    Checkbox
+    Checkbox,
+    UnitInput
   },
 
   mixins: [CreateEditView],
@@ -83,7 +85,7 @@ export default {
         this.value.spec['exponentialBackOffValues'] = {};
       }
       // when user removes the value we remove the key too, backend will set the default value
-      if (newVal === '') {
+      if (newVal === '' || newVal === null) {
         delete this.value.spec.exponentialBackOffValues[key];
 
         return;
@@ -91,15 +93,27 @@ export default {
 
       this.value.spec.exponentialBackOffValues[key] = Number(newVal);
     },
+    updateRefreshInterval(newVal) {
+      // when user removes the value we don't send refreshInterval along with the payload
+      if (newVal === null) {
+        delete this.value.spec.refreshInterval;
+
+        return;
+      }
+
+      this.value.spec.refreshInterval = newVal;
+    },
     resetGitRepoValues() {
       delete this.value.spec['gitRepo'];
       delete this.value.spec['gitBranch'];
+      delete this.value.spec['refreshInterval'];
     },
     resetOciValues() {
       delete this.value.spec['url'];
       delete this.value.spec['insecurePlainHttp'];
       delete this.value.spec['insecureSkipTLSVerify'];
       delete this.value.spec['caBundle'];
+      delete this.value.spec['refreshInterval'];
       delete this.value.spec['exponentialBackOffValues'];
       this.ociMinWait = undefined;
       this.ociMaxWait = undefined;
@@ -139,55 +153,80 @@ export default {
       </div>
     </div>
 
-    <div
-      v-if="clusterRepoType === CLUSTER_REPO_TYPES.GIT_REPO"
-      class="row mb-10"
+    <InfoBox
+      v-if="clusterRepoType === CLUSTER_REPO_TYPES.OCI_URL"
+      class="p-10"
     >
-      <div class="col span-6">
+      {{ t('catalog.repo.oci.info', null, true) }}
+    </InfoBox>
+
+    <div class="row mb-10">
+      <template v-if="clusterRepoType === CLUSTER_REPO_TYPES.GIT_REPO">
+        <div class="col span-6">
+          <LabeledInput
+            v-model:value.trim="value.spec.gitRepo"
+            :required="true"
+            :label="t('catalog.repo.gitRepo.label')"
+            :placeholder="t('catalog.repo.gitRepo.placeholder', null, true)"
+            :mode="mode"
+            data-testid="clusterrepo-git-repo-input"
+          />
+        </div>
+        <div class="col span-3">
+          <LabeledInput
+            v-model:value.trim="value.spec.gitBranch"
+            :sub-label="!value.spec.gitBranch ? t('catalog.repo.gitBranch.defaultMessage', null, true) : undefined"
+            :label="t('catalog.repo.gitBranch.label')"
+            :placeholder="t('catalog.repo.gitBranch.placeholder', null, true)"
+            :mode="mode"
+            data-testid="clusterrepo-git-branch-input"
+          />
+        </div>
+      </template>
+
+      <template v-else-if="clusterRepoType === CLUSTER_REPO_TYPES.OCI_URL">
+        <div class="col span-6">
+          <LabeledInput
+            v-model:value.trim="value.spec.url"
+            :required="true"
+            :label="t('catalog.repo.oci.urlLabel')"
+            :placeholder="t('catalog.repo.oci.placeholder', null, true)"
+            :mode="mode"
+            data-testid="clusterrepo-oci-url-input"
+          />
+        </div>
+      </template>
+
+      <div
+        v-else
+        class="col span-6"
+      >
         <LabeledInput
-          v-model:value.trim="value.spec.gitRepo"
+          v-model:value.trim="value.spec.url"
           :required="true"
-          :label="t('catalog.repo.gitRepo.label')"
-          :placeholder="t('catalog.repo.gitRepo.placeholder', null, true)"
+          :label="t('catalog.repo.url.label')"
+          :placeholder="t('catalog.repo.url.placeholder', null, true)"
           :mode="mode"
-          data-testid="clusterrepo-git-repo-input"
+          data-testid="clusterrepo-helm-url-input"
         />
       </div>
-      <div class="col span-6">
-        <LabeledInput
-          v-model:value.trim="value.spec.gitBranch"
-          :sub-label="!value.spec.gitBranch ? t('catalog.repo.gitBranch.defaultMessage', null, true) : undefined"
-          :label="t('catalog.repo.gitBranch.label')"
-          :placeholder="t('catalog.repo.gitBranch.placeholder', null, true)"
+
+      <div
+        class="col span-3"
+        data-testid="clusterrepo-refresh-interval"
+      >
+        <UnitInput
+          v-model:value.trim="value.spec.refreshInterval"
+          :label="t('catalog.repo.refreshInterval.label')"
           :mode="mode"
-          data-testid="clusterrepo-git-branch-input"
+          min="0"
+          :suffix="t('unit.hour', { count: value.spec.refreshInterval })"
+          :placeholder="t('catalog.repo.refreshInterval.placeholder', { hours: clusterRepoType === CLUSTER_REPO_TYPES.OCI_URL ? 24 : 6 })"
+          @update:value="updateRefreshInterval($event)"
         />
       </div>
     </div>
 
-    <div v-else-if="clusterRepoType === CLUSTER_REPO_TYPES.OCI_URL">
-      <InfoBox class="p-10">
-        {{ t('catalog.repo.oci.info', null, true) }}
-      </InfoBox>
-      <LabeledInput
-        v-model:value.trim="value.spec.url"
-        :required="true"
-        :label="t('catalog.repo.oci.urlLabel')"
-        :placeholder="t('catalog.repo.oci.placeholder', null, true)"
-        :mode="mode"
-        data-testid="clusterrepo-oci-url-input"
-      />
-    </div>
-
-    <LabeledInput
-      v-else
-      v-model:value.trim="value.spec.url"
-      :required="true"
-      :label="t('catalog.repo.url.label')"
-      :placeholder="t('catalog.repo.url.placeholder', null, true)"
-      :mode="mode"
-      data-testid="clusterrepo-helm-url-input"
-    />
     <SelectOrCreateAuthSecret
       v-model:value="value.spec.clientSecret"
       :mode="mode"
@@ -231,28 +270,32 @@ export default {
       <h4 class="mb-10 mt-20">
         {{ t('catalog.repo.oci.exponentialBackOff.label') }}
       </h4>
-      <div class="row mb-10 mt-10">
-        <div class="col span-4">
-          <LabeledInput
+      <div class="row mb-40 mt-10">
+        <div
+          class="col span-4"
+          data-testid="clusterrepo-oci-min-wait-input"
+        >
+          <UnitInput
             v-model:value.trim="ociMinWait"
             :label="t('catalog.repo.oci.exponentialBackOff.minWait.label')"
-            :placeholder="!ociMinWait ? t('catalog.repo.oci.exponentialBackOff.minWait.placeholder') : undefined"
+            :placeholder="t('catalog.repo.oci.exponentialBackOff.minWait.placeholder')"
             :mode="mode"
-            type="number"
             min="1"
-            data-testid="clusterrepo-oci-min-wait-input"
+            :suffix="t('suffix.seconds', { count: ociMinWait })"
             @update:value="updateExponentialBackOffValues('minWait', $event)"
           />
         </div>
-        <div class="col span-4">
-          <LabeledInput
+        <div
+          class="col span-4"
+          data-testid="clusterrepo-oci-max-wait-input"
+        >
+          <UnitInput
             v-model:value.trim="ociMaxWait"
             :label="t('catalog.repo.oci.exponentialBackOff.maxWait.label')"
-            :placeholder="!ociMaxWait ? t('catalog.repo.oci.exponentialBackOff.maxWait.placeholder') : undefined"
+            :placeholder="t('catalog.repo.oci.exponentialBackOff.maxWait.placeholder')"
             :mode="mode"
-            type="number"
             min="1"
-            data-testid="clusterrepo-oci-max-wait-input"
+            :suffix="t('suffix.seconds', { count: ociMaxWait })"
             @update:value="updateExponentialBackOffValues('maxWait', $event)"
           />
         </div>
@@ -260,7 +303,7 @@ export default {
           <LabeledInput
             v-model:value.trim="ociMaxRetries"
             :label="t('catalog.repo.oci.exponentialBackOff.maxRetries.label')"
-            :placeholder="!ociMaxRetries ? t('catalog.repo.oci.exponentialBackOff.maxRetries.placeholder') : undefined"
+            :placeholder="t('catalog.repo.oci.exponentialBackOff.maxRetries.placeholder')"
             :mode="mode"
             type="number"
             min="0"

package/edit/provisioning.cattle.io.cluster/index.vue

@@ -404,7 +404,8 @@ export default {
           disabled:    ext.disabled || false,
           link:        ext.link,
           tag:         ext.tag,
-          component:   ext.component
+          component:   ext.component,
+          hidden:      ext.hidden,
         };
 
         out.push(subtype);
@@ -449,10 +450,14 @@ export default {
       }
     },
 
+    filteredSubTypes() {
+      return this.subTypes.filter((subtype) => !subtype.hidden);
+    },
+
     groupedSubTypes() {
       const out = {};
 
-      for ( const row of this.subTypes ) {
+      for ( const row of this.filteredSubTypes ) {
         const name = row.group;
         let entry = out[name];
 
@@ -623,7 +628,7 @@ export default {
       <div
         v-for="(obj, i) in groupedSubTypes"
         :key="i"
-        class="mb-20"
+        :class="{'mt-5': i === 0, 'mt-20': i !== 0 }"
         style="width: 100%;"
       >
         <h4>

package/edit/workload/index.vue

@@ -415,7 +415,7 @@ export default {
           >
             <Tab
               :label="t('workload.storage.title')"
-              name="storage"
+              name="storage-pod"
               :weight="tabWeightMap['storage']"
               @active="$refs.storage.refresh()"
             >

package/edit/workload/storage/csi/index.vue

@@ -44,6 +44,33 @@ export default {
 
     ...mapGetters({ t: 'i18n/t' })
   },
+
+  methods: {
+    /**
+    * Retrieves the label for a given option
+    * @param option The option for which to retrieve the label. option can be
+    * either a string or an object. If it is an object, is should have a `label`
+    * property associated with it.
+    */
+    getOptionLabel(option) {
+      if (typeof option === 'string') {
+        return this.getOptionLabelString(option);
+      }
+
+      const { label } = option;
+
+      return this.getOptionLabelString(label);
+    },
+    /**
+    * Translates a given key into a localized string.
+    * @param key The key to be translated.
+    */
+    getOptionLabelString(key) {
+      // Periods are replaced with `-` to prevent conflict with the default key
+      // separator.
+      return this.t(`workload.storage.csi.drivers.'${ key.replaceAll('.', '-') }'`);
+    }
+  }
 };
 </script>
 
@@ -71,10 +98,11 @@ export default {
         <div class="col span-6">
           <LabeledSelect
             v-model:value="value.csi.driver"
+            data-testid="workload-storage-driver"
             :mode="mode"
             :label="t('workload.storage.driver')"
             :options="driverOpts"
-            :get-option-label="opt=>t(`workload.storage.csi.drivers.'${opt}'`)"
+            :get-option-label="getOptionLabel"
             :required="true"
           />
         </div>

package/edit/workload/storage/index.vue

@@ -301,6 +301,7 @@ export default {
           :button-label="t('workload.storage.addVolume')"
           :dropdown-options="volumeTypeOptions"
           size="sm"
+          data-testid="dropdown-button-storage-volume"
           @click-action="e=>addVolume(e.value)"
         />
       </template>

package/initialize/App.vue

@@ -1,15 +1,10 @@
 <script>
-import NuxtError from '@shell/components/templates/error.vue';
 import NuxtLoading from '@shell/components/nav/GlobalLoading.vue';
 
 import '@shell/assets/styles/app.scss';
 
 export default {
-  data: () => ({
-    isOnline: true,
-
-    showErrorPage: false,
-  }),
+  data: () => ({ isOnline: true }),
 
   created() {
     // add to window so we can listen when ready
@@ -60,7 +55,7 @@ export default {
     },
   },
 
-  components: { NuxtLoading, NuxtError }
+  components: { NuxtLoading }
 };
 </script>
 <template>
@@ -68,10 +63,8 @@ export default {
     <NuxtLoading ref="loading" />
     <div
       id="__layout"
-      :key="showErrorPage"
     >
-      <NuxtError v-if="showErrorPage" />
-      <router-view v-else />
+      <router-view />
     </div>
   </div>
 </template>

package/initialize/install-plugins.js

@@ -15,7 +15,6 @@ import axios from '@shell/utils/axios';
 import cookieUniversal from '@shell/utils/cookie-universal';
 import config from '@shell/utils/config';
 import axiosShell from '@shell/plugins/axios';
-import backButton from '@shell/plugins/back-button';
 import codeMirror from '@shell/plugins/codemirror-loader';
 import { InstallCodeMirror } from 'codemirror-editor-vue3';
 import * as intNumber from '@shell/directives/int-number';
@@ -42,7 +41,7 @@ export async function installPlugins(vueApp) {
 }
 
 export async function installInjectedPlugins(app, vueApp) {
-  const pluginDefinitions = [config, cookieUniversal, axios, plugins, pluginsLoader, axiosShell, intNumber, codeMirror, nuxtClientInit, replaceAll, backButton, plugin, steveCreateWorker, emberCookie];
+  const pluginDefinitions = [config, cookieUniversal, axios, plugins, pluginsLoader, axiosShell, intNumber, codeMirror, nuxtClientInit, replaceAll, plugin, steveCreateWorker, emberCookie];
 
   const installations = pluginDefinitions.map(async(pluginDefinition) => {
     if (typeof pluginDefinition === 'function') {