@dovetail-v2/refine 0.0.49-alpha.0 → 0.0.51

package/dist/refine.umd.cjs

@@ -1016,7 +1016,7 @@ var __publicField = (obj, key, value) => {
   }
   const copy$1 = "Copy";
   const reset_arguments$1 = "Reset";
-  const view_changes$1 = "Show Diff";
+  const view_changes$1 = "Show diff";
   const back_to_edit$1 = "Edit";
   const configure_file$1 = "Configuration";
   const yaml_format_wrong$1 = "Configuration is in an invalid YAML format.";
@@ -1053,7 +1053,7 @@ var __publicField = (obj, key, value) => {
   const workload$1 = "Workload";
   const empty$1 = "No data available";
   const schedule$1 = "Schedule";
-  const lastScheduleTime$1 = "Last Schedule";
+  const lastScheduleTime$1 = "Last schedule";
   const duration$1 = "Duration";
   const started$1 = "Start time";
   const container$1 = "Container";
@@ -1080,7 +1080,7 @@ var __publicField = (obj, key, value) => {
   const port$1 = "Port";
   const cert$1 = "Certificate";
   const ip_address$1 = "IP address";
-  const last_seen$1 = "Last Seen";
+  const last_seen$1 = "Last seen";
   const node_port$1 = "NodePort";
   const protocol$1 = "Protocol";
   const key$1 = "Key";
@@ -1150,9 +1150,9 @@ var __publicField = (obj, key, value) => {
   const suspend$1 = "Suspend";
   const default_backend$1 = "Default backend";
   const ingress_class$1 = "IngressClass";
-  const pod_ready_num$1 = "Ready Pod";
-  const pod_complete_num$1 = "Completion Pod";
-  const pod_replicas_num$1 = "Desired Pod";
+  const pod_ready_num$1 = "Ready pod";
+  const pod_complete_num$1 = "Completion pod";
+  const pod_replicas_num$1 = "Desired pod";
   const edit_replicas$1 = "Edit expected number of replicas";
   const dns_record$1 = "DNS record";
   const basic_info$1 = "Basic information";
@@ -1164,6 +1164,8 @@ var __publicField = (obj, key, value) => {
   const path_type$1 = "Path type";
   const only_support_one_yaml$1 = "Only one YAML configuration is supported at a time.";
   const not_support$1 = "Not supported";
+  const stopped$1 = "Stopped";
+  const any_node_ip$1 = "Any node IP";
   const dovetail$1 = {
     copy: copy$1,
     reset_arguments: reset_arguments$1,
@@ -1317,7 +1319,9 @@ var __publicField = (obj, key, value) => {
     pod_port: pod_port$1,
     path_type: path_type$1,
     only_support_one_yaml: only_support_one_yaml$1,
-    not_support: not_support$1
+    not_support: not_support$1,
+    stopped: stopped$1,
+    any_node_ip: any_node_ip$1
   };
   const EN = {
     dovetail: dovetail$1
@@ -1473,6 +1477,8 @@ var __publicField = (obj, key, value) => {
   const out_external_name_desc = "ExternalName 展示 <strong>external-ip</strong>。";
   const only_support_one_yaml = "一次仅支持输入一个 YAML 配置。";
   const not_support = "不支持";
+  const stopped = "已停止";
+  const any_node_ip = "任意节点 IP";
   const dovetail = {
     copy,
     reset_arguments,
@@ -1627,7 +1633,9 @@ var __publicField = (obj, key, value) => {
     out_cluster_lb_desc,
     out_external_name_desc,
     only_support_one_yaml,
-    not_support
+    not_support,
+    stopped,
+    any_node_ip
   };
   const ZH = {
     dovetail
@@ -9550,6 +9558,7 @@ var __publicField = (obj, key, value) => {
     WorkloadState2["TERMINATING"] = "terminating";
     WorkloadState2["PENDING"] = "pending";
     WorkloadState2["WAITING"] = "waiting";
+    WorkloadState2["STOPPED"] = "stopped";
     return WorkloadState2;
   })(WorkloadState || {});
   var AccessControlAuth = /* @__PURE__ */ ((AccessControlAuth2) => {
@@ -9840,7 +9849,7 @@ var __publicField = (obj, key, value) => {
     }
     get readyDisplay() {
       var _a, _b, _c;
-      return `${(_b = (_a = this._rawYaml.status) == null ? void 0 : _a.containerStatuses) == null ? void 0 : _b.filter((c2) => c2.ready).length}/${(_c = this._rawYaml.spec) == null ? void 0 : _c.containers.length}`;
+      return `${((_b = (_a = this._rawYaml.status) == null ? void 0 : _a.containerStatuses) == null ? void 0 : _b.filter((c2) => c2.ready).length) || 0}/${((_c = this._rawYaml.spec) == null ? void 0 : _c.containers.length) || 0}`;
     }
     get readyContainerCount() {
       var _a, _b;
@@ -9931,8 +9940,10 @@ var __publicField = (obj, key, value) => {
       this._globalStore = _globalStore;
     }
     get stateDisplay() {
-      var _a, _b;
-      if (((_a = this.spec) == null ? void 0 : _a.replicas) !== ((_b = this.status) == null ? void 0 : _b.readyReplicas)) {
+      var _a, _b, _c;
+      if (((_a = this.spec) == null ? void 0 : _a.replicas) === 0) {
+        return WorkloadState.STOPPED;
+      } else if (((_b = this.spec) == null ? void 0 : _b.replicas) !== ((_c = this.status) == null ? void 0 : _c.readyReplicas)) {
         return WorkloadState.UPDATING;
       }
       return WorkloadState.READY;
@@ -9965,8 +9976,10 @@ var __publicField = (obj, key, value) => {
       this._globalStore = _globalStore;
     }
     get stateDisplay() {
-      var _a, _b;
-      if (((_a = this.spec) == null ? void 0 : _a.replicas) !== ((_b = this.status) == null ? void 0 : _b.readyReplicas)) {
+      var _a, _b, _c;
+      if (((_a = this.spec) == null ? void 0 : _a.replicas) === 0) {
+        return WorkloadState.STOPPED;
+      } else if (((_b = this.spec) == null ? void 0 : _b.replicas) !== ((_c = this.status) == null ? void 0 : _c.readyReplicas)) {
         return WorkloadState.UPDATING;
       }
       return WorkloadState.READY;
@@ -10000,19 +10013,20 @@ var __publicField = (obj, key, value) => {
     get displayPortMapping() {
       var _a;
       return (_a = this._rawYaml.spec.ports) == null ? void 0 : _a.map((p) => {
-        let servicePort = `${p.port}`;
+        let link = "";
         if (this._rawYaml.spec.clusterIP && this._rawYaml.spec.clusterIP !== "None") {
-          servicePort = `${this._rawYaml.spec.clusterIP}:${p.port}`;
+          link = `${this._rawYaml.spec.clusterIP}:${p.port}`;
         }
         return {
-          servicePort,
+          servicePort: p.port,
+          link,
           targetPort: p.targetPort,
           protocol: p.protocol
         };
       });
     }
   }
-  const index_w8956m = "";
+  const index_1lzkrja = "";
   const ServiceInClusterAccessComponent = ({
     service
   }) => {
@@ -10033,10 +10047,8 @@ var __publicField = (obj, key, value) => {
     }
   };
   const BreakLineStyle = "b1vtjd4k";
-  const LinkStyle = "luro4rx";
   const ServiceOutClusterAccessComponent = ({
     service,
-    clusterVip,
     breakLine = true
   }) => {
     var _a, _b, _c, _d;
@@ -10048,17 +10060,12 @@ var __publicField = (obj, key, value) => {
     let content = "-";
     switch (spec.type) {
       case ServiceTypeEnum.NodePort:
-        content = (_a = spec.ports) == null ? void 0 : _a.filter((v) => !!v).map((p, index) => /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.Link, {
-          target: "_blank",
-          href: `http://${clusterVip}:${p.nodePort}`,
-          className: cx_default(breakLine ? BreakLineStyle : "", LinkStyle),
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.OverflowTooltip, {
-            content: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
-              className: eagle.Typo.Label.l4_regular_title,
-              children: [clusterVip, ":", p.nodePort, !breakLine && index !== (spec.ports || []).length - 1 ? ", " : ""]
-            }),
-            tooltip: `${clusterVip}:${p.nodePort}`
-          })
+        content = (_a = spec.ports) == null ? void 0 : _a.filter((v) => !!v).map((p, index) => /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.OverflowTooltip, {
+          content: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
+            className: cx_default(eagle.Typo.Label.l4_regular_title, BreakLineStyle),
+            children: [i18n2.t("dovetail.any_node_ip"), ":", p.nodePort, !breakLine && index !== (spec.ports || []).length - 1 ? ", " : ""]
+          }),
+          tooltip: `${i18n2.t("dovetail.any_node_ip")}:${p.nodePort}`
         }, p.nodePort));
         return /* @__PURE__ */ jsxRuntimeExports.jsx("ul", {
           children: content
@@ -10142,7 +10149,8 @@ var __publicField = (obj, key, value) => {
       terminating: "loading",
       pending: "warning",
       waiting: "warning",
-      terminated: "red"
+      terminated: "red",
+      stopped: "gray"
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsx(kit.statusCapsule, {
       className: cx_default(className, StateTagStyle, hideBackground && "no-background"),
@@ -10902,8 +10910,14 @@ var __publicField = (obj, key, value) => {
       }, `${image2}-${index}`)) : value2.join(", ")
     });
   };
+  const index_cbhkdt = "";
+  const LinkStyle$1 = "l1vnw9x0";
   const ResourceLink = (props) => {
-    const { name: name2, namespace: namespace2, resourceId } = props;
+    const {
+      name: name2,
+      namespace: namespace2,
+      resourceId
+    } = props;
     const kit = eagle.useUIKit();
     const navigation = core.useNavigation();
     const go = core.useGo();
@@ -10918,7 +10932,11 @@ var __publicField = (obj, key, value) => {
         }
       });
     };
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(kit.Link, { onClick, children: resourceId });
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(kit.Link, {
+      className: LinkStyle$1,
+      onClick,
+      children: resourceId
+    });
   };
   const IngressRulesTable = ({ ingress }) => {
     const { t: t2 } = useTranslation();
@@ -11324,7 +11342,7 @@ var __publicField = (obj, key, value) => {
       i18n: i18n2
     } = useTranslation();
     const [hideSecret, setHideSecret] = React.useState(true);
-    const toggleButton = /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.Button, {
+    const toggleButton = Object.keys(data2).length ? /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.Button, {
       type: "quiet",
       prefixIcon: /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.Icon, {
         src: hideSecret ? iconsReact.ViewEye16GradientGrayIcon : iconsReact.EntityFilterIgnoreGradient16GrayIcon
@@ -11333,7 +11351,7 @@ var __publicField = (obj, key, value) => {
       className: ButtonStyle,
       size: "small",
       children: hideSecret ? i18n2.t("dovetail.show_data_value") : i18n2.t("dovetail.hide_data_value")
-    });
+    }) : null;
     return /* @__PURE__ */ jsxRuntimeExports.jsx(ShowGroupComponent, {
       title: i18n2.t("dovetail.data"),
       operationEle: toggleButton,
@@ -11845,7 +11863,13 @@ var __publicField = (obj, key, value) => {
       key: "data",
       path: ["data"],
       renderContent: (val) => {
-        return /* @__PURE__ */ jsxRuntimeExports.jsx(KeyValue, { data: val, empty: i18n2.t("dovetail.no_resource", { kind: i18n2.t("dovetail.data") }) });
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(
+          KeyValue,
+          {
+            data: val,
+            empty: i18n2.t("dovetail.no_resource", { kind: i18n2.t("dovetail.data") })
+          }
+        );
       }
     };
   };
@@ -11970,12 +11994,12 @@ var __publicField = (obj, key, value) => {
       return /* @__PURE__ */ jsxRuntimeExports.jsx(ServiceInClusterAccessComponent, { service: record });
     }
   });
-  const ServiceOutClusterAccessField = (clusterVip) => ({
+  const ServiceOutClusterAccessField = () => ({
     key: "innerClusterAccess",
     title: /* @__PURE__ */ jsxRuntimeExports.jsx(ServiceOutClusterAccessTitle, {}),
     path: [],
     renderContent: (_, record) => {
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(ServiceOutClusterAccessComponent, { service: record, clusterVip, breakLine: false });
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(ServiceOutClusterAccessComponent, { service: record, breakLine: false });
     }
   });
   const PodSelectorField = () => ({
@@ -23498,6 +23522,9 @@ var __publicField = (obj, key, value) => {
       errorNotification: false,
       transformInitValues,
       transformApplyValues,
+      mutationMeta: {
+        updateType: "put"
+      },
       ...useFormProps
     });
     const kit = eagle.useUIKit();
@@ -23604,9 +23631,9 @@ var __publicField = (obj, key, value) => {
         onErrorsChange(errors) {
           setIsError(!!errors.length);
         },
-        onFinish: eagle.usePopModal
+        onFinish: popModal
       };
-    }, [props.formProps, (_a = config.formConfig) == null ? void 0 : _a.transformInitValues, (_b = config.formConfig) == null ? void 0 : _b.transformApplyValues, config == null ? void 0 : config.initValue, id, action]);
+    }, [props.formProps, (_a = config.formConfig) == null ? void 0 : _a.transformInitValues, (_b = config.formConfig) == null ? void 0 : _b.transformApplyValues, config == null ? void 0 : config.initValue, id, action, popModal]);
     const refineFormResult = useRefineForm({
       config,
       id,
@@ -24010,41 +24037,45 @@ var __publicField = (obj, key, value) => {
     });
     return /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { children: tags });
   };
-  const IngressRulesComponent = ({ ingress }) => {
+  const index_18ct5u4 = "";
+  const LinkStyle = "l25ca2k";
+  const IngressRulesComponent = ({
+    ingress
+  }) => {
     const kit = eagle.useUIKit();
     const result = ingress.flattenedRules.map((r2) => {
       const divider = " > ";
-      let pre = /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: r2.fullPath });
+      let pre = /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+        children: r2.fullPath
+      });
       if (r2.fullPath.includes("http") && !r2.fullPath.includes("*")) {
-        pre = /* @__PURE__ */ jsxRuntimeExports.jsx(kit.Link, { href: r2.fullPath, target: "_blank", children: r2.fullPath });
+        pre = /* @__PURE__ */ jsxRuntimeExports.jsx(kit.Link, {
+          className: LinkStyle,
+          href: r2.fullPath,
+          target: "_blank",
+          children: r2.fullPath
+        });
       }
-      return /* @__PURE__ */ jsxRuntimeExports.jsx(
-        kit.overflowTooltip,
-        {
-          content: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-            pre,
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: divider }),
-            r2.serviceName ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsx(
-                ResourceLink,
-                {
-                  name: "services",
-                  namespace: ingress.metadata.namespace || "default",
-                  resourceId: r2.serviceName
-                }
-              ),
-              /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-                ":",
-                r2.servicePort
-              ] })
-            ] }) : r2.resourceName
-          ] }),
-          tooltip: `${r2.fullPath}${divider}:${r2.servicePort}`
-        },
-        r2.fullPath
-      );
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(kit.overflowTooltip, {
+        content: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
+          children: [pre, /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+            children: divider
+          }), r2.serviceName ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
+            children: [/* @__PURE__ */ jsxRuntimeExports.jsx(ResourceLink, {
+              name: "services",
+              namespace: ingress.metadata.namespace || "default",
+              resourceId: r2.serviceName
+            }), /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
+              children: [":", r2.servicePort]
+            })]
+          }) : r2.resourceName]
+        }),
+        tooltip: `${r2.fullPath}${divider}:${r2.servicePort}`
+      }, r2.fullPath);
+    });
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {
+      children: result
     });
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: result });
   };
   const columns_qgyagz = "";
   const DashedTitleStyle = "dh5j833";
