From a92c3bd28d82eff7e9971fb2d8950add46fde2de Mon Sep 17 00:00:00 2001
From: kyli <ldh71777@gmail.com>
Date: Tue, 24 Dec 2024 11:41:12 +0800
Subject: [PATCH] feat(chrome-devtools): add customValueValidate

---
 .changeset/neat-jars-type.md                            | 5 +++++
 packages/chrome-devtools/src/App.tsx                    | 2 ++
 packages/chrome-devtools/src/component/Form/index.tsx   | 8 +++++++-
 packages/chrome-devtools/src/component/Layout/index.tsx | 2 ++
 packages/chrome-devtools/src/utils/types/common.ts      | 1 +
 5 files changed, 17 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/neat-jars-type.md

diff --git a/.changeset/neat-jars-type.md b/.changeset/neat-jars-type.md
new file mode 100644
index 00000000000..11130cc10d2
--- /dev/null
+++ b/.changeset/neat-jars-type.md
@@ -0,0 +1,5 @@
+---
+'@module-federation/devtools': patch
+---
+
+feat(chrome-devtools): add option customValueValidate for form component
diff --git a/packages/chrome-devtools/src/App.tsx b/packages/chrome-devtools/src/App.tsx
index 382e0a8dd47..43c78756e42 100644
--- a/packages/chrome-devtools/src/App.tsx
+++ b/packages/chrome-devtools/src/App.tsx
@@ -17,6 +17,7 @@ const App = (props: RootComponentProps) => {
     getVersion,
     handleSnapshot,
     handleProxyAddress,
+    customValueValidate,
   } = props;
   const [module, setModule] = useState(window.__FEDERATION__?.moduleInfo || {});
 
@@ -37,6 +38,7 @@ const App = (props: RootComponentProps) => {
               getVersion={getVersion}
               handleSnapshot={handleSnapshot}
               handleProxyAddress={handleProxyAddress}
+              customValueValidate={customValueValidate}
             />
           ) : (
             <Empty description={'No ModuleInfo Detected'} />
diff --git a/packages/chrome-devtools/src/component/Form/index.tsx b/packages/chrome-devtools/src/component/Form/index.tsx
index 9691b72b53d..0742d2cec03 100644
--- a/packages/chrome-devtools/src/component/Form/index.tsx
+++ b/packages/chrome-devtools/src/component/Form/index.tsx
@@ -58,6 +58,7 @@ const FormComponent = (props: FormProps & RootComponentProps) => {
     versionList,
     setVersionList,
     getVersion,
+    customValueValidate,
   } = props;
   const { moduleInfo } = window.__FEDERATION__;
   let { producer } = separateType(moduleInfo);
@@ -145,7 +146,12 @@ const FormComponent = (props: FormProps & RootComponentProps) => {
       };
     }
 
-    if (validateCustom(value) || validateSemver(value) || validatePort(value)) {
+    if (
+      validateCustom(value) ||
+      validateSemver(value) ||
+      validatePort(value) ||
+      customValueValidate?.(value)
+    ) {
       statusSet[index].valueStatus = true;
       flushSync(() => setFormStatus(statusSet));
       return callback();
diff --git a/packages/chrome-devtools/src/component/Layout/index.tsx b/packages/chrome-devtools/src/component/Layout/index.tsx
index ffcddbf4c1b..f1577fed729 100644
--- a/packages/chrome-devtools/src/component/Layout/index.tsx
+++ b/packages/chrome-devtools/src/component/Layout/index.tsx
@@ -50,6 +50,7 @@ const Layout = (
     setVersionList,
     getVersion,
     handleProxyAddress,
+    customValueValidate,
   } = props;
   const { producer } = separateType(moduleInfo);
   const [condition, setCondition] = useState(statusInfo.processing);
@@ -209,6 +210,7 @@ const Layout = (
           versionList={versionList}
           setVersionList={setVersionList}
           getVersion={getVersion}
+          customValueValidate={customValueValidate}
         />
       </Form>
 
diff --git a/packages/chrome-devtools/src/utils/types/common.ts b/packages/chrome-devtools/src/utils/types/common.ts
index 3cd356079e1..dc4fdf8f42c 100644
--- a/packages/chrome-devtools/src/utils/types/common.ts
+++ b/packages/chrome-devtools/src/utils/types/common.ts
@@ -13,4 +13,5 @@ export interface RootComponentProps {
   setVersionList?: React.Dispatch<React.SetStateAction<Array<Array<string>>>>;
   getVersion?: (moduleName: string) => Promise<Array<string>>;
   handleProxyAddress?: (address: string) => string;
+  customValueValidate?: (schema: string) => boolean;
 }