From a3fc92feb4f840a6ffc9a8bad9d406f6ee0f64ac Mon Sep 17 00:00:00 2001
From: astrid <astridli@easyop.cn>
Date: Tue, 19 Mar 2024 11:50:19 +0800
Subject: [PATCH] =?UTF-8?q?fix(form):=20labelBrick=20=E4=BD=8D=E7=BD=AE?=
 =?UTF-8?q?=E4=B8=8D=E5=AF=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

refs DASHBOARD-522
---
 bricks/form/src/form-item/index.spec.tsx      | 23 ++++++++++++++++++-
 bricks/form/src/form-item/index.tsx           |  8 ++++---
 bricks/form/src/upload/upload-image/index.tsx |  1 +
 3 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/bricks/form/src/form-item/index.spec.tsx b/bricks/form/src/form-item/index.spec.tsx
index 6bd5d9466..cb690d9e3 100644
--- a/bricks/form/src/form-item/index.spec.tsx
+++ b/bricks/form/src/form-item/index.spec.tsx
@@ -1,3 +1,4 @@
+import React from "react";
 import { FormItem } from "./";
 import { describe, test, expect } from "@jest/globals";
 import { act } from "react-dom/test-utils";
@@ -6,6 +7,11 @@ import { Form } from "../form/index.js";
 
 jest.mock("./FormItem.shadow.less", () => "");
 jest.mock("@next-core/theme", () => ({}));
+jest.mock("@next-core/react-runtime", () => ({
+  ReactUseMultipleBricks: () => {
+    return <div>mock element</div>;
+  },
+}));
 
 describe("eo-form-item", () => {
   test("basic usage", async () => {
@@ -30,6 +36,22 @@ describe("eo-form-item", () => {
     element.trigger = "change";
     element.label = "测试";
     element.required = true;
+    element.labelBrick = {
+      useBrick: {
+        brick: "span",
+        properties: {
+          textContent: "labelBrick",
+        },
+      },
+    };
+    element.helpBrick = {
+      useBrick: {
+        brick: "span",
+        properties: {
+          textContent: "helpBrick",
+        },
+      },
+    };
 
     expect(element.shadowRoot).toBeFalsy();
     act(() => {
@@ -71,7 +93,6 @@ describe("eo-form-item", () => {
     act(() => {
       document.body.removeChild(element);
     });
-
     expect(mockFormStore.removeField).toBeCalledTimes(1);
     expect(mockFormStore.unsubscribe).toBeCalledTimes(5);
     expect(element.shadowRoot?.childNodes.length).toBe(0);
diff --git a/bricks/form/src/form-item/index.tsx b/bricks/form/src/form-item/index.tsx
index 787ed4015..bf6510a35 100644
--- a/bricks/form/src/form-item/index.tsx
+++ b/bricks/form/src/form-item/index.tsx
@@ -317,10 +317,12 @@ export function FormItemComponent(props: FormItemProps) {
             <label>
               {required && <span className="required">*</span>}
               {label}
+              {labelBrick?.useBrick ? (
+                <ReactUseMultipleBricks
+                  {...labelBrick}
+                ></ReactUseMultipleBricks>
+              ) : null}
             </label>
-            {labelBrick?.useBrick ? (
-              <ReactUseMultipleBricks {...labelBrick}></ReactUseMultipleBricks>
-            ) : null}
           </div>
         </div>
       )}
diff --git a/bricks/form/src/upload/upload-image/index.tsx b/bricks/form/src/upload/upload-image/index.tsx
index b08e97a4c..9e0411b93 100644
--- a/bricks/form/src/upload/upload-image/index.tsx
+++ b/bricks/form/src/upload/upload-image/index.tsx
@@ -144,6 +144,7 @@ class UploadImage extends FormItemElementBase implements UploadImageProps {
         helpBrick={this.helpBrick}
         onChange={this.handleChange}
         trigger="handleChange"
+        labelBrick={this.labelBrick}
       />
     );
   }