@dovetail-v2/refine 0.3.0 → 0.3.2

package/dist/{index-23ef5f69.js → index-3126e84d.js}

@@ -7,14 +7,14 @@ var __publicField = (obj, key2, value2) => {
 import dayjs from "dayjs";
 import i18n from "i18next";
 import { w as warnOnce, g as getDefaults, a as warn, b as getI18n, s as setDefaults, d as setI18n, I as I18nContext, j as jsxRuntimeExports, u as useTranslation, c as cx_default, S as SocketStatus } from "./common-feae5742.js";
-import { ResourceContext, matchResourceFromRoute, useResource, useDelete, useNavigation, useBreadcrumb, useList, CanAccess, useUpdate, useParsed, useGo, useCan, useTable, useDeleteMany, useShow, useDataProvider, useRefineContext, useTranslate, useWarnAboutChange, useForm as useForm$2, flattenObjectKeys, pickNotDeprecated, useMenu, Refine } from "@refinedev/core";
+import { ResourceContext, matchResourceFromRoute, useResource, useDelete, useNavigation, useBreadcrumb, useList, CanAccess, useUpdate, useParsed, useGo, useCan, useTable, useDeleteMany, useDataProvider, useShow, useRefineContext, useTranslate, useWarnAboutChange, useForm as useForm$2, flattenObjectKeys, pickNotDeprecated, useMenu, Refine } from "@refinedev/core";
 import { parse, stringify } from "qs";
 import * as React from "react";
 import React__default, { createElement, isValidElement, cloneElement, Children, useContext, useCallback, createContext, useState, useEffect, useMemo, useRef, useImperativeHandle, lazy, Suspense, forwardRef } from "react";
 import { useLocation, useHistory, useParams, matchPath, Link, Route, NavLink, Router } from "react-router-dom";
-import { usePushModal, usePopModal, DeleteDialog, Tag, RejectDialog, RejectDialogType, Input, Select, AntdOption, Button, Form, Space, TextArea, kitContext, Typo, Loading, Table as Table$2, Pagination, Alert, Modal, Fields, Units, Link as Link$1, OverflowTooltip, Tooltip, Dropdown, Menu as Menu$1, Icon as Icon$1, Divider, StatusCapsule, Tabs as Tabs$1, TabsTabPane, Row, Col, Popover, AntdTable, TableForm, getOptions, DonutChart, SegmentControl, Checkbox, useMessage, SearchInput, Token, AntdSelectOptGroup, MenuItemGroup, Layout as Layout$1, Time as Time$1, ModalStack, KitStoreProvider, ConfigProvider } from "@cloudtower/eagle";
-import { EditPen16PrimaryIcon, Download16GradientBlueIcon, TrashBinDelete16Icon, MoreEllipsis324BoldSecondaryIcon, MoreEllipsis324BoldBlueIcon, MoreEllipsis316BoldBlueIcon, PlusAddCreateNew16BoldOntintIcon, ArrowChevronLeft16BoldTertiaryIcon, ArrowChevronLeftSmall16BoldBlueIcon, ViewEye16GradientGrayIcon, EntityFilterIgnoreGradient16GrayIcon, InfoICircleFill16GrayIcon, InfoICircleFill16Gray70Icon, RecoverContinue16GradientBlueIcon, SuspendedPause16GradientBlueIcon, Retry16GradientBlueIcon, OpenTerminal16GradientBlueIcon, HierarchyTriangleRight16GrayIcon, HierarchyTriangleRight16BlueIcon, ClipboardCopy16GradientGrayIcon, ClipboardCopy16GradientBlueIcon, Retry16GradientGrayIcon, EditPen16GradientGrayIcon, EditPen16GradientBlueIcon, Showdiff16GradientGrayIcon, Showdiff16GradientBlueIcon, XmarkFailedSeriousWarningFill16RedIcon, ExclamationErrorCircleFill16RedIcon, Pause16GradientBlueIcon, EditPen16BlueIcon } from "@cloudtower/icons-react";
-import { first, get as get$2, cloneDeep, set, omit as omit$1, merge, debounce, last, setWith, clone, isObject as isObject$3, uniq, keyBy } from "lodash-es";
+import { usePushModal, usePopModal, DeleteDialog, Tag, RejectDialog, RejectDialogType, Input, Select, AntdOption, Button, Form, Space, TextArea, kitContext, Typo, Loading, Table as Table$2, Pagination, Alert, Modal, Fields, Units, Link as Link$1, OverflowTooltip, Tooltip, Dropdown, Menu as Menu$1, Icon as Icon$1, Divider, StatusCapsule, Popover, AntdTable, TableForm, Upload, getOptions, DonutChart, SegmentControl, Checkbox, Tabs as Tabs$1, TabsTabPane, Row, Col, useMessage, SearchInput, Token, AntdSelectOptGroup, MenuItemGroup, Layout as Layout$1, Time as Time$1, ModalStack, KitStoreProvider, ConfigProvider } from "@cloudtower/eagle";
+import { EditPen16PrimaryIcon, Download16GradientBlueIcon, TrashBinDelete16Icon, MoreEllipsis324BoldSecondaryIcon, MoreEllipsis324BoldBlueIcon, MoreEllipsis316BoldBlueIcon, PlusAddCreateNew16BoldOntintIcon, ViewEye16GradientGrayIcon, EntityFilterIgnoreGradient16GrayIcon, InfoICircleFill16GrayIcon, InfoICircleFill16Gray70Icon, RecoverContinue16GradientBlueIcon, SuspendedPause16GradientBlueIcon, ArrowChevronLeft16BoldTertiaryIcon, ArrowChevronLeftSmall16BoldBlueIcon, Retry16GradientBlueIcon, OpenTerminal16GradientBlueIcon, HierarchyTriangleRight16GrayIcon, HierarchyTriangleRight16BlueIcon, ClipboardCopy16GradientGrayIcon, ClipboardCopy16GradientBlueIcon, Retry16GradientGrayIcon, EditPen16GradientGrayIcon, EditPen16GradientBlueIcon, Showdiff16GradientGrayIcon, Showdiff16GradientBlueIcon, XmarkFailedSeriousWarningFill16RedIcon, ExclamationErrorCircleFill16RedIcon, Pause16GradientBlueIcon, EditPen16BlueIcon } from "@cloudtower/icons-react";
+import { first, get as get$2, cloneDeep, set, omit as omit$1, merge, isEqual, debounce, last, setWith, clone, isObject as isObject$3, uniq, keyBy } from "lodash-es";
 import yaml$2 from "js-yaml";
 import { useLocalStorage } from "usehooks-ts";
 import { paginateData, sortData, dataProvider, liveProvider } from "k8s-api-provider";
@@ -1163,6 +1163,7 @@ const confirm = "确认";
 const cant_delete_resource = "无法删除{{resource}}";
 const cant_delete_resource_with_name = "无法删除{{resource}} <0>{{name}}</0> 。";
 const close = "关闭";
+const import_from_file = "从文件读取";
 const dovetail = {
   copy,
   reset_arguments,
@@ -1404,7 +1405,8 @@ const dovetail = {
   confirm,
   cant_delete_resource,
   cant_delete_resource_with_name,
-  close
+  close,
+  import_from_file
 };
 const ZH = {
   dovetail
@@ -5615,7 +5617,7 @@ lodash.exports;
         }
         return true;
       }
-      function isEqual(value2, other) {
+      function isEqual2(value2, other) {
         return baseIsEqual(value2, other);
       }
       function isEqualWith(value2, other, customizer) {
@@ -6728,7 +6730,7 @@ lodash.exports;
       lodash2.isDate = isDate;
       lodash2.isElement = isElement;
       lodash2.isEmpty = isEmpty;
-      lodash2.isEqual = isEqual;
+      lodash2.isEqual = isEqual2;
       lodash2.isEqualWith = isEqualWith;
       lodash2.isError = isError;
       lodash2.isFinite = isFinite2;
@@ -9252,7 +9254,7 @@ var ResourceState = /* @__PURE__ */ ((ResourceState2) => {
   return ResourceState2;
 })(ResourceState || {});
 function matchSelector(pod2, selector, namespace2 = "default") {
-  var _a, _b, _c;
+  var _a, _b, _c, _d;
   let match = true;
   if (selector) {
     for (const key2 in selector.matchLabels) {
@@ -9261,7 +9263,7 @@ function matchSelector(pod2, selector, namespace2 = "default") {
       }
     }
   }
-  return match && pod2.metadata.namespace === namespace2;
+  return match && ((_d = pod2.metadata) == null ? void 0 : _d.namespace) === namespace2;
 }
 class WorkloadBaseModel extends ResourceModel {
   constructor(_rawYaml, _globalStore) {
@@ -9351,10 +9353,14 @@ class WorkloadModel extends WorkloadBaseModel {
   constructor(_rawYaml, _globalStore) {
     super(_rawYaml, _globalStore);
     __publicField(this, "restarts", 0);
+    __publicField(this, "services", []);
+    __publicField(this, "ingresses", []);
     this._rawYaml = _rawYaml;
   }
   async init() {
     await this.getRestarts();
+    await this.getServices();
+    await this.getIngresses();
   }
   async getRestarts() {
     const pods = await this._globalStore.get("pods", {
@@ -9370,6 +9376,29 @@ class WorkloadModel extends WorkloadBaseModel {
     const result = lodashExports.sumBy(myPods, "restarts");
     this.restarts = result;
   }
+  async getServices() {
+    const services = await this._globalStore.get("services", {
+      resourceBasePath: "/api/v1",
+      kind: "Service"
+    });
+    const myServices = services.items.filter(
+      (p) => {
+        var _a;
+        return matchSelector(p, (_a = this.spec) == null ? void 0 : _a.selector, this.metadata.namespace);
+      }
+    );
+    this.services = myServices;
+  }
+  async getIngresses() {
+    const allIngresses = /* @__PURE__ */ new Map();
+    for (const service of this.services) {
+      for (const ingress of service.ingresses) {
+        const key2 = `${ingress.namespace}-${ingress.name}`;
+        allIngresses.set(key2, ingress);
+      }
+    }
+    this.ingresses = Array.from(allIngresses.values());
+  }
   get replicas() {
     return this.spec && "replicas" in this.spec ? this.spec.replicas : 0;
   }
@@ -9510,6 +9539,38 @@ class PodMetricsModel extends ResourceModel {
     };
   }
 }
+class ReplicaSetModel extends ResourceModel {
+  constructor(_rawYaml, _globalStore) {
+    super(_rawYaml, _globalStore);
+    __publicField(this, "pods", []);
+    __publicField(this, "restarts", 0);
+    this._rawYaml = _rawYaml;
+  }
+  async init() {
+    await this.getPods();
+  }
+  async getPods() {
+    const pods = await this._globalStore.get("pods", {
+      resourceBasePath: "/api/v1",
+      kind: "Pod"
+    });
+    const myPods = pods.items.filter(
+      (pod2) => {
+        var _a;
+        return matchSelector(pod2, (_a = this.spec) == null ? void 0 : _a.selector, this.metadata.namespace);
+      }
+    );
+    this.pods = myPods;
+    this.restarts = lodashExports.sumBy(this.pods, (pod2) => pod2.restarts || 0);
+  }
+  get ownerDeploymentName() {
+    var _a;
+    const ownerRef = (_a = this.metadata.ownerReferences) == null ? void 0 : _a.find(
+      (ref) => ref.kind === "Deployment" && ref.apiVersion === "apps/v1"
+    );
+    return ownerRef == null ? void 0 : ownerRef.name;
+  }
+}
 class CronJobModel extends WorkloadBaseModel {
   constructor(_rawYaml, _globalStore) {
     super(_rawYaml, _globalStore);
@@ -9552,8 +9613,27 @@ class EventModel extends ResourceModel {
 class DeploymentModel extends WorkloadModel {
   constructor(_rawYaml, _globalStore) {
     super(_rawYaml, _globalStore);
+    __publicField(this, "replicaSets", []);
     this._rawYaml = _rawYaml;
   }
+  async init() {
+    await super.init();
+    await this.getReplicaSets();
+  }
+  async getReplicaSets() {
+    const replicaSets = await this._globalStore.get("replicasets", {
+      resourceBasePath: "/apis/apps/v1",
+      kind: "ReplicaSet"
+    });
+    const myReplicaSets = replicaSets.items.filter((rs) => {
+      var _a, _b, _c;
+      const ownerRef = (_b = (_a = rs.metadata) == null ? void 0 : _a.ownerReferences) == null ? void 0 : _b.find(
+        (ref) => ref.kind === "Deployment" && ref.apiVersion === "apps/v1" && ref.name === this.name && ref.uid === this.metadata.uid
+      );
+      return !!ownerRef && ((_c = rs.metadata) == null ? void 0 : _c.namespace) === this.metadata.namespace;
+    });
+    this.replicaSets = myReplicaSets;
+  }
   get stateDisplay() {
     var _a, _b, _c;
     if (((_a = this.spec) == null ? void 0 : _a.replicas) === 0) {
@@ -9609,8 +9689,25 @@ var ServiceTypeEnum = /* @__PURE__ */ ((ServiceTypeEnum2) => {
 class ServiceModel extends ResourceModel {
   constructor(_rawYaml, _globalStore) {
     super(_rawYaml, _globalStore);
+    __publicField(this, "ingresses", []);
     this._rawYaml = _rawYaml;
   }
+  async init() {
+    await this.getIngresses();
+  }
+  async getIngresses() {
+    const ingresses = await this._globalStore.get("ingresses", {
+      resourceBasePath: "/apis/networking.k8s.io/v1",
+      kind: "Ingress"
+    });
+    const myIngresses = ingresses.items.filter((ingress) => {
+      const rules = ingress.getFlattenedRules([]);
+      return rules.some(
+        (rule2) => rule2.serviceName === this.name
+      );
+    });
+    this.ingresses = myIngresses;
+  }
   get displayType() {
     const spec = this._rawYaml.spec;
     const type2 = spec.type;
@@ -10176,29 +10273,38 @@ function getInitialValues(config) {
     spec: {}
   };
 }
-function useOpenForm(options) {
+function useOpenForm() {
   const { resource } = useResource();
   const configs = useContext(ConfigsContext);
   const { edit: edit2 } = useEdit();
   const navigation = useNavigation();
   const pushModal = usePushModal();
   const go = useGo();
-  return function openForm(resourceName) {
-    var _a, _b;
-    const finalResourceName = resourceName || (resource == null ? void 0 : resource.name);
+  return function openForm(options) {
+    var _a;
+    const finalResourceName = (options == null ? void 0 : options.resourceName) || (resource == null ? void 0 : resource.name);
     if (finalResourceName) {
       const config = configs[finalResourceName];
       const formType = (_a = config.formConfig) == null ? void 0 : _a.formContainerType;
       if (formType === void 0 || formType === FormContainerType.MODAL) {
         pushModal({
-          component: ((_b = config.formConfig) == null ? void 0 : _b.CustomFormModal) || FormModal,
-          props: {
-            resource: finalResourceName,
-            id: options == null ? void 0 : options.id,
-            formProps: {
-              initialValues: getInitialValues(config)
-            }
-          }
+          component: () => {
+            var _a2;
+            const ModalComponent = ((_a2 = config.formConfig) == null ? void 0 : _a2.CustomFormModal) || FormModal;
+            return /* @__PURE__ */ jsxRuntimeExports.jsx(
+              ModalComponent,
+              {
+                resource: finalResourceName,
+                id: options == null ? void 0 : options.id,
+                yamlFormProps: {
+                  config,
+                  initialValuesForCreate: getInitialValues(config)
+                },
+                onSuccess: options == null ? void 0 : options.onSuccess
+              }
+            );
+          },
+          props: {}
         });
       } else if (options == null ? void 0 : options.id) {
         edit2(options.id);
@@ -10217,6 +10323,52 @@ function getResourceNameByKind(kind, configs) {
   var _a;
   return (_a = Object.values(configs).find((config) => config.kind === kind)) == null ? void 0 : _a.name;
 }
+function validateDnsSubdomain(subdomain) {
+  const regex = /(^[a-zA-Z0-9]$)|(^[a-zA-Z0-9][a-zA-Z0-9\.\-\_]*[a-zA-Z0-9]$)/;
+  if (!regex.test(subdomain)) {
+    return { isValid: false };
+  }
+  if (subdomain && subdomain.length > 63) {
+    return { isValid: false };
+  }
+  return { isValid: true };
+}
+function validateLabelKey(key2) {
+  const labelRegex = /(^[a-zA-Z0-9]$)|(^[a-zA-Z0-9][a-zA-Z0-9\.\-\_]*[a-zA-Z0-9]$)/;
+  let prefix2, name2;
+  const splitResult = key2.split("/");
+  if (splitResult.length === 1) {
+    name2 = splitResult[0];
+  } else {
+    prefix2 = splitResult[0];
+    name2 = splitResult[1];
+  }
+  if (prefix2 === "") {
+    return { isValid: false };
+  }
+  if (prefix2 && !labelRegex.test(prefix2)) {
+    return { isValid: false };
+  }
+  if (prefix2 && prefix2.length > 253) {
+    return { isValid: false };
+  }
+  return validateDnsSubdomain(name2);
+}
+function validateLabelValue(value2, isOptional) {
+  const labelValueRegex = /(^[a-zA-Z0-9]$)|(^[a-zA-Z0-9][a-zA-Z0-9\.\-\_]*[a-zA-Z0-9]$)/;
+  if (isOptional && value2 === "") {
+    return { isValid: true };
+  } else if (value2 === "") {
+    return { isValid: false };
+  }
+  if (value2.length > 63) {
+    return { isValid: false };
+  }
+  if (!labelValueRegex.test(value2)) {
+    return { isValid: false };
+  }
+  return { isValid: true };
+}
 function K8sDropdown(props) {
   var _a;
   const { record, size = "normal" } = props;
@@ -10228,7 +10380,7 @@ function K8sDropdown(props) {
   const { t: t2 } = useTranslation();
   const { openDeleteConfirmModal } = useDeleteModal({ resourceName: resourceName || "" });
   const download2 = useDownloadYAML();
-  const openForm = useOpenForm({ id: record.id });
+  const openForm = useOpenForm();
   const isInShowPage = useResourceResult.action === "show";
   const { data: canEditData } = useCan({
     resource: resourceName,
@@ -10249,7 +10401,7 @@ function K8sDropdown(props) {
     Dropdown,
     {
       overlay: /* @__PURE__ */ jsxRuntimeExports.jsxs(Menu$1, { children: [
-        isInShowPage || (canEditData == null ? void 0 : canEditData.can) === false || config.hideEdit ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(Menu$1.Item, { onClick: () => openForm(), children: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon$1, { src: EditPen16PrimaryIcon, children: formType === FormType.FORM ? t2("dovetail.edit") : t2("dovetail.edit_yaml") }) }),
+        isInShowPage || (canEditData == null ? void 0 : canEditData.can) === false || config.hideEdit ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(Menu$1.Item, { onClick: () => openForm({ id: record.id }), children: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon$1, { src: EditPen16PrimaryIcon, children: formType === FormType.FORM ? t2("dovetail.edit") : t2("dovetail.edit_yaml") }) }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           Menu$1.Item,
           {
@@ -10923,273 +11075,9 @@ function KeyValueAnnotation(props) {
     }) : null]
   });
 }
-function Tabs(props) {
-  const { tabs, className } = props;
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(Tabs$1, { className, children: tabs.map((tab) => {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTabPane, { tab: tab.title, children: tab.children }, tab.title);
-  }) });
-}
-const StateTag = (props) => {
-  const {
-    state: state2 = ResourceState.UPDATING,
-    hideBackground,
-    className,
-    customResourceStateMap
-  } = props;
-  const { t: t2 } = useTranslation();
-  const defaultStateMap = {
-    [ResourceState.UPDATING]: "loading",
-    [ResourceState.READY]: "green",
-    [ResourceState.COMPLETED]: "gray",
-    [ResourceState.FAILED]: "red",
-    [ResourceState.SUSPENDED]: "warning",
-    [ResourceState.RUNNING]: "green",
-    [ResourceState.SUCCEEDED]: "blue",
-    [ResourceState.UNKNOWN]: "gray",
-    [ResourceState.TERMINATING]: "loading",
-    [ResourceState.PENDING]: "warning",
-    [ResourceState.WAITING]: "warning",
-    [ResourceState.TERMINATED]: "gray",
-    [ResourceState.STOPPED]: "gray",
-    [ResourceState.AVAILABLE]: "blue",
-    [ResourceState.BOUND]: "green",
-    [ResourceState.RELEASED]: "gray",
-    [ResourceState.LOST]: "red",
-    [ResourceState.ACTIVE]: "green",
-    [ResourceState.DELETING]: "loading"
-  };
-  const finalColorMap = (customResourceStateMap == null ? void 0 : customResourceStateMap.color) || defaultStateMap;
-  const finalTextMap = customResourceStateMap == null ? void 0 : customResourceStateMap.text;
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    StatusCapsule,
-    {
-      className: cx_default(className, StateTagStyle, hideBackground && "no-background"),
-      color: finalColorMap[state2] !== "loading" ? finalColorMap[state2] : void 0,
-      loading: finalColorMap[state2] === "loading",
-      children: finalTextMap ? finalTextMap[state2] : t2(`dovetail.${state2 || "updating"}_state`)
-    }
-  );
-};
-const ShowContent_1g0ejph = "";
-const ShowContentWrapperStyle = "s9agep2";
-const BackButton = "bo89gfi";
-const ToolBarWrapper = "t1ohe42f";
-const NameStyle = "nqm4qz0";
-const TopBarStyle = "ticl0qc";
-const ShowContentHeaderStyle = "so9uwk1";
-const GroupStyle$1 = "ge26ou0";
-const GroupTitleStyle = "g17f8vl9";
-const FullTabContentStyle = "fykgn2i";
-const FieldWrapperStyle = "fngr745";
-const TabContentStyle = "t11wg61l";
-const ValueStyle$1 = "v1x3rivf";
-const TabsStyle = "tf5s6s";
-function ShowGroupComponent(props) {
-  const {
-    title,
-    className,
-    children,
-    operationEle
-  } = props;
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-    className: cx_default(GroupStyle$1, className),
-    children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-      className: cx_default(Typo.Heading.h2_bold_title, GroupTitleStyle),
-      children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-        children: title
-      }), operationEle]
-    }), children]
-  });
-}
-const ShowContent = (props) => {
-  var _a, _b, _c, _d, _e, _f;
-  const {
-    showConfig,
-    formatter,
-    Dropdown: Dropdown2 = K8sDropdown
-  } = props;
-  const parsed = useParsed();
-  const {
-    resource
-  } = useResource();
-  const id = (_a = parsed == null ? void 0 : parsed.params) == null ? void 0 : _a.id;
-  const {
-    queryResult
-  } = useShow({
-    id,
-    errorNotification: false
-  });
-  const {
-    t: t2
-  } = useTranslation();
-  const {
-    data: data2
-  } = queryResult;
-  const navigation = useNavigation();
-  const go = useGo();
-  const openForm = useOpenForm({
-    id
-  });
-  const Component = useContext(ComponentContext);
-  const configs = useContext(ConfigsContext);
-  const config = configs[(resource == null ? void 0 : resource.name) || ""];
-  const Tabs$12 = Component.Tabs || Tabs;
-  if (!(data2 == null ? void 0 : data2.data)) {
-    return null;
-  }
-  const model = data2.data;
-  const record = formatter ? formatter(model) : data2 == null ? void 0 : data2.data;
-  function renderFields(fields, areaType, hasCol = true) {
-    if (!record)
-      return null;
-    return fields.map((field) => {
-      if (field.hidden)
-        return null;
-      let content;
-      const value2 = get$2(record, field.path);
-      if (field.renderContent) {
-        content = field.renderContent(value2, record, field);
-      } else {
-        content = get$2(record, field.path);
-      }
-      return hasCol ? /* @__PURE__ */ jsxRuntimeExports.jsx(Col, {
-        flex: areaType === AreaType.Inline ? "none" : "",
-        span: field.col || 24,
-        children: field.render ? field.render(value2, record, field) : /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-          className: FieldWrapperStyle,
-          children: [field.title && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-            className: Typo.Label.l4_regular_title,
-            style: {
-              width: field.labelWidth || "165px",
-              marginRight: 8,
-              flexShrink: 0,
-              color: "#2C385299"
-            },
-            children: field.title
-          }), /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-            style: {
-              flex: 1,
-              minWidth: 0
-            },
-            children: /* @__PURE__ */ jsxRuntimeExports.jsx(ValueDisplay, {
-              className: cx_default(Typo.Label.l4_regular_title, ValueStyle$1),
-              value: content,
-              useOverflow: false
-            })
-          })]
-        })
-      }, field.key) : /* @__PURE__ */ jsxRuntimeExports.jsx(ValueDisplay, {
-        style: {
-          height: "100%"
-        },
-        value: content,
-        useOverflow: false
-      });
-    });
-  }
-  const stateDisplay = get$2(record, "stateDisplay");
-  const topBar = /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-    className: ToolBarWrapper,
-    children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-      className: cx_default(Typo.Label.l4_bold, BackButton),
-      onClick: () => {
-        go({
-          to: navigation.listUrl((resource == null ? void 0 : resource.name) || "")
-        });
-      },
-      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon$1, {
-        src: ArrowChevronLeft16BoldTertiaryIcon,
-        hoverSrc: ArrowChevronLeftSmall16BoldBlueIcon,
-        style: {
-          marginRight: 4
-        },
-        children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-          className: "button-text",
-          children: (config == null ? void 0 : config.displayName) || ((_b = resource == null ? void 0 : resource.meta) == null ? void 0 : _b.kind)
-        })
-      })
-    }), /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
-      className: TopBarStyle,
-      children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-        style: {
-          display: "flex"
-        },
-        children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-          className: cx_default(Typo.Display.d2_regular_title, NameStyle),
-          children: ((_c = showConfig.displayName) == null ? void 0 : _c.call(showConfig, record)) || ((_d = record == null ? void 0 : record.metadata) == null ? void 0 : _d.name)
-        }), stateDisplay ? /* @__PURE__ */ jsxRuntimeExports.jsx(StateTag, {
-          state: stateDisplay,
-          customResourceStateMap: showConfig.resourceStateMap
-        }) : void 0]
-      }), /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
-        children: [(_e = showConfig.renderExtraButton) == null ? void 0 : _e.call(showConfig, record), !config.hideEdit ? /* @__PURE__ */ jsxRuntimeExports.jsx(CanAccess, {
-          resource: resource == null ? void 0 : resource.name,
-          action: AccessControlAuth.Edit,
-          params: {
-            namespace: record.namespace
-          },
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button, {
-            style: {
-              marginRight: 8
-            },
-            onClick: () => openForm(),
-            children: ((_f = config.formConfig) == null ? void 0 : _f.formType) === FormType.FORM ? t2("dovetail.edit") : t2("dovetail.edit_yaml")
-          })
-        }) : null, /* @__PURE__ */ jsxRuntimeExports.jsx(Dropdown2, {
-          record,
-          size: "large"
-        })]
-      })]
-    })]
-  });
-  const tabs = /* @__PURE__ */ jsxRuntimeExports.jsx(Tabs$12, {
-    tabs: (showConfig.tabs || []).map((tab, tabIndex) => {
-      var _a2;
-      return {
-        title: tab.title,
-        key: tab.key,
-        children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-          className: cx_default(TabContentStyle, tab.groups.length <= 1 && tabIndex !== 0 && FullTabContentStyle),
-          children: (_a2 = tab.groups) == null ? void 0 : _a2.map((group) => {
-            const GroupContainer = group.title ? ShowGroupComponent : React__default.Fragment;
-            const FieldContainer = group.title ? Row : React__default.Fragment;
-            const groupContainerProps = group.title ? {
-              title: group.title || ""
-            } : {};
-            const fieldContainerProps = group.title ? {
-              gutter: [24, 8]
-            } : {};
-            return /* @__PURE__ */ jsxRuntimeExports.jsx(GroupContainer, {
-              ...groupContainerProps,
-              children: group.areas.map((area, index2) => /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
-                children: [/* @__PURE__ */ jsxRuntimeExports.jsx(FieldContainer, {
-                  ...fieldContainerProps,
-                  children: renderFields(area.fields, area.type, !!group.title)
-                }, index2), index2 !== group.areas.length - 1 ? /* @__PURE__ */ jsxRuntimeExports.jsx(Divider, {
-                  style: {
-                    margin: "8px 0 12px 0"
-                  }
-                }) : null]
-              }))
-            }, group.title);
-          })
-        })
-      };
-    }),
-    className: TabsStyle
-  });
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-    className: ShowContentWrapperStyle,
-    children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Space, {
-      direction: "vertical",
-      className: ShowContentHeaderStyle,
-      children: topBar
-    }), tabs]
-  });
-};
 const KeyValueSecret_c3ji18 = "";
 const ButtonStyle = "b11tbgf7";