@@ -24175,8 +24206,7 @@ var __publicField = (obj, key, value) => {
       width: 120,
       dataIndex,
       align: "right",
-      title: i18n2.t("dovetail.restarts"),
-      sortable: false
+      title: i18n2.t("dovetail.restarts")
     };
   };
   const ReplicasColumnRenderer = (i18n2) => {
@@ -24186,7 +24216,7 @@ var __publicField = (obj, key, value) => {
       display: true,
       dataIndex,
       title: /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.Tooltip, {
-        title: i18n2.t("dovetail.completion_num_tooltip"),
+        title: i18n2.t("dovetail.ready_num_tooltip"),
         children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
           className: DashedTitleStyle,
           children: i18n2.t("dovetail.pod_num")
@@ -24207,6 +24237,7 @@ var __publicField = (obj, key, value) => {
     isRelativeTime = true
   } = {}) => {
     const dataIndex = ["metadata", "creationTimestamp"];
+    const kit = eagle.useUIKit();
     return {
       key: "creationTimestamp",
       display: true,
@@ -24218,7 +24249,11 @@ var __publicField = (obj, key, value) => {
         return isRelativeTime ? /* @__PURE__ */ jsxRuntimeExports.jsx(Time, {
           date: new Date(value2)
         }) : /* @__PURE__ */ jsxRuntimeExports.jsx(ValueDisplay, {
-          value: dayjs(value2).format("YYYY-MM-DD hh:mm:ss")
+          value: /* @__PURE__ */ jsxRuntimeExports.jsx(kit.time, {
+            date: value2,
+            timeTemplate: "HH:mm:ss",
+            dateTemplate: "YYYY-MM-DD"
+          })
         });
       },
       ...config
@@ -24379,7 +24414,7 @@ var __publicField = (obj, key, value) => {
       })
     });
   }
