From cc768e575fa2c26b10c876d3bd3f4dc75d604d97 Mon Sep 17 00:00:00 2001
From: daeyeon ko <rowan@megazone.com>
Date: Thu, 2 Jan 2025 17:12:13 +0900
Subject: [PATCH 1/3] fix: user add conditions

Signed-off-by: daeyeon ko <rowan@megazone.com>
---
 .../iam/components/UserManagementAddUser.vue  | 32 ++++++++++++-------
 1 file changed, 20 insertions(+), 12 deletions(-)

diff --git a/apps/web/src/services/iam/components/UserManagementAddUser.vue b/apps/web/src/services/iam/components/UserManagementAddUser.vue
index 5b8c183c8f..8f09472eb3 100644
--- a/apps/web/src/services/iam/components/UserManagementAddUser.vue
+++ b/apps/web/src/services/iam/components/UserManagementAddUser.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { onClickOutside } from '@vueuse/core';
 import {
+    computed,
     onMounted, reactive, ref, watch,
 } from 'vue';
 import type { TranslateResult } from 'vue-i18n';
@@ -42,6 +43,7 @@ const authTypeMenuItem = ref([
 const state = reactive({
     loading: false,
     menuVisible: false,
+    isNew: computed(() => userPageState.isAdminMode || userPageState.afterWorkspaceCreated),
     menuItems: [] as AddModalMenuItem[],
     selectedItems: [] as AddModalMenuItem[],
     independentUsersList: [] as SummaryWorkspaceUserModel[],
@@ -55,6 +57,7 @@ const validationState = reactive({
     userIdInvalidText: '' as TranslateResult,
 });
 
+
 /* Component */
 const hideMenu = () => {
     emit('change-input', { userList: state.selectedItems });
@@ -67,13 +70,15 @@ const handleClickTextInput = async () => {
 const handleChangeTextInput = (value: string) => {
     resetValidationState();
     formState.searchText = value;
-    if (!userPageState.isAdminMode || userPageState.afterWorkspaceCreated) {
+    if (!state.isNew) {
         fetchListUsers();
         state.menuVisible = true;
     }
 };
 const handleEnterTextInput = async () => {
     if (formState.searchText === '') return;
+    if (state.menuVisible) return;
+
     if (validateUserId()) {
         await getUserList();
     }
@@ -88,18 +93,17 @@ const handleSelectDropdownItem = (selected: AuthType|LocalType) => {
 };
 
 const getUserList = async () => {
-    let isNew = userPageState.isAdminMode || userPageState.afterWorkspaceCreated;
+    const isIndependentUser = state.independentUsersList.find((user) => user.user_id === formState.searchText);
+
     try {
         const trimmedText = formState.searchText.trim();
-        if (userPageState.isAdminMode || userPageState.afterWorkspaceCreated) {
+        if (state.isNew) {
             await fetchGetUsers(trimmedText);
         } else {
-            const isIndependentUser = state.independentUsersList.find((user) => user.user_id === formState.searchText);
-            isNew = !isIndependentUser;
             await fetchGetWorkspaceUsers(trimmedText);
         }
     } catch (e) {
-        addSelectedItem(isNew);
+        addSelectedItem(formState.searchText, !isIndependentUser);
         await hideMenu();
         formState.searchText = '';
         resetValidationState();
@@ -144,8 +148,11 @@ const clickOutside = () => {
     }
 };
 const handleSelectMenuItem = async (menuItem: AddModalMenuItem) => {
-    state.selectedItems.unshift(menuItem);
+    if (!state.selectedItems.some((item) => item.name === menuItem.name)) {
+        state.selectedItems.unshift(menuItem);
+    }
     await hideMenu();
+    resetValidationState();
 };
 const initAuthTypeList = async () => {
     if (domainStore.state.extendedAuthType !== undefined) {
@@ -155,17 +162,18 @@ const initAuthTypeList = async () => {
         ];
     }
 };
-const addSelectedItem = (isNew: boolean) => {
-    if (!formState.searchText) return;
-    const trimmedText = formState.searchText.trim();
+
+const addSelectedItem = (name : string, isNew: boolean) => {
+    if (!name) return;
+    const trimmedText = name.trim();
     if (state.selectedItems.some((item) => item.name === trimmedText && item.auth_type === formState.selectedMenuItem)) return;
 
     state.selectedItems.unshift({
-        user_id: trimmedText,
         label: trimmedText,
         name: trimmedText,
-        isNew,
+        user_id: trimmedText,
         auth_type: formState.selectedMenuItem,
+        isNew,
     });
 };
 

From c42475063f7a8ed1797179e77a5d10efce665976 Mon Sep 17 00:00:00 2001
From: daeyeon ko <rowan@megazone.com>
Date: Fri, 3 Jan 2025 14:21:47 +0900
Subject: [PATCH 2/3] fix: display user-add Modal after creating workspace

Signed-off-by: daeyeon ko <rowan@megazone.com>
---
 .../advanced/pages/admin/AdminWorkspacesPage.vue | 16 +++++++---------
 .../iam/components/UserManagementAddUser.vue     |  9 ++++-----
 2 files changed, 11 insertions(+), 14 deletions(-)

diff --git a/apps/web/src/services/advanced/pages/admin/AdminWorkspacesPage.vue b/apps/web/src/services/advanced/pages/admin/AdminWorkspacesPage.vue
index 0c58460bfa..f6eacccd90 100644
--- a/apps/web/src/services/advanced/pages/admin/AdminWorkspacesPage.vue
+++ b/apps/web/src/services/advanced/pages/admin/AdminWorkspacesPage.vue
@@ -4,8 +4,6 @@ import Vue, {
 } from 'vue';
 import { useRoute } from 'vue-router/composables';
 
-import { cloneDeep } from 'lodash';
-
 import { ApiQueryHelper } from '@cloudforet/core-lib/space-connector/helper';
 import {
     PButton, PHeading, PHorizontalLayout, PHeadingLayout,
@@ -76,15 +74,15 @@ const handleCreateWorkspace = () => {
 
 const handleConfirm = async ({ id, name }: {id: string, name: string}) => {
     userPageStore.$patch((_state) => {
-        _state.state.modal.type = USER_MODAL_TYPE.ADD;
-        _state.state.modal.title = i18n.t('IAM.USER.MAIN.MODAL.INVITE_TITLE', { workspace_name: name }) as string;
-        _state.state.modal.themeColor = 'primary';
         _state.state.afterWorkspaceCreated = true;
         _state.state.createdWorkspaceId = id;
-        _state.state.modal.visible = {
-            add: true,
-        };
-        _state.state.modal = cloneDeep(_state.state.modal);
+    });
+
+    userPageStore.updateModalSettings({
+        type: USER_MODAL_TYPE.ADD,
+        title: i18n.t('IAM.USER.MAIN.MODAL.INVITE_TITLE', { workspace_name: name }) as string,
+        themeColor: 'primary',
+        modalVisibleType: 'add',
     });
 };
 
diff --git a/apps/web/src/services/iam/components/UserManagementAddUser.vue b/apps/web/src/services/iam/components/UserManagementAddUser.vue
index 8f09472eb3..05b2ef1b81 100644
--- a/apps/web/src/services/iam/components/UserManagementAddUser.vue
+++ b/apps/web/src/services/iam/components/UserManagementAddUser.vue
@@ -60,7 +60,6 @@ const validationState = reactive({
 
 /* Component */
 const hideMenu = () => {
-    emit('change-input', { userList: state.selectedItems });
     state.menuVisible = false;
 };
 const handleClickTextInput = async () => {
@@ -77,7 +76,6 @@ const handleChangeTextInput = (value: string) => {
 };
 const handleEnterTextInput = async () => {
     if (formState.searchText === '') return;
-    if (state.menuVisible) return;
 
     if (validateUserId()) {
         await getUserList();
@@ -104,7 +102,7 @@ const getUserList = async () => {
         }
     } catch (e) {
         addSelectedItem(formState.searchText, !isIndependentUser);
-        await hideMenu();
+        hideMenu();
         formState.searchText = '';
         resetValidationState();
     }
@@ -151,7 +149,7 @@ const handleSelectMenuItem = async (menuItem: AddModalMenuItem) => {
     if (!state.selectedItems.some((item) => item.name === menuItem.name)) {
         state.selectedItems.unshift(menuItem);
     }
-    await hideMenu();
+    hideMenu();
     resetValidationState();
 };
 const initAuthTypeList = async () => {
@@ -175,6 +173,8 @@ const addSelectedItem = (name : string, isNew: boolean) => {
         auth_type: formState.selectedMenuItem,
         isNew,
     });
+
+    emit('change-input', { userList: state.selectedItems });
 };
 
 /* API */
@@ -268,7 +268,6 @@ onMounted(() => {
                                class="user-id-input"
                                :class="{'invalid': invalid}"
                                @click="handleClickTextInput"
-                               @blur="handleEnterTextInput"
                                @keyup.enter="handleEnterTextInput"
                                @input="handleChangeTextInput($event.target.value)"
                         >

From fc2b0eb71c2d1c18623f37da19de32818ac6f09c Mon Sep 17 00:00:00 2001
From: daeyeon ko <rowan@megazone.com>
Date: Fri, 3 Jan 2025 14:50:35 +0900
Subject: [PATCH 3/3] fix: conditional restoration for variable 'isNew'

Signed-off-by: daeyeon ko <rowan@megazone.com>
---
 .../iam/components/UserManagementAddUser.vue       | 14 ++++++--------
 1 file changed, 6 insertions(+), 8 deletions(-)

diff --git a/apps/web/src/services/iam/components/UserManagementAddUser.vue b/apps/web/src/services/iam/components/UserManagementAddUser.vue
index 05b2ef1b81..61a5495a56 100644
--- a/apps/web/src/services/iam/components/UserManagementAddUser.vue
+++ b/apps/web/src/services/iam/components/UserManagementAddUser.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import { onClickOutside } from '@vueuse/core';
 import {
-    computed,
     onMounted, reactive, ref, watch,
 } from 'vue';
 import type { TranslateResult } from 'vue-i18n';
@@ -43,7 +42,6 @@ const authTypeMenuItem = ref([
 const state = reactive({
     loading: false,
     menuVisible: false,
-    isNew: computed(() => userPageState.isAdminMode || userPageState.afterWorkspaceCreated),
     menuItems: [] as AddModalMenuItem[],
     selectedItems: [] as AddModalMenuItem[],
     independentUsersList: [] as SummaryWorkspaceUserModel[],
@@ -69,7 +67,7 @@ const handleClickTextInput = async () => {
 const handleChangeTextInput = (value: string) => {
     resetValidationState();
     formState.searchText = value;
-    if (!state.isNew) {
+    if (!userPageState.isAdminMode || userPageState.afterWorkspaceCreated) {
         fetchListUsers();
         state.menuVisible = true;
     }
@@ -89,19 +87,19 @@ const handleSelectDropdownItem = (selected: AuthType|LocalType) => {
     formState.selectedMenuItem = selected;
     resetValidationState();
 };
-
 const getUserList = async () => {
-    const isIndependentUser = state.independentUsersList.find((user) => user.user_id === formState.searchText);
-
+    let isNew = userPageState.isAdminMode || userPageState.afterWorkspaceCreated;
     try {
         const trimmedText = formState.searchText.trim();
-        if (state.isNew) {
+        if (userPageState.isAdminMode || userPageState.afterWorkspaceCreated) {
             await fetchGetUsers(trimmedText);
         } else {
+            const isIndependentUser = state.independentUsersList.find((user) => user.user_id === formState.searchText);
+            isNew = !isIndependentUser;
             await fetchGetWorkspaceUsers(trimmedText);
         }
     } catch (e) {
-        addSelectedItem(formState.searchText, !isIndependentUser);
+        addSelectedItem(formState.searchText, isNew);
         hideMenu();
         formState.searchText = '';
         resetValidationState();