-const GroupStyle = "gtbyh5g";
+const GroupStyle$1 = "gtbyh5g";
 function KeyValueSecret(props) {
   const {
     data: data2 = {}
@@ -11211,7 +11099,7 @@ function KeyValueSecret(props) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(ShowGroupComponent, {
     title: i18n2.t("dovetail.data"),
     operationEle: toggleButton,
-    className: GroupStyle,
+    className: GroupStyle$1,
     children: /* @__PURE__ */ jsxRuntimeExports.jsx(KeyValue, {
       data: data2,
       hideSecret,
@@ -11221,45 +11109,36 @@ function KeyValueSecret(props) {
     })
   });
 }
-function validateLabelKey(key2) {
-  const labelRegex = /(^[a-zA-Z0-9]$)|(^[a-zA-Z0-9][a-zA-Z0-9\.\-\_]*[a-zA-Z0-9]$)/;
-  let prefix2, name2;
-  const splitResult = key2.split("/");
-  if (splitResult.length === 1) {
-    name2 = splitResult[0];
-  } else {
-    prefix2 = splitResult[0];
-    name2 = splitResult[1];
-  }
-  if (prefix2 === "") {
-    return { isValid: false, errorMessage: "EMPTY_PREFIX" };
-  }
-  if (prefix2 && !labelRegex.test(prefix2)) {
-    return { isValid: false, errorMessage: "INVALID_PREFIX" };
-  }
-  if (!labelRegex.test(name2)) {
-    return { isValid: false, errorMessage: "INVALID_NAME" };
-  }
-  if (prefix2 && prefix2.length > 253) {
-    return { isValid: false, errorMessage: "MAX_253" };
-  }
-  if (name2 && name2.length > 63) {
-    return { isValid: false, errorMessage: "MAX_63" };
+function isUtf8(buffer) {
+  try {
+    const decoder = new TextDecoder("utf-8", { fatal: true });
+    decoder.decode(buffer);
+    return true;
+  } catch (e2) {
+    return false;
   }
-  return { isValid: true };
 }
-function validateLabelValue(value2) {
-  const labelValueRegex = /(^[a-zA-Z0-9]$)|(^[a-zA-Z0-9][a-zA-Z0-9\.\-\_]*[a-zA-Z0-9]$)/;
-  if (value2 === "") {
-    return { isValid: true };
-  }
-  if (value2.length > 63) {
-    return { isValid: false, errorMessage: "MAX_63" };
-  }
-  if (!labelValueRegex.test(value2)) {
-    return { isValid: false, errorMessage: "INVALID_VALUE" };
-  }
-  return { isValid: true };
+function readFileAsBase64(file) {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onload = async () => {
+      const arrayBuffer = reader.result;
+      if (arrayBuffer instanceof ArrayBuffer) {
+        if (isUtf8(arrayBuffer)) {
+          resolve(await file.text());
+        } else {
+          const base64String = btoa(
+            String.fromCharCode(...new Uint8Array(arrayBuffer))
+          );
+          resolve(base64String);
+        }
+        return;
+      }
+      reject(new Error("Failed to read file"));
+    };
+    reader.onerror = reject;
+    reader.readAsArrayBuffer(file);
+  });
 }
 const LabelFormatPopover_piveun = "";
 const PodLabelFormatRulePopoverStyle = "p5jt6nm";
@@ -11347,59 +11226,86 @@ const LabelFormatPopover = ({
     })
   });
 };
