@dovetail-v2/refine 0.0.45-bowen.0 → 0.0.45-bowen.1

package/dist/{MonacoYamlDiffEditor-5ce46809.js → MonacoYamlDiffEditor-481880fe.js}

@@ -1,4 +1,4 @@
-import { j as jsxRuntimeExports } from "./index-c644b7e1.js";
+import { j as jsxRuntimeExports } from "./index-ad1e8a1c.js";
 import * as monaco from "monaco-editor";
 import { useRef, useEffect } from "react";
 import "i18next";

package/dist/{index-c644b7e1.js → index-ad1e8a1c.js}

@@ -10,7 +10,7 @@ import React__default, { createElement, isValidElement, cloneElement, Children,
 import { ResourceContext, matchResourceFromRoute, useResource, useDelete, useNavigation, useBreadcrumb, useList, useParsed, useGo, useDeleteMany, CanAccess, useCan, useShow, useUpdate, useDataProvider, useRefineContext, useTranslate, useWarnAboutChange, useForm as useForm$2, flattenObjectKeys, pickNotDeprecated, useMenu, useTable, Refine } from "@refinedev/core";
 import { parse, stringify } from "qs";
 import { useLocation, useHistory, useParams, matchPath, Link, Route, NavLink, Router } from "react-router-dom";
-import { Typo, Tag, useUIKit, kitContext, Link as Link$1, OverflowTooltip, Tooltip, StatusCapsule, pushModal, Button, Icon as Icon$1, popModal, Loading, Divider, Fields, Form, Space, Modal, useMessage, ModalStack, KitStoreProvider } from "@cloudtower/eagle";
+import { Typo, Tag, useUIKit, kitContext, Link as Link$1, OverflowTooltip, Tooltip, StatusCapsule, pushModal, Button, Icon as Icon$1, popModal, Loading, Divider, Fields, Space, Form, Modal, useMessage, ModalStack, KitStoreProvider } from "@cloudtower/eagle";
 import { PlusAddCreateNew16BoldOntintIcon, EditPen16PrimaryIcon, Download16GradientBlueIcon, TrashBinDelete16Icon, MoreEllipsis324BoldSecondaryIcon, MoreEllipsis324BoldBlueIcon, MoreEllipsis316BoldBlueIcon, ArrowChevronLeft16BoldTertiaryIcon, ArrowChevronLeftSmall16BoldBlueIcon, EditPen16GradientBlueIcon, ViewEye16GradientGrayIcon, EntityFilterIgnoreGradient16GrayIcon, RecoverContinue16GradientBlueIcon, SuspendedPause16GradientBlueIcon, Retry16GradientBlueIcon, HierarchyTriangleRight16GrayIcon, HierarchyTriangleRight16BlueIcon, ClipboardCopy16GradientGrayIcon, ClipboardCopy16GradientBlueIcon, Retry16GradientGrayIcon, EditPen16GradientGrayIcon, Showdiff16GradientGrayIcon, Showdiff16GradientBlueIcon, XmarkFailedSeriousWarningFill16RedIcon, ExclamationErrorCircleFill16RedIcon, Pause16GradientBlueIcon } from "@cloudtower/icons-react";
 import { get as get$3, first, debounce, last, isObject as isObject$4, merge, keyBy } from "lodash-es";
 import yaml from "js-yaml";
@@ -21779,20 +21779,44 @@ function useForm$1(props = {}) {
   _formControl.current.formState = getProxyFormState(formState, control);
   return _formControl.current;
 }
-const RefineFormContent_1in3vad = "";
+const RefineFormContent_1tb00bi = "";
 const RefineFormContent = (props) => {
-  var _a, _b;
+  var _a, _b, _c, _d;
   const {
     config,
     formResult,
-    action,
+    resourceId,
     errorMsg
   } = props;
   const {
     control,
     getValues
   } = formResult;
-  const fields = (_b = (_a = config == null ? void 0 : config.formConfig) == null ? void 0 : _a.fields) == null ? void 0 : _b.map((c2) => {
+  const action = resourceId ? "edit" : "create";
+  const listQuery = useList({
+    resource: config == null ? void 0 : config.name,
+    meta: {
+      resourceBasePath: config == null ? void 0 : config.basePath,
+      kind: config == null ? void 0 : config.kind
+    },
+    pagination: {
+      mode: "off"
+    }
+  });
+  const showQuery = useShow({
+    resource: config == null ? void 0 : config.name,
+    meta: {
+      resourceBasePath: config == null ? void 0 : config.basePath,
+      kind: config == null ? void 0 : config.kind
+    },
+    id: resourceId
+  });
+  const formFieldsConfig = (_d = (_a = config == null ? void 0 : config.formConfig) == null ? void 0 : _a.fields) == null ? void 0 : _d.call(_a, {
+    record: (_b = showQuery.queryResult.data) == null ? void 0 : _b.data,
+    records: ((_c = listQuery.data) == null ? void 0 : _c.data) || [],
+    action
+  });
+  const fields = formFieldsConfig == null ? void 0 : formFieldsConfig.map((c2) => {
     return /* @__PURE__ */ jsxRuntimeExports.jsx(Controller, {
       control,
       name: c2.path.join("."),
@@ -21824,6 +21848,7 @@ const RefineFormContent = (props) => {
         var _a2;
         const formValue = getValues();
         let ele = /* @__PURE__ */ jsxRuntimeExports.jsx(Fields.String, {
+          placeholder: c2.placeholder,
           input: {
             value: value2,
             onChange,
@@ -21851,6 +21876,17 @@ const RefineFormContent = (props) => {
             children: value2
           });
         }
+        if (c2.helperText) {
+          ele = /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
+            size: 4,
+            direction: "vertical",
+            className: "c154n7ie",
+            children: [c2, /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+              className: cx_default(Typo.Footnote.f2_regular, "c1c9j4da"),
+              children: c2.helperText
+            })]
+          });
+        }
         if (c2 == null ? void 0 : c2.render) {
           ele = c2.render(value2, onChange, formValue, onBlur, action);
         }
@@ -21868,7 +21904,7 @@ const RefineFormContent = (props) => {
   });
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
     direction: "vertical",
-    className: "c154n7ie",
+    className: "cjxv8cf",
     children: [fields, /* @__PURE__ */ jsxRuntimeExports.jsx(FormErrorAlert, {
       errorMsgs: errorMsg ? [errorMsg] : [],
       style: {
@@ -22559,7 +22595,7 @@ const Separator = () => {
   });
 };
 const MonacoYamlEditor = React__default.lazy(() => Promise.resolve().then(() => MonacoYamlEditor$2));
-const MonacoYamlDiffEditor = React__default.lazy(() => import("./MonacoYamlDiffEditor-5ce46809.js"));
+const MonacoYamlDiffEditor = React__default.lazy(() => import("./MonacoYamlDiffEditor-481880fe.js"));
 const YamlEditorComponent = forwardRef(
   function YamlEditorComponent2(props, ref) {
     const {
@@ -23307,7 +23343,7 @@ function FormModal(props) {
       formResult: refineFormResult.formResult,
       config,
       errorMsg: refineFormResult.responseErrorMsg,
-      action: id ? "edit" : "create"
+      resourceId: id
     });
   })();
   const saveButtonProps = isYamlForm ? yamlSaveButtonProps : refineFormResult.formResult.saveButtonProps;
@@ -23390,7 +23426,7 @@ const RefineFormPage = (props) => {
     children: [/* @__PURE__ */ jsxRuntimeExports.jsx(RefineFormContent, {
       config,
       formResult,
-      action
+      resourceId: id
     }), ";", /* @__PURE__ */ jsxRuntimeExports.jsx(Button, {
       ...saveButtonProps,
       onClick,
@@ -23791,7 +23827,11 @@ const PlainTextNameColumnRenderer = (i18n2) => {
     title: i18n2.t("dovetail.name"),
     sortable: true,
     width: 200,
-    sorter: CommonSorter(dataIndex)
+    sorter: CommonSorter(dataIndex),
+    render: (v) => /* @__PURE__ */ jsxRuntimeExports.jsx(OverflowTooltip, {
+      content: v,
+      tooltip: v
+    })
   };
 };
 const NameSpaceColumnRenderer = (i18n2) => {
@@ -24231,7 +24271,7 @@ const PortMappingColumnRenderer = (i18n2) => {
             href: `//${v.servicePort}`,
             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));

package/dist/refine.js

@@ -1,4 +1,4 @@
-import { b6, bK, A, az, aB, aj, bm, aJ, G, bA, bo, at, w, C, g, bO, am, aN, Y, bQ, a0, a7, bZ, ab, bp, bn, c0, ap, aT, t, ah, aY, b$, bL, b0, D, aG, b2, b_, aH, ax, b9, bN, bP, by, ak, a1, p, o, bR, I, aQ, aw, q, bq, bT, ao, aP, ac, ad, T, ae, aA, ai, aZ, b1, U, M, bz, b5, N, H, b, ay, O, b8, aV, aU, bS, bk, e, bs, V, P, aL, s, Z, bj, aI, bX, bW, aE, aR, n, an, aK, v, aS, aF, c4, bM, b3, ba, bb, al, R, $, a5, a4, b4, a2, bY, a3, a8, f, bF, bI, bE, bD, bG, bH, bB, bt, bw, bx, bv, bu, br, bc, aq, aO, af, k, bf, i, aC, c3, m, bg, aD, l, av, aM, h, c2, as, au, aX, aW, ar, S, a$, a_, c1, bC, bl, bh, bi, X, bV, _, W, bU, a6, aa, a9, c, bJ, ag, bd, x, J, d, Q, L, K, r, a, z, y, B, E, b7, F, be, u } from "./index-c644b7e1.js";
+import { b6, bK, A, az, aB, aj, bm, aJ, G, bA, bo, at, w, C, g, bO, am, aN, Y, bQ, a0, a7, bZ, ab, bp, bn, c0, ap, aT, t, ah, aY, b$, bL, b0, D, aG, b2, b_, aH, ax, b9, bN, bP, by, ak, a1, p, o, bR, I, aQ, aw, q, bq, bT, ao, aP, ac, ad, T, ae, aA, ai, aZ, b1, U, M, bz, b5, N, H, b, ay, O, b8, aV, aU, bS, bk, e, bs, V, P, aL, s, Z, bj, aI, bX, bW, aE, aR, n, an, aK, v, aS, aF, c4, bM, b3, ba, bb, al, R, $, a5, a4, b4, a2, bY, a3, a8, f, bF, bI, bE, bD, bG, bH, bB, bt, bw, bx, bv, bu, br, bc, aq, aO, af, k, bf, i, aC, c3, m, bg, aD, l, av, aM, h, c2, as, au, aX, aW, ar, S, a$, a_, c1, bC, bl, bh, bi, X, bV, _, W, bU, a6, aa, a9, c, bJ, ag, bd, x, J, d, Q, L, K, r, a, z, y, B, E, b7, F, be, u } from "./index-ad1e8a1c.js";
 import "@cloudtower/eagle";
 import "@refinedev/core";
 import "@cloudtower/icons-react";

package/dist/refine.umd.cjs

@@ -21785,20 +21785,44 @@ var __publicField = (obj, key, value) => {
     _formControl.current.formState = getProxyFormState(formState, control);
     return _formControl.current;
   }
-  const RefineFormContent_1in3vad = "";
+  const RefineFormContent_1tb00bi = "";
   const RefineFormContent = (props) => {
-    var _a, _b;
+    var _a, _b, _c, _d;
     const {
       config,
       formResult,
-      action,
+      resourceId,
       errorMsg
     } = props;
     const {
       control,
       getValues
     } = formResult;
-    const fields = (_b = (_a = config == null ? void 0 : config.formConfig) == null ? void 0 : _a.fields) == null ? void 0 : _b.map((c2) => {
+    const action = resourceId ? "edit" : "create";
+    const listQuery = core.useList({
+      resource: config == null ? void 0 : config.name,
+      meta: {
+        resourceBasePath: config == null ? void 0 : config.basePath,
+        kind: config == null ? void 0 : config.kind
+      },
+      pagination: {
+        mode: "off"
+      }
+    });
+    const showQuery = core.useShow({
+      resource: config == null ? void 0 : config.name,
+      meta: {
+        resourceBasePath: config == null ? void 0 : config.basePath,
+        kind: config == null ? void 0 : config.kind
+      },
+      id: resourceId
+    });
+    const formFieldsConfig = (_d = (_a = config == null ? void 0 : config.formConfig) == null ? void 0 : _a.fields) == null ? void 0 : _d.call(_a, {
+      record: (_b = showQuery.queryResult.data) == null ? void 0 : _b.data,
+      records: ((_c = listQuery.data) == null ? void 0 : _c.data) || [],
+      action
+    });
+    const fields = formFieldsConfig == null ? void 0 : formFieldsConfig.map((c2) => {
       return /* @__PURE__ */ jsxRuntimeExports.jsx(Controller, {
         control,
         name: c2.path.join("."),
@@ -21830,6 +21854,7 @@ var __publicField = (obj, key, value) => {
           var _a2;
           const formValue = getValues();
           let ele = /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.Fields.String, {
+            placeholder: c2.placeholder,
             input: {
               value: value2,
               onChange,
@@ -21857,6 +21882,17 @@ var __publicField = (obj, key, value) => {
               children: value2
             });
           }
+          if (c2.helperText) {
+            ele = /* @__PURE__ */ jsxRuntimeExports.jsxs(eagle.Space, {
+              size: 4,
+              direction: "vertical",
+              className: "c154n7ie",
+              children: [c2, /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: cx_default(eagle.Typo.Footnote.f2_regular, "c1c9j4da"),
+                children: c2.helperText
+              })]
+            });
+          }
           if (c2 == null ? void 0 : c2.render) {
             ele = c2.render(value2, onChange, formValue, onBlur, action);
           }
@@ -21874,7 +21910,7 @@ var __publicField = (obj, key, value) => {
     });
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(eagle.Space, {
       direction: "vertical",
-      className: "c154n7ie",
+      className: "cjxv8cf",
       children: [fields, /* @__PURE__ */ jsxRuntimeExports.jsx(FormErrorAlert, {
         errorMsgs: errorMsg ? [errorMsg] : [],
         style: {
@@ -23313,7 +23349,7 @@ var __publicField = (obj, key, value) => {
         formResult: refineFormResult.formResult,
         config,
         errorMsg: refineFormResult.responseErrorMsg,
-        action: id ? "edit" : "create"
+        resourceId: id
       });
     })();
     const saveButtonProps = isYamlForm ? yamlSaveButtonProps : refineFormResult.formResult.saveButtonProps;
@@ -23396,7 +23432,7 @@ var __publicField = (obj, key, value) => {
       children: [/* @__PURE__ */ jsxRuntimeExports.jsx(RefineFormContent, {
         config,
         formResult,
-        action
+        resourceId: id
       }), ";", /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.Button, {
         ...saveButtonProps,
         onClick,
@@ -23797,7 +23833,11 @@ var __publicField = (obj, key, value) => {
       title: i18n2.t("dovetail.name"),
       sortable: true,
       width: 200,
-      sorter: CommonSorter(dataIndex)
+      sorter: CommonSorter(dataIndex),
+      render: (v) => /* @__PURE__ */ jsxRuntimeExports.jsx(eagle.OverflowTooltip, {
+        content: v,
+        tooltip: v
+      })
     };
   };
   const NameSpaceColumnRenderer = (i18n2) => {
@@ -24237,7 +24277,7 @@ var __publicField = (obj, key, value) => {
               href: `//${v.servicePort}`,
               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));

package/dist/style.css

@@ -1520,7 +1520,9 @@
 .l1ng0psc{padding:12px 24px;-webkit-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-height:0;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
 .tj6zpn4{-webkit-flex:1;-ms-flex:1;flex:1;min-height:0;}.tj6zpn4.table-wrapper{height:auto;-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;min-height:0;}
 .n1rqcyjn.ant-select{margin-bottom:12px;}
-.c154n7ie{-webkit-flex-basis:58%;-ms-flex-preferred-size:58%;flex-basis:58%;width:100%;}
+.c154n7ie{width:100%;}
+.c1c9j4da{color:rgba(44,56,82,0.6);}
+.cjxv8cf{-webkit-flex-basis:58%;-ms-flex-preferred-size:58%;flex-basis:58%;width:100%;}
 .s1bsn3us{width:1px;height:16px;border-radius:1px;background:rgba(172,186,211,0.6);}
 
 .e1guqlj2{-webkit-flex:1;-ms-flex:1;flex:1;height:100%;margin-bottom:16px;}

package/lib/src/components/Form/RefineFormContent.d.ts

@@ -6,7 +6,7 @@ type Props<Model extends ResourceModel> = {
     config?: ResourceConfig<Model>;
     formResult: UseFormReturnType;
     errorMsg?: string;
-    action: 'create' | 'edit';
+    resourceId?: string;
 };
 export declare const RefineFormContent: <Model extends ResourceModel<import("k8s-api-provider").Unstructured>>(props: Props<Model>) => JSX.Element;
 export {};

package/lib/src/components/Form/type.d.ts

@@ -7,6 +7,8 @@ export type RefineFormField = {
     path: string[];
     key: string;
     label: string;
+    placeholder?: string;
+    helperText?: string;
     type?: 'number';
     validators?: RefineFormValidator[];
     disabledWhenEdit?: boolean;

package/lib/src/types/resource.d.ts

@@ -41,7 +41,11 @@ export type ResourceConfig<Model extends ResourceModel = ResourceModel> = {
     }>;
     isCustom?: boolean;
     formConfig?: {
-        fields?: RefineFormField[];
+        fields?: (props: {
+            record?: Model;
+            records: Model[];
+            action: 'create' | 'edit';
+        }) => RefineFormField[];
         renderForm?: (props: YamlFormProps) => React.ReactNode;
         formType?: FormType;
         transformInitValues?: (values: Unstructured) => Unstructured;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dovetail-v2/refine",
-  "version": "0.0.45-bowen.0",
+  "version": "0.0.45-bowen.1",
   "type": "module",
   "files": [
     "dist",