Optimize and patch minor issues for Cloudflare Pages integration

backend/src/integrations/sync.ts

@@ -1843,6 +1843,13 @@ const syncSecretsHashiCorpVault = async ({
   );
 };
 
+/**
+ * Sync/push [secrets] to Cloudflare Pages project with name [integration.app]
+ * @param {Object} obj
+ * @param {IIntegration} obj.integration - integration details
+ * @param {Object} obj.secrets - secrets to push to integration (object where keys are secret keys and values are secret values)
+ * @param {String} obj.accessToken - API token for Cloudflare
+ */
 const syncSecretsCloudflarePages = async ({
     integration,
     secrets,
@@ -1854,7 +1861,6 @@ const syncSecretsCloudflarePages = async ({
     accessId: string | null;
     accessToken: string;
 }) => {
-    const targetEnvironment = integration.targetEnvironment;
 
   // get secrets from cloudflare pages
   const getSecretsRes = (
@@ -1868,7 +1874,7 @@ const syncSecretsCloudflarePages = async ({
           }
       )
   )
-    .data.result['deployment_configs'][targetEnvironment]['env_vars'];
+  .data.result['deployment_configs'][integration.targetEnvironment]['env_vars'];
 
   // copy the secrets object, so we can set deleted keys to null
   const secretsObj: any = {...secrets};
@@ -1877,7 +1883,7 @@ const syncSecretsCloudflarePages = async ({
       secretsObj[key] = { type: "secret_text", value: val };
   }
 
-    if (getSecretsRes) { // if there are no env vars set in cloudflare pages, none have to be deleted either
+  if (getSecretsRes) {
       for await (const key of Object.keys(getSecretsRes)) {
           if (!(key in secrets)) {
               // case: secret does not exist in infisical
@@ -1887,23 +1893,15 @@ const syncSecretsCloudflarePages = async ({
       }
   }
 
-    const data = targetEnvironment === 'production' 
+  const data = {
-    ? {
     "deployment_configs": {
-            "production" : {
+      [integration.targetEnvironment]: {
         "env_vars": secretsObj
       }
     }
-    }
+  };
-    : {
-        "deployment_configs": {
-            "preview": {
-                "env_vars": secretsObj
-            }
-        }
-    }
 
-    const result = await standardRequest.patch(
+  await standardRequest.patch(
       `${INTEGRATION_CLOUDFLARE_PAGES_API_URL}/client/v4/accounts/${accessId}/pages/projects/${integration.app}`,
       data,
       {
@@ -1912,7 +1910,7 @@ const syncSecretsCloudflarePages = async ({
               "Accept": "application/json",
           },
       }
-    )
+  );
 }
 
 export { syncSecrets };

frontend/src/pages/integrations/[id].tsx

@@ -288,7 +288,7 @@ export default function Integrations() {
           link = `${window.location.origin}/integrations/hashicorp-vault/create?integrationAuthId=${integrationAuth._id}`;
           break;
         case 'cloudflare-pages':
-          link = `${window.location.origin}/integrations/cloudflare-pages/create?integrationAutHId=${integrationAuth._id}`;
+          link = `${window.location.origin}/integrations/cloudflare-pages/create?integrationAuthId=${integrationAuth._id}`;
         default:
           break;
       }

frontend/src/pages/integrations/cloudflare-pages/authorize.tsx

@@ -1,7 +1,7 @@
-import { useState } from 'react';
+import { useState } from "react";
-import { useRouter } from 'next/router';
+import { useRouter } from "next/router";
-import { Card, CardTitle, FormControl, Input, Button } from '../../../components/v2';
+import { Card, CardTitle, FormControl, Input, Button } from "../../../components/v2";
-import saveIntegrationAccessToken from '~/pages/api/integrations/saveIntegrationAccessToken';
+import saveIntegrationAccessToken from "~/pages/api/integrations/saveIntegrationAccessToken";
 
 export default function CloudflarePagesIntegrationPage() {
     const router = useRouter();
@@ -16,7 +16,7 @@ export default function CloudflarePagesIntegrationPage() {
             setAccessKeyErrorText('');
             setAccountIdErrorText('');
             if (accessKey.length === 0 || accountId.length === 0) {
-                if (accessKey.length === 0) setAccessKeyErrorText('Access key cannot be blank!');
+                if (accessKey.length === 0) setAccessKeyErrorText('API token cannot be blank!');
                 if (accountId.length === 0) setAccountIdErrorText('Account ID cannot be blank!');
                 return;
             }

frontend/src/pages/integrations/cloudflare-pages/create.tsx

@@ -1,10 +1,10 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect } from "react";
-import { useRouter } from 'next/router';
+import { useRouter } from "next/router";
-import { useGetWorkspaceById } from '~/hooks/api';
+import { useGetWorkspaceById } from "~/hooks/api";
-import queryString from 'query-string';
+import queryString from "query-string";
-import { useGetIntegrationAuthApps, useGetIntegrationAuthById } from '~/hooks/api/integrationAuth';
+import { useGetIntegrationAuthApps, useGetIntegrationAuthById } from "~/hooks/api/integrationAuth";
-import createIntegration from '~/pages/api/integrations/createIntegration';
+import createIntegration from "~/pages/api/integrations/createIntegration";
-import { Button, Card, CardTitle, FormControl, Select, SelectItem } from '~/components/v2';
+import { Button, Card, CardTitle, FormControl, Select, SelectItem } from "~/components/v2";
 
 const cloudflareEnvironments = [
     { name: 'Production', slug: 'production' },