-const KeyValueTableForm_1eydq7y = "";
-function _KeyValueTableFormForm(props, ref) {
+const index_t3zi07 = "";
+function _KeyValueTableForm(props, ref) {
   const {
+    value: value2,
     defaultValue,
-    onSubmit,
+    onChange,
     extraColumns,
     addButtonText,
-    noValueValidation
+    noValueValidation,
+    isHideLabelFormatPopover,
+    isValueOptional = true,
+    canImportFromFile,
+    minSize,
+    validateKey,
+    validateValue,
+    onSubmit
   } = props;
   const {
     t: t2
   } = useTranslation();
-  const [value2, setValue] = useState([]);
   const tableFormRef = useRef(null);
+  const [_value, _setValue] = useState(value2 || defaultValue);
+  const [forceUpdateCount, setForceUpdateCount] = useState(0);
+  const validate = useCallback(() => {
+    return new Promise((resolve) => {
+      var _a;
+      (_a = tableFormRef.current) == null ? void 0 : _a.validateWholeFields();
+      setForceUpdateCount(forceUpdateCount + 1);
+      setTimeout(() => {
+        var _a2;
+        const isValid = (_a2 = tableFormRef.current) == null ? void 0 : _a2.isValid();
+        resolve(isValid || false);
+      }, 0);
+    });
+  }, [forceUpdateCount]);
   useImperativeHandle(ref, () => ({
-    submit: () => {
-      return new Promise((res, rej) => {
-        var _a;
-        (_a = tableFormRef.current) == null ? void 0 : _a.validateWholeFields();
-        setTimeout(() => {
-          var _a2;
-          const isValid = (_a2 = tableFormRef.current) == null ? void 0 : _a2.isValid();
-          if (isValid) {
-            res(onSubmit(value2));
-          } else {
-            rej();
-          }
-        }, 0);
-      });
+    validate,
+    submit: async () => {
+      const isValid = await validate();
+      if (isValid) {
+        return onSubmit == null ? void 0 : onSubmit(_value);
+      }
+      return Promise.reject();
+    },
+    setValue: (value22) => {
+      var _a;
+      _setValue(value22);
+      (_a = tableFormRef.current) == null ? void 0 : _a.setData(value22);
     }
-  }), [onSubmit, value2]);
+  }), [validate, onSubmit, _value]);
+  useEffect(() => {
+    var _a;
+    if (value2 && !isEqual(value2, _value)) {
+      _setValue(value2);
+      (_a = tableFormRef.current) == null ? void 0 : _a.setData(value2);
+    }
+  }, [value2]);
   const renderTextAreaFunc = ({
     value: value22,
-    onChange
+    onChange: onChange2
   }) => {
     return /* @__PURE__ */ jsxRuntimeExports.jsx(TextArea, {
       autoSize: true,
-      className: "clsjtk2",
+      className: "c17gq8cd",
       size: "small",
       value: value22,
       onChange: (e2) => {
-        onChange(e2.target.value);
+        onChange2(e2.target.value);
       }
     });
   };
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
     size: 8,
     direction: "vertical",
