dashboard-shell-shell 1.0.121 → 1.0.1000000081

package/scripts/extension/publish

@@ -1,4 +1,5 @@
 #!/usr/bin/env bash
+set -eo pipefail
 
 SCRIPT_DIR="$( cd -- "$( dirname -- "${BASH_SOURCE[0]}" )" &> /dev/null && pwd )"
 BASE_DIR="$(pwd)"
@@ -330,6 +331,12 @@ if [ "${UPDATE_LATEST_PACAKGES}" = "true" ]; then
       find plugin -type f | sort > files.txt
       popd > /dev/null
 
+      # --------------------------------------------------------------------------------
+      # Package extensions into tgz for the compressedEndpoint
+      # --------------------------------------------------------------------------------
+      echo -e "${CYAN}Packaging extension into tgz${RESET}"
+      tar -czf ${BASE_DIR}/extensions/${pkg}/${PKG_VERSION}.tgz -C ${BASE_DIR}/extensions/${pkg} ${PKG_VERSION}
+
       # --------------------------------------------------------------------------------
       # Create the Helm chart
       # --------------------------------------------------------------------------------
@@ -358,18 +365,11 @@ if [ "${UPDATE_LATEST_PACAKGES}" = "true" ]; then
         cp ./pkg/${pkg}/README.md ${CHART_FOLDER}/README.md
       fi
 
-      pushd ${CHART_FOLDER}/templates > /dev/null
-      
-      if [ "${GITHUB_BUILD}" == "true" ]; then
-        echo "Patching for GitHub build"
-        ENDPOINT=https://raw.githubusercontent.com/${GITHUB_SOURCE}/${GITHUB_BRANCH}/extensions/${pkg}/${PKG_VERSION}
-      else
-        echo "Patching for container build"
-        ENDPOINT=http://${IMAGE_PREFIX}${BASE_EXT}-svc.cattle-ui-plugin-system:8080/plugin/${PKG_NAME}
-      fi
-      sed -i.bak -e 's@endpoint: .*@endpoint: '"${ENDPOINT}"'@g' cr.yaml
-      rm *.bak
-      popd > /dev/null
+      export GITHUB_BUILD
+      export IMAGE_PREFIX
+      export BASE_EXT
+      export GITHUB_SOURCE
+      export GITHUB_BRANCH
 
       # Additional patches
       ${SCRIPT_DIR}/helmpatch ${CHART_FOLDER} "${BASE_DIR}/pkg/${pkg}/package.json"

package/scripts/publish-shell.sh

@@ -1,10 +1,16 @@
 #!/usr/bin/env bash
 
+# 执行命令：TAG=cloud-shell-pkg-v{版本号} ./cloud-shell/scripts/publish-shell.sh
+
 set -eo pipefail
 
 SCRIPT_DIR="$(cd -- "$(dirname -- "${BASH_SOURCE[0]}")" &>/dev/null && pwd)"
 BASE_DIR="$(cd $SCRIPT_DIR && cd ../.. && pwd)"
-SHELL_DIR=$BASE_DIR/shell/
+echo "BASE_DIR is ${BASE_DIR}"
+echo "SCRIPT_DIR is ${SCRIPT_DIR}"
+echo "PWD is $(pwd)"
+CLOUD_SHELL_DIR=$BASE_DIR/cloud-shell/
+echo "CLOUD_SHELL_DIR is ${CLOUD_SHELL_DIR}"
 CREATORS_DIR=$BASE_DIR/creators/extension
 FORCE_PUBLISH_TO_NPM="false"
 DEFAULT_NPM_REGISTRY="https://registry.npmjs.org"
@@ -20,7 +26,7 @@ if [ ! -d "${BASE_DIR}/node_modules" ]; then
   exit 1
 fi
 
-echo "Publishing Shell Packages"
+echo "Publishing Cloud Shell Packages"
 
 if [ "$1" == "--npm" ]; then
   FORCE_PUBLISH_TO_NPM="true"
@@ -32,26 +38,16 @@ fi
 
 PUBLISH_ARGS="--no-git-tag-version --access public --registry $NPM_REGISTRY"
 
