Skip to content

Commit 8e60970

Browse files
seungyeoneeeeseungyeoneeee
committed
fix: bugs about MFA updated at mypage and admin user page
Signed-off-by: 이승연 <[email protected]>
1 parent f68961a commit 8e60970

7 files changed

+65
-12
lines changed

‎apps/web/src/services/iam/composables/use-user-list-query.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,7 @@ export const useUserListQuery = (userIds?: Ref<string[]>) => {
5353
}, ['WORKSPACE']);
5454

5555
return {
56+
userListKey,
5657
userListData,
5758
workspaceUserListData,
5859
};

‎apps/web/src/services/my-page/components/UserAccountMultiFactorAuthItems.vue‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -37,11 +37,11 @@ const storeState = reactive({
3737
const state = reactive({
3838
isVerified: computed<boolean>(() => storeState.mfa?.state === 'ENABLED'),
3939
currentType: computed<string|undefined>(() => userStore.state.mfa?.mfa_type || undefined),
40-
isEnforced: computed<boolean>(() => !!userStore.state.mfa?.options?.enforce),
40+
isEnforced: computed<boolean>(() => userStore.state.mfa?.options?.enforce === true),
4141
});
4242
4343
const handleChange = async (isSelected: boolean, selected: MultiFactorAuthType) => {
44-
if (props.readonlyMode || state.isEnforced) return;
44+
if (props.readonlyMode) return;
4545
if (state.isEnforced && state.currentType !== selected) return;
4646
if (state.isVerified && state.currentType !== selected) {
4747
if (selected === MULTI_FACTOR_AUTH_TYPE.OTP) {
@@ -85,7 +85,7 @@ const handleClickReSyncButton = async (type: MultiFactorAuthType, event: MouseEv
8585
<p-select-card v-for="(item, idx) in MULTI_FACTOR_AUTH_ITEMS"
8686
:key="`${item.type} - ${idx}`"
8787
block
88-
:readonly="props.readonlyMode || state.isEnforced"
88+
:readonly="props.readonlyMode || (state.isEnforced && state.currentType !== item.type)"
8989
:selected="state.isVerified ? state.currentType : undefined"
9090
:disabled="state.isEnforced && state.currentType !== item.type"
9191
:value="item.type"
@@ -122,7 +122,7 @@ const handleClickReSyncButton = async (type: MultiFactorAuthType, event: MouseEv
122122
<p-button class="re-sync-button"
123123
style-type="tertiary"
124124
size="sm"
125-
:readonly="props.readonlyMode"
125+
:readonly="props.readonlyMode || (state.isEnforced && state.currentType !== item.type)"
126126
@click="handleClickReSyncButton(item.type, $event)"
127127
>
128128
{{ $t('MY_PAGE.MFA.RESYNC') }}

‎apps/web/src/services/my-page/components/mfa/UserAccountMultiFactorAuthEmailDisableModal.vue‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,12 @@
22
import { reactive, ref, computed } from 'vue';
33
import type { TranslateResult } from 'vue-i18n';
44
5+
import { useQueryClient } from '@tanstack/vue-query';
6+
57
import { PButtonModal } from '@cloudforet/mirinae';
68
79
import type { UserModel } from '@/api-clients/identity/user/schema/model';
10+
import { useServiceQueryKey } from '@/query/core/query-key/use-service-query-key';
811
import { i18n } from '@/translations';
912
1013
import { useUserStore } from '@/store/user/user-store';
@@ -17,7 +20,7 @@ import VerificationCodeForm from '@/common/components/mfa/components/Verificatio
1720
import { useUserProfileConfirmMfaMutation } from '@/common/components/mfa/composables/use-user-profile-confirm-mfa-mutation';
1821
import ErrorHandler from '@/common/composables/error/errorHandler';
1922
20-
23+
import { useUserListQuery } from '@/services/iam/composables/use-user-list-query';
2124
import { useMultiFactorAuthStore } from '@/services/my-page/stores/multi-factor-auth-store';
2225
2326
interface Props {
@@ -65,13 +68,22 @@ const closeModal = () => {
6568
multiFactorAuthStore.setEmailDisableModalVisible(false);
6669
}
6770
};
71+
72+
const queryClient = useQueryClient();
73+
const { userListKey: userListQueryKey } = useUserListQuery();
74+
const { key: userGetQueryKey } = useServiceQueryKey('identity', 'user', 'get', {
75+
contextKey: computed(() => userStore.state.userId),
76+
});
6877
/* API */
6978
const { mutateAsync: confirmMfa, isPending: isConfirmingMfa } = useUserProfileConfirmMfaMutation({
70-
onSuccess: (data: UserModel) => {
79+
onSuccess: async (data: UserModel) => {
7180
showSuccessMessage(i18n.t('COMMON.MFA_MODAL.ALT_S_ENABLED'), '');
7281
userStore.setMfa(data.mfa ?? {});
7382
closeModal();
7483
if (props.switch) multiFactorAuthStore.setOTPEnableModalVisible(true);
84+
85+
await queryClient.invalidateQueries({ queryKey: userListQueryKey.value });
86+
await queryClient.invalidateQueries({ queryKey: userGetQueryKey.value });
7587
},
7688
onError: (error: Error) => {
7789
ErrorHandler.handleError(error);

‎apps/web/src/services/my-page/components/mfa/UserAccountMultiFactorAuthEmailEnableModal.vue‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,14 @@ import {
44
} from 'vue';
55
import type { TranslateResult } from 'vue-i18n';
66
7+
import { useQueryClient } from '@tanstack/vue-query';
8+
79
import {
810
PButtonModal,
911
} from '@cloudforet/mirinae';
1012
1113
import type { UserModel } from '@/api-clients/identity/user/schema/model';
14+
import { useServiceQueryKey } from '@/query/core/query-key/use-service-query-key';
1215
import { i18n } from '@/translations';
1316
1417
import { useUserStore } from '@/store/user/user-store';
@@ -21,7 +24,7 @@ import VerificationCodeForm from '@/common/components/mfa/components/Verificatio
2124
import { useUserProfileConfirmMfaMutation } from '@/common/components/mfa/composables/use-user-profile-confirm-mfa-mutation';
2225
import ErrorHandler from '@/common/composables/error/errorHandler';
2326
24-
27+
import { useUserListQuery } from '@/services/iam/composables/use-user-list-query';
2528
import { useMultiFactorAuthStore } from '@/services/my-page/stores/multi-factor-auth-store';
2629
2730
interface Props {
@@ -69,15 +72,24 @@ const closeModal = () => {
6972
}
7073
};
7174
75+
const queryClient = useQueryClient();
76+
const { userListKey: userListQueryKey } = useUserListQuery();
77+
const { key: userGetQueryKey } = useServiceQueryKey('identity', 'user', 'get', {
78+
contextKey: computed(() => userStore.state.userId),
79+
});
80+
7281
/* API */
7382
const { mutateAsync: confirmMfa, isPending: isConfirmingMfa } = useUserProfileConfirmMfaMutation({
74-
onSuccess: (data: UserModel) => {
83+
onSuccess: async (data: UserModel) => {
7584
showSuccessMessage(i18n.t('COMMON.MFA_MODAL.ALT_S_ENABLED'), '');
7685
userStore.setMfa(data.mfa ?? {});
7786
closeModal();
7887
isSentCode.value = false;
7988
validationState.verificationCode = '';
8089
if (props.reSync) multiFactorAuthStore.setEmailEnableModalVisible(true);
90+
91+
await queryClient.invalidateQueries({ queryKey: userListQueryKey.value });
92+
await queryClient.invalidateQueries({ queryKey: userGetQueryKey.value });
8193
},
8294
onError: (error: Error) => {
8395
ErrorHandler.handleError(error);

‎apps/web/src/services/my-page/components/mfa/UserAccountMultiFactorAuthOTPDisableModal.vue‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,14 @@
22
import { computed, reactive } from 'vue';
33
import type { TranslateResult } from 'vue-i18n';
44
5+
import { useQueryClient } from '@tanstack/vue-query';
6+
57
import {
68
PButtonModal,
79
} from '@cloudforet/mirinae';
810
911
import type { UserModel } from '@/api-clients/identity/user/schema/model';
12+
import { useServiceQueryKey } from '@/query/core/query-key/use-service-query-key';
1013
import { i18n } from '@/translations';
1114
1215
import { useUserStore } from '@/store/user/user-store';
@@ -17,6 +20,7 @@ import VerificationCodeForm from '@/common/components/mfa/components/Verificatio
1720
import { useUserProfileConfirmMfaMutation } from '@/common/components/mfa/composables/use-user-profile-confirm-mfa-mutation';
1821
import ErrorHandler from '@/common/composables/error/errorHandler';
1922
23+
import { useUserListQuery } from '@/services/iam/composables/use-user-list-query';
2024
import { useMultiFactorAuthStore } from '@/services/my-page/stores/multi-factor-auth-store';
2125
2226
@@ -64,13 +68,22 @@ const closeModal = () => {
6468
}
6569
};
6670
71+
const queryClient = useQueryClient();
72+
const { userListKey: userListQueryKey } = useUserListQuery();
73+
const { key: userGetQueryKey } = useServiceQueryKey('identity', 'user', 'get', {
74+
contextKey: computed(() => userStore.state.userId),
75+
});
76+
6777
/* API */
6878
const { mutateAsync: confirmMfa, isPending: isConfirmingMfa } = useUserProfileConfirmMfaMutation({
69-
onSuccess: (data: UserModel) => {
79+
onSuccess: async (data: UserModel) => {
7080
showSuccessMessage(i18n.t('COMMON.MFA_MODAL.ALT_S_DISABLED'), '');
7181
userStore.setMfa(data.mfa ?? {});
7282
closeModal();
7383
if (props.switch) multiFactorAuthStore.setEmailEnableModalVisible(true);
84+
85+
await queryClient.invalidateQueries({ queryKey: userListQueryKey.value });
86+
await queryClient.invalidateQueries({ queryKey: userGetQueryKey.value });
7487
},
7588
onError: (error: Error) => {
7689
ErrorHandler.handleError(error);

‎apps/web/src/services/my-page/components/mfa/UserAccountMultiFactorAuthOTPEnableModal.vue‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,14 @@
22
import { reactive, computed } from 'vue';
33
import type { TranslateResult } from 'vue-i18n';
44
5+
import { useQueryClient } from '@tanstack/vue-query';
6+
57
import {
68
PButtonModal,
79
} from '@cloudforet/mirinae';
810
911
import type { UserModel } from '@/api-clients/identity/user/schema/model';
12+
import { useServiceQueryKey } from '@/query/core/query-key/use-service-query-key';
1013
import { i18n } from '@/translations';
1114
1215
import { useUserStore } from '@/store/user/user-store';
@@ -18,6 +21,7 @@ import VerificationCodeForm from '@/common/components/mfa/components/Verificatio
1821
import { useUserProfileConfirmMfaMutation } from '@/common/components/mfa/composables/use-user-profile-confirm-mfa-mutation';
1922
import ErrorHandler from '@/common/composables/error/errorHandler';
2023
24+
import { useUserListQuery } from '@/services/iam/composables/use-user-list-query';
2125
import { useMultiFactorAuthStore } from '@/services/my-page/stores/multi-factor-auth-store';
2226
2327
@@ -65,14 +69,23 @@ const closeModal = () => {
6569
}
6670
};
6771
72+
const queryClient = useQueryClient();
73+
const { userListKey: userListQueryKey } = useUserListQuery();
74+
const { key: userGetQueryKey } = useServiceQueryKey('identity', 'user', 'get', {
75+
contextKey: computed(() => userStore.state.userId),
76+
});
77+
6878
/* API */
6979
const { mutateAsync: confirmMfa, isPending: isConfirmingMfa } = useUserProfileConfirmMfaMutation({
70-
onSuccess: (data: UserModel) => {
80+
onSuccess: async (data: UserModel) => {
7181
showSuccessMessage(i18n.t('COMMON.MFA_MODAL.ALT_S_ENABLED'), '');
7282
userStore.setMfa(data.mfa ?? {});
7383
closeModal();
7484
validationState.verificationCode = '';
7585
if (props.reSync) multiFactorAuthStore.setOTPEnableModalVisible(true);
86+
87+
await queryClient.invalidateQueries({ queryKey: userListQueryKey.value });
88+
await queryClient.invalidateQueries({ queryKey: userGetQueryKey.value });
7689
},
7790
onError: (error: Error) => {
7891
ErrorHandler.handleError(error);

‎apps/web/src/services/my-page/pages/UserAccountPage.vue‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,7 @@ const handleConfirmPasswordCheckModal = async () => {
9090
user_id: passwordFormState.userId,
9191
password: passwordFormState.password,
9292
},
93-
}, { skipAuthRefresh: true });
93+
}, { skipAuthRefresh: true } as any);
9494
if (result.status === 'succeed') {
9595
if (!!result.response.access_token && !!result.response.refresh_token) {
9696
passwordFormState.certifiedPassword = passwordFormState.password;
@@ -104,7 +104,9 @@ const handleConfirmPasswordCheckModal = async () => {
104104
}
105105
}
106106
} catch (e: any) {
107-
if (e.message.startsWith(' MFA is required.')) { // MFA activated CASE
107+
const message = e.message || '';
108+
if (message.startsWith(' MFA is required.') || message.includes(' MFA is not activated.')) {
109+
// MFA activated CASE OR MFA not activated CASE - both should proceed successfully
108110
passwordFormState.certifiedPassword = passwordFormState.password;
109111
passwordFormState.isTokenChecked = true;
110112
passwordFormState.invalidText = '';

0 commit comments

Comments
 (0)