-  const ServiceOutClusterAccessColumnRenderer = (clusterVip) => {
+  const ServiceOutClusterAccessColumnRenderer = () => {
     return {
       key: "outClusterAccess",
       title: /* @__PURE__ */ jsxRuntimeExports.jsx(ServiceOutClusterAccessTitle, {}),
@@ -24388,8 +24423,7 @@ var __publicField = (obj, key, value) => {
       width: 160,
       render(_, record) {
         return /* @__PURE__ */ jsxRuntimeExports.jsx(ServiceOutClusterAccessComponent, {
-          service: record,
-          clusterVip
+          service: record
         });
       }
     };
@@ -24552,15 +24586,15 @@ var __publicField = (obj, key, value) => {
               whiteSpace: "pre"
             },
             children: [record.displayType === "NodePort" ? /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.Link, {
-              href: `//${v.servicePort}`,
+              href: `//${v.link}`,
               target: "_blank",
               children: v.servicePort
-            }) : v.servicePort, " > ", v.targetPort, "/", v.protocol]
+            }) : v.servicePort, " ", "> ", v.targetPort, "/", v.protocol]
           }),
           tooltip: `${v.servicePort} > ${v.targetPort}/${v.protocol}`
         }, v.servicePort));
-        return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {
-          children: content
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(ValueDisplay, {
+          value: content
         });
       }
     };

