Finish adding support for build-configuration level syncs for TeamCity integration

frontend/src/hooks/api/integrationAuth/index.tsx

@@ -7,6 +7,7 @@ export {
   useGetIntegrationAuthNorthflankSecretGroups,
   useGetIntegrationAuthRailwayEnvironments,
   useGetIntegrationAuthRailwayServices,
+  useGetIntegrationAuthTeamCityBuildConfigs,
   useGetIntegrationAuthTeams,
   useGetIntegrationAuthVercelBranches,
   useSaveIntegrationAccessToken

frontend/src/hooks/api/integrationAuth/queries.tsx

@@ -10,8 +10,8 @@ import {
   IntegrationAuth, 
   NorthflankSecretGroup,
   Service, 
-  Team 
-} from "./types";
+  Team, 
+  TeamCityBuildConfig} from "./types";
 
 const integrationAuthKeys = {
   getIntegrationAuthById: (integrationAuthId: string) =>
@@ -49,7 +49,14 @@ const integrationAuthKeys = {
   }: {
     integrationAuthId: string;
     appId: string;
-  }) => [{ integrationAuthId, appId }, "integrationAuthNorthflankSecretGroups"] as const, 
+  }) => [{ integrationAuthId, appId }, "integrationAuthNorthflankSecretGroups"] as const,
+  getIntegrationAuthTeamCityBuildConfigs: ({
+    integrationAuthId,
+    appId
+  }: {
+    integrationAuthId: string;
+    appId: string;
+  }) => [{ integrationAuthId, appId }, "integrationAuthTeamCityBranchConfigs"] as const, 
 };
 
 const fetchIntegrationAuthById = async (integrationAuthId: string) => {
@@ -183,6 +190,27 @@ const fetchIntegrationAuthNorthflankSecretGroups = async ({
   return secretGroups;
 };
 
+const fetchIntegrationAuthTeamCityBuildConfigs = async ({
+  integrationAuthId,
+  appId
+}: {
+  integrationAuthId: string;
+  appId: string;
+}) => {
+  const {
+    data: { buildConfigs }
+  } = await apiRequest.get<{ buildConfigs: TeamCityBuildConfig[] }>(
+    `/api/v1/integration-auth/${integrationAuthId}/teamcity/build-configs`,
+    {
+      params: {
+        appId
+      }
+    }
+  );
+
+  return buildConfigs;
+};
+
 export const useGetIntegrationAuthById = (integrationAuthId: string) => {
   return useQuery({
     queryKey: integrationAuthKeys.getIntegrationAuthById(integrationAuthId),
@@ -312,6 +340,26 @@ export const useGetIntegrationAuthNorthflankSecretGroups = ({
   });
 };
 
+export const useGetIntegrationAuthTeamCityBuildConfigs = ({
+  integrationAuthId,
+  appId
+}: {
+  integrationAuthId: string;
+  appId: string;
+}) => {
+  return useQuery({
+    queryKey: integrationAuthKeys.getIntegrationAuthTeamCityBuildConfigs({
+      integrationAuthId,
+      appId
+    }),
+    queryFn: () => fetchIntegrationAuthTeamCityBuildConfigs({
+      integrationAuthId,
+      appId
+    }),
+    enabled: true
+  });
+};
+
 export const useAuthorizeIntegration = () => {
   const queryClient = useQueryClient();
 

frontend/src/hooks/api/integrationAuth/types.ts

@@ -40,4 +40,9 @@ export type BitBucketWorkspace = {
 export type NorthflankSecretGroup = {
   name: string;
   groupId: string;
+}
+
+export type TeamCityBuildConfig = {
+  name: string;
+  buildConfigId: string;
 }

frontend/src/pages/integrations/teamcity/create.tsx

@@ -17,13 +17,20 @@ import {
 } from "../../../components/v2";
 import {
   useGetIntegrationAuthApps,
-  useGetIntegrationAuthById
+  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<string>("");
+  const [secretPath, setSecretPath] = useState("/");
+  const [isLoading, setIsLoading] = useState(false);
 
   const { integrationAuthId } = queryString.parse(router.asPath.split("?")[1]);
 
@@ -32,11 +39,11 @@ export default function TeamCityCreateIntegrationPage() {
   const { data: integrationAuthApps } = useGetIntegrationAuthApps({
     integrationAuthId: (integrationAuthId as string) ?? ""
   });
-
-  const [selectedSourceEnvironment, setSelectedSourceEnvironment] = useState("");
-  const [targetApp, setTargetApp] = useState("");
-  const [secretPath, setSecretPath] = useState("/");
-  const [isLoading, setIsLoading] = useState(false);
+  
+  const { data: targetBuildConfigs } = useGetIntegrationAuthTeamCityBuildConfigs({
+    integrationAuthId: (integrationAuthId as string) ?? "",
+    appId: targetAppId
+  });
 
   useEffect(() => {
     if (workspace) {
@@ -47,29 +54,31 @@ export default function TeamCityCreateIntegrationPage() {
   useEffect(() => {
     if (integrationAuthApps) {
       if (integrationAuthApps.length > 0) {
-        setTargetApp(integrationAuthApps[0].name);
+        setTargetAppId(integrationAuthApps[0].appId as string);
       } else {
-        setTargetApp("none");
+        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: targetApp,
-        appId:
-          integrationAuthApps?.find((integrationAuthApp) => integrationAuthApp.name === targetApp)
-            ?.appId ?? null,
+        app: integrationAuthApps?.find((integrationAuthApp) => integrationAuthApp.appId === targetAppId)?.name ?? null,
+        appId: targetAppId,
         sourceEnvironment: selectedSourceEnvironment,
-        targetEnvironment: null,
-        targetEnvironmentId: null,
+        targetEnvironment: targetEnvironment ? targetEnvironment.name : null,
+        targetEnvironmentId: targetEnvironment ? targetEnvironment.buildConfigId : null,
         targetService: null,
         targetServiceId: null,
         owner: null,
@@ -86,12 +95,17 @@ export default function TeamCityCreateIntegrationPage() {
     }
   };
 
+  const filteredBuildConfigs = targetBuildConfigs?.concat({
+    name: "",
+    buildConfigId: ""
+  });
 
   return integrationAuth &&
     workspace &&
     selectedSourceEnvironment &&
     integrationAuthApps &&
-    targetApp ? (
+    filteredBuildConfigs &&
+    targetAppId ? (
     <div className="flex h-full w-full items-center justify-center">
       <Card className="max-w-md rounded-md p-8">
         <CardTitle className="text-center">TeamCity Integration</CardTitle>
@@ -120,16 +134,16 @@ export default function TeamCityCreateIntegrationPage() {
         </FormControl>
         <FormControl label="TeamCity Project" className="mt-4">
           <Select
-            value={targetApp}
-            onValueChange={(val) => setTargetApp(val)}
+            value={targetAppId}
+            onValueChange={(val) => setTargetAppId(val)}
             className="w-full border border-mineshaft-500"
             isDisabled={integrationAuthApps.length === 0}
           >
             {integrationAuthApps.length > 0 ? (
               integrationAuthApps.map((integrationAuthApp) => (
                 <SelectItem
-                  value={integrationAuthApp.name}
-                  key={`target-app-${integrationAuthApp.name}`}
+                  value={integrationAuthApp.appId as string}
+                  key={`target-app-${integrationAuthApp.appId as string}`}
                 >
                   {integrationAuthApp.name}
                 </SelectItem>
@@ -141,6 +155,22 @@ export default function TeamCityCreateIntegrationPage() {
             )}
           </Select>
         </FormControl>
+        <FormControl label="Team City Build Config (Optional)" className="mt-4">
+          <Select
+            value={targetBuildConfigId}
+            onValueChange={(val) => setTargetBuildConfigId(val)}
+            className="w-full border border-mineshaft-500"
+          >
+            {filteredBuildConfigs.map((buildConfig: any) => (
+              <SelectItem
+                value={buildConfig.buildConfigId}
+                key={`target-build-config-${buildConfig.buildConfigId}`}
+              >
+                {buildConfig.name}
+              </SelectItem>
+            ))}
+          </Select>
+        </FormControl>
         <Button
           onClick={handleButtonClick}
           color="mineshaft"

frontend/src/views/IntegrationsPage/components/IntegrationsSection/IntegrationsSection.tsx

@@ -106,6 +106,7 @@ export const IntegrationsSection = ({
                   integration.integration === "netlify" ||
                   integration.integration === "railway" ||
                   integration.integration === "gitlab" ||
+                  integration.integration === "teamcity" ||
                   integration.integration === "bitbucket") && (
                   <div className="ml-4 flex flex-col">
                     <FormLabel label="Target Environment" />