-pushd ${SHELL_DIR} >/dev/null
+pushd ${CLOUD_SHELL_DIR} >/dev/null
 
 function publish() {
   NAME=$1
   FOLDER=$2
 
-  # if we pass a third arg, that is the version number
-  # that we want to actually publish on NPM
-  # they should match with the package.json version stated 
-  # because of the check in the "Check Tags Version Matching" step in the workflow
   if [ -n "$3" ]; then
     PKG_VERSION=$3
   fi
 
-  # if the PKG_VERSION has a - it means it will be a pre-release
-  if [[ $PKG_VERSION == *"-"* ]]; then
-    PUBLISH_ARGS="$PUBLISH_ARGS --tag pre-release"
-  fi
-
-  # when testing the workflow, we don't want to actually do an npm publish but only a dry run
   if [ ${DRY_RUN} == "true" ]; then
     PUBLISH_ARGS="$PUBLISH_ARGS --dry-run"
   fi
@@ -62,13 +58,12 @@ function publish() {
   pushd ${FOLDER} >/dev/null
 
   # For now, copy the rancher components into the shell and ship them with it
-  if [ "$NAME" == "Shell" ]; then
+  if [ "$NAME" == "Cloud Shell" ]; then
     echo "Adding Rancher Components"
     rm -rf ./rancher-components
     cp -R ${BASE_DIR}/pkg/rancher-components/src/components ./rancher-components/
   fi
 
-  # Make a note of dependency versions, if required
   node ${SCRIPT_DIR}/record-deps.js
 
   echo "Publishing to registry: $NPM_REGISTRY"
@@ -86,30 +81,30 @@ function publish() {
 
 echo "TAG ${TAG}"
   
-  # let's get the package name and version from the tag
+# let's get the package name and version from the tag
 PKG_NAME=$(sed 's/-pkg-v.*//' <<< "$TAG")
 PKG_V=$(sed 's/.*-pkg-v//'<<< "$TAG")
 
 echo "PKG_NAME ${PKG_NAME}"
 echo "PKG_V ${PKG_V}"
 
-# Generate the type definitions for the shell
-if [ ${PKG_NAME} == "shell" ]; then
+# Generate the type definitions for the cloud-shell
+if [ ${PKG_NAME} == "cloud-shell" ]; then
   ${SCRIPT_DIR}/typegen.sh
 fi
 
 # version comparison checks
 case $PKG_NAME in
-  "shell")
-    echo "Publishing only Shell pkg via tagged release"
-    publish "Shell" ${SHELL_DIR} ${PKG_V}
+  "cloud-shell")
+    echo "Publishing only Cloud Shell pkg via tagged release"
+    publish "Cloud Shell" ${CLOUD_SHELL_DIR} ${PKG_V}
     ;;
   "creators")
     echo "Publishing only Creators pkg via tagged release"
     publish "Extension creator" ${CREATORS_DIR} ${PKG_V}
     ;;
   *)
-    echo "something went wrong with the tagging name => TAG: ${TAG} , PKG_NAME: ${PKG_NAME}. Admissable names are 'shell' and 'creator'"
+    echo "something went wrong with the tagging name => TAG: ${TAG} , PKG_NAME: ${PKG_NAME}. Admissable names are 'cloud-shell' and 'creators'"
     exit 1
     ;;
-esac
+esac

package/scripts/test-plugins-build.sh