-    className: "cq3mbby",
+    className: "c1n7fiws",
     children: [/* @__PURE__ */ jsxRuntimeExports.jsx(TableForm, {
       ref: tableFormRef,
-      onBodyChange: (value22) => {
-        setValue(value22);
+      onBodyChange: (newValue) => {
+        _setValue(newValue);
+        onChange == null ? void 0 : onChange(newValue);
       },
       columns: [{
         key: "key",
@@ -11410,46 +11316,72 @@ function _KeyValueTableFormForm(props, ref) {
         }) => {
           if (!value22)
             return t2("dovetail.key_empty_text");
+          const validate2 = validateKey || validateLabelKey;
           const {
-            isValid
-          } = validateLabelKey(value22 || "");
+            isValid,
+            errorMessage
+          } = validate2(value22 || "");
           if (!isValid)
-            return t2("dovetail.format_error");
+            return errorMessage || t2("dovetail.format_error");
         },
         render: renderTextAreaFunc
       }, {
         key: "value",
-        title: t2("dovetail.value_optional"),
+        title: isValueOptional ? t2("dovetail.value_optional") : t2("dovetail.value"),
         type: "input",
         validator: ({
           value: value22
         }) => {
           if (noValueValidation)
             return;
+          const validate2 = validateValue || validateLabelValue;
           const {
-            isValid
-          } = validateLabelValue(value22 || "");
+            isValid,
+            errorMessage
+          } = validate2(value22 || "", isValueOptional);
           if (!isValid)
-            return t2("dovetail.format_error");
+            return errorMessage || t2("dovetail.format_error");
         },
         render: renderTextAreaFunc
       }, ...extraColumns || []],
-      disableBatchFilling: true,
-      hideEmptyTable: true,
       rowAddConfig: {
         addible: true,
         text: () => addButtonText
       },
       defaultData: defaultValue,
       row: {
-        deletable: true
-      }
-    }), /* @__PURE__ */ jsxRuntimeExports.jsx(LabelFormatPopover, {
+        deletable: _value.length > (minSize || 0)
+      },
+      disableBatchFilling: true,
+      hideEmptyTable: true
+    }), isHideLabelFormatPopover ? null : /* @__PURE__ */ jsxRuntimeExports.jsx(LabelFormatPopover, {
       noValueValidation
-    })]
+    }), canImportFromFile ? /* @__PURE__ */ jsxRuntimeExports.jsx(Upload, {
+      multiple: false,
+      showUploadList: false,
+      onChange: async (e2) => {
+        var _a;
+        const fileValue = {
+          key: e2.file.name,
+          value: await readFileAsBase64(e2.file.originFileObj)
+        };
+        let newValue = [..._value, fileValue];
+        if (_value.some((v) => v.key === fileValue.key)) {
+          newValue = _value.map((v) => v.key === fileValue.key ? fileValue : v);
+        }
+        _setValue(newValue);
+        (_a = tableFormRef.current) == null ? void 0 : _a.setData(newValue);
+        onChange == null ? void 0 : onChange(newValue);
+      },
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button, {
+        type: "link",
+        size: "small",
+        children: t2("dovetail.import_from_file")
+      })
+    }) : null]
   });
 }
