diff --git a/frontend/src/hooks/api/integrationAuth/queries.tsx b/frontend/src/hooks/api/integrationAuth/queries.tsx index d800e5313..45ac90a84 100644 --- a/frontend/src/hooks/api/integrationAuth/queries.tsx +++ b/frontend/src/hooks/api/integrationAuth/queries.tsx @@ -802,6 +802,7 @@ export const useSaveIntegrationAccessToken = () => { refreshToken, accessId, accessToken, + awsAssumeIamRoleArn, url, namespace }: { @@ -810,6 +811,7 @@ export const useSaveIntegrationAccessToken = () => { refreshToken?: string; accessId?: string; accessToken?: string; + awsAssumeIamRoleArn?: string; url?: string; namespace?: string; }) => { @@ -821,6 +823,7 @@ export const useSaveIntegrationAccessToken = () => { refreshToken, accessId, accessToken, + awsAssumeIamRoleArn, url, namespace }); diff --git a/frontend/src/pages/integrations/aws-secret-manager/authorize.tsx b/frontend/src/pages/integrations/aws-secret-manager/authorize.tsx index c901d0a56..c330d60c4 100644 --- a/frontend/src/pages/integrations/aws-secret-manager/authorize.tsx +++ b/frontend/src/pages/integrations/aws-secret-manager/authorize.tsx @@ -1,54 +1,70 @@ -import { useState } from "react"; +import { Controller, useForm } from "react-hook-form"; import Head from "next/head"; import Image from "next/image"; import Link from "next/link"; import { useRouter } from "next/router"; import { faArrowUpRightFromSquare, faBookOpen } from "@fortawesome/free-solid-svg-icons"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import { zodResolver } from "@hookform/resolvers/zod"; +import { z } from "zod"; +import { + Button, + Card, + CardBody, + CardTitle, + FormControl, + Input, + Select, + SelectItem +} from "@app/components/v2"; import { useSaveIntegrationAccessToken } from "@app/hooks/api"; -import { Button, Card, CardTitle, FormControl, Input } from "../../../components/v2"; +enum AwsAuthType { + AccessKey = "access-key", + AssumeRole = "assume-role" +} + +const formSchema = z.discriminatedUnion("type", [ + z.object({ + type: z.literal(AwsAuthType.AccessKey), + accessKey: z.string().min(1), + accessSecretKey: z.string().min(1) + }), + z.object({ + type: z.literal(AwsAuthType.AssumeRole), + iamRoleArn: z.string().min(1) + }) +]); + +type TForm = z.infer; export default function AWSSecretManagerCreateIntegrationPage() { const router = useRouter(); const { mutateAsync } = useSaveIntegrationAccessToken(); - const [isLoading, setIsLoading] = useState(false); + const { control, handleSubmit, formState, watch } = useForm({ + resolver: zodResolver(formSchema), + defaultValues: { + type: AwsAuthType.AccessKey + } + }); + const formAwsAuthTypeField = watch("type"); - const [accessKey, setAccessKey] = useState(""); - const [accessKeyErrorText, setAccessKeyErrorText] = useState(""); - const [accessSecretKey, setAccessSecretKey] = useState(""); - const [accessSecretKeyErrorText, setAccessSecretKeyErrorText] = useState(""); - - const handleButtonClick = async () => { + const handleFormSubmit = async (data: TForm) => { try { - setAccessKeyErrorText(""); - setAccessSecretKeyErrorText(""); - - if (accessKey.length === 0) { - setAccessKeyErrorText("Access key cannot be blank"); - return; - } - - if (accessSecretKey.length === 0) { - setAccessSecretKeyErrorText("Secret access key cannot be blank"); - return; - } - - setIsLoading(true); - const integrationAuth = await mutateAsync({ workspaceId: localStorage.getItem("projectData.id"), integration: "aws-secret-manager", - accessId: accessKey, - accessToken: accessSecretKey + ...(data.type === AwsAuthType.AssumeRole + ? { + awsAssumeIamRoleArn: data.iamRoleArn + } + : { + accessId: data.accessKey, + accessToken: data.accessSecretKey + }) }); - - setAccessKey(""); - setAccessSecretKey(""); - setIsLoading(false); - router.push( `/integrations/aws-secret-manager/create?integrationAuthId=${integrationAuth.id}` ); @@ -69,7 +85,7 @@ export default function AWSSecretManagerCreateIntegrationPage() { subTitle="After adding the details below, you will be prompted to set up an integration for a particular Infisical project and environment." >
-
+
- - setAccessKey(e.target.value)} /> - - - setAccessSecretKey(e.target.value)} - /> - - + +
+ ( + + + + )} + /> + {formAwsAuthTypeField === AwsAuthType.AccessKey ? ( + <> + ( + + + + )} + /> + ( + + + + )} + /> + + ) : ( + ( + + + + )} + /> + )} + + +
);