@@ -238,11 +238,9 @@ function clone_repo_test_extension_build() {
 # Don't forget to add the unit tests exception to clone_repo_test_extension_build function if a new extension has those
 clone_repo_test_extension_build "rancher" "kubewarden-ui" "kubewarden"
 clone_repo_test_extension_build "rancher" "elemental-ui" "elemental"
-# TODO #13141: Enable neuvector tests after issues have been resolved
-# clone_repo_test_extension_build "neuvector" "manager-ext" "neuvector-ui-ext"
-# TODO: #13173: Enable capi, stackstate, and harvester after `entities` resolution has been set
-# clone_repo_test_extension_build "rancher" "capi-ui-extension" "capi"
-# clone_repo_test_extension_build "StackVista" "rancher-extension-stackstate" "observability"
-# clone_repo_test_extension_build "harvester" "harvester-ui-extension" "harvester"
+clone_repo_test_extension_build "neuvector" "manager-ext" "neuvector-ui-ext"
+clone_repo_test_extension_build "rancher" "capi-ui-extension" "capi"
+clone_repo_test_extension_build "StackVista" "rancher-extension-stackstate" "observability"
+clone_repo_test_extension_build "harvester" "harvester-ui-extension" "harvester"
 
 echo "All done"

package/scripts/typegen.sh

@@ -2,71 +2,53 @@
 
 SCRIPT_DIR="$( cd -- "$( dirname -- "${BASH_SOURCE[0]}" )" &> /dev/null && pwd )"
 BASE_DIR="$(git rev-parse --show-toplevel)"
-SHELL_DIR=$BASE_DIR/shell
+CLOUD_SHELL_DIR=$BASE_DIR/cloud-shell
 
-echo "Generating typescript definitions"
+echo "Generating typescript definitions in ${CLOUD_SHELL_DIR}"
 
-rm -rf ${SHELL_DIR}/tmp
-mkdir -p ${SHELL_DIR}/tmp
+# 清理 tmp 并创建目录
+rm -rf ${CLOUD_SHELL_DIR}/tmp
+mkdir -p ${CLOUD_SHELL_DIR}/tmp
 
 echo "Generating ..."
 
 # utils
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/utils/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/utils > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/utils/validators/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/utils/validators > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/utils/crypto/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/utils/crypto > /dev/null
+${BASE_DIR}/node_modules/.bin/tsc ${CLOUD_SHELL_DIR}/utils/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${CLOUD_SHELL_DIR}/tmp/utils > /dev/null
+${BASE_DIR}/node_modules/.bin/tsc ${CLOUD_SHELL_DIR}/utils/validators/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${CLOUD_SHELL_DIR}/tmp/utils/validators > /dev/null
+${BASE_DIR}/node_modules/.bin/tsc ${CLOUD_SHELL_DIR}/utils/crypto/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${CLOUD_SHELL_DIR}/tmp/utils/crypto > /dev/null
 
 # config
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/config/query-params.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/config > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/config/table-headers.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/config > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/config/types.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/config > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/config/labels-annotations.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/config > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/config/version.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/config > /dev/null
+${BASE_DIR}/node_modules/.bin/tsc ${CLOUD_SHELL_DIR}/config/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${CLOUD_SHELL_DIR}/tmp/config > /dev/null
 
-# # store
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/store/features.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/store > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/store/prefs.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/store > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/store/plugins.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/store > /dev/null
+# store
+${BASE_DIR}/node_modules/.bin/tsc ${CLOUD_SHELL_DIR}/store/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${CLOUD_SHELL_DIR}/tmp/store > /dev/null
 
-# # plugins
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/plugins/dashboard-store/normalize.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/plugins/dashboard-store/ > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/plugins/dashboard-store/resource-class.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/plugins/dashboard-store/ > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/plugins/dashboard-store/classify.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/plugins/dashboard-store/ > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/plugins/dashboard-store/actions.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/plugins/dashboard-store/ > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/plugins/steve/steve-class.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/plugins/steve/ > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/plugins/steve/hybrid-class.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/plugins/steve/ > /dev/null
+# plugins
+${BASE_DIR}/node_modules/.bin/tsc ${CLOUD_SHELL_DIR}/plugins/dashboard-store/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${CLOUD_SHELL_DIR}/tmp/plugins/dashboard-store/ > /dev/null
+${BASE_DIR}/node_modules/.bin/tsc ${CLOUD_SHELL_DIR}/plugins/steve/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${CLOUD_SHELL_DIR}/tmp/plugins/steve/ > /dev/null
 
-# # mixins
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/mixins/create-edit-view/index.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/mixins/create-edit-view > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/mixins/resource-fetch.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/mixins > /dev/null
+# mixins
+${BASE_DIR}/node_modules/.bin/tsc ${CLOUD_SHELL_DIR}/mixins/**/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${CLOUD_SHELL_DIR}/tmp/mixins > /dev/null
 
-# # models
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/models/namespace.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/models/ > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/models/networking.k8s.io.ingress.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/models/ > /dev/null
-${BASE_DIR}/node_modules/.bin/tsc ${SHELL_DIR}/models/catalog.cattle.io.clusterrepo.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/models/ > /dev/null
+# models
+${BASE_DIR}/node_modules/.bin/tsc ${CLOUD_SHELL_DIR}/models/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${CLOUD_SHELL_DIR}/tmp/models/ > /dev/null
 
-#./node_modules/.bin/tsc ${SHELL_DIR}/plugins/dashboard-store/*.js --declaration --allowJs --emitDeclarationOnly --outDir ${SHELL_DIR}/tmp/plugins/dashboard-store
-
-# Go through all of the folders and combine by wrapping with 'declare module'
-
-echo "Contents of ${SHELL_DIR}/tmp after tsc commands:"
-find ${SHELL_DIR}/tmp
+echo "Contents of ${CLOUD_SHELL_DIR}/tmp after tsc commands:"
+find ${CLOUD_SHELL_DIR}/tmp
 
 echo "Combining type definitions ..."
 
-DEST=${SHELL_DIR}/types/shell
+DEST=${CLOUD_SHELL_DIR}/types/cloud-shell
 mkdir -p ${DEST}
 
 INDEX=${DEST}/index.d.ts
 rm -rf ${INDEX}
 
-echo "// Auto-generated type definitions for shell" > ${INDEX}
+echo "// Auto-generated type definitions for cloud-shell" > ${INDEX}
 echo "// Do not modify this file as changes will get overwritten" >> ${INDEX}
 
-# Copy in the vue shim type definitions
-if [ -f "$BASE_DIR/shell/types/vue-shim.d" ]; then
-  cat "$BASE_DIR/shell/types/vue-shim.d" >> ${INDEX}
-fi
+echo "/// <reference types=\"@rancher/cloud-shell/types/vue-shim\" />" >> ${INDEX}
+echo "/// <reference types=\"@rancher/cloud-shell/types/global-vue\" />" >> ${INDEX}
 
 function processDir() {
   local dir=$1
@@ -80,9 +62,7 @@ function processDir() {
       processDir $entry $basePkg/$filename
     else
       if [[ $filename == *.d.ts ]]; then
-        # We use convoluted mechanism here to ensure this works on mac with bash 3.x
         local name=$(echo $filename | rev | cut -c6- | rev)
-
         local module=${basePkg}/${name}
         if [ "${name}" == "index" ]; then
           module=${basePkg}
@@ -97,6 +77,8 @@ function processDir() {
   done
 }
 
-processDir ${SHELL_DIR}/tmp @shell
+processDir ${CLOUD_SHELL_DIR}/tmp @cloud-shell
+
+rm -rf ${CLOUD_SHELL_DIR}/tmp
 
-rm -rf ${SHELL_DIR}/tmp
+echo "Type generation completed in ${CLOUD_SHELL_DIR}"

package/server/har-file.js

@@ -1,11 +1,15 @@
 const fs = require('fs');
 const path = require('path');
+const querystring = require('querystring');
 
 // When we receive a request to this URL we will reset the session to replay again from the HAR file
 // This allows the user to refresh the browser and replay the HAR file again
 const RESET_URL = '/api/v1/namespaces/cattle-ui-plugin-system/services/http:ui-plugin-operator:80/proxy/index.json';
 
-const EXCLUDES_QS = '?exclude=metadata.managedFields';
+const EXCLUDE_QS = 'exclude';
+
+const LEGACY_UI_PLUGIN_INDEX = '/api/v1/namespaces/cattle-ui-plugin-system/services/http:ui-plugin-operator:80/proxy/index.json';
+const NEW_UI_PLUGIN_INDEX = '/v1/uiplugins';
 
 /**
  * Load the network requests/responses from the har file
@@ -113,10 +117,28 @@ function harProxy(responses, folder) {
     const url = decodeURIComponent(req.originalUrl);
     let playback = session[req.originalUrl];
 
+    // Handle case where HAR file was created with older UI Extension API that used the operator
+    if (!playback && req.originalUrl.includes(NEW_UI_PLUGIN_INDEX)) {
+      // Look for new URl for UI plugins
+      playback = session[LEGACY_UI_PLUGIN_INDEX];
+    }
+
     // If it did not match, try without the metadata excludes query string that was adding in 2.8.0
     // This might allow HAR captures with Rancher < 2.8.0 to be replayed on >= 2.8.0
-    if (!playback && req.originalUrl.endsWith(EXCLUDES_QS)) {
-      playback = session[req.originalUrl.slice(0, -EXCLUDES_QS.length)];
+    if (!playback && req.originalUrl.includes('?')) {
+      const urlParts = req.originalUrl.split('?');
+
+      if (urlParts.length > 1) {
+        const queryString = urlParts[1];
+        const qs = querystring.parse(queryString);
+
+        delete qs[EXCLUDE_QS];
+
+        const newQs = querystring.stringify(qs);
+        const newUrl = newQs.length ? `${ urlParts[0] }?${ newQs }` : urlParts[0];
+
+        playback = session[newUrl];
+      }
     }
 
     if (playback && playback[req.method] && playback[req.method].length) {

package/static/loading-indicator.html

@@ -15,9 +15,9 @@
   animation: initial-load-animate 1s infinite linear;
   background-color: transparent;
   box-sizing: border-box;
-  border: 5px solid #008ACF;
+  border: 5px solid #1890FF;
   border-radius: 50%;
-  border-top-color: #00B2E2;
+  border-top-color: transparent;
   display: inline-block;
   height: 80px;
   margin: 0 auto;

package/store/aws.js

@@ -241,8 +241,15 @@ export const actions = {
       }
 
       addObjects(out, res[key]);
-      opt.NextToken = res.NextToken;
-      hasNext = !!res.NextToken;
+      if (res.NextToken) {
+        opt.NextToken = res.NextToken;
+        hasNext = true;
+      } else if (res.Marker) {
+        opt.Marker = res.Marker;
+        hasNext = true;
+      } else {
+        hasNext = false;
+      }
     }
 
     return out;

package/store/features.js

@@ -1,4 +1,5 @@
 import { MANAGEMENT } from '@shell/config/types';
+import { SCHEDULING_CUSTOMIZATION as SCHEDULING_CUSTOMIZATION_FEATURE } from '@shell/config/features';
 
 const definitions = {};
 
@@ -36,7 +37,7 @@ export const FLEET_WORKSPACE_BACK = create('provisioningv2-fleet-workspace-back-
 export const STEVE_CACHE = create('ui-sql-cache', false);
 export const UIEXTENSION = create('uiextension', true);
 export const PROVISIONING_PRE_BOOTSTRAP = create('provisioningprebootstrap', false);
-export const SCHEDULING_CUSTOMIZATION = create('cluster-agent-scheduling-customization', false);
+export const SCHEDULING_CUSTOMIZATION = create(SCHEDULING_CUSTOMIZATION_FEATURE, false);
 
 // Not currently used.. no point defining ones we don't use
 // export const EMBEDDED_CLUSTER_API = create('embedded-cluster-api', true);

package/store/i18n.js

@@ -1,12 +1,12 @@
 import merge from 'lodash/merge';
 import IntlMessageFormat from 'intl-messageformat';
 import { get } from '@shell/utils/object';
-import en from '@shell/assets/translations/en-us.yaml';
+import zh from '@shell/assets/translations/zh-hans.yaml';
 import { getProduct, getVendor, DOCS_BASE } from '@shell/config/private-label';
 import { loadTranslation } from '@shell/utils/dynamic-importer';
 
 const NONE = 'none';
-const DEFAULT_LOCALE = 'en-us';
+const DEFAULT_LOCALE = 'zh-hans';
 
 // Formatters can't be serialized into state
 const intlCache = {};
@@ -25,7 +25,7 @@ export const state = function() {
     selected:     null,
     previous:     null,
     available,
-    translations: { [DEFAULT_LOCALE]: en },
+    translations: { [DEFAULT_LOCALE]: zh },
   };
 
   return out;

package/store/modal.ts

@@ -0,0 +1,71 @@
+import { markRaw, Component } from 'vue';
+import { MutationTree, GetterTree, ActionTree } from 'vuex';
+
+export interface ModalState {
+  isOpen: boolean;
+  component: Component | null;
+  componentProps: Record<string, any>;
+  resources: any[];
+  closeOnClickOutside: boolean;
+  modalWidth: string;
+  modalSticky: boolean;
+}
+
+const state = (): ModalState => ({
+  isOpen:              false,
+  component:           null,
+  componentProps:      {},
+  resources:           [],
+  closeOnClickOutside: false,
+  modalWidth:          '610px',
+  modalSticky:         false
+});
+
+const getters: GetterTree<ModalState, any> = {
+  isOpen:              (state) => state.isOpen,
+  component:           (state) => state.component,
+  componentProps:      (state) => state.componentProps,
+  resources:           (state) => state.resources,
+  closeOnClickOutside: (state) => state.closeOnClickOutside,
+  modalWidth:          (state) => state.modalWidth,
+  modalSticky:         (state) => state.modalSticky,
+};
+
+const mutations: MutationTree<ModalState> = {
+  openModal(state, payload: {
+    component: Component;
+    componentProps?: Record<string, any>;
+    resources?: any[];
+    closeOnClickOutside?: boolean;
+    modalWidth?: string;
+    modalSticky?: boolean;
+  }) {
+    state.isOpen = true;
+    state.component = markRaw(payload.component);
+    state.componentProps = payload.componentProps || {};
+    state.resources = Array.isArray(payload.resources) ? payload.resources : (payload.resources ? [payload.resources] : []);
+    state.closeOnClickOutside = payload.closeOnClickOutside ?? false;
+    state.modalWidth = payload.modalWidth || '610px';
+    state.modalSticky = payload.modalSticky ?? false;
+  },
+
+  closeModal(state) {
+    state.isOpen = false;
+    state.component = null;
+    state.componentProps = {};
+    state.resources = [];
+    state.closeOnClickOutside = false;
+    state.modalWidth = '610px';
+    state.modalSticky = false;
+  }
+};
+
+const actions: ActionTree<ModalState, any> = {};
+
+export default {
+  namespaced: true,
+  state,
+  getters,
+  mutations,
+  actions
+};

package/store/slideInPanel.ts

@@ -0,0 +1,47 @@
+import { markRaw, Component } from 'vue';
+import { MutationTree, GetterTree, ActionTree } from 'vuex';
+
+export interface SlideInPanelState {
+  isOpen: boolean;
+  component: Component | null;
+  componentProps: Record<string, any>;
+}
+
+const state = (): SlideInPanelState => ({
+  isOpen:         false,
+  component:      null,
+  componentProps: {}
+});
+
+const getters: GetterTree<SlideInPanelState, any> = {
+  isOpen:         (state) => state.isOpen,
+  component:      (state) => state.component,
+  componentProps: (state) => state.componentProps
+};
+
+const mutations: MutationTree<SlideInPanelState> = {
+  open(state, payload: { component: Component; componentProps?: Record<string, any> }) {
+    state.isOpen = true;
+    state.component = markRaw(payload.component);
+    state.componentProps = payload.componentProps || {};
+  },
+  close(state) {
+    state.isOpen = false;
+
+    // Delay clearing component/props for 500ms (same as transition duration)
+    setTimeout(() => {
+      state.component = null;
+      state.componentProps = {};
+    }, 500);
+  }
+};
+
+const actions: ActionTree<SlideInPanelState, any> = {};
+
+export default {
+  namespaced: true,
+  state,
+  getters,
+  mutations,
+  actions
+};

package/store/type-map.js

@@ -154,6 +154,7 @@ import { haveV2Monitoring } from '@shell/utils/monitoring';
 import { NEU_VECTOR_NAMESPACE } from '@shell/config/product/neuvector';
 import { createHeaders, rowValueGetter } from '@shell/store/type-map.utils';
 import { defineAsyncComponent } from 'vue';
+import { cloud2harvesterhci } from '@shell/utils/router';
 
 export const NAMESPACED = 'namespaced';
 export const CLUSTER_LEVEL = 'cluster';
@@ -506,7 +507,7 @@ export const getters = {
 
   groupForBasicType(state) {
     return (product, schemaId) => {
-      return state.basicTypes?.[product]?.[schemaId];
+      return state.basicTypes?.[product]?.[cloud2harvesterhci(schemaId)];
     };
   },