feat(app-connections, PKI): Cloudflare as DNS provider

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

@@ -3,14 +3,16 @@ import { useQuery, UseQueryOptions } from "@tanstack/react-query";
 import { apiRequest } from "@app/config/request";
 
 import { appConnectionKeys } from "../queries";
-import { TCloudflarePagesProject, TCloudflareWorkersScript } from "./types";
+import { TCloudflarePagesProject, TCloudflareWorkersScript, TCloudflareZone } from "./types";
 
 const cloudflareConnectionKeys = {
   all: [...appConnectionKeys.all, "cloudflare"] as const,
   listPagesProjects: (connectionId: string) =>
     [...cloudflareConnectionKeys.all, "pages-projects", connectionId] as const,
   listWorkersScripts: (connectionId: string) =>
-    [...cloudflareConnectionKeys.all, "workers-scripts", connectionId] as const
+    [...cloudflareConnectionKeys.all, "workers-scripts", connectionId] as const,
+  listWorkersZones: (connectionId: string) =>
+    [...cloudflareConnectionKeys.all, "zones", connectionId] as const
 };
 
 export const useCloudflareConnectionListPagesProjects = (
@@ -62,3 +64,28 @@ export const useCloudflareConnectionListWorkersScripts = (
     ...options
   });
 };
+
+export const useCloudflareConnectionListZones = (
+  connectionId: string,
+  options?: Omit<
+    UseQueryOptions<
+      TCloudflareZone[],
+      unknown,
+      TCloudflareZone[],
+      ReturnType<typeof cloudflareConnectionKeys.listWorkersZones>
+    >,
+    "queryKey" | "queryFn"
+  >
+) => {
+  return useQuery({
+    queryKey: cloudflareConnectionKeys.listWorkersZones(connectionId),
+    queryFn: async () => {
+      const { data } = await apiRequest.get<TCloudflareZone[]>(
+        `/api/v1/app-connections/cloudflare/${connectionId}/cloudflare-zones`
+      );
+
+      return data;
+    },
+    ...options
+  });
+};

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

@@ -6,3 +6,8 @@ export type TCloudflarePagesProject = {
 export type TCloudflareWorkersScript = {
   id: string;
 };
+
+export type TCloudflareZone = {
+  id: string;
+  name: string;
+};

frontend/src/hooks/api/ca/constants.tsx

@@ -1,6 +1,7 @@
+import { AppConnection } from "../appConnections/enums";
 import { SshCaStatus } from "../sshCa";
 import { SshCertTemplateStatus } from "../sshCertificateTemplates";
-import { CaStatus, InternalCaType } from "./enums";
+import { AcmeDnsProvider, CaStatus, InternalCaType } from "./enums";
 
 export const caTypeToNameMap: { [K in InternalCaType]: string } = {
   [InternalCaType.ROOT]: "Root",
@@ -13,6 +14,16 @@ export const caStatusToNameMap: { [K in CaStatus]: string } = {
   [CaStatus.PENDING_CERTIFICATE]: "Pending Certificate"
 };
 
+export const ACME_DNS_PROVIDER_NAME_MAP: Record<AcmeDnsProvider, string> = {
+  [AcmeDnsProvider.ROUTE53]: "Route53",
+  [AcmeDnsProvider.Cloudflare]: "Cloudflare"
+};
+
+export const ACME_DNS_PROVIDER_APP_CONNECTION_MAP: Record<AcmeDnsProvider, AppConnection> = {
+  [AcmeDnsProvider.ROUTE53]: AppConnection.AWS,
+  [AcmeDnsProvider.Cloudflare]: AppConnection.Cloudflare
+};
+
 export const getCaStatusBadgeVariant = (status: CaStatus | SshCaStatus | SshCertTemplateStatus) => {
   switch (status) {
     case CaStatus.ACTIVE:

frontend/src/hooks/api/ca/enums.tsx

@@ -19,5 +19,6 @@ export enum CaRenewalType {
 }
 
 export enum AcmeDnsProvider {
-  ROUTE53 = "route53"
+  ROUTE53 = "route53",
+  Cloudflare = "cloudflare"
 }

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

@@ -11,7 +11,7 @@ export type TAcmeCertificateAuthority = {
   configuration: {
     dnsAppConnectionId: string;
     dnsProviderConfig: {
-      provider: AcmeDnsProvider.ROUTE53;
+      provider: AcmeDnsProvider;
       hostedZoneId: string;
     };
     directoryUrl: string;