import { useEffect, 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, faBugs } from "@fortawesome/free-solid-svg-icons"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import queryString from "query-string"; import { useCreateIntegration } from "@app/hooks/api"; import { Button, Card, CardTitle, FormControl, Input, Select, SelectItem } from "../../../components/v2"; import { useGetIntegrationAuthApps, useGetIntegrationAuthById, useGetIntegrationAuthTeamCityBuildConfigs } from "../../../hooks/api/integrationAuth"; import { useGetWorkspaceById } from "../../../hooks/api/workspace"; export default function TeamCityCreateIntegrationPage() { const router = useRouter(); const { mutateAsync } = useCreateIntegration(); const [selectedSourceEnvironment, setSelectedSourceEnvironment] = useState(""); const [targetAppId, setTargetAppId] = useState(""); const [targetBuildConfigId, setTargetBuildConfigId] = useState(""); const [secretPath, setSecretPath] = useState("/"); const [isLoading, setIsLoading] = useState(false); const { integrationAuthId } = queryString.parse(router.asPath.split("?")[1]); const { data: workspace } = useGetWorkspaceById(localStorage.getItem("projectData.id") ?? ""); const { data: integrationAuth, isLoading: isIntegrationAuthLoading } = useGetIntegrationAuthById( (integrationAuthId as string) ?? "" ); const { data: integrationAuthApps, isLoading: isIntegrationAuthAppsLoading } = useGetIntegrationAuthApps({ integrationAuthId: (integrationAuthId as string) ?? "" }); const { data: targetBuildConfigs } = useGetIntegrationAuthTeamCityBuildConfigs({ integrationAuthId: (integrationAuthId as string) ?? "", appId: targetAppId }); useEffect(() => { if (workspace) { setSelectedSourceEnvironment(workspace.environments[0].slug); } }, [workspace]); useEffect(() => { if (integrationAuthApps) { if (integrationAuthApps.length > 0) { setTargetAppId(integrationAuthApps[0].appId as string); } else { setTargetAppId("none"); } } }, [integrationAuthApps]); const handleButtonClick = async () => { try { if (!integrationAuth?.id) return; setIsLoading(true); const targetEnvironment = targetBuildConfigs?.find( (buildConfig) => buildConfig.buildConfigId === targetBuildConfigId ); await mutateAsync({ integrationAuthId: integrationAuth?.id, isActive: true, app: integrationAuthApps?.find( (integrationAuthApp) => integrationAuthApp.appId === targetAppId )?.name, appId: targetAppId, sourceEnvironment: selectedSourceEnvironment, targetEnvironment: targetEnvironment?.name, targetEnvironmentId: targetEnvironment?.buildConfigId, secretPath }); setIsLoading(false); router.push(`/integrations/${localStorage.getItem("projectData.id")}`); } catch (err) { console.error(err); } }; const filteredBuildConfigs = targetBuildConfigs?.concat({ name: "", buildConfigId: "" }); return integrationAuth && workspace && selectedSourceEnvironment && integrationAuthApps && filteredBuildConfigs && targetAppId ? (
Set Up TeamCity Integration
TeamCity logo
TeamCity Integration
Docs
setSecretPath(evt.target.value)} placeholder="Provide a path, default is /" />
) : (
Set Up TeamCity Integration {isIntegrationAuthLoading || isIntegrationAuthAppsLoading ? ( infisical loading indicator ) : (

Something went wrong. Please contact{" "} support@infisical.com {" "} if the issue persists.

)}
); } TeamCityCreateIntegrationPage.requireAuth = true;