-const KeyValueTableFormForm = React__default.forwardRef(_KeyValueTableFormForm);
+const KeyValueTableForm = React__default.forwardRef(_KeyValueTableForm);
 const EditNodeTaintForm_cgov7z = "";
 const UlStyle = "u19jcs7t";
 const EditNodeTaintForm = React__default.forwardRef(function EditNodeTaintForm2(props, ref) {
@@ -11462,6 +11394,7 @@ const EditNodeTaintForm = React__default.forwardRef(function EditNodeTaintForm2(
   const {
     t: t2
   } = useTranslation();
+  const tableFormRef = useRef(null);
   const defaultValue = useMemo(() => {
     var _a;
     return ((_a = nodeModel._rawYaml.spec) == null ? void 0 : _a.taints) || [];
@@ -11497,8 +11430,14 @@ const EditNodeTaintForm = React__default.forwardRef(function EditNodeTaintForm2(
       errorNotification: false
     });
   }, [nodeModel, mutateAsync, t2]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(KeyValueTableFormForm, {
-    ref,
+  useImperativeHandle(ref, () => ({
+    submit: () => {
+      var _a;
+      return (_a = tableFormRef.current) == null ? void 0 : _a.submit();
+    }
+  }), []);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(KeyValueTableForm, {
+    ref: tableFormRef,
     defaultValue,
     onSubmit,
     addButtonText: t2("dovetail.add_taint"),
@@ -11751,6 +11690,47 @@ function ResourceTable(props) {
     }
   );
 }
+const StateTag = (props) => {
+  const {
+    state: state2 = ResourceState.UPDATING,
+    hideBackground,
+    className,
+    customResourceStateMap
+  } = props;
+  const { t: t2 } = useTranslation();
+  const defaultStateMap = {
+    [ResourceState.UPDATING]: "loading",
+    [ResourceState.READY]: "green",
+    [ResourceState.COMPLETED]: "gray",
+    [ResourceState.FAILED]: "red",
+    [ResourceState.SUSPENDED]: "warning",
+    [ResourceState.RUNNING]: "green",
+    [ResourceState.SUCCEEDED]: "blue",
+    [ResourceState.UNKNOWN]: "gray",
+    [ResourceState.TERMINATING]: "loading",
+    [ResourceState.PENDING]: "warning",
+    [ResourceState.WAITING]: "warning",
+    [ResourceState.TERMINATED]: "gray",
+    [ResourceState.STOPPED]: "gray",
+    [ResourceState.AVAILABLE]: "blue",
+    [ResourceState.BOUND]: "green",
+    [ResourceState.RELEASED]: "gray",
+    [ResourceState.LOST]: "red",
+    [ResourceState.ACTIVE]: "green",
+    [ResourceState.DELETING]: "loading"
+  };
+  const finalColorMap = (customResourceStateMap == null ? void 0 : customResourceStateMap.color) || defaultStateMap;
+  const finalTextMap = customResourceStateMap == null ? void 0 : customResourceStateMap.text;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    StatusCapsule,
+    {
+      className: cx_default(className, StateTagStyle, hideBackground && "no-background"),
+      color: finalColorMap[state2] !== "loading" ? finalColorMap[state2] : void 0,
+      loading: finalColorMap[state2] === "loading",
+      children: finalTextMap ? finalTextMap[state2] : t2(`dovetail.${state2 || "updating"}_state`)
+    }
+  );
+};
 const WorkloadPodsTable_975j2t = "";
 const WorkloadPodsTable = ({
   namespace: namespace2,
@@ -11832,7 +11812,7 @@ const ReadyValueStyle = "r1bm8olw";
 const ReplicasValueStyle = "r1oqudbh";
 const ContentWrapperStyle = "c18i6jtg";
 const LabelStyle = "lpm22il";
-const ValueStyle = "v1ixr1me";
+const ValueStyle$1 = "v1ixr1me";
 const WorkloadReplicasForm = React__default.forwardRef(function WorkloadReplicasForm2(props, ref) {
   const {
     defaultValue,
@@ -11962,7 +11942,7 @@ function WorkloadReplicas({
           className: cx_default(LabelStyle, Typo.Label.l3_regular),
           children: record.kind === "Job" ? t2("dovetail.pod_complete_num") : t2("dovetail.pod_ready_num")
         }), /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
-          className: cx_default(ValueStyle, Typo.Label.l3_regular),
+          className: cx_default(ValueStyle$1, Typo.Label.l3_regular),
           children: readyReplicas
         })]
       }), /* @__PURE__ */ jsxRuntimeExports.jsxs("tr", {
@@ -11970,7 +11950,7 @@ function WorkloadReplicas({
           className: cx_default(LabelStyle, Typo.Label.l3_regular),
           children: t2("dovetail.pod_replicas_num")
         }), /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
-          className: cx_default(ValueStyle, Typo.Label.l3_regular),
+          className: cx_default(ValueStyle$1, Typo.Label.l3_regular),
           children: replicas
         }), /* @__PURE__ */ jsxRuntimeExports.jsx("td", {
           children: editable && canScale && /* @__PURE__ */ jsxRuntimeExports.jsx(EditField, {
@@ -12001,6 +11981,7 @@ var AreaType = /* @__PURE__ */ ((AreaType2) => {
 const ImageField = (i18n2) => {
   return {
     key: "Image",
+    col: 12,
     title: i18n2.t("dovetail.image"),
     path: ["imageNames"],
     renderContent(value2) {
@@ -12107,6 +12088,7 @@ const SecretDataField = () => {
 const StartTimeField = (i18n2) => {
   return {
     key: "started",
+    col: 12,
     title: i18n2.t("dovetail.started"),
     path: ["status", "startTime"],
     renderContent(value2) {
@@ -12117,6 +12099,7 @@ const StartTimeField = (i18n2) => {
 const ServiceTypeField = (i18n2) => {
   return {
     key: "type",
+    col: 12,
     title: i18n2.t("dovetail.type"),
     path: ["displayType"]
   };
@@ -12124,6 +12107,7 @@ const ServiceTypeField = (i18n2) => {
 const ClusterIpField = (i18n2) => {
   return {
     key: "clusterIp",
+    col: 12,
     title: i18n2.t("dovetail.clusterIp"),
     path: ["spec", "clusterIP"]
   };
@@ -12131,6 +12115,7 @@ const ClusterIpField = (i18n2) => {
 const SessionAffinityField = (i18n2) => {
   return {
     key: "clusterIp",
+    col: 12,
     title: i18n2.t("dovetail.sessionAffinity"),
     path: ["spec", "sessionAffinity"]
   };
@@ -12175,11 +12160,13 @@ const EventsTableTabField = () => {
 };
 const NamespaceField = (i18n2) => ({
   key: "NameSpace",
+  col: 12,
   title: i18n2.t("dovetail.namespace"),
   path: ["metadata", "namespace"]
 });
 const AgeField = (i18n2) => ({
   key: "Age",
+  col: 12,
   title: i18n2.t("dovetail.created_time"),
   path: ["metadata", "creationTimestamp"],
   renderContent(value2) {
@@ -12207,6 +12194,7 @@ const AnnotationsField = (i18n2) => ({
 });
 const ServiceInnerClusterAccessField = () => ({
   key: "innerClusterAccess",
+  col: 12,
   title: /* @__PURE__ */ jsxRuntimeExports.jsx(ServiceInClusterAccessTitle, {}),
   path: [],
   renderContent: (_, record) => {
@@ -12215,6 +12203,7 @@ const ServiceInnerClusterAccessField = () => ({
 });
 const ServiceOutClusterAccessField = (clusterVip) => ({
   key: "innerClusterAccess",
+  col: 12,
   title: /* @__PURE__ */ jsxRuntimeExports.jsx(ServiceOutClusterAccessTitle, {}),
   path: [],
   renderContent: (_, record) => {
@@ -12247,6 +12236,7 @@ const PortsTableField = () => ({
 const DurationField = (i18n2) => {
   return {
     key: "duration",
+    col: 12,
     path: ["duration"],
     title: i18n2.t("dovetail.duration"),
     renderContent: (v) => {
@@ -12257,6 +12247,7 @@ const DurationField = (i18n2) => {
 const StorageClassProvisionerField = (i18n2) => {
   return {
     key: "provisioner",
+    col: 12,
     path: ["provisioner"],
     title: i18n2.t("dovetail.provisioner")
   };
@@ -12292,6 +12283,7 @@ const StorageClassPvField = () => {
 const PVCapacityField = (i18n2) => {
   return {
     key: "capacity",
+    col: 12,
     path: ["spec", "capacity", "storage"],
     title: i18n2.t("dovetail.capacity"),
     renderContent(value2) {
@@ -12302,6 +12294,7 @@ const PVCapacityField = (i18n2) => {
 const PVCStorageField = (i18n2) => {
   return {
     key: "storage",
+    col: 12,
     path: ["spec", "resources", "requests", "storage"],
     title: i18n2.t("dovetail.distributed"),
     renderContent(value2, pvc2) {
@@ -12312,6 +12305,7 @@ const PVCStorageField = (i18n2) => {
 const PVRefField = (i18n2) => {
   return {
     key: "pv",
+    col: 12,
     path: ["pv"],
     title: i18n2.t("dovetail.pv"),
     renderContent(value2) {
@@ -12329,6 +12323,7 @@ const PVRefField = (i18n2) => {
 const PVStorageClassField = (i18n2) => {
   return {
     key: "storageClass",
+    col: 12,
     path: ["spec", "storageClassName"],
     title: i18n2.t("dovetail.storage_class"),
     renderContent(value2) {
@@ -12339,6 +12334,7 @@ const PVStorageClassField = (i18n2) => {
 const PVPhaseField = (i18n2) => {
   return {
     key: "phase",
+    col: 12,
     path: ["stateDisplay"],
     title: i18n2.t("dovetail.state"),
     renderContent(value2) {
@@ -12349,6 +12345,7 @@ const PVPhaseField = (i18n2) => {
 const PVVolumeModeField = (i18n2) => {
   return {
     key: "mode",
+    col: 12,
     path: ["spec", "volumeMode"],
     title: i18n2.t("dovetail.volume_mode"),
     renderContent(value2) {
@@ -12359,6 +12356,7 @@ const PVVolumeModeField = (i18n2) => {
 const PVAccessModeField = (i18n2) => {
   return {
     key: "accessMode",
+    col: 12,
     path: ["spec", "accessModes"],
     title: i18n2.t("dovetail.access_mode"),
     renderContent(value2) {
@@ -12394,6 +12392,7 @@ const PVCPodsField = () => {
 const PVCRefField = (i18n2) => {
   return {
     key: "pvc",
+    col: 12,
     path: ["pvc"],
     title: i18n2.t("dovetail.pvc"),
     renderContent(value2, pv2) {
@@ -12412,6 +12411,7 @@ const PVCRefField = (i18n2) => {
 const PVCSIRefField = (i18n2) => {
   return {
     key: "csi",
+    col: 12,
     path: ["csi"],
     title: i18n2.t("dovetail.csi")
   };
@@ -12419,6 +12419,7 @@ const PVCSIRefField = (i18n2) => {
 const IsDefaultSCField = (i18n2) => {
   return {
     key: "isDefaultSC",
+    col: 12,
     path: ["isDefaultSC"],
     title: i18n2.t("dovetail.default_sc"),
     renderContent(val) {
@@ -12429,6 +12430,7 @@ const IsDefaultSCField = (i18n2) => {
 const SCReclaimPolicyField = (i18n2) => {
   return {
     key: "reclaimPolicy",
+    col: 12,
     path: ["reclaimPolicy"],
     title: i18n2.t("dovetail.reclaim_policy"),
     renderContent(val) {
@@ -12443,6 +12445,7 @@ const SCReclaimPolicyField = (i18n2) => {
 const IsSCAllowVolumeExpansionField = (i18n2) => {
   return {
     key: "allowVolumeExpansion",
+    col: 12,
     path: ["allowVolumeExpansion"],
     title: i18n2.t("dovetail.allow_expand"),
     renderContent(val) {
@@ -12690,7 +12693,7 @@ const PodLogTab = (i18n2) => ({
   ]
 });
 const NetworkPolicyRulesViewer_r6jity = "";
-const MonacoYamlEditor$1 = lazy(() => import("./MonacoYamlEditor-74ecf0d5.js"));
+const MonacoYamlEditor$1 = lazy(() => import("./MonacoYamlEditor-d09e7de9.js"));
 const EditorStyle$1 = "e1cjl2b8";
 const NetworkPolicyRulesViewer = ({
   ingressOrEgress,
@@ -13007,27 +13010,269 @@ const NetworkPolicyEgressRulesGroup = (i18n2) => ({
               }
             );
           }
-        }
-      ]
-    }
-  ]
-});
-const StorageClassPvGroup = (i18n2) => ({
-  title: i18n2.t("dovetail.persistent_volume"),
-  areas: [
-    {
-      fields: [StorageClassPvField()]
-    }
-  ]
-});
-const ResourceTableGroup = (resource, title) => ({
-  title,
-  areas: [
+        }
+      ]
+    }
+  ]
+});
+const StorageClassPvGroup = (i18n2) => ({
+  title: i18n2.t("dovetail.persistent_volume"),
+  areas: [
+    {
+      fields: [StorageClassPvField()]
+    }
+  ]
+});
+const ResourceTableGroup = (resource, title) => ({
+  title,
+  areas: [
+    {
+      fields: [ResourceTableField(resource)]
+    }
+  ]
+});
+function Tabs(props) {
+  const { tabs, className } = props;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(Tabs$1, { className, children: tabs.map((tab) => {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(TabsTabPane, { tab: tab.title, children: tab.children }, tab.title);
+  }) });
+}
+const ShowContentView_1mvcyif = "";
+const ShowContentWrapperStyle = "soapvs9";
+const BackButton = "b13d603q";
+const ToolBarWrapper = "tm8eaia";
+const NameStyle = "nhnus27";
+const TopBarStyle = "t16t20f5";
+const ShowContentHeaderStyle = "s97y2wr";
+const GroupStyle = "g1rhnxqx";
+const GroupTitleStyle = "g1f1s2pc";
+const FullTabContentStyle = "f1qw3bxx";
+const FieldWrapperStyle = "flfewds";
+const TabContentStyle = "t1c7cta8";
+const ValueStyle = "v1pt61xk";
+const TabsStyle = "t1to6fie";
+function ShowGroupComponent(props) {
+  const {
+    title,
+    className,
+    children,
+    operationEle
+  } = props;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+    className: cx_default(GroupStyle, className),
+    children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+      className: cx_default(Typo.Heading.h2_bold_title, GroupTitleStyle),
+      children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+        children: title
+      }), operationEle]
+    }), children]
+  });
+}
+const ShowContentView = (props) => {
+  var _a, _b, _c, _d;
+  const {
+    id,
+    resourceName,
+    showConfig,
+    formatter,
+    Dropdown: Dropdown2 = K8sDropdown,
+    hideBackButton = false
+  } = props;
+  const {
+    queryResult
+  } = useShow({
+    id,
+    resource: resourceName,
+    errorNotification: false
+  });
+  const {
+    t: t2
+  } = useTranslation();
+  const {
+    data: data2
+  } = queryResult;
+  const navigation = useNavigation();
+  const go = useGo();
+  const openForm = useOpenForm();
+  const Component = useContext(ComponentContext);
+  const configs = useContext(ConfigsContext);
+  const config = configs[resourceName];
+  const Tabs$12 = Component.Tabs || Tabs;
+  if (!(data2 == null ? void 0 : data2.data)) {
+    return null;
+  }
+  const model = data2.data;
+  const record = formatter ? formatter(model) : data2 == null ? void 0 : data2.data;
+  function renderFields(fields, areaType, hasCol = true) {
+    if (!record)
+      return null;
+    return fields.map((field) => {
+      if (field.hidden)
+        return null;
+      let content;
+      const value2 = get$2(record, field.path);
+      if (field.renderContent) {
+        content = field.renderContent(value2, record, field);
+      } else {
+        content = get$2(record, field.path);
+      }
+      return hasCol ? /* @__PURE__ */ jsxRuntimeExports.jsx(Col, {
+        flex: areaType === AreaType.Inline ? "none" : "",
+        span: field.col || 24,
+        className: "cca5959",
+        children: field.render ? field.render(value2, record, field) : /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+          className: FieldWrapperStyle,
+          children: [field.title && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+            className: Typo.Label.l4_regular_title,
+            style: {
+              width: field.labelWidth || "165px",
+              marginRight: 8,
+              flexShrink: 0,
+              color: "#2C385299"
+            },
+            children: field.title
+          }), /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+            style: {
+              flex: 1,
+              minWidth: 0
+            },
+            children: /* @__PURE__ */ jsxRuntimeExports.jsx(ValueDisplay, {
+              className: cx_default(Typo.Label.l4_regular_title, ValueStyle),
+              value: content,
+              useOverflow: false
+            })
+          })]
+        })
+      }, field.key) : /* @__PURE__ */ jsxRuntimeExports.jsx(ValueDisplay, {
+        style: {
+          height: "100%"
+        },
+        value: content,
+        useOverflow: false
+      });
+    });
+  }
+  function renderGroup(group) {
+    const GroupContainer = group.title ? ShowGroupComponent : React__default.Fragment;
+    const FieldContainer = group.title ? Row : React__default.Fragment;
+    const groupContainerProps = group.title ? {
+      title: group.title || ""
+    } : {};
+    const fieldContainerProps = group.title ? {
+      gutter: [24, 8]
+    } : {};
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(GroupContainer, {
+      ...groupContainerProps,
+      children: group.areas.map((area, index2) => /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
+        children: [/* @__PURE__ */ jsxRuntimeExports.jsx(FieldContainer, {
+          ...fieldContainerProps,
+          children: renderFields(area.fields, area.type, !!group.title)
+        }, index2), index2 !== group.areas.length - 1 ? /* @__PURE__ */ jsxRuntimeExports.jsx(Divider, {
+          style: {
+            margin: "8px 0 12px 0"
+          }
+        }) : null]
+      }))
+    }, group.title);
+  }
+  const stateDisplay = get$2(record, "stateDisplay");
+  const topBar = /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+    className: ToolBarWrapper,
+    children: [!hideBackButton && /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+      className: cx_default(Typo.Label.l4_bold, BackButton),
+      onClick: () => {
+        go({
+          to: navigation.listUrl(resourceName)
+        });
+      },
+      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon$1, {
+        src: ArrowChevronLeft16BoldTertiaryIcon,
+        hoverSrc: ArrowChevronLeftSmall16BoldBlueIcon,
+        style: {
+          marginRight: 4
+        },
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+          className: "button-text",
+          children: (config == null ? void 0 : config.displayName) || resourceName
+        })
+      })
+    }), /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
+      className: TopBarStyle,
+      children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+        style: {
+          display: "flex"
+        },
+        children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+          className: cx_default(Typo.Display.d2_regular_title, NameStyle),
+          children: ((_a = showConfig.displayName) == null ? void 0 : _a.call(showConfig, record)) || ((_b = record == null ? void 0 : record.metadata) == null ? void 0 : _b.name)
+        }), stateDisplay ? /* @__PURE__ */ jsxRuntimeExports.jsx(StateTag, {
+          state: stateDisplay,
+          customResourceStateMap: showConfig.resourceStateMap
+        }) : void 0]
+      }), /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
+        children: [(_c = showConfig.renderExtraButton) == null ? void 0 : _c.call(showConfig, record), !config.hideEdit ? /* @__PURE__ */ jsxRuntimeExports.jsx(CanAccess, {
+          resource: resourceName,
+          action: AccessControlAuth.Edit,
+          params: {
+            namespace: record.namespace
+          },
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button, {
+            style: {
+              marginRight: 8
+            },
+            onClick: () => openForm({
+              id
+            }),
+            children: ((_d = config.formConfig) == null ? void 0 : _d.formType) === FormType.FORM ? t2("dovetail.edit") : t2("dovetail.edit_yaml")
+          })
+        }) : null, /* @__PURE__ */ jsxRuntimeExports.jsx(Dropdown2, {
+          record,
+          size: "large"
+        })]
+      })]
+    })]
+  });
+  const tabs = /* @__PURE__ */ jsxRuntimeExports.jsx(Tabs$12, {
+    tabs: (showConfig.tabs || []).map((tab, tabIndex) => {
+      var _a2;
+      return {
+        title: tab.title,
+        key: tab.key,
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+          className: cx_default(TabContentStyle, tab.groups.length <= 1 && tabIndex !== 0 && FullTabContentStyle),
+          children: (_a2 = tab.groups) == null ? void 0 : _a2.map(renderGroup)
+        })
+      };
+    }),
+    className: TabsStyle
+  });
+  const basicInfo = showConfig.basicGroup ? renderGroup(showConfig.basicGroup) : null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+    className: ShowContentWrapperStyle,
+    children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Space, {
+      direction: "vertical",
+      className: ShowContentHeaderStyle,
+      children: topBar
+    }), basicInfo, tabs]
+  });
+};
+const ShowContent = (props) => {
+  var _a;
+  const { showConfig, formatter, Dropdown: Dropdown2 = K8sDropdown } = props;
+  const parsed = useParsed();
+  const { resource } = useResource();
+  const id = (_a = parsed == null ? void 0 : parsed.params) == null ? void 0 : _a.id;
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    ShowContentView,
     {
-      fields: [ResourceTableField(resource)]
+      id,
+      resourceName: (resource == null ? void 0 : resource.name) || "",
+      showConfig,
+      formatter,
+      Dropdown: Dropdown2
     }
-  ]
-});
+  );
+};
 const PageShow = (props) => {
   var _a;
   const parsed = useParsed();
@@ -15261,6 +15506,11 @@ function usePathMap(options) {
     transformApplyValues
   };
 }
+var FormItemLayout = /* @__PURE__ */ ((FormItemLayout2) => {
+  FormItemLayout2["VERTICAL"] = "VERTICAL";
+  FormItemLayout2["HORIZONTAL"] = "HORIZONTAL";
+  return FormItemLayout2;
+})(FormItemLayout || {});
 function useFieldsConfig(config, formConfig, resourceId) {
   var _a, _b, _c;
   const action = resourceId ? "edit" : "create";
@@ -15282,7 +15532,8 @@ function useFieldsConfig(config, formConfig, resourceId) {
     action
   });
 }
-const RefineFormContent_ahna8x = "";
+const RefineFormContent_lnhybh = "";
+const VerticalFormItemStyle = "v154n7ie";
 function renderCommonFormFiled(props) {
   const {
     field,
@@ -15309,7 +15560,7 @@ function renderCommonFormFiled(props) {
   switch (fieldConfig.type) {
     case "number":
       ele = /* @__PURE__ */ jsxRuntimeExports.jsx(Fields.Integer, {
-        className: "c154n7ie",
+        className: "c1c9j4da",
         placeholder: fieldConfig.placeholder,
         input: {
           value: value2,
@@ -15352,7 +15603,7 @@ const RefineFormContent = (props) => {
       control,
       name: fieldConfig.path.join("."),
       rules: {
-        validate(value2) {
+        async validate(value2) {
           const formValue = getValues();
           if (!fieldConfig.validators || fieldConfig.validators.length === 0)
             return true;
@@ -15360,7 +15611,7 @@ const RefineFormContent = (props) => {
             const {
               isValid,
               errorMsg
-            } = func(value2, formValue, FormType.FORM);
+            } = await func(value2, formValue, FormType.FORM);
             if (!isValid)
               return errorMsg;
           }
@@ -15388,13 +15639,14 @@ const RefineFormContent = (props) => {
         return /* @__PURE__ */ jsxRuntimeExports.jsx(Form.Item, {
           label: fieldConfig.label,
           colon: false,
-          labelCol: {
+          labelCol: fieldConfig.layout === FormItemLayout.VERTICAL ? {} : {
             flex: `0 0 ${(formConfig == null ? void 0 : formConfig.labelWidth) || "216px"}`
           },
-          help: (_a2 = fieldState.error) == null ? void 0 : _a2.message,
+          help: fieldConfig.isHideErrorStatus ? "" : (_a2 = fieldState.error) == null ? void 0 : _a2.message,
           extra: fieldConfig.helperText,
-          validateStatus: fieldState.invalid ? "error" : void 0,
+          validateStatus: fieldState.invalid && !fieldConfig.isHideErrorStatus ? "error" : void 0,
           "data-test-id": fieldConfig.key,
+          className: fieldConfig.layout === FormItemLayout.VERTICAL ? VerticalFormItemStyle : "",
           children: ele
         }, fieldConfig.key);
       }
@@ -15403,7 +15655,7 @@ const RefineFormContent = (props) => {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
     direction: "vertical",
     size: 16,
-    className: "c1c9j4da",
+    className: "cjxv8cf",
     children: [fields, /* @__PURE__ */ jsxRuntimeExports.jsx(FormErrorAlert, {
       errorMsgs: errorMsgs || [],
       style: {
@@ -16122,7 +16374,7 @@ const PlainCodeStyle = "pqch97v";
 const ErrorMsgStyle = "eh2qjnl";
 const ErrorWrapperStyle = "e19q2bnp";
 const YamlEditorStyle = "y16u5v3w";
-const MonacoYamlEditor = React__default.lazy(() => import("./MonacoYamlEditor-74ecf0d5.js"));
+const MonacoYamlEditor = React__default.lazy(() => import("./MonacoYamlEditor-d09e7de9.js"));
 const MonacoYamlDiffEditor = React__default.lazy(() => import("./MonacoYamlDiffEditor-7de94ad2.js"));
 const YamlEditorComponent = forwardRef(
   function YamlEditorComponent2(props, ref) {
@@ -16150,20 +16402,18 @@ const YamlEditorComponent = forwardRef(
     const editorInstance = useRef();
     const [copyTooltip, setCopyTooltip] = useState(t2("dovetail.copy"));
     const [resetTooltip, setResetTooltip] = useState(t2("dovetail.reset_arguments"));
-    useImperativeHandle(ref, () => {
-      return {
-        setValue: _setValue,
-        setEditorValue: (value22) => {
-          var _a, _b;
-          (_b = (_a = editorInstance.current) == null ? void 0 : _a.getModel()) == null ? void 0 : _b.setValue(value22);
-        },
-        getEditorValue: () => {
-          var _a;
-          return ((_a = editorInstance.current) == null ? void 0 : _a.getValue()) ?? "";
-        },
-        getEditorInstance: () => editorInstance.current || null
-      };
-    });
+    const defaultValueString = useMemo(() => {
+      if (typeof defaultValue === "string") {
+        return defaultValue;
+      }
+      return yaml$2.dump(defaultValue);
+    }, [defaultValue]);
+    const _valueString = useMemo(() => {
+      if (typeof _value === "string") {
+        return _value;
+      }
+      return yaml$2.dump(_value);
+    }, [_value]);
     const onChange = useCallback(
       (newVal) => {
         var _a;
@@ -16186,7 +16436,7 @@ const YamlEditorComponent = forwardRef(
       (editor) => {
         var _a, _b, _c;
         if (editor.getValue() !== _value) {
-          (_b = (_a = editorInstance.current) == null ? void 0 : _a.getModel()) == null ? void 0 : _b.setValue(_value);
+          (_b = (_a = editorInstance.current) == null ? void 0 : _a.getModel()) == null ? void 0 : _b.setValue(_valueString);
         }
         (_c = props.onEditorCreate) == null ? void 0 : _c.call(props, editor);
       },
@@ -16195,13 +16445,29 @@ const YamlEditorComponent = forwardRef(
     const getInstance = useCallback((ins) => {
       editorInstance.current = ins;
     }, []);
+    const getEditorValue = useCallback(() => {
+      var _a;
+      return ((_a = editorInstance.current) == null ? void 0 : _a.getValue()) ?? "";
+    }, []);
     useEffect(() => {
       var _a, _b;
-      if (value2 !== void 0 && value2 !== _value) {
+      if (value2 !== void 0 && !isEqual(value2, _value)) {
+        const valueString = typeof value2 === "string" ? value2 : yaml$2.dump(value2);
         _setValue(value2);
-        (_b = (_a = editorInstance.current) == null ? void 0 : _a.getModel()) == null ? void 0 : _b.setValue(value2);
+        (_b = (_a = editorInstance.current) == null ? void 0 : _a.getModel()) == null ? void 0 : _b.setValue(valueString);
       }
     }, [value2]);
+    useImperativeHandle(ref, () => {
+      return {
+        setValue: _setValue,
+        setEditorValue: (value22) => {
+          var _a, _b;
+          (_b = (_a = editorInstance.current) == null ? void 0 : _a.getModel()) == null ? void 0 : _b.setValue(value22);
+        },
+        getEditorValue,
+        getEditorInstance: () => editorInstance.current || null
+      };
+    });
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "div",
       {
@@ -16255,7 +16521,7 @@ const YamlEditorComponent = forwardRef(
                               iconHeight: 16,
                               onClick: () => {
                                 if (!isCollapsed) {
-                                  copyToClipboard(_value);
+                                  copyToClipboard(getEditorValue());
                                   setCopyTooltip(t2("dovetail.copied"));
                                 }
                               }
@@ -16287,7 +16553,7 @@ const YamlEditorComponent = forwardRef(
                               onClick: () => {
                                 var _a;
                                 if (!isCollapsed) {
-                                  (_a = editorInstance.current) == null ? void 0 : _a.setValue(defaultValue);
+                                  (_a = editorInstance.current) == null ? void 0 : _a.setValue(defaultValueString);
                                   setResetTooltip(t2("dovetail.already_reset"));
                                 }
                               }
@@ -16348,7 +16614,7 @@ const YamlEditorComponent = forwardRef(
                 zIndex: 1
               },
               children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: PlainCodeStyle, children: _value }), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { display: isDiff ? "none" : "block" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: PlainCodeStyle, children: _valueString }), children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { display: isDiff ? "none" : "block" }, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
                   MonacoYamlEditor,
                   {
                     id: props.id,
@@ -16364,12 +16630,12 @@ const YamlEditorComponent = forwardRef(
                     isScrollOnFocus
                   }
                 ) }) }),
-                isDiff ? /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: PlainCodeStyle, children: _value }), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+                isDiff ? /* @__PURE__ */ jsxRuntimeExports.jsx(Suspense, { fallback: /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: PlainCodeStyle, children: _valueString }), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
                   MonacoYamlDiffEditor,
                   {
                     id: props.id,
-                    origin: defaultValue,
-                    modified: _value,
+                    origin: defaultValueString,
+                    modified: _valueString,
                     height
                   }
                 ) }) : null
@@ -16647,21 +16913,21 @@ const useYamlForm = ({
     }
     return changeValues;
   };
-  const validateRules = (yamlValue) => {
+  const validateRules = async (yamlValue) => {
     const errorMap = {};
     if (rules && isYamlValid && isSchemaValid) {
       const formValue = yaml$2.load(yamlValue || "");
-      rules.forEach((rule2) => {
+      for (const rule2 of rules) {
         const { path: path2, validators } = rule2;
         const value2 = get$2(formValue, path2);
         for (const validator of validators || []) {
-          const { isValid, errorMsg } = validator(value2, formValue, FormType.YAML);
+          const { isValid, errorMsg } = await validator(value2, formValue, FormType.YAML);
           if (!isValid) {
             errorMap[path2.join(".")] = `${errorMsg}(${path2.join(".")})`;
             break;
           }
         }
-      });
+      }
     }
     setRulesErrors(uniq(Object.values(errorMap)));
     return errorMap;
@@ -16799,7 +17065,7 @@ function YamlForm(props) {
     try {
       const result = await ((_a = formProps.onFinish) == null ? void 0 : _a.call(formProps, store));
       if (result) {
-        (_b = props.onFinish) == null ? void 0 : _b.call(props);
+        (_b = props.onFinish) == null ? void 0 : _b.call(props, result);
       }
     } catch {
     } finally {
@@ -16870,20 +17136,21 @@ function RefineFormContainer({
     config,
     id,
     refineProps: {
-      onMutationSuccess: () => {
-        onSuccess == null ? void 0 : onSuccess();
+      onMutationSuccess: (data2) => {
+        onSuccess == null ? void 0 : onSuccess(data2);
       },
       onMutationError() {
         onError == null ? void 0 : onError();
       },
       redirect: false,
+      mutationMeta: {
+        updateType: "put"
+      },
       ...formConfig == null ? void 0 : formConfig.refineCoreProps
     },
     formConfig
   });
-  const {
-    transformApplyValues
-  } = usePathMap({
+  const { transformApplyValues } = usePathMap({
     pathMap: formConfig == null ? void 0 : formConfig.pathMap,
     transformInitValues: formConfig == null ? void 0 : formConfig.transformInitValues,
     transformApplyValues: (formConfig == null ? void 0 : formConfig.transformApplyValues) || ((v) => v)
@@ -16898,14 +17165,16 @@ function RefineFormContainer({
         initialValuesForCreate: transformApplyValues(
           refineFormResult.formResult.getValues()
         ),
-        initialValuesForEdit: transformApplyValues(refineFormResult.formResult.getValues()),
+        initialValuesForEdit: transformApplyValues(
+          refineFormResult.formResult.getValues()
+        ),
         id,
         action,
         isShowLayout: false,
         useFormProps: {
           redirect: false
         },
-        rules: fieldsConfig == null ? void 0 : fieldsConfig.map((config2) => ({
+        rules: fieldsConfig == null ? void 0 : fieldsConfig.filter((config2) => !config2.isSkipValidationInYaml).map((config2) => ({
           path: config2.path,
           validators: config2.validators
         })),
@@ -16973,51 +17242,45 @@ function YamlFormContainer({
   onSaveButtonPropsChange
 }) {
   const action = id ? "edit" : "create";
-  const {
-    transformInitValues,
-    transformApplyValues
-  } = usePathMap({
+  const { transformInitValues, transformApplyValues } = usePathMap({
     pathMap: formConfig == null ? void 0 : formConfig.pathMap,
     transformInitValues: formConfig == null ? void 0 : formConfig.transformInitValues,
     transformApplyValues: (formConfig == null ? void 0 : formConfig.transformApplyValues) || ((v) => v)
   });
-  const yamlFormProps = useMemo(
-    () => {
-      return {
-        ...customYamlFormProps,
-        config,
-        transformInitValues,
-        transformApplyValues,
-        initialValuesForCreate: (customYamlFormProps == null ? void 0 : customYamlFormProps.initialValuesForCreate) || config.initValue,
-        initialValuesForEdit: void 0,
-        id,
-        action,
-        isShowLayout: false,
-        useFormProps: {
-          redirect: false
-        },
-        rules: void 0,
-        onSaveButtonPropsChange,
-        onErrorsChange(errors) {
-          if (errors.length) {
-            onError == null ? void 0 : onError();
-          }
-        },
-        onFinish: onSuccess
-      };
-    },
-    [
-      id,
-      action,
-      customYamlFormProps,
+  const yamlFormProps = useMemo(() => {
+    return {
+      ...customYamlFormProps,
       config,
       transformInitValues,
       transformApplyValues,
-      onSuccess,
-      onError,
-      onSaveButtonPropsChange
-    ]
-  );
+      initialValuesForCreate: (customYamlFormProps == null ? void 0 : customYamlFormProps.initialValuesForCreate) || config.initValue,
+      initialValuesForEdit: void 0,
+      id,
+      action,
+      isShowLayout: false,
+      useFormProps: {
+        redirect: false
+      },
+      rules: void 0,
+      onSaveButtonPropsChange,
+      onErrorsChange(errors) {
+        if (errors.length) {
+          onError == null ? void 0 : onError();
+        }
+      },
+      onFinish: onSuccess
+    };
+  }, [
+    id,
+    action,
+    customYamlFormProps,
+    config,
+    transformInitValues,
+    transformApplyValues,
+    onSuccess,
+    onError,
+    onSaveButtonPropsChange
+  ]);
   return /* @__PURE__ */ jsxRuntimeExports.jsx(YamlForm, { ...yamlFormProps });
 }
 const FormModal_64brhp = "";
@@ -17057,7 +17320,8 @@ function FormModal(props) {
   const {
     resource: resourceFromProps,
     id,
-    yamlFormProps: customYamlFormProps
+    yamlFormProps: customYamlFormProps,
+    onSuccess
   } = props;
   const {
     i18n: i18n2
@@ -17136,9 +17400,10 @@ function FormModal(props) {
       onError: () => {
         setIsError(true);
       },
-      onSuccess: () => {
+      onSuccess: (data2) => {
         setIsError(false);
         popModal();
+        onSuccess == null ? void 0 : onSuccess(data2);
       }
     };
     if (config.formConfig && (((_a2 = config.formConfig) == null ? void 0 : _a2.formType) === FormType.FORM || "fields" in config.formConfig)) {
@@ -17152,7 +17417,7 @@ function FormModal(props) {
       ...commonFormProps,
       formConfig: config.formConfig
     });
-  }, [id, customYamlFormProps, config, isYamlMode, popModal, setSaveButtonProps]);
+  }, [id, customYamlFormProps, config, isYamlMode, popModal, setSaveButtonProps, onSuccess]);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Modal, {
     className: cx_default(FullscreenModalStyle),
     style: {
@@ -17325,6 +17590,7 @@ const EditLabelForm = React__default.forwardRef(
     const { resourceModel } = props;
     const { mutateAsync } = useUpdate();
     const { t: t2 } = useTranslation();
+    const tableFormRef = useRef(null);
     const defaultValue = useMemo(() => {
       var _a2;
       return Object.keys(((_a2 = resourceModel.metadata) == null ? void 0 : _a2.labels) || {}).map((key2) => {
@@ -17366,10 +17632,20 @@ const EditLabelForm = React__default.forwardRef(
       },
       [resourceModel, mutateAsync, t2]
     );
+    useImperativeHandle(
+      ref,
+      () => ({
+        submit: () => {
+          var _a2;
+          return (_a2 = tableFormRef.current) == null ? void 0 : _a2.submit();
+        }
+      }),
+      []
+    );
     return /* @__PURE__ */ jsxRuntimeExports.jsx(
-      KeyValueTableFormForm,
+      KeyValueTableForm,
       {
-        ref,
+        ref: tableFormRef,
         defaultValue,
         onSubmit,
         addButtonText: t2("dovetail.add_label")
@@ -17412,6 +17688,7 @@ const EditAnnotationForm = React__default.forwardRef(function EditAnnotationForm
   const { resourceModel } = props;
   const { mutateAsync } = useUpdate();
   const { t: t2 } = useTranslation();
+  const tableFormRef = useRef(null);
   const defaultValue = useMemo(() => {
     var _a2;
     return Object.keys(((_a2 = resourceModel.metadata) == null ? void 0 : _a2.annotations) || {}).map((key2) => {
@@ -17453,10 +17730,20 @@ const EditAnnotationForm = React__default.forwardRef(function EditAnnotationForm
     },
     [resourceModel, mutateAsync, t2]
   );
+  useImperativeHandle(
+    ref,
+    () => ({
+      submit: () => {
+        var _a2;
+        return (_a2 = tableFormRef.current) == null ? void 0 : _a2.submit();
+      }
+    }),
+    []
+  );
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    KeyValueTableFormForm,
+    KeyValueTableForm,
     {
-      ref,
+      ref: tableFormRef,
       defaultValue,
       onSubmit,
       addButtonText: t2("dovetail.add_annotation"),
@@ -18625,7 +18912,8 @@ class ModelPlugin {
         Node: NodeModel,
         StorageClass: StorageClassModel,
         PersistentVolume: PersistentVolumeModel,
-        PersistentVolumeClaim: PersistentVolumeClaimModel
+        PersistentVolumeClaim: PersistentVolumeClaimModel,
+        ReplicaSet: ReplicaSetModel
       })
     ));
   }
@@ -18846,7 +19134,7 @@ export {
   CronjobJobsTable as ay,
   KeyValue as az,
   useSchema as b,
-  TextTags as b$,
+  ServiceOutClusterAccessComponent as b$,
   PodSelectorField as b0,
   PortsTableField as b1,
   DurationField as b2,
@@ -18859,31 +19147,31 @@ export {
   PVPhaseField as b9,
   StorageClassPvGroup as bA,
   ResourceTableGroup as bB,
-  ShowGroupComponent as bC,
-  ShowContent as bD,
-  DeleteManyButton as bE,
-  ListPage as bF,
-  StateTag as bG,
-  DrawerShow as bH,
-  Menu as bI,
-  Table as bJ,
-  EditButton as bK,
-  ReferenceLink as bL,
-  ResourceLink as bM,
-  NS_STORE_KEY as bN,
-  ALL_NS as bO,
-  useNamespacesFilter as bP,
-  NamespacesFilter as bQ,
-  FormModal as bR,
-  renderCommonFormFiled as bS,
-  RefineFormContent as bT,
-  RefineFormPage as bU,
-  SchemaStrategy as bV,
-  YamlForm as bW,
-  useRefineForm as bX,
-  ServiceInClusterAccessComponent as bY,
-  ServiceOutClusterAccessComponent as bZ,
-  Tags as b_,
+  ShowContent as bC,
+  ShowGroupComponent as bD,
+  ShowContentView as bE,
+  DeleteManyButton as bF,
+  ListPage as bG,
+  StateTag as bH,
+  DrawerShow as bI,
+  Menu as bJ,
+  Table as bK,
+  EditButton as bL,
+  ReferenceLink as bM,
+  ResourceLink as bN,
+  NS_STORE_KEY as bO,
+  ALL_NS as bP,
+  useNamespacesFilter as bQ,
+  NamespacesFilter as bR,
+  FormModal as bS,
+  renderCommonFormFiled as bT,
+  RefineFormContent as bU,
+  RefineFormPage as bV,
+  SchemaStrategy as bW,
+  YamlForm as bX,
+  useRefineForm as bY,
+  FormItemLayout as bZ,
+  ServiceInClusterAccessComponent as b_,
   PVVolumeModeField as ba,
   PVAccessModeField as bb,
   PVCPodsField as bc,
@@ -18911,86 +19199,93 @@ export {
   NetworkPolicyIngressRulesGroup as by,
   NetworkPolicyEgressRulesGroup as bz,
   useDeleteModal as c,
-  NodeModel as c$,
-  PodLog as c0,
-  NetworkPolicyRulesViewer as c1,
-  PVVolumeModeDisplay as c2,
-  Tabs as c3,
-  ResourceSelect as c4,
-  PodShellModal as c5,
-  PodShell as c6,
-  ResourceTable as c7,
-  ErrorWrapper as c8,
-  ErrorContentType as c9,
-  PVC_INIT_VALUE as cA,
-  ResourceState as cB,
-  AccessControlAuth as cC,
-  Dovetail as cD,
-  RESOURCE_GROUP as cE,
-  FormContainerType as cF,
-  FormType as cG,
-  FormMode as cH,
-  ComponentContext as cI,
-  GlobalStoreContext as cJ,
-  ConfigsContext as cK,
-  IngressModel as cL,
-  NetworkPolicyModel as cM,
-  JobModel as cN,
-  WorkloadModel as cO,
-  WorkloadBaseModel as cP,
-  PodModel as cQ,
-  PodMetricsModel as cR,
-  ResourceModel as cS,
-  CronJobModel as cT,
-  EventModel as cU,
-  DeploymentModel as cV,
-  DaemonSetModel as cW,
-  StatefulSetModel as cX,
-  ServiceTypeEnum as cY,
-  ServiceModel as cZ,
-  NodeRole as c_,
-  BASE_INIT_VALUE as ca,
-  DEPLOYMENT_INIT_VALUE as cb,
-  CRONJOB_INIT_VALUE as cc,
-  DAEMONSET_INIT_VALUE as cd,
-  JOB_INIT_VALUE as ce,
-  STATEFULSET_INIT_VALUE as cf,
-  POD_INIT_VALUE as cg,
-  SERVICE_CLUSTER_IP_INIT_VALUE as ch,
-  SERVICE_NODE_PORT_INIT_VALUE as ci,
-  SERVICE_LOAD_BALANCER_INIT_VALUE as cj,
-  SERVICE_EXTERNAL_NAME_INIT_VALUE as ck,
-  SERVICE_HEADLESS_INIT_VALUE as cl,
-  INGRESS_INIT_VALUE as cm,
-  NETWORK_POLICY_INIT_VALUE as cn,
-  CONFIG_MAP_INIT_VALUE as co,
-  SERVER_INSTANCE_INIT_VALUE as cp,
-  REDEPLOY_TIMESTAMP_KEY as cq,
-  SECRET_OPAQUE_INIT_VALUE as cr,
-  SECRET_IMAGE_REPO_INIT_VALUE as cs,
-  SECRET_BASIC_AUTH_INIT_VALUE as ct,
-  SECRET_SSH_AUTH_INIT_VALUE as cu,
-  SECRET_TLS_INIT_VALUE as cv,
-  SECRET_CUSTOM_INIT_VALUE as cw,
-  NODE_INIT_VALUE as cx,
-  STORAGE_CLASS_INIT_VALUE as cy,
-  PV_INIT_VALUE as cz,
+  StatefulSetModel as c$,
+  Tags as c0,
+  TextTags as c1,
+  PodLog as c2,
+  NetworkPolicyRulesViewer as c3,
+  PVVolumeModeDisplay as c4,
+  Tabs as c5,
+  ResourceSelect as c6,
+  PodShellModal as c7,
+  PodShell as c8,
+  ResourceTable as c9,
+  NODE_INIT_VALUE as cA,
+  STORAGE_CLASS_INIT_VALUE as cB,
+  PV_INIT_VALUE as cC,
+  PVC_INIT_VALUE as cD,
+  ResourceState as cE,
+  AccessControlAuth as cF,
+  Dovetail as cG,
+  RESOURCE_GROUP as cH,
+  FormContainerType as cI,
+  FormType as cJ,
+  FormMode as cK,
+  ComponentContext as cL,
+  GlobalStoreContext as cM,
+  ConfigsContext as cN,
+  IngressModel as cO,
+  NetworkPolicyModel as cP,
+  JobModel as cQ,
+  WorkloadModel as cR,
+  WorkloadBaseModel as cS,
+  PodModel as cT,
+  PodMetricsModel as cU,
+  ResourceModel as cV,
+  ReplicaSetModel as cW,
+  CronJobModel as cX,
+  EventModel as cY,
+  DeploymentModel as cZ,
+  DaemonSetModel as c_,
+  ErrorWrapper as ca,
+  ErrorContentType as cb,
+  KeyValueTableForm as cc,
+  BASE_INIT_VALUE as cd,
+  DEPLOYMENT_INIT_VALUE as ce,
+  CRONJOB_INIT_VALUE as cf,
+  DAEMONSET_INIT_VALUE as cg,
+  JOB_INIT_VALUE as ch,
+  STATEFULSET_INIT_VALUE as ci,
+  POD_INIT_VALUE as cj,
+  SERVICE_CLUSTER_IP_INIT_VALUE as ck,
+  SERVICE_NODE_PORT_INIT_VALUE as cl,
+  SERVICE_LOAD_BALANCER_INIT_VALUE as cm,
+  SERVICE_EXTERNAL_NAME_INIT_VALUE as cn,
+  SERVICE_HEADLESS_INIT_VALUE as co,
+  INGRESS_INIT_VALUE as cp,
+  NETWORK_POLICY_INIT_VALUE as cq,
+  CONFIG_MAP_INIT_VALUE as cr,
+  SERVER_INSTANCE_INIT_VALUE as cs,
+  REDEPLOY_TIMESTAMP_KEY as ct,
+  SECRET_OPAQUE_INIT_VALUE as cu,
+  SECRET_IMAGE_REPO_INIT_VALUE as cv,
+  SECRET_BASIC_AUTH_INIT_VALUE as cw,
+  SECRET_SSH_AUTH_INIT_VALUE as cx,
+  SECRET_TLS_INIT_VALUE as cy,
+  SECRET_CUSTOM_INIT_VALUE as cz,
   dovetailRefineI18n as d,
-  StorageClassModel as d0,
-  PersistentVolumeModel as d1,
-  PersistentVolumeClaimModel as d2,
-  ProviderPlugins as d3,
-  ModelPlugin as d4,
-  modelPlugin as d5,
-  RelationPlugin as d6,
-  relationPlugin as d7,
-  generateValueFromSchema as d8,
-  generateSchemaTypeValue as d9,
-  resolveRef as da,
-  getApiVersion as db,
-  pruneBeforeEdit as dc,
-  matchSelector as dd,
-  getResourceNameByKind as de,
+  ServiceTypeEnum as d0,
+  ServiceModel as d1,
+  NodeRole as d2,
+  NodeModel as d3,
+  StorageClassModel as d4,
+  PersistentVolumeModel as d5,
+  PersistentVolumeClaimModel as d6,
+  ProviderPlugins as d7,
+  ModelPlugin as d8,
+  modelPlugin as d9,
+  RelationPlugin as da,
+  relationPlugin as db,
+  generateValueFromSchema as dc,
+  generateSchemaTypeValue as dd,
+  resolveRef as de,
+  getApiVersion as df,
+  pruneBeforeEdit as dg,
+  matchSelector as dh,
+  getResourceNameByKind as di,
+  validateDnsSubdomain as dj,
+  validateLabelKey as dk,
+  validateLabelValue as dl,
   useDeleteModalOnly as e,
   useFailedModal as f,
   NameSpaceColumnRenderer as g,