diff --git a/frontend/src/hooks/api/identities/queries.tsx b/frontend/src/hooks/api/identities/queries.tsx index 0e07136c8..c5c442407 100644 --- a/frontend/src/hooks/api/identities/queries.tsx +++ b/frontend/src/hooks/api/identities/queries.tsx @@ -1,4 +1,4 @@ -import { useQuery } from "@tanstack/react-query"; +import { useQuery, UseQueryOptions } from "@tanstack/react-query"; import { apiRequest } from "@app/config/request"; @@ -13,7 +13,8 @@ import { IdentityMembershipOrg, IdentityOidcAuth, IdentityTokenAuth, - IdentityUniversalAuth} from "./types"; + IdentityUniversalAuth +} from "./types"; export const identitiesKeys = { getIdentityById: (identityId: string) => [{ identityId }, "identity"] as const, @@ -64,9 +65,16 @@ export const useGetIdentityProjectMemberships = (identityId: string) => { }); }; -export const useGetIdentityUniversalAuth = (identityId: string) => { +export const useGetIdentityUniversalAuth = ( + identityId: string, + options?: UseQueryOptions< + IdentityUniversalAuth, + unknown, + IdentityUniversalAuth, + ReturnType + > +) => { return useQuery({ - enabled: Boolean(identityId), queryKey: identitiesKeys.getIdentityUniversalAuth(identityId), queryFn: async () => { const { @@ -76,8 +84,10 @@ export const useGetIdentityUniversalAuth = (identityId: string) => { ); return identityUniversalAuth; }, + cacheTime: 0, staleTime: 0, - cacheTime: 0 + ...options, + enabled: Boolean(identityId) && (options?.enabled ?? true) }); }; @@ -96,9 +106,16 @@ export const useGetIdentityUniversalAuthClientSecrets = (identityId: string) => }); }; -export const useGetIdentityGcpAuth = (identityId: string) => { +export const useGetIdentityGcpAuth = ( + identityId: string, + options?: UseQueryOptions< + IdentityGcpAuth, + unknown, + IdentityGcpAuth, + ReturnType + > +) => { return useQuery({ - enabled: Boolean(identityId), queryKey: identitiesKeys.getIdentityGcpAuth(identityId), queryFn: async () => { const { @@ -109,13 +126,22 @@ export const useGetIdentityGcpAuth = (identityId: string) => { return identityGcpAuth; }, staleTime: 0, - cacheTime: 0 + cacheTime: 0, + ...options, + enabled: Boolean(identityId) && (options?.enabled ?? true) }); }; -export const useGetIdentityAwsAuth = (identityId: string) => { +export const useGetIdentityAwsAuth = ( + identityId: string, + options?: UseQueryOptions< + IdentityAwsAuth, + unknown, + IdentityAwsAuth, + ReturnType + > +) => { return useQuery({ - enabled: Boolean(identityId), queryKey: identitiesKeys.getIdentityAwsAuth(identityId), queryFn: async () => { const { @@ -126,13 +152,22 @@ export const useGetIdentityAwsAuth = (identityId: string) => { return identityAwsAuth; }, staleTime: 0, - cacheTime: 0 + cacheTime: 0, + ...options, + enabled: Boolean(identityId) && (options?.enabled ?? true) }); }; -export const useGetIdentityAzureAuth = (identityId: string) => { +export const useGetIdentityAzureAuth = ( + identityId: string, + options?: UseQueryOptions< + IdentityAzureAuth, + unknown, + IdentityAzureAuth, + ReturnType + > +) => { return useQuery({ - enabled: Boolean(identityId), queryKey: identitiesKeys.getIdentityAzureAuth(identityId), queryFn: async () => { const { @@ -143,13 +178,22 @@ export const useGetIdentityAzureAuth = (identityId: string) => { return identityAzureAuth; }, staleTime: 0, - cacheTime: 0 + cacheTime: 0, + ...options, + enabled: Boolean(identityId) && (options?.enabled ?? true) }); }; -export const useGetIdentityKubernetesAuth = (identityId: string) => { +export const useGetIdentityKubernetesAuth = ( + identityId: string, + options?: UseQueryOptions< + IdentityKubernetesAuth, + unknown, + IdentityKubernetesAuth, + ReturnType + > +) => { return useQuery({ - enabled: Boolean(identityId), queryKey: identitiesKeys.getIdentityKubernetesAuth(identityId), queryFn: async () => { const { @@ -160,13 +204,22 @@ export const useGetIdentityKubernetesAuth = (identityId: string) => { return identityKubernetesAuth; }, staleTime: 0, - cacheTime: 0 + cacheTime: 0, + ...options, + enabled: Boolean(identityId) && (options?.enabled ?? true) }); }; -export const useGetIdentityTokenAuth = (identityId: string) => { +export const useGetIdentityTokenAuth = ( + identityId: string, + options?: UseQueryOptions< + IdentityTokenAuth, + unknown, + IdentityTokenAuth, + ReturnType + > +) => { return useQuery({ - enabled: Boolean(identityId), queryKey: identitiesKeys.getIdentityTokenAuth(identityId), queryFn: async () => { const { @@ -177,7 +230,9 @@ export const useGetIdentityTokenAuth = (identityId: string) => { return identityTokenAuth; }, staleTime: 0, - cacheTime: 0 + cacheTime: 0, + ...options, + enabled: Boolean(identityId) && (options?.enabled ?? true) }); }; @@ -196,9 +251,16 @@ export const useGetIdentityTokensTokenAuth = (identityId: string) => { }); }; -export const useGetIdentityOidcAuth = (identityId: string) => { +export const useGetIdentityOidcAuth = ( + identityId: string, + options?: UseQueryOptions< + IdentityOidcAuth, + unknown, + IdentityOidcAuth, + ReturnType + > +) => { return useQuery({ - enabled: Boolean(identityId), queryKey: identitiesKeys.getIdentityOidcAuth(identityId), queryFn: async () => { const { @@ -209,6 +271,8 @@ export const useGetIdentityOidcAuth = (identityId: string) => { return identityOidcAuth; }, staleTime: 0, - cacheTime: 0 + cacheTime: 0, + ...options, + enabled: Boolean(identityId) && (options?.enabled ?? true) }); }; diff --git a/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModal.tsx b/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModal.tsx index cf5774c0f..c924b4b66 100644 --- a/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModal.tsx +++ b/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModal.tsx @@ -21,7 +21,8 @@ import { useDeleteIdentityKubernetesAuth, useDeleteIdentityOidcAuth, useDeleteIdentityTokenAuth, - useDeleteIdentityUniversalAuth} from "@app/hooks/api"; + useDeleteIdentityUniversalAuth +} from "@app/hooks/api"; import { IdentityAuthMethod, identityAuthToNameMap } from "@app/hooks/api/identities"; import { UsePopUpState } from "@app/hooks/usePopUp"; @@ -54,7 +55,10 @@ const identityAuthMethods = [ const schema = yup .object({ - authMethod: yup.mixed().oneOf(Object.values(IdentityAuthMethod)).required("Auth method is required") + authMethod: yup + .mixed() + .oneOf(Object.values(IdentityAuthMethod)) + .required("Auth method is required") }) .required(); @@ -71,27 +75,33 @@ export const IdentityAuthMethodModal = ({ popUp, handlePopUpOpen, handlePopUpTog const { mutateAsync: revokeAwsAuth } = useDeleteIdentityAwsAuth(); const { mutateAsync: revokeAzureAuth } = useDeleteIdentityAzureAuth(); const { mutateAsync: revokeOidcAuth } = useDeleteIdentityOidcAuth(); - + const initialAuthMethod = popUp?.identityAuthMethod?.data?.authMethod; - - const { control, watch, setValue } = useForm({ - resolver: yupResolver(schema), - defaultValues: { - authMethod: initialAuthMethod - } - }); - - const identityAuthMethodData = { - identityId: popUp?.identityAuthMethod.data?.identityId, - name: popUp?.identityAuthMethod?.data?.name, - authMethod: watch("authMethod") - } as { - identityId: string; - name: string; - authMethod?: IdentityAuthMethod; + + const { control, watch, setValue, reset } = useForm({ + resolver: yupResolver(schema), + defaultValues: { + authMethod: initialAuthMethod + } + }); + + useEffect(() => { + // reset form on open + if (popUp.identityAuthMethod.isOpen) + reset({ authMethod: popUp?.identityAuthMethod?.data?.authMethod }); + }, [popUp.identityAuthMethod.isOpen]); + + const identityAuthMethodData = { + identityId: popUp?.identityAuthMethod.data?.identityId, + name: popUp?.identityAuthMethod?.data?.name, + authMethod: watch("authMethod") + } as { + identityId: string; + name: string; + authMethod?: IdentityAuthMethod; }; - useEffect(() => { + useEffect(() => { if (identityAuthMethodData?.authMethod) { setValue("authMethod", identityAuthMethodData.authMethod); return; @@ -103,7 +113,6 @@ export const IdentityAuthMethodModal = ({ popUp, handlePopUpOpen, handlePopUpTog const onRevokeAuthMethodSubmit = async (authMethod: IdentityAuthMethod) => { if (!orgId || !authMethod) return; try { - console.log("onRevokeAuthMethodSubmit identityId: ", identityAuthMethodData); switch (authMethod) { case IdentityAuthMethod.UNIVERSAL_AUTH: { await revokeUniversalAuth({ @@ -159,9 +168,7 @@ export const IdentityAuthMethodModal = ({ popUp, handlePopUpOpen, handlePopUpTog } createNotification({ - text: `Successfully removed ${ - identityAuthToNameMap[authMethod] - } on ${identityAuthMethodData.name}`, + text: `Successfully removed ${identityAuthToNameMap[authMethod]} on ${identityAuthMethodData.name}`, type: "success" }); @@ -170,9 +177,7 @@ export const IdentityAuthMethodModal = ({ popUp, handlePopUpOpen, handlePopUpTog } catch (err) { console.error(err); createNotification({ - text: `Failed to remove ${identityAuthToNameMap[authMethod]} on ${ - identityAuthMethodData.name - }`, + text: `Failed to remove ${identityAuthToNameMap[authMethod]} on ${identityAuthMethodData.name}`, type: "error" }); } @@ -272,7 +277,9 @@ export const IdentityAuthMethodModal = ({ popUp, handlePopUpOpen, handlePopUpTog {onChange(e)}} + onValueChange={(e) => { + onChange(e); + }} className="w-full" > {identityAuthMethods.map(({ label, value }) => ( @@ -310,6 +319,7 @@ export const IdentityAuthMethodModal = ({ popUp, handlePopUpOpen, handlePopUpTog } on ${identityAuthMethodData?.name ?? ""}?`} onChange={(isOpen) => handlePopUpToggle("revokeAuthMethod", isOpen)} deleteKey="confirm" + buttonText="Remove" onDeleteApproved={() => onRevokeAuthMethodSubmit(identityAuthMethodData.authMethod!)} /> diff --git a/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAwsAuthForm.tsx b/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAwsAuthForm.tsx index 54c148616..781a78125 100644 --- a/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAwsAuthForm.tsx +++ b/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAwsAuthForm.tsx @@ -82,11 +82,12 @@ export const IdentityAwsAuthForm = ({ const { mutateAsync: addMutateAsync } = useAddIdentityAwsAuth(); const { mutateAsync: updateMutateAsync } = useUpdateIdentityAwsAuth(); - const { data } = useGetIdentityAwsAuth(identityAuthMethodData?.identityId ?? ""); + const isCurrentAuthMethod = identityAuthMethodData?.authMethod === initialAuthMethod; + const { data } = useGetIdentityAwsAuth(identityAuthMethodData?.identityId ?? "", { + enabled: isCurrentAuthMethod + }); - const popup = usePopUp([ - "overwriteAuthMethod", - ] as const); + const internalPopUpState = usePopUp(["overwriteAuthMethod"] as const); const { control, @@ -183,8 +184,7 @@ export const IdentityAwsAuthForm = ({ handlePopUpToggle("identityAuthMethod", false); createNotification({ - text: `Successfully ${identityAuthMethodData?.authMethod === initialAuthMethod ? "updated" : "configured" - } auth method`, + text: `Successfully ${isCurrentAuthMethod ? "updated" : "configured"} auth method`, type: "success" }); @@ -198,207 +198,216 @@ export const IdentityAwsAuthForm = ({ }; return ( -
- ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - {accessTokenTrustedIpsFields.map(({ id }, index) => ( -
- { - return ( - - { - if (subscription?.ipAllowlisting) { - field.onChange(e); - return; - } + <> + + ( + + + + )} + /> + ( + + + + )} + /> + ( + + + + )} + /> + ( + + + + )} + /> + ( + + + + )} + /> + ( + + + + )} + /> + {accessTokenTrustedIpsFields.map(({ id }, index) => ( +
+ { + return ( + + { + if (subscription?.ipAllowlisting) { + field.onChange(e); + return; + } - handlePopUpOpen("upgradePlan"); - }} - placeholder="123.456.789.0" - /> - - ); - }} - /> - + + ); + }} + /> + { + if (subscription?.ipAllowlisting) { + removeAccessTokenTrustedIp(index); + return; + } + + handlePopUpOpen("upgradePlan"); + }} + size="lg" + colorSchema="danger" + variant="plain" + ariaLabel="update" + className="p-3" + > + + +
+ ))} +
+
- ))} -
- -
-
-
- {(initialAuthMethod && identityAuthMethodData?.authMethod !== initialAuthMethod) ? +
+
+ {initialAuthMethod && identityAuthMethodData?.authMethod !== initialAuthMethod ? ( + + ) : ( + + )} - : - } - + onClick={() => handlePopUpToggle("revokeAuthMethod", true)} + > + Remove Auth Method + + )}
- {identityAuthMethodData?.authMethod === initialAuthMethod && ( - - )} -
+ popup.handlePopUpToggle("overwriteAuthMethod", isOpen)} - deleteKey="confirm" - onDeleteApproved={async () => { await revokeAuth(initialAuthMethod); handleSubmit(onFormSubmit)(); }} - /> - + isOpen={internalPopUpState.popUp.overwriteAuthMethod?.isOpen} + title={`Are you sure want to overwrite ${initialAuthMethod || "the auth method"} on ${ + identityAuthMethodData?.name ?? "" + }?`} + onChange={(isOpen) => internalPopUpState.handlePopUpToggle("overwriteAuthMethod", isOpen)} + deleteKey="confirm" + buttonText="Overwrite" + onDeleteApproved={async () => { + await revokeAuth(initialAuthMethod); + handleSubmit(onFormSubmit)(); + }} + /> + ); }; diff --git a/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAzureAuthForm.tsx b/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAzureAuthForm.tsx index ec15e556d..a2a6387fb 100644 --- a/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAzureAuthForm.tsx +++ b/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAzureAuthForm.tsx @@ -70,11 +70,12 @@ export const IdentityAzureAuthForm = ({ const { mutateAsync: addMutateAsync } = useAddIdentityAzureAuth(); const { mutateAsync: updateMutateAsync } = useUpdateIdentityAzureAuth(); - const { data } = useGetIdentityAzureAuth(identityAuthMethodData?.identityId ?? ""); + const isCurrentAuthMethod = identityAuthMethodData?.authMethod === initialAuthMethod; + const { data } = useGetIdentityAzureAuth(identityAuthMethodData?.identityId ?? "", { + enabled: isCurrentAuthMethod + }); - const popup = usePopUp([ - "overwriteAuthMethod", - ] as const); + const internalPopUpState = usePopUp(["overwriteAuthMethod"] as const); const { control, @@ -172,8 +173,7 @@ export const IdentityAzureAuthForm = ({ handlePopUpToggle("identityAuthMethod", false); createNotification({ - text: `Successfully ${identityAuthMethodData?.authMethod === initialAuthMethod ? "updated" : "configured" - } auth method`, + text: `Successfully ${isCurrentAuthMethod ? "updated" : "configured"} auth method`, type: "success" }); @@ -187,219 +187,225 @@ export const IdentityAzureAuthForm = ({ }; return ( -
- ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - {accessTokenTrustedIpsFields.map(({ id }, index) => ( -
- { - return ( - - { - if (subscription?.ipAllowlisting) { - field.onChange(e); - return; - } + <> + + ( + + + + )} + /> + ( + + + + )} + /> + ( + + + + )} + /> + ( + + + + )} + /> + ( + + + + )} + /> + ( + + + + )} + /> + {accessTokenTrustedIpsFields.map(({ id }, index) => ( +
+ { + return ( + + { + if (subscription?.ipAllowlisting) { + field.onChange(e); + return; + } - handlePopUpOpen("upgradePlan"); - }} - placeholder="123.456.789.0" - /> - - ); - }} - /> - + + ); + }} + /> + { + if (subscription?.ipAllowlisting) { + removeAccessTokenTrustedIp(index); + return; + } + + handlePopUpOpen("upgradePlan"); + }} + size="lg" + colorSchema="danger" + variant="plain" + ariaLabel="update" + className="p-3" + > + + +
+ ))} +
+
- ))} -
- -
-
-
- {(initialAuthMethod && identityAuthMethodData?.authMethod !== initialAuthMethod) ? +
+
+ {initialAuthMethod && identityAuthMethodData?.authMethod !== initialAuthMethod ? ( + + ) : ( + + )} - : - } - + onClick={() => handlePopUpToggle("revokeAuthMethod", true)} + > + Remove Auth Method + + )}
- {identityAuthMethodData?.authMethod === initialAuthMethod && ( - - )} -
+ popup.handlePopUpToggle("overwriteAuthMethod", isOpen)} - deleteKey="confirm" - onDeleteApproved={async () => { - const result = await trigger(); - if(result){ - await revokeAuth(initialAuthMethod); - handleSubmit(onFormSubmit)(); - }else{ - createNotification({ - text: "Please fill in all required fields", - type: "error" - }); - popup.handlePopUpToggle("overwriteAuthMethod", false); - } - }} - /> - - + isOpen={internalPopUpState.popUp.overwriteAuthMethod?.isOpen} + title={`Are you sure want to overwrite ${initialAuthMethod || "the auth method"} on ${ + identityAuthMethodData?.name ?? "" + }?`} + onChange={(isOpen) => internalPopUpState.handlePopUpToggle("overwriteAuthMethod", isOpen)} + deleteKey="confirm" + buttonText="Overwrite" + onDeleteApproved={async () => { + const result = await trigger(); + if (result) { + await revokeAuth(initialAuthMethod); + handleSubmit(onFormSubmit)(); + } else { + createNotification({ + text: "Please fill in all required fields", + type: "error" + }); + internalPopUpState.handlePopUpToggle("overwriteAuthMethod", false); + } + }} + /> + ); }; diff --git a/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityGcpAuthForm.tsx b/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityGcpAuthForm.tsx index 4c59f46fa..81dd51d22 100644 --- a/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityGcpAuthForm.tsx +++ b/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityGcpAuthForm.tsx @@ -6,7 +6,15 @@ import { zodResolver } from "@hookform/resolvers/zod"; import { z } from "zod"; import { createNotification } from "@app/components/notifications"; -import { Button, DeleteActionModal, FormControl, IconButton, Input, Select, SelectItem } from "@app/components/v2"; +import { + Button, + DeleteActionModal, + FormControl, + IconButton, + Input, + Select, + SelectItem +} from "@app/components/v2"; import { useOrganization, useSubscription } from "@app/context"; import { useAddIdentityGcpAuth, @@ -71,17 +79,18 @@ export const IdentityGcpAuthForm = ({ const { mutateAsync: addMutateAsync } = useAddIdentityGcpAuth(); const { mutateAsync: updateMutateAsync } = useUpdateIdentityGcpAuth(); - const { data } = useGetIdentityGcpAuth(identityAuthMethodData?.identityId ?? ""); - const popup = usePopUp([ - "overwriteAuthMethod", - ] as const); + const isCurrentAuthMethod = identityAuthMethodData?.authMethod === initialAuthMethod; + const { data } = useGetIdentityGcpAuth(identityAuthMethodData?.identityId ?? "", { + enabled: isCurrentAuthMethod + }); + const internalPopUpState = usePopUp(["overwriteAuthMethod"] as const); const { control, handleSubmit, reset, formState: { isSubmitting }, - watch, + watch } = useForm({ resolver: zodResolver(schema), defaultValues: { @@ -180,12 +189,10 @@ export const IdentityGcpAuthForm = ({ handlePopUpToggle("identityAuthMethod", false); createNotification({ - text: `Successfully ${identityAuthMethodData?.authMethod === initialAuthMethod ? "updated" : "configured" - } auth method`, + text: `Successfully ${isCurrentAuthMethod ? "updated" : "configured"} auth method`, type: "success" }); - reset(); } catch (err) { createNotification({ @@ -196,231 +203,244 @@ export const IdentityGcpAuthForm = ({ }; return ( -
- ( - - - - )} - /> - ( - - - - )} - /> - {watchedType === "gce" && ( + <> + ( + + + + )} + /> + ( - + )} /> - )} - {watchedType === "gce" && ( - ( - - - - )} - /> - )} - ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - {accessTokenTrustedIpsFields.map(({ id }, index) => ( -
+ {watchedType === "gce" && ( { - return ( - - { - if (subscription?.ipAllowlisting) { - field.onChange(e); - return; - } - - handlePopUpOpen("upgradePlan"); - }} - placeholder="123.456.789.0" - /> - - ); - }} + name="allowedProjects" + render={({ field, fieldState: { error } }) => ( + + + + )} /> - ( + + + + )} + /> + )} + ( + + + + )} + /> + ( + + + + )} + /> + ( + + + + )} + /> + {accessTokenTrustedIpsFields.map(({ id }, index) => ( +
+ { + return ( + + { + if (subscription?.ipAllowlisting) { + field.onChange(e); + return; + } + + handlePopUpOpen("upgradePlan"); + }} + placeholder="123.456.789.0" + /> + + ); + }} + /> + { + if (subscription?.ipAllowlisting) { + removeAccessTokenTrustedIp(index); + return; + } + + handlePopUpOpen("upgradePlan"); + }} + size="lg" + colorSchema="danger" + variant="plain" + ariaLabel="update" + className="p-3" + > + + +
+ ))} +
+
- ))} -
- -
-
-
- {(initialAuthMethod && identityAuthMethodData?.authMethod !== initialAuthMethod) ? +
+
+ {initialAuthMethod && identityAuthMethodData?.authMethod !== initialAuthMethod ? ( + + ) : ( + + )} - : - } - + onClick={() => handlePopUpToggle("revokeAuthMethod", true)} + > + Remove Auth Method + + )}
- {identityAuthMethodData?.authMethod === initialAuthMethod && ( - - )} -
+ popup.handlePopUpToggle("overwriteAuthMethod", isOpen)} - deleteKey="confirm" - onDeleteApproved={async () => { await revokeAuth(initialAuthMethod); handleSubmit(onFormSubmit)(); }} - /> - + isOpen={internalPopUpState.popUp.overwriteAuthMethod?.isOpen} + title={`Are you sure want to overwrite ${initialAuthMethod || "the auth method"} on ${ + identityAuthMethodData?.name ?? "" + }?`} + buttonText="Overwrite" + onChange={(isOpen) => internalPopUpState.handlePopUpToggle("overwriteAuthMethod", isOpen)} + deleteKey="confirm" + onDeleteApproved={async () => { + await revokeAuth(initialAuthMethod); + handleSubmit(onFormSubmit)(); + }} + /> + ); }; diff --git a/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm.tsx b/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm.tsx index adcf93cbe..fc272a63f 100644 --- a/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm.tsx +++ b/frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityKubernetesAuthForm.tsx @@ -6,7 +6,14 @@ import { zodResolver } from "@hookform/resolvers/zod"; import { z } from "zod"; import { createNotification } from "@app/components/notifications"; -import { Button, DeleteActionModal, FormControl, IconButton, Input, TextArea } from "@app/components/v2"; +import { + Button, + DeleteActionModal, + FormControl, + IconButton, + Input, + TextArea +} from "@app/components/v2"; import { useOrganization, useSubscription } from "@app/context"; import { useAddIdentityKubernetesAuth, @@ -73,17 +80,18 @@ export const IdentityKubernetesAuthForm = ({ const { mutateAsync: addMutateAsync } = useAddIdentityKubernetesAuth(); const { mutateAsync: updateMutateAsync } = useUpdateIdentityKubernetesAuth(); - const { data } = useGetIdentityKubernetesAuth(identityAuthMethodData?.identityId ?? ""); - const popup = usePopUp([ - "overwriteAuthMethod", - ] as const); + const isCurrentAuthMethod = identityAuthMethodData?.authMethod === initialAuthMethod; + const { data } = useGetIdentityKubernetesAuth(identityAuthMethodData?.identityId ?? "", { + enabled: isCurrentAuthMethod + }); + const internalPopUpState = usePopUp(["overwriteAuthMethod"] as const); const { control, handleSubmit, reset, trigger, - formState: { isSubmitting }, + formState: { isSubmitting } } = useForm({ resolver: zodResolver(schema), defaultValues: { @@ -192,8 +200,7 @@ export const IdentityKubernetesAuthForm = ({ handlePopUpToggle("identityAuthMethod", false); createNotification({ - text: `Successfully ${identityAuthMethodData?.authMethod === initialAuthMethod ? "updated" : "configured" - } auth method`, + text: `Successfully ${isCurrentAuthMethod ? "updated" : "configured"} auth method`, type: "success" }); @@ -207,269 +214,277 @@ export const IdentityKubernetesAuthForm = ({ }; return ( -
- ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - ( - - - - )} - /> - ( - + + ( + - - - )} - /> - ( - -