chore: Salesforce - handle checkbox type fields (#20490)

* Add checkbox field type

* Handle accepting booleans under value field when saving writing to field settings

* UI saving settings to write to checkbox field

* Prepare update body to pass boolean value to checkbox field

* Type fixes

* Type fix

packages/app-store/routing-forms/pages/incomplete-booking/[...appPages].tsx

@@ -10,10 +10,10 @@ import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { IncompleteBookingActionType } from "@calcom/prisma/enums";
 import { trpc } from "@calcom/trpc/react";
 import type { inferSSRProps } from "@calcom/types/inferSSRProps";
+import { Button } from "@calcom/ui/components/button";
 import { Switch } from "@calcom/ui/components/form";
 import { InputField } from "@calcom/ui/components/form";
 import { Select } from "@calcom/ui/components/form";
-import { Button } from "@calcom/ui/components/button";
 import { showToast } from "@calcom/ui/components/toast";
 
 import SingleForm, {
@@ -158,7 +158,7 @@ function Page({ form }: { form: RoutingFormWithResponseCount }) {
                         />
                       </div>
                       <div>
-                        <InputField value={action.value} readOnly />
+                        <InputField value={action.value as string} readOnly />
                       </div>
                       <div>
                         <Select

packages/app-store/salesforce/components/EventTypeAppCardInterface.tsx

@@ -1,5 +1,6 @@
 import { usePathname } from "next/navigation";
 import { useState } from "react";
+import type z from "zod";
 
 import { useAppContextWithSchema } from "@calcom/app-store/EventTypeAppContext";
 import AppCard from "@calcom/app-store/_components/AppCard";
@@ -21,7 +22,7 @@ import {
   SalesforceFieldType,
   DateFieldTypeData,
 } from "../lib/enums";
-import type { appDataSchema } from "../zod";
+import type { appDataSchema, writeToRecordEntrySchema } from "../zod";
 
 const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({ app, eventType }) {
   const pathname = usePathname();
@@ -63,8 +64,9 @@ const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({
     { label: t("text"), value: SalesforceFieldType.TEXT },
     { label: t("date"), value: SalesforceFieldType.DATE },
     { label: t("phone").charAt(0).toUpperCase() + t("phone").slice(1), value: SalesforceFieldType.PHONE },
-    { label: t("custom"), value: SalesforceFieldType.CUSTOM },
+    { label: t("checkbox"), value: SalesforceFieldType.CHECKBOX },
     { label: t("picklist"), value: SalesforceFieldType.PICKLIST },
+    { label: t("custom"), value: SalesforceFieldType.CUSTOM },
   ];
 
   const [writeToPersonObjectFieldType, setWriteToPersonObjectFieldType] = useState(fieldTypeOptions[0]);
@@ -74,16 +76,27 @@ const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({
     { label: t("only_if_field_is_empty"), value: WhenToWriteToRecord.FIELD_EMPTY },
   ];
 
-  const [whenToWriteToPersonRecord, setWhenToWriteToPersonRecord] = useState(whenToWriteToRecordOptions[0]);
+  const [whenToWriteToPersonRecord, setWhenToWriteToPersonRecord] = useState(
+    whenToWriteToRecordOptions.find((option) => option.value === WhenToWriteToRecord.FIELD_EMPTY) ??
+      whenToWriteToRecordOptions[0]
+  );
 
   const dateFieldValueOptions = [
     { label: t("booking_start_date"), value: DateFieldTypeData.BOOKING_START_DATE },
     { label: t("booking_created_date"), value: DateFieldTypeData.BOOKING_CREATED_DATE },
   ];
 
-  const [dateFieldValue, setDateValue] = useState(dateFieldValueOptions[0]);
+  const checkboxFieldValueOptions = [
+    { label: t("true"), value: true },
+    { label: t("false"), value: false },
+  ];
 
-  const [newOnBookingWriteToPersonObjectField, setNewOnBookingWriteToPersonObjectField] = useState({
+  const [dateFieldValue, setDateValue] = useState(dateFieldValueOptions[0]);
+  const [checkboxFieldValue, setCheckboxFieldValue] = useState(checkboxFieldValueOptions[0]);
+
+  const [newOnBookingWriteToPersonObjectField, setNewOnBookingWriteToPersonObjectField] = useState<
+    z.infer<typeof writeToRecordEntrySchema>
+  >({
     field: "",
     fieldType: writeToPersonObjectFieldType.value,
     value: "",
@@ -331,8 +344,15 @@ const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({
                           )}
                           isDisabled={true}
                         />
+                      ) : onBookingWriteToRecordFields[key].fieldType === SalesforceFieldType.CHECKBOX ? (
+                        <Select
+                          value={checkboxFieldValueOptions.find(
+                            (option) => option.value === onBookingWriteToRecordFields[key].value
+                          )}
+                          isDisabled={true}
+                        />
                       ) : (
-                        <InputField value={onBookingWriteToRecordFields[key].value} readOnly />
+                        <InputField value={onBookingWriteToRecordFields[key].value as string} readOnly />
                       )}
                     </div>
                     <div>
@@ -380,6 +400,9 @@ const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({
                             ...newOnBookingWriteToPersonObjectField,
                             fieldType: e.value,
                             ...(e.value === SalesforceFieldType.DATE && { value: dateFieldValue.value }),
+                            ...(e.value === SalesforceFieldType.CHECKBOX && {
+                              value: checkboxFieldValue.value,
+                            }),
                           });
                         }
                       }}
@@ -400,9 +423,23 @@ const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({
                           }
                         }}
                       />
+                    ) : writeToPersonObjectFieldType.value === SalesforceFieldType.CHECKBOX ? (
+                      <Select
+                        options={checkboxFieldValueOptions}
+                        value={checkboxFieldValue}
+                        onChange={(e) => {
+                          if (e) {
+                            setCheckboxFieldValue(e);
+                            setNewOnBookingWriteToPersonObjectField({
+                              ...newOnBookingWriteToPersonObjectField,
+                              value: e.value,
+                            });
+                          }
+                        }}
+                      />
                     ) : (
                       <InputField
-                        value={newOnBookingWriteToPersonObjectField.value}
+                        value={newOnBookingWriteToPersonObjectField.value as string}
                         onChange={(e) =>
                           setNewOnBookingWriteToPersonObjectField({
                             ...newOnBookingWriteToPersonObjectField,
@@ -436,7 +473,7 @@ const EventTypeAppCard: EventTypeAppCardComponent = function EventTypeAppCard({
                   !(
                     newOnBookingWriteToPersonObjectField.field &&
                     newOnBookingWriteToPersonObjectField.fieldType &&
-                    newOnBookingWriteToPersonObjectField.value &&
+                    newOnBookingWriteToPersonObjectField.value !== "" &&
                     newOnBookingWriteToPersonObjectField.whenToWrite
                   )
                 }

packages/app-store/salesforce/lib/CrmService.ts

@@ -1059,7 +1059,6 @@ export default class SalesforceCRMService implements CRM {
     // Search the fields and ensure 1. they exist 2. they're the right type
     const fieldsToWriteOn = Object.keys(onBookingWriteToRecordFields);
     const existingFields = await this.ensureFieldsExistOnObject(fieldsToWriteOn, personRecordType);
-
     if (!existingFields.length) {
       this.log.warn(`No fields found for record type ${personRecordType}`);
       return;
@@ -1193,6 +1192,11 @@ export default class SalesforceCRMService implements CRM {
             writeOnRecordBody[field.name] = picklistValue;
             continue;
           }
+        } else if (field.type === SalesforceFieldType.CHECKBOX) {
+          // If the checkbox field value is not a boolean for some reason, default to if it's a falsely value
+          const checkboxValue = !!fieldConfig.value;
+          writeOnRecordBody[field.name] = checkboxValue;
+          continue;
         }
       }
 

packages/app-store/salesforce/lib/enums.ts

@@ -15,6 +15,7 @@ export enum SalesforceFieldType {
   PHONE = "phone",
   CUSTOM = "custom",
   PICKLIST = "picklist",
+  CHECKBOX = "boolean",
 }
 
 export enum DateFieldTypeData {

packages/app-store/salesforce/zod.ts

@@ -4,7 +4,7 @@ import { eventTypeAppCardZod } from "../eventTypeAppCardZod";
 import { SalesforceRecordEnum, WhenToWriteToRecord, SalesforceFieldType } from "./lib/enums";
 
 const writeToBookingEntry = z.object({
-  value: z.string(),
+  value: z.union([z.string(), z.boolean()]),
   fieldType: z.nativeEnum(SalesforceFieldType),
   whenToWrite: z.nativeEnum(WhenToWriteToRecord),
 });
@@ -12,7 +12,7 @@ const writeToBookingEntry = z.object({
 export const writeToRecordEntrySchema = z.object({
   field: z.string(),
   fieldType: z.nativeEnum(SalesforceFieldType),
-  value: z.string(),
+  value: z.union([z.string(), z.boolean()]),
   whenToWrite: z.nativeEnum(WhenToWriteToRecord),
 });