package/dist/style.css

@@ -10,7 +10,6 @@
 .ax1qopv{position:absolute;top:0;left:0;bottom:0;width:1px;background:$blue-60;-webkit-transform:translateX(-9999px);-ms-transform:translateX(-9999px);transform:translateX(-9999px);z-index:999;}.ax1qopv::before{content:'';position:absolute;height:34px;width:3px;top:0;left:-1px;background:$blue-60;}
 .t1upn1sz{width:100%;border-top:1px solid rgba(211,218,235,0.6);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.t1upn1sz .ant-table-pagination{display:none;}.t1upn1sz .table-container{min-height:0;}
 .b1vtjd4k.ant-btn.ant-btn-link{display:block;}
-.luro4rx.ant-btn.ant-btn-link{line-height:18px;height:18px;}
 .t13a6vox{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;max-width:100%;gap:8px 8px;}
 .t12ikbmp.ant-tag{overflow:hidden;text-overflow:ellipsis;color:#1D326C;}.t12ikbmp.ant-tag.outside-tag{border:1px solid #A3B4CC;background-color:#E4E9F2;}.t12ikbmp.ant-tag .inside-tag{background-color:#CCD4E3;}
 .s8qkbck.ant-tag{padding:3px 16px;height:24px;}.s8qkbck.no-background{background-color:transparent !important;padding:0;}
@@ -21,6 +20,7 @@
 .d1wqyhgc{color:rgba(44,56,82,0.75);}
 .w16agr8o.ant-space{width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
 .i1u1f5zp{white-space:pre-line;}
+.l1vnw9x0{padding:0 !important;}
 .c8jy7dc{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:8px 10px;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;gap:8px;-webkit-align-self:stretch;-ms-flex-item-align:stretch;align-self:stretch;border-radius:4px;background:rgba(237,241,250,0.6);}.c8jy7dc:not(:last-of-type){margin-bottom:8px;}
 .k2sddxl{color:rgba(44,56,82,0.75);width:calc(30% - 4px);margin-right:8px;word-break:break-all;}
 .v16vicsr{word-break:break-all;white-space:pre-wrap;width:calc(70% - 4px);}
@@ -1536,6 +1536,7 @@
 .c1i80kj{height:100%;}
 .s18sezq1.ant-layout-sider{background:#edf0f7;}
 .cyc9hl2.ant-layout-content{background:#fff;}
+.l25ca2k{padding:0 !important;}
 .dh5j833{border-bottom:1px dashed rgba(107,128,167,0.6);padding-bottom:1px;}
 .s1fcgan.ant-tooltip .ant-tooltip-inner{width:256px;}
 body,

package/lib/src/App.js

@@ -0,0 +1,91 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createBrowserHistory } from 'history';
+import { GlobalStore } from 'k8s-api-provider';
+import { useMemo } from 'react';
+import { I18nextProvider } from 'react-i18next';
+import { Route, Router } from 'react-router-dom';
+import { Layout } from './components';
+import { CRONJOB_INIT_VALUE, DAEMONSET_INIT_VALUE, STATEFULSET_INIT_VALUE, POD_INIT_VALUE, } from './constants/k8s';
+import { Dovetail } from './Dovetail';
+import i18n from './i18n';
+import { ConfigMapConfig } from './pages/configmaps';
+import { CronJobForm, CronJobList, CronJobShow } from './pages/cronjobs';
+import { DaemonSetForm, DaemonSetList, DaemonSetShow } from './pages/daemonsets';
+import { DeploymentForm, DeploymentList, DeploymentShow } from './pages/deployments';
+import { IngressConfig } from './pages/ingresses';
+import { JobConfig } from './pages/jobs';
+import { NetworkPolicyConfig } from './pages/networkPolicies';
+import { PodShow, PodList, PodForm } from './pages/pods';
+import { SecretsConfig } from './pages/secrets';
+import { ServicesConfig } from './pages/services';
+import { StatefulSetShow, StatefulSetList, StatefulSetForm } from './pages/statefulsets';
+import { ProviderPlugins } from './plugins';
+import { RESOURCE_GROUP, FormType } from './types';
+function App() {
+    const histroy = createBrowserHistory();
+    const resourcesConfig = useMemo(() => {
+        return [
+            {
+                name: 'cronjobs',
+                basePath: '/apis/batch/v1beta1',
+                kind: 'CronJob',
+                parent: RESOURCE_GROUP.WORKLOAD,
+                label: 'CronJobs',
+                initValue: CRONJOB_INIT_VALUE,
+                isCustom: true,
+            },
+            {
+                name: 'daemonsets',
+                basePath: '/apis/apps/v1',
+                kind: 'DaemonSet',
+                parent: RESOURCE_GROUP.WORKLOAD,
+                label: 'DaemonSets',
+                initValue: DAEMONSET_INIT_VALUE,
+                isCustom: true,
+            },
+            {
+                name: 'deployments',
+                basePath: '/apis/apps/v1',
+                kind: 'Deployment',
+                parent: RESOURCE_GROUP.WORKLOAD,
+                label: 'Deployments',
+                formType: FormType.MODAL,
+                FormModal: DeploymentForm,
+                isCustom: true,
+            },
+            {
+                name: 'statefulsets',
+                basePath: '/apis/apps/v1',
+                kind: 'StatefulSet',
+                parent: RESOURCE_GROUP.WORKLOAD,
+                label: 'StatefulSets',
+                initValue: STATEFULSET_INIT_VALUE,
+                isCustom: true,
+            },
+            {
+                name: 'pods',
+                basePath: '/api/v1',
+                kind: 'Pod',
+                parent: RESOURCE_GROUP.WORKLOAD,
+                label: 'Pods',
+                initValue: POD_INIT_VALUE,
+                isCustom: true,
+            },
+            JobConfig,
+            IngressConfig,
+            NetworkPolicyConfig,
+            ConfigMapConfig,
+            SecretsConfig,
+            ServicesConfig,
+        ];
+    }, []);
+    const globalStore = useMemo(() => {
+        return new GlobalStore({
+            apiUrl: '/api/k8s',
+            watchWsApiUrl: 'api/sks-ws/k8s',
+            prefix: 'default',
+        }, ProviderPlugins);
+    }, []);
+    return (_jsx(I18nextProvider, { i18n: i18n, children: _jsx(Dovetail, { resourcesConfig: resourcesConfig, Layout: Layout, history: histroy, globalStore: globalStore, children: _jsxs(Router, { history: histroy, children: [_jsx(Route, { path: "/cronjobs", exact: true, children: _jsx(CronJobList, {}) }), _jsx(Route, { path: "/cronjobs/show", children: _jsx(CronJobShow, {}) }), _jsx(Route, { path: "/cronjobs/create", children: _jsx(CronJobForm, {}) }), _jsx(Route, { path: "/cronjobs/edit", children: _jsx(CronJobForm, {}) }), _jsx(Route, { path: "/daemonsets", exact: true, children: _jsx(DaemonSetList, {}) }), _jsx(Route, { path: "/daemonsets/show", children: _jsx(DaemonSetShow, {}) }), _jsx(Route, { path: "/daemonsets/create", children: _jsx(DaemonSetForm, {}) }), _jsx(Route, { path: "/daemonsets/edit", children: _jsx(DaemonSetForm, {}) }), _jsx(Route, { path: "/deployments", exact: true, children: _jsx(DeploymentList, {}) }), _jsx(Route, { path: "/deployments/show", children: _jsx(DeploymentShow, {}) }), _jsx(Route, { path: "/statefulsets", exact: true, children: _jsx(StatefulSetList, {}) }), _jsx(Route, { path: "/statefulsets/show", children: _jsx(StatefulSetShow, {}) }), _jsx(Route, { path: "/statefulsets/create", children: _jsx(StatefulSetForm, {}) }), _jsx(Route, { path: "/statefulsets/edit", children: _jsx(StatefulSetForm, {}) }), _jsx(Route, { path: "/pods", exact: true, children: _jsx(PodList, {}) }), _jsx(Route, { path: "/pods/show", children: _jsx(PodShow, {}) }), _jsx(Route, { path: "/pods/create", children: _jsx(PodForm, {}) }), _jsx(Route, { path: "/pods/edit", children: _jsx(PodForm, {}) })] }) }) }));
+}
+export default App;

package/lib/src/Dovetail.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { KitStoreProvider, ModalStack } from '@cloudtower/eagle';
+import { Refine } from '@refinedev/core';
+import { dataProvider, liveProvider } from 'k8s-api-provider';
+import { keyBy } from 'lodash-es';
+import { useMemo } from 'react';
+import { Router } from 'react-router-dom';
+import ConfigsContext from 'src/contexts/configs';
+import { ResourceCRUD } from './components/ResourceCRUD';
+import GlobalStoreContext from './contexts/global-store';
+import { routerProvider } from './providers/router-provider';
+import './styles.css';
+export const Dovetail = props => {
+    const { resourcesConfig, urlPrefix = '', Layout, history, globalStore } = props;
+    const notCustomResources = useMemo(() => {
+        return resourcesConfig.filter(c => !c.isCustom);
+    }, [resourcesConfig]);
+    const content = useMemo(() => {
+        const _content = (_jsxs(_Fragment, { children: [_jsx(ModalStack, {}), _jsx(ResourceCRUD, { configs: notCustomResources, urlPrefix: urlPrefix }), props.children] }));
+        if (Layout) {
+            return _jsx(Layout, { children: _content });
+        }
+        return _content;
+    }, [Layout, notCustomResources, props.children, urlPrefix]);
+    return (_jsx(Router, { history: history, children: _jsx(KitStoreProvider, { children: _jsx(GlobalStoreContext.Provider, { value: { globalStore }, children: _jsx(ConfigsContext.Provider, { value: keyBy(resourcesConfig, 'name'), children: _jsx(Refine, { dataProvider: {
+                            default: dataProvider(globalStore),
+                        }, routerProvider: routerProvider, liveProvider: liveProvider(globalStore), options: {
+                            warnWhenUnsavedChanges: true,
+                            liveMode: 'auto',
+                        }, resources: resourcesConfig.map(c => {
+                            return {
+                                name: c.name,
+                                meta: {
+                                    resourceBasePath: c.basePath,
+                                    kind: c.kind,
+                                    parent: c.parent,
+                                    label: `${c.kind}s`,
+                                },
+                                list: `${urlPrefix}/${c.name}`,
+                                show: `${urlPrefix}/${c.name}/show`,
+                                create: `${urlPrefix}/${c.name}/create`,
+                                edit: `${urlPrefix}/${c.name}/edit`,
+                            };
+                        }), children: content }) }) }) }) }));
+};

package/lib/src/components/Breadcrumb/index.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { css, cx } from '@linaria/core';
+import { useBreadcrumb } from '@refinedev/core';
+import { Link } from 'react-router-dom';
+const BreadcrumbStyle = css `
+  display: flex;
+
+  .breadcrumb-item {
+    &:not(:last-of-type):after {
+      content: '>';
+      margin: 0 8px;
+    }
+  }
+`;
+export function Breadcrumb(props) {
+    const { breadcrumbs } = useBreadcrumb();
+    return (_jsx("ul", { className: cx(BreadcrumbStyle, props.className), children: breadcrumbs.map(breadcrumb => {
+            return (_jsx("li", { className: "breadcrumb-item", children: breadcrumb.href ? (_jsx(Link, { to: breadcrumb.href, children: breadcrumb.label })) : (_jsx("span", { children: breadcrumb.label })) }, `breadcrumb-${breadcrumb.label}`));
+        }) }));
+}