import { useState } from "react"; 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 { useSaveIntegrationAccessToken } from "@app/hooks/api"; import { Button, Card, CardTitle, FormControl, Input } from "../../../components/v2"; export default function RenderCreateIntegrationPage() { const router = useRouter(); const { mutateAsync } = useSaveIntegrationAccessToken(); const [apiKey, setApiKey] = useState(""); const [apiKeyErrorText, setApiKeyErrorText] = useState(""); const [isLoading, setIsLoading] = useState(false); const handleButtonClick = async () => { try { setApiKeyErrorText(""); if (apiKey.length === 0) { setApiKeyErrorText("API Key cannot be blank"); return; } setIsLoading(true); const integrationAuth = await mutateAsync({ workspaceId: localStorage.getItem("projectData.id"), integration: "render", accessToken: apiKey }); setIsLoading(false); router.push(`/integrations/render/create?integrationAuthId=${integrationAuth.id}`); } catch (err) { console.error(err); } }; return (
Authorize Render Integration
Render logo
Render Integration
Docs
setApiKey(e.target.value)} />
); } RenderCreateIntegrationPage.requireAuth = true;