Add secret sync vercel integration

frontend/src/hooks/api/appConnections/enums.ts

@@ -5,5 +5,6 @@ export enum AppConnection {
   AzureKeyVault = "azure-key-vault",
   AzureAppConfiguration = "azure-app-configuration",
   Databricks = "databricks",
-  Humanitec = "humanitec"
+  Humanitec = "humanitec",
+  Vercel = "vercel"
 }

frontend/src/hooks/api/appConnections/types/app-options.ts

@@ -38,6 +38,10 @@ export type THumanitecConnectionOption = TAppConnectionOptionBase & {
   app: AppConnection.Humanitec;
 };
 
+export type TVercelConnectionOption = TAppConnectionOptionBase & {
+  app: AppConnection.Vercel;
+};
+
 export type TAppConnectionOption =
   | TAwsConnectionOption
   | TGitHubConnectionOption
@@ -45,7 +49,8 @@ export type TAppConnectionOption =
   | TAzureAppConfigurationConnectionOption
   | TAzureKeyVaultConnectionOption
   | TDatabricksConnectionOption
-  | THumanitecConnectionOption;
+  | THumanitecConnectionOption
+  | TVercelConnectionOption;
 
 export type TAppConnectionOptionMap = {
   [AppConnection.AWS]: TAwsConnectionOption;
@@ -55,4 +60,5 @@ export type TAppConnectionOptionMap = {
   [AppConnection.AzureAppConfiguration]: TAzureAppConfigurationConnectionOption;
   [AppConnection.Databricks]: TDatabricksConnectionOption;
   [AppConnection.Humanitec]: THumanitecConnectionOption;
+  [AppConnection.Vercel]: TVercelConnectionOption;
 };

frontend/src/hooks/api/appConnections/types/index.ts

@@ -8,6 +8,7 @@ import { THumanitecConnection } from "@app/hooks/api/appConnections/types/humani
 import { TAzureAppConfigurationConnection } from "./azure-app-configuration-connection";
 import { TAzureKeyVaultConnection } from "./azure-key-vault-connection";
 import { TGcpConnection } from "./gcp-connection";
+import { TVercelConnection } from "./vercel-connection";
 
 export * from "./aws-connection";
 export * from "./azure-app-configuration-connection";
@@ -23,7 +24,8 @@ export type TAppConnection =
   | TAzureKeyVaultConnection
   | TAzureAppConfigurationConnection
   | TDatabricksConnection
-  | THumanitecConnection;
+  | THumanitecConnection
+  | TVercelConnection;
 
 export type TAvailableAppConnection = Pick<TAppConnection, "name" | "id">;
 
@@ -58,4 +60,5 @@ export type TAppConnectionMap = {
   [AppConnection.AzureAppConfiguration]: TAzureAppConfigurationConnection;
   [AppConnection.Databricks]: TDatabricksConnection;
   [AppConnection.Humanitec]: THumanitecConnection;
+  [AppConnection.Vercel]: TVercelConnection;
 };

frontend/src/hooks/api/appConnections/types/vercel-connection.ts

@@ -0,0 +1,13 @@
+import { AppConnection } from "@app/hooks/api/appConnections/enums";
+import { TRootAppConnection } from "@app/hooks/api/appConnections/types/root-connection";
+
+export enum VercelConnectionMethod {
+  API_TOKEN = "api-token"
+}
+
+export type TVercelConnection = TRootAppConnection & { app: AppConnection.Vercel } & {
+  method: VercelConnectionMethod.API_TOKEN;
+  credentials: {
+    apiToken: string;
+  };
+};

frontend/src/hooks/api/appConnections/vercel/index.ts

@@ -0,0 +1,2 @@
+export * from "./queries";
+export * from "./types";

frontend/src/hooks/api/appConnections/vercel/queries.tsx

@@ -0,0 +1,37 @@
+import { useQuery, UseQueryOptions } from "@tanstack/react-query";
+
+import { apiRequest } from "@app/config/request";
+
+import { appConnectionKeys } from "../queries";
+import { TVercelConnectionOrganization } from "./types";
+
+const vercelConnectionKeys = {
+  all: [...appConnectionKeys.all, "vercel"] as const,
+  listOrganizations: (connectionId: string) =>
+    [...vercelConnectionKeys.all, "organizations", connectionId] as const
+};
+
+export const useVercelConnectionListOrganizations = (
+  connectionId: string,
+  options?: Omit<
+    UseQueryOptions<
+      TVercelConnectionOrganization[],
+      unknown,
+      TVercelConnectionOrganization[],
+      ReturnType<typeof vercelConnectionKeys.listOrganizations>
+    >,
+    "queryKey" | "queryFn"
+  >
+) => {
+  return useQuery({
+    queryKey: vercelConnectionKeys.listOrganizations(connectionId),
+    queryFn: async () => {
+      const { data } = await apiRequest.get<TVercelConnectionOrganization[]>(
+        `/api/v1/app-connections/vercel/${connectionId}/projects`
+      );
+
+      return data;
+    },
+    ...options
+  });
+};

frontend/src/hooks/api/appConnections/vercel/types.ts

@@ -0,0 +1,29 @@
+export type TVercelApp = {
+  id: string;
+  name: string;
+  envs: { id: string; name: string }[];
+};
+
+export type TVercelConnectionEnvironment = {
+  key: string;
+  value: string;
+  type: string;
+  target?: string[];
+  gitBranch?: string;
+  createdAt?: number;
+  updatedAt?: number;
+};
+
+export type TVercelConnectionApp = {
+  id: string;
+  name: string;
+  envs?: TVercelConnectionEnvironment[];
+  previewBranches?: string[];
+};
+
+export type TVercelConnectionOrganization = {
+  id: string;
+  name: string;
+  slug: string;
+  apps: TVercelConnectionApp[];
+};