devfront 관계 탭 사용자 검색·다중선택 UX 개선

devfront/tests/devfront-relationships.spec.ts

@@ -26,6 +26,14 @@ test.describe("DevFront relationships", () => {
     const state = {
       clients: [makeClient("client-rel", { name: "Relations app" })],
       consents: [] as Consent[],
+      users: [
+        {
+          id: "user-2",
+          name: "홍길동",
+          email: "hong@example.com",
+          loginId: "hong01",
+        },
+      ],
       relations: {
         "client-rel": [
           {
@@ -33,6 +41,8 @@ test.describe("DevFront relationships", () => {
             subject: "User:user-1",
             subjectType: "User",
             subjectId: "user-1",
+            userName: "기존 사용자",
+            userEmail: "existing@example.com",
           },
         ] satisfies ClientRelation[],
       },
@@ -48,14 +58,17 @@ test.describe("DevFront relationships", () => {
     await expect(
       page.getByRole("heading", { name: "부여된 관계" }),
     ).toBeVisible();
+    await expect(page.getByText("기존 사용자")).toBeVisible();
     await expect(page.getByText("User:user-1")).toBeVisible();
 
-    await page.getByLabel(/^관계$/).selectOption("secret_rotator");
-    await page.getByLabel(/^사용자 ID$/).fill("user-2");
+    await page.getByLabel(/^사용자$/).fill("홍길동");
+    await page.getByRole("button", { name: /홍길동/ }).click();
+    await page.getByLabel(/시크릿 재발급/).check();
+    await page.getByLabel(/동의 조회/).check();
     await page.getByRole("button", { name: /^추가$/ }).click();
 
     await expect(page.getByText("User:user-2")).toBeVisible();
-    await expect.poll(() => state.relations["client-rel"]?.length ?? 0).toBe(2);
+    await expect.poll(() => state.relations["client-rel"]?.length ?? 0).toBe(3);
 
     await page
       .locator("tr")
@@ -63,7 +76,13 @@ test.describe("DevFront relationships", () => {
       .getByRole("button", { name: /Delete|삭제/i })
       .click();
 
-    await expect(page.getByText("User:user-2")).toHaveCount(0);
-    await expect.poll(() => state.relations["client-rel"]?.length ?? 0).toBe(1);
+    await expect
+      .poll(
+        () =>
+          state.relations["client-rel"]?.filter(
+            (item) => item.subject === "User:user-2",
+          ).length ?? 0,
+      )
+      .toBe(1);
   });
 });