From 76a912e58dee650a1be3c880c20a2a2025228988 Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Tue, 12 May 2026 10:02:45 -0500
Subject: [PATCH 01/11] ENG-3522: add client-side conditional validation for
 privacy center custom fields

---
 .../__tests__/lib/condition-evaluator.test.ts | 466 ++++++++++++++++++
 .../ConsentRequestForm.tsx                    | 103 ++--
 .../useConsentRequestForm.ts                  | 158 ++++--
 .../PrivacyRequestForm.tsx                    |   3 +-
 .../usePrivacyRequestForm.ts                  | 151 ++++--
 .../hooks/useApplicableFields.ts              |  93 ++++
 .../hooks/useCustomFieldsForm.ts              |  73 ++-
 .../privacy-center/lib/condition-evaluator.ts | 168 +++++++
 clients/privacy-center/types/config.ts        |  25 +
 clients/privacy-center/types/forms.ts         |   1 +
 10 files changed, 1093 insertions(+), 148 deletions(-)
 create mode 100644 clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
 create mode 100644 clients/privacy-center/hooks/useApplicableFields.ts
 create mode 100644 clients/privacy-center/lib/condition-evaluator.ts

diff --git a/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts b/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
new file mode 100644
index 00000000000..e789cf17b98
--- /dev/null
+++ b/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
@@ -0,0 +1,466 @@
+/**
+ * @jest-environment jsdom
+ */
+
+import {
+  evaluateCondition,
+  resolveApplicableFields,
+} from "~/lib/condition-evaluator";
+import type {
+  Condition,
+  ConditionGroup,
+  ConditionLeaf,
+  CustomConfigField,
+} from "~/types/config";
+
+// Helper to create test field records with proper typing
+const makeFields = (
+  fields: Record<string, Partial<CustomConfigField> & { label: string }>,
+) => fields as Record<string, CustomConfigField>;
+
+describe("evaluateCondition", () => {
+  describe("eq operator", () => {
+    it("returns true when values match", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "country",
+        operator: "eq",
+        value: "US",
+      };
+      expect(evaluateCondition(leaf, { country: "US" })).toBe(true);
+    });
+
+    it("returns false when values differ", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "country",
+        operator: "eq",
+        value: "US",
+      };
+      expect(evaluateCondition(leaf, { country: "CA" })).toBe(false);
+    });
+
+    it("treats both null-ish as equal", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "field",
+        operator: "eq",
+        value: null,
+      };
+      expect(evaluateCondition(leaf, { field: undefined })).toBe(true);
+      expect(evaluateCondition(leaf, {})).toBe(true);
+      expect(evaluateCondition(leaf, { field: "" })).toBe(true);
+    });
+
+    it("works with boolean values", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "agreed",
+        operator: "eq",
+        value: true,
+      };
+      expect(evaluateCondition(leaf, { agreed: true })).toBe(true);
+      expect(evaluateCondition(leaf, { agreed: false })).toBe(false);
+    });
+
+    it("works with number values", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "count",
+        operator: "eq",
+        value: 5,
+      };
+      expect(evaluateCondition(leaf, { count: 5 })).toBe(true);
+      expect(evaluateCondition(leaf, { count: 3 })).toBe(false);
+    });
+  });
+
+  describe("neq operator", () => {
+    it("returns true when values differ", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "country",
+        operator: "neq",
+        value: "US",
+      };
+      expect(evaluateCondition(leaf, { country: "CA" })).toBe(true);
+    });
+
+    it("returns false when values match", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "country",
+        operator: "neq",
+        value: "US",
+      };
+      expect(evaluateCondition(leaf, { country: "US" })).toBe(false);
+    });
+
+    it("treats both null-ish as equal (returns false)", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "field",
+        operator: "neq",
+        value: null,
+      };
+      expect(evaluateCondition(leaf, {})).toBe(false);
+    });
+  });
+
+  describe("exists operator", () => {
+    it("returns true when field has a value", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "name",
+        operator: "exists",
+      };
+      expect(evaluateCondition(leaf, { name: "Alice" })).toBe(true);
+    });
+
+    it("returns false for empty string", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "name",
+        operator: "exists",
+      };
+      expect(evaluateCondition(leaf, { name: "" })).toBe(false);
+    });
+
+    it("returns false for null/undefined/missing", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "name",
+        operator: "exists",
+      };
+      expect(evaluateCondition(leaf, { name: null })).toBe(false);
+      expect(evaluateCondition(leaf, { name: undefined })).toBe(false);
+      expect(evaluateCondition(leaf, {})).toBe(false);
+    });
+
+    it("returns false for empty array", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "tags",
+        operator: "exists",
+      };
+      expect(evaluateCondition(leaf, { tags: [] })).toBe(false);
+    });
+
+    it("returns true for non-empty array", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "tags",
+        operator: "exists",
+      };
+      expect(evaluateCondition(leaf, { tags: ["a"] })).toBe(true);
+    });
+
+    it("returns true for boolean false (it exists)", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "agreed",
+        operator: "exists",
+      };
+      expect(evaluateCondition(leaf, { agreed: false })).toBe(true);
+    });
+
+    it("returns true for zero (it exists)", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "count",
+        operator: "exists",
+      };
+      expect(evaluateCondition(leaf, { count: 0 })).toBe(true);
+    });
+  });
+
+  describe("not_exists operator", () => {
+    it("returns true for missing field", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "name",
+        operator: "not_exists",
+      };
+      expect(evaluateCondition(leaf, {})).toBe(true);
+    });
+
+    it("returns true for empty string", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "name",
+        operator: "not_exists",
+      };
+      expect(evaluateCondition(leaf, { name: "" })).toBe(true);
+    });
+
+    it("returns false for present value", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "name",
+        operator: "not_exists",
+      };
+      expect(evaluateCondition(leaf, { name: "Alice" })).toBe(false);
+    });
+  });
+
+  describe("list_contains operator", () => {
+    it("returns true when data array contains expected value", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "departments",
+        operator: "list_contains",
+        value: "Engineering",
+      };
+      expect(
+        evaluateCondition(leaf, {
+          departments: ["Engineering", "Marketing"],
+        }),
+      ).toBe(true);
+    });
+
+    it("returns false when data array does not contain expected value", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "departments",
+        operator: "list_contains",
+        value: "Legal",
+      };
+      expect(
+        evaluateCondition(leaf, {
+          departments: ["Engineering", "Marketing"],
+        }),
+      ).toBe(false);
+    });
+
+    it("returns true when expected array contains data value", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "country",
+        operator: "list_contains",
+        value: ["US", "CA", "UK"],
+      };
+      expect(evaluateCondition(leaf, { country: "US" })).toBe(true);
+    });
+
+    it("returns false when expected array does not contain data value", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "country",
+        operator: "list_contains",
+        value: ["US", "CA", "UK"],
+      };
+      expect(evaluateCondition(leaf, { country: "DE" })).toBe(false);
+    });
+
+    it("returns false for non-array values", () => {
+      const leaf: ConditionLeaf = {
+        field_address: "name",
+        operator: "list_contains",
+        value: "Alice",
+      };
+      expect(evaluateCondition(leaf, { name: "Alice" })).toBe(false);
+    });
+  });
+
+  describe("ConditionGroup - AND", () => {
+    it("returns true when all conditions pass", () => {
+      const group: ConditionGroup = {
+        logical_operator: "and",
+        conditions: [
+          { field_address: "country", operator: "eq", value: "US" },
+          { field_address: "state", operator: "exists" },
+        ],
+      };
+      expect(evaluateCondition(group, { country: "US", state: "CA" })).toBe(
+        true,
+      );
+    });
+
+    it("returns false when any condition fails", () => {
+      const group: ConditionGroup = {
+        logical_operator: "and",
+        conditions: [
+          { field_address: "country", operator: "eq", value: "US" },
+          { field_address: "state", operator: "exists" },
+        ],
+      };
+      expect(evaluateCondition(group, { country: "US", state: "" })).toBe(
+        false,
+      );
+    });
+  });
+
+  describe("ConditionGroup - OR", () => {
+    it("returns true when any condition passes", () => {
+      const group: ConditionGroup = {
+        logical_operator: "or",
+        conditions: [
+          { field_address: "country", operator: "eq", value: "US" },
+          { field_address: "country", operator: "eq", value: "CA" },
+        ],
+      };
+      expect(evaluateCondition(group, { country: "CA" })).toBe(true);
+    });
+
+    it("returns false when all conditions fail", () => {
+      const group: ConditionGroup = {
+        logical_operator: "or",
+        conditions: [
+          { field_address: "country", operator: "eq", value: "US" },
+          { field_address: "country", operator: "eq", value: "CA" },
+        ],
+      };
+      expect(evaluateCondition(group, { country: "DE" })).toBe(false);
+    });
+  });
+
+  describe("nested groups", () => {
+    it("handles nested group conditions", () => {
+      const condition: Condition = {
+        logical_operator: "and",
+        conditions: [
+          { field_address: "country", operator: "eq", value: "US" },
+          {
+            logical_operator: "or",
+            conditions: [
+              { field_address: "state", operator: "eq", value: "CA" },
+              { field_address: "state", operator: "eq", value: "NY" },
+            ],
+          },
+        ],
+      };
+      expect(evaluateCondition(condition, { country: "US", state: "CA" })).toBe(
+        true,
+      );
+      expect(evaluateCondition(condition, { country: "US", state: "TX" })).toBe(
+        false,
+      );
+      expect(evaluateCondition(condition, { country: "CA", state: "CA" })).toBe(
+        false,
+      );
+    });
+  });
+
+  it("returns false on unknown operator", () => {
+    const leaf = {
+      field_address: "x",
+      operator: "unknown_op" as any,
+      value: "y",
+    };
+    expect(evaluateCondition(leaf, { x: "y" })).toBe(false);
+  });
+});
+
+describe("resolveApplicableFields", () => {
+  it("returns all fields when none have display_condition", () => {
+    const fields = makeFields({
+      name: { label: "Name" },
+      email: { label: "Email" },
+    });
+    const result = resolveApplicableFields(fields, { name: "", email: "" });
+    expect(result).toEqual(new Set(["name", "email"]));
+  });
+
+  it("hides a field when its condition is false", () => {
+    const fields = makeFields({
+      country: { label: "Country", field_type: "select" },
+      state: {
+        label: "State",
+        field_type: "select",
+        display_condition: {
+          field_address: "country",
+          operator: "eq",
+          value: "US",
+        },
+      },
+    });
+    const result = resolveApplicableFields(fields, {
+      country: "CA",
+      state: "",
+    });
+    expect(result.has("country")).toBe(true);
+    expect(result.has("state")).toBe(false);
+  });
+
+  it("shows a field when its condition is true", () => {
+    const fields = makeFields({
+      country: { label: "Country", field_type: "select" },
+      state: {
+        label: "State",
+        field_type: "select",
+        display_condition: {
+          field_address: "country",
+          operator: "eq",
+          value: "US",
+        },
+      },
+    });
+    const result = resolveApplicableFields(fields, {
+      country: "US",
+      state: "CA",
+    });
+    expect(result.has("country")).toBe(true);
+    expect(result.has("state")).toBe(true);
+  });
+
+  it("handles cascading dependencies (A → B → C)", () => {
+    const fields = makeFields({
+      toggle: { label: "Toggle" },
+      level1: {
+        label: "Level 1",
+        display_condition: {
+          field_address: "toggle",
+          operator: "eq",
+          value: "on",
+        },
+      },
+      level2: {
+        label: "Level 2",
+        display_condition: {
+          field_address: "level1",
+          operator: "exists",
+        },
+      },
+    });
+
+    // toggle=on → level1 visible → level2 visible
+    const allVisible = resolveApplicableFields(fields, {
+      toggle: "on",
+      level1: "something",
+      level2: "deep",
+    });
+    expect(allVisible).toEqual(new Set(["toggle", "level1", "level2"]));
+
+    // toggle=off → level1 hidden → level2 hidden (cascade)
+    const cascadeHidden = resolveApplicableFields(fields, {
+      toggle: "off",
+      level1: "something",
+      level2: "deep",
+    });
+    expect(cascadeHidden).toEqual(new Set(["toggle"]));
+  });
+
+  it("handles fields hidden by another hidden field", () => {
+    // B depends on A, C depends on B. A is hidden → B is hidden → C is hidden.
+    const fields = makeFields({
+      a: {
+        label: "A",
+        display_condition: {
+          field_address: "external",
+          operator: "exists",
+        },
+      },
+      b: {
+        label: "B",
+        display_condition: {
+          field_address: "a",
+          operator: "exists",
+        },
+      },
+    });
+    const result = resolveApplicableFields(fields, {
+      external: "",
+      a: "val",
+      b: "val",
+    });
+    // external is empty → a hidden → b hidden
+    expect(result.size).toBe(0);
+  });
+
+  it("converges in one pass when there are no dependencies", () => {
+    const fields = makeFields({
+      a: { label: "A" },
+      b: {
+        label: "B",
+        display_condition: {
+          field_address: "a",
+          operator: "eq",
+          value: "x",
+        },
+      },
+    });
+    // Simple case - single dependency
+    const result = resolveApplicableFields(fields, { a: "x", b: "y" });
+    expect(result).toEqual(new Set(["a", "b"]));
+  });
+});
+
+export {};
diff --git a/clients/privacy-center/components/modals/consent-request-modal/ConsentRequestForm.tsx b/clients/privacy-center/components/modals/consent-request-modal/ConsentRequestForm.tsx
index f20c7200895..8baf2ddd049 100644
--- a/clients/privacy-center/components/modals/consent-request-modal/ConsentRequestForm.tsx
+++ b/clients/privacy-center/components/modals/consent-request-modal/ConsentRequestForm.tsx
@@ -40,6 +40,7 @@ const ConsentRequestForm = ({
     resetForm,
     identityInputs: { email: emailInput, phone: phoneInput },
     customPrivacyRequestFields,
+    applicableFields,
   } = useConsentRequestForm({
     onClose,
     setCurrentView,
@@ -111,58 +112,60 @@ const ConsentRequestForm = ({
             />
           </Form.Item>
         )}
-        {Object.entries(customPrivacyRequestFields).map(([key, item]) => {
-          const customFieldProps = (
-            value: string | string[],
-            fieldConfig: CustomConfigField,
-          ): CustomFieldRendererProps => {
-            const sharedProps = {
-              fieldKey: key,
-              onBlur: () => handleBlur({ target: { name: key } }),
-              error: touched[key] && errors[key] ? errors[key] : undefined,
-            };
-
-            switch (fieldConfig.field_type) {
-              case "multiselect":
-                return {
-                  ...fieldConfig,
-                  ...sharedProps,
-                  value: typeof value === "string" ? [value] : value,
-                  onChange: (v: Array<string>) => {
-                    setFieldValue(key, v);
-                  },
-                };
-              default:
-                return {
-                  ...fieldConfig,
-                  ...sharedProps,
-                  value: typeof value === "string" ? value : value?.[0],
-                  onChange: (v: string) => {
-                    setFieldValue(key, v);
-                  },
-                };
-            }
-          };
+        {Object.entries(customPrivacyRequestFields)
+          .filter(([key, field]) => !field?.hidden && applicableFields.has(key))
+          .map(([key, item]) => {
+            const customFieldProps = (
+              value: string | string[],
+              fieldConfig: CustomConfigField,
+            ): CustomFieldRendererProps => {
+              const sharedProps = {
+                fieldKey: key,
+                onBlur: () => handleBlur({ target: { name: key } }),
+                error: touched[key] && errors[key] ? errors[key] : undefined,
+              };
 
-          return (
-            <Form.Item
-              key={key}
-              id={key}
-              validateStatus={
-                touched[key] && Boolean(errors[key]) ? "error" : undefined
+              switch (fieldConfig.field_type) {
+                case "multiselect":
+                  return {
+                    ...fieldConfig,
+                    ...sharedProps,
+                    value: typeof value === "string" ? [value] : value,
+                    onChange: (v: Array<string>) => {
+                      setFieldValue(key, v);
+                    },
+                  };
+                default:
+                  return {
+                    ...fieldConfig,
+                    ...sharedProps,
+                    value: typeof value === "string" ? value : value?.[0],
+                    onChange: (v: string) => {
+                      setFieldValue(key, v);
+                    },
+                  };
               }
-              help={touched[key] && errors[key]}
-              required={item.required !== false}
-              hasFeedback={
-                item.field_type === "text" && touched[key] && !!errors[key]
-              }
-              label={item.label}
-              htmlFor={key}
-            >
-              <CustomFieldRenderer {...customFieldProps(values[key], item)} />
-            </Form.Item>
-          );
-        })}
+            };
+
+            return (
+              <Form.Item
+                key={key}
+                id={key}
+                validateStatus={
+                  touched[key] && Boolean(errors[key]) ? "error" : undefined
+                }
+                help={touched[key] && errors[key]}
+                required={item.required !== false}
+                hasFeedback={
+                  item.field_type === "text" && touched[key] && !!errors[key]
+                }
+                label={item.label}
+                htmlFor={key}
+              >
+                <CustomFieldRenderer {...customFieldProps(values[key], item)} />
+              </Form.Item>
+            );
+          })}
         <Flex justify="stretch" gap="medium">
           <Button type="default" variant="outlined" onClick={onClose} block>
             {config.consent?.button.cancelButtonText || "Cancel"}
diff --git a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
index aba09a9b64e..d84b0d8142b 100644
--- a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
+++ b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
@@ -2,7 +2,7 @@ import { getOrMakeFidesCookie, saveFidesCookie } from "fides-js";
 import { useChakraToast as useToast } from "fidesui";
 import { useFormik } from "formik";
 import { Headers } from "headers-polyfill";
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import * as Yup from "yup";
 
 import { addCommonHeaders } from "~/common/CommonHeaders";
@@ -15,6 +15,7 @@ import {
 import { DEFAULT_IDENTITY_INPUTS } from "~/constants";
 import { useConfig } from "~/features/common/config.slice";
 import { useSettings } from "~/features/common/settings.slice";
+import { useApplicableFields } from "~/hooks/useApplicableFields";
 import { useCustomFieldsForm } from "~/hooks/useCustomFieldsForm";
 import { PrivacyRequestSource } from "~/types/api/models/PrivacyRequestSource";
 import { FormValues } from "~/types/forms";
@@ -58,11 +59,48 @@ const useConsentRequestForm = ({
     searchParams: null, // ConsentRequestForm doesn't use URL params
   });
 
+  const initialValues = getInitialValues();
+
+  // Ref to hold current applicable fields — read inside validate/onSubmit closures
+  const applicableFieldsRef = useRef<Set<string>>(
+    new Set(Object.keys(customPrivacyRequestFields)),
+  );
+
+  // Build the static portion of the validation schema (identity fields)
+  const identityValidationSchema = Yup.object().shape({
+    email: emailValidation(identityInputs?.email!).test(
+      "one of email or phone entered",
+      "You must enter an email",
+      (_value, context) => {
+        if (identityInputs?.email === "required") {
+          return Boolean(context.parent.email);
+        }
+        return true;
+      },
+    ),
+    phone: phoneValidation(identityInputs?.phone!).test(
+      "one of email or phone entered",
+      "You must enter a phone number",
+      (_value, context) => {
+        if (identityInputs?.phone === "required") {
+          return Boolean(context.parent.phone);
+        }
+        return true;
+      },
+    ),
+  });
+
+  // Cache the last applicable-aware schema
+  const schemaCache = useRef<{
+    applicableKey: string;
+    schema: Yup.AnyObjectSchema;
+  } | null>(null);
+
   const formik = useFormik<FormValues>({
     initialValues: {
       email: "",
       phone: "",
-      ...getInitialValues(),
+      ...initialValues,
     },
     onSubmit: async (values) => {
       if (!cookie) {
@@ -71,17 +109,27 @@ const useConsentRequestForm = ({
 
       const { email, phone, ...customPrivacyRequestFieldValues } = values;
 
-      // populate the values from the form or from the field's default value
+      // populate the values from the form or from the field's default value,
+      // excluding fields gated off by display_condition
       const transformedCustomPrivacyRequestFields = Object.fromEntries(
-        Object.entries(customPrivacyRequestFields ?? {}).map(([key, field]) => [
-          key,
-          {
-            label: field.label,
-            value: field.hidden
-              ? field.default_value
-              : customPrivacyRequestFieldValues[key] || "",
-          },
-        ]),
+        Object.entries(customPrivacyRequestFields ?? {})
+          .filter(([key, field]) => {
+            // Keep hidden fields (they use default_value)
+            if (field.hidden) {
+              return true;
+            }
+            // Exclude fields gated off by display_condition
+            return applicableFieldsRef.current.has(key);
+          })
+          .map(([key, field]) => [
+            key,
+            {
+              label: field.label,
+              value: field.hidden
+                ? field.default_value
+                : customPrivacyRequestFieldValues[key] || "",
+            },
+          ]),
       );
 
       const body = {
@@ -157,32 +205,70 @@ const useConsentRequestForm = ({
         handleError({ title: "An unhandled exception occurred." });
       }
     },
-    validationSchema: Yup.object().shape({
-      email: emailValidation(identityInputs?.email!).test(
-        "one of email or phone entered",
-        "You must enter an email",
-        (_value, context) => {
-          if (identityInputs?.email === "required") {
-            return Boolean(context.parent.email);
-          }
-          return true;
-        },
-      ),
-      phone: phoneValidation(identityInputs?.phone!).test(
-        "one of email or phone entered",
-        "You must enter a phone number",
-        (_value, context) => {
-          if (identityInputs?.phone === "required") {
-            return Boolean(context.parent.phone);
-          }
-          return true;
-        },
-      ),
-      ...getValidationSchema().fields,
-    }),
+
+    validate: (values) => {
+      const currentApplicable = applicableFieldsRef.current;
+      const applicableKey = Array.from(currentApplicable).sort().join(",");
+      let combinedSchema: Yup.AnyObjectSchema;
+
+      if (schemaCache.current?.applicableKey === applicableKey) {
+        combinedSchema = schemaCache.current.schema;
+      } else {
+        const customFieldSchema = getValidationSchema(currentApplicable);
+        combinedSchema = identityValidationSchema.concat(
+          customFieldSchema,
+        ) as Yup.AnyObjectSchema;
+        schemaCache.current = { applicableKey, schema: combinedSchema };
+      }
+
+      try {
+        combinedSchema.validateSync(values, { abortEarly: false });
+        return {};
+      } catch (err) {
+        if (err instanceof Yup.ValidationError) {
+          const errors: Record<string, string> = {};
+          err.inner.forEach((e) => {
+            if (e.path && !errors[e.path]) {
+              errors[e.path] = e.message;
+            }
+          });
+          return errors;
+        }
+        return {};
+      }
+    },
   });
 
-  return { ...formik, identityInputs, customPrivacyRequestFields };
+  // Resolve which custom fields are applicable based on current form values
+  const applicableFields = useApplicableFields(
+    customPrivacyRequestFields as Record<string, any>,
+    formik.values,
+  );
+  applicableFieldsRef.current = applicableFields;
+
+  // Clear values when fields become non-applicable
+  const prevApplicable = useRef<Set<string>>(applicableFields);
+  useEffect(() => {
+    const prev = prevApplicable.current;
+    prevApplicable.current = applicableFields;
+
+    prev.forEach((key) => {
+      if (!applicableFields.has(key) && key in customPrivacyRequestFields) {
+        const fieldInitial = initialValues[key];
+        if (formik.values[key] !== fieldInitial) {
+          formik.setFieldValue(key, fieldInitial ?? "");
+        }
+      }
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [applicableFields]);
+
+  return {
+    ...formik,
+    identityInputs,
+    customPrivacyRequestFields,
+    applicableFields,
+  };
 };
 
 export default useConsentRequestForm;
diff --git a/clients/privacy-center/components/modals/privacy-request-modal/PrivacyRequestForm.tsx b/clients/privacy-center/components/modals/privacy-request-modal/PrivacyRequestForm.tsx
index 5c0204bb920..18e9f8e70b8 100644
--- a/clients/privacy-center/components/modals/privacy-request-modal/PrivacyRequestForm.tsx
+++ b/clients/privacy-center/components/modals/privacy-request-modal/PrivacyRequestForm.tsx
@@ -45,6 +45,7 @@ const PrivacyRequestForm = ({
     },
     customIdentityFields,
     customPrivacyRequestFields,
+    applicableFields,
   } = usePrivacyRequestForm({
     onExit,
     action,
@@ -140,7 +141,7 @@ const PrivacyRequestForm = ({
           ...customIdentityFields,
           ...customPrivacyRequestFields,
         })
-          .filter(([, field]) => !field?.hidden)
+          .filter(([key, field]) => !field?.hidden && applicableFields.has(key))
           .map(([key, item]) => {
             const customFieldProps = (
               value: string | string[],
diff --git a/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts b/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
index cedc185c83a..5921b6ec7e1 100644
--- a/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
+++ b/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
@@ -2,7 +2,7 @@ import { useChakraToast as useToast } from "fidesui";
 import { useFormik } from "formik";
 import { Headers } from "headers-polyfill";
 import { useSearchParams } from "next/navigation";
-import { useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import * as Yup from "yup";
 
 import { addCommonHeaders } from "~/common/CommonHeaders";
@@ -16,6 +16,7 @@ import {
 import { DEFAULT_IDENTITY_INPUTS } from "~/constants";
 import { useProperty } from "~/features/common/property.slice";
 import { useSettings } from "~/features/common/settings.slice";
+import { useApplicableFields } from "~/hooks/useApplicableFields";
 import { useCustomFieldsForm } from "~/hooks/useCustomFieldsForm";
 import { PrivacyRequestStatus } from "~/types";
 import { PrivacyRequestSource } from "~/types/api/models/PrivacyRequestSource";
@@ -84,6 +85,52 @@ const usePrivacyRequestForm = ({
     searchParams,
   });
 
+  const initialValues = getInitialValues();
+
+  // Ref to hold current applicable fields — updated after useApplicableFields,
+  // read inside validate/onSubmit closures to satisfy no-use-before-define
+  const applicableFieldsRef = useRef<Set<string>>(
+    new Set(Object.keys(customPrivacyRequestFields)),
+  );
+
+  // Build the static portion of the validation schema (identity fields)
+  const identityValidationSchema = Yup.object().shape({
+    name: nameValidation(nameInput),
+    email: emailValidation(emailInput).test(
+      "one of email or phone entered",
+      "You must enter either email or phone",
+      (_value, context) => {
+        if (emailInput === "optional" && phoneInput === "optional") {
+          return Boolean(context.parent.phone || context.parent.email);
+        }
+        return true;
+      },
+    ),
+    phone: phoneValidation(phoneInput).test(
+      "one of email or phone entered",
+      "You must enter either email or phone",
+      (_value, context) => {
+        if (emailInput === "optional" && phoneInput === "optional") {
+          return Boolean(context.parent.phone || context.parent.email);
+        }
+        return true;
+      },
+    ),
+    ...Object.fromEntries(
+      Object.entries(customIdentityFields).flatMap(([key, value]) => {
+        return value
+          ? [[key, Yup.string().required(`${value.label} is required`)]]
+          : [];
+      }),
+    ),
+  });
+
+  // Cache the last applicable-aware schema to avoid rebuilding on every keystroke
+  const schemaCache = useRef<{
+    applicableKey: string;
+    schema: Yup.AnyObjectSchema;
+  } | null>(null);
+
   const formik = useFormik<FormValues>({
     initialValues: {
       ...Object.fromEntries(
@@ -92,7 +139,7 @@ const usePrivacyRequestForm = ({
           ...customIdentityFields,
         }).map(([key]) => [key, ""]),
       ),
-      ...getInitialValues(),
+      ...initialValues,
       ...Object.fromEntries(
         Object.entries({
           ...legacyIdentityFields,
@@ -134,7 +181,16 @@ const usePrivacyRequestForm = ({
         action.custom_privacy_request_fields
           ? Object.fromEntries(
               Object.entries(action.custom_privacy_request_fields)
-                .filter(([, field]) => field.field_type !== "location")
+                .filter(([key, field]) => {
+                  if (field.field_type === "location") {
+                    return false;
+                  }
+                  // Exclude fields gated off by display_condition
+                  if (!applicableFieldsRef.current.has(key) && !field.hidden) {
+                    return false;
+                  }
+                  return true;
+                })
                 .map(([key, field]) => {
                   const paramValue =
                     field.query_param_key &&
@@ -253,45 +309,72 @@ const usePrivacyRequestForm = ({
         });
       }
     },
-    validationSchema: Yup.object().shape({
-      name: nameValidation(nameInput),
-      email: emailValidation(emailInput).test(
-        "one of email or phone entered",
-        "You must enter either email or phone",
-        (_value, context) => {
-          if (emailInput === "optional" && phoneInput === "optional") {
-            return Boolean(context.parent.phone || context.parent.email);
-          }
-          return true;
-        },
-      ),
-      phone: phoneValidation(phoneInput).test(
-        "one of email or phone entered",
-        "You must enter either email or phone",
-        (_value, context) => {
-          if (emailInput === "optional" && phoneInput === "optional") {
-            return Boolean(context.parent.phone || context.parent.email);
-          }
-          return true;
-        },
-      ),
-      ...Object.fromEntries(
-        Object.entries(customIdentityFields).flatMap(([key, value]) => {
-          return value
-            ? [[key, Yup.string().required(`${value.label} is required`)]]
-            : [];
-        }),
-      ),
-      ...getValidationSchema().fields,
-    }),
+
+    validate: (values) => {
+      // Build the custom fields schema filtered by applicable fields
+      const currentApplicable = applicableFieldsRef.current;
+      const applicableKey = Array.from(currentApplicable).sort().join(",");
+      let combinedSchema: Yup.AnyObjectSchema;
+
+      if (schemaCache.current?.applicableKey === applicableKey) {
+        combinedSchema = schemaCache.current.schema;
+      } else {
+        const customFieldSchema = getValidationSchema(currentApplicable);
+        combinedSchema = identityValidationSchema.concat(
+          customFieldSchema,
+        ) as Yup.AnyObjectSchema;
+        schemaCache.current = { applicableKey, schema: combinedSchema };
+      }
+
+      try {
+        combinedSchema.validateSync(values, { abortEarly: false });
+        return {};
+      } catch (err) {
+        if (err instanceof Yup.ValidationError) {
+          const errors: Record<string, string> = {};
+          err.inner.forEach((e) => {
+            if (e.path && !errors[e.path]) {
+              errors[e.path] = e.message;
+            }
+          });
+          return errors;
+        }
+        return {};
+      }
+    },
   });
 
+  // Resolve which custom fields are applicable based on current form values
+  const applicableFields = useApplicableFields(
+    customPrivacyRequestFields,
+    formik.values,
+  );
+  applicableFieldsRef.current = applicableFields;
+
+  // Clear values when fields become non-applicable
+  const prevApplicable = useRef<Set<string>>(applicableFields);
+  useEffect(() => {
+    const prev = prevApplicable.current;
+    prevApplicable.current = applicableFields;
+
+    prev.forEach((key) => {
+      if (!applicableFields.has(key) && key in customPrivacyRequestFields) {
+        const fieldInitial = initialValues[key];
+        if (formik.values[key] !== fieldInitial) {
+          formik.setFieldValue(key, fieldInitial ?? "");
+        }
+      }
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [applicableFields]);
+
   return {
     ...formik,
     isSubmitting: formik.isSubmitting || isSubmitPending,
     legacyIdentityFields,
     customIdentityFields,
     customPrivacyRequestFields,
+    applicableFields,
   };
 };
 
diff --git a/clients/privacy-center/hooks/useApplicableFields.ts b/clients/privacy-center/hooks/useApplicableFields.ts
new file mode 100644
index 00000000000..e9cfbfeda6a
--- /dev/null
+++ b/clients/privacy-center/hooks/useApplicableFields.ts
@@ -0,0 +1,93 @@
+import { useMemo, useRef } from "react";
+
+import { resolveApplicableFields } from "~/lib/condition-evaluator";
+import type { CustomConfigField } from "~/types/config";
+
+/**
+ * Extracts the set of field keys that are referenced by any display_condition
+ * across the given field definitions.
+ */
+const extractWatchedKeys = (
+  fields: Record<string, CustomConfigField>,
+): Set<string> => {
+  const watched = new Set<string>();
+
+  const walk = (condition: unknown): void => {
+    if (!condition || typeof condition !== "object") {
+      return;
+    }
+    if ("field_address" in (condition as Record<string, unknown>)) {
+      watched.add((condition as { field_address: string }).field_address);
+    }
+    if ("conditions" in (condition as Record<string, unknown>)) {
+      const group = condition as { conditions: unknown[] };
+      group.conditions.forEach(walk);
+    }
+  };
+
+  Object.values(fields).forEach((field) => {
+    if (field.display_condition) {
+      walk(field.display_condition);
+    }
+  });
+
+  return watched;
+};
+
+const setsEqual = (a: Set<string>, b: Set<string>): boolean => {
+  if (a.size !== b.size) {
+    return false;
+  }
+  let equal = true;
+  a.forEach((item) => {
+    if (!b.has(item)) {
+      equal = false;
+    }
+  });
+  return equal;
+};
+
+/**
+ * React hook that resolves which custom fields are currently applicable
+ * based on form values and display_condition rules.
+ *
+ * Returns a stable Set<string> of applicable field keys — the same reference
+ * is returned when the result hasn't changed.
+ */
+export const useApplicableFields = (
+  customFields: Record<string, CustomConfigField>,
+  formValues: Record<string, string | string[]>,
+): Set<string> => {
+  const prevResult = useRef<Set<string>>(new Set());
+
+  const watchedKeys = useMemo(
+    () => extractWatchedKeys(customFields),
+    [customFields],
+  );
+
+  // Snapshot only the watched values into a stable string for memoization
+  const watchedSnapshot = useMemo(() => {
+    if (watchedKeys.size === 0) {
+      return "";
+    }
+    const entries: string[] = [];
+    watchedKeys.forEach((key) => {
+      const val = formValues[key];
+      entries.push(
+        `${key}=${Array.isArray(val) ? val.join(",") : (val ?? "")}`,
+      );
+    });
+    return entries.sort().join("|");
+  }, [watchedKeys, formValues]);
+
+  return useMemo(() => {
+    const result = resolveApplicableFields(customFields, formValues);
+    // Return the same reference if the set hasn't changed
+    if (setsEqual(result, prevResult.current)) {
+      return prevResult.current;
+    }
+    prevResult.current = result;
+    return result;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [customFields, watchedSnapshot]);
+};
diff --git a/clients/privacy-center/hooks/useCustomFieldsForm.ts b/clients/privacy-center/hooks/useCustomFieldsForm.ts
index fbde656ccf7..e0c11d5baaa 100644
--- a/clients/privacy-center/hooks/useCustomFieldsForm.ts
+++ b/clients/privacy-center/hooks/useCustomFieldsForm.ts
@@ -9,6 +9,47 @@ interface UseCustomFieldsFormProps {
   searchParams?: URLSearchParams | null;
 }
 
+/**
+ * Build a Yup validation schema for custom fields, filtering out fields that
+ * are hidden or not in the applicable set.
+ */
+export const buildCustomFieldsValidationSchema = (
+  fields: Record<string, CustomConfigField>,
+  applicableFields?: Set<string>,
+) => {
+  return Yup.object({
+    ...Object.fromEntries(
+      Object.entries(fields)
+        .filter(([key, field]) => {
+          if (field.hidden) {
+            return false;
+          }
+          if (applicableFields && !applicableFields.has(key)) {
+            return false;
+          }
+          return true;
+        })
+        .map(([key, { label, required, field_type }]) => {
+          const isRequired = required !== false;
+          if (field_type === "multiselect") {
+            return [
+              key,
+              isRequired
+                ? Yup.array().min(1, `${label} is required`)
+                : Yup.array().notRequired(),
+            ];
+          }
+          return [
+            key,
+            isRequired
+              ? Yup.string().required(`${label} is required`)
+              : Yup.string().notRequired(),
+          ];
+        }),
+    ),
+  });
+};
+
 export const useCustomFieldsForm = ({
   customPrivacyRequestFields,
   searchParams,
@@ -58,33 +99,11 @@ export const useCustomFieldsForm = ({
     return values;
   };
 
-  const getValidationSchema = () => {
-    const schema = Yup.object({
-      ...Object.fromEntries(
-        Object.entries(customPrivacyRequestFields)
-          .filter(([, field]) => !field.hidden)
-          .map(([key, { label, required, field_type }]) => {
-            const isRequired = required !== false;
-            if (field_type === "multiselect") {
-              return [
-                key,
-                isRequired
-                  ? Yup.array().min(1, `${label} is required`)
-                  : Yup.array().notRequired(),
-              ];
-            }
-            return [
-              key,
-              isRequired
-                ? Yup.string().required(`${label} is required`)
-                : Yup.string().notRequired(),
-            ];
-          }),
-      ),
-    });
-
-    return schema;
-  };
+  const getValidationSchema = (applicableFields?: Set<string>) =>
+    buildCustomFieldsValidationSchema(
+      customPrivacyRequestFields,
+      applicableFields,
+    );
 
   return { getInitialValues, getValidationSchema };
 };
diff --git a/clients/privacy-center/lib/condition-evaluator.ts b/clients/privacy-center/lib/condition-evaluator.ts
new file mode 100644
index 00000000000..bd65fa5fea0
--- /dev/null
+++ b/clients/privacy-center/lib/condition-evaluator.ts
@@ -0,0 +1,168 @@
+import type { Condition, ConditionGroup, ConditionLeaf } from "~/types/config";
+
+const setsEqual = (a: Set<string>, b: Set<string>): boolean => {
+  if (a.size !== b.size) {
+    return false;
+  }
+  let equal = true;
+  a.forEach((item) => {
+    if (!b.has(item)) {
+      equal = false;
+    }
+  });
+  return equal;
+};
+
+/**
+ * Check whether a value should be considered "present" for exists/not_exists.
+ * Empty strings and empty arrays are treated as absent, matching backend behavior.
+ */
+const hasValue = (val: unknown): boolean => {
+  if (val === null || val === undefined) {
+    return false;
+  }
+  if (val === "") {
+    return false;
+  }
+  if (Array.isArray(val) && val.length === 0) {
+    return false;
+  }
+  return true;
+};
+
+type ConditionValue = ConditionLeaf["value"];
+
+const applyOperator = (
+  operator: string,
+  actual: unknown,
+  expected: ConditionValue,
+): boolean => {
+  switch (operator) {
+    case "eq":
+      // Both null-ish values are considered equal
+      if (!hasValue(actual) && !hasValue(expected)) {
+        return true;
+      }
+      return actual === expected;
+
+    case "neq":
+      if (!hasValue(actual) && !hasValue(expected)) {
+        return false;
+      }
+      return actual !== expected;
+
+    case "exists":
+      return hasValue(actual);
+
+    case "not_exists":
+      return !hasValue(actual);
+
+    case "list_contains": {
+      // data is array, check if it contains the expected value
+      if (Array.isArray(actual)) {
+        return actual.includes(expected);
+      }
+      // expected is array, check if it contains the actual value
+      if (Array.isArray(expected)) {
+        return expected.includes(actual as string | number | boolean);
+      }
+      return false;
+    }
+
+    default:
+      return false;
+  }
+};
+
+/**
+ * Evaluate a single condition (leaf or group) against a flat data record.
+ * Returns false on any error, matching backend behavior (conservative: field hidden).
+ */
+export const evaluateCondition = (
+  condition: Condition,
+  data: Record<string, unknown>,
+): boolean => {
+  try {
+    if ("field_address" in condition) {
+      // ConditionLeaf
+      const leaf = condition as ConditionLeaf;
+      const actual = data[leaf.field_address];
+      return applyOperator(leaf.operator, actual, leaf.value);
+    }
+    // ConditionGroup
+    const group = condition as ConditionGroup;
+    const results = group.conditions.map((c) => evaluateCondition(c, data));
+    return group.logical_operator === "and"
+      ? results.every(Boolean)
+      : results.some(Boolean);
+  } catch {
+    return false;
+  }
+};
+
+/**
+ * Evaluate a single field's applicability given a data view.
+ * Extracted to avoid the no-loop-func lint rule in resolveApplicableFields.
+ */
+const isFieldApplicable = (
+  condition: Condition | null | undefined,
+  dataView: Record<string, unknown>,
+): boolean => {
+  if (!condition) {
+    return true;
+  }
+  try {
+    return evaluateCondition(condition, dataView);
+  } catch {
+    return false;
+  }
+};
+
+/**
+ * Evaluate one iteration of the fixed-point loop: given the current applicable
+ * set, build a data view and return the next applicable set.
+ */
+const evaluateFieldSet = <T extends { display_condition?: Condition | null }>(
+  currentApplicable: Set<string>,
+  fields: Record<string, T>,
+  formValues: Record<string, unknown>,
+): Set<string> => {
+  const dataView: Record<string, unknown> = {};
+  currentApplicable.forEach((key) => {
+    dataView[key] = formValues[key];
+  });
+
+  const next = new Set<string>();
+  currentApplicable.forEach((key) => {
+    const field = fields[key];
+    if (isFieldApplicable(field.display_condition, dataView)) {
+      next.add(key);
+    }
+  });
+  return next;
+};
+
+/**
+ * Fixed-point iteration to resolve which fields are applicable given current
+ * form values. Mirrors the backend's `_resolve_applicable` algorithm.
+ *
+ * The condition graph is guaranteed acyclic (validated at save time), so this
+ * converges in at most N iterations where N = number of fields.
+ */
+export const resolveApplicableFields = <
+  T extends { display_condition?: Condition | null },
+>(
+  fields: Record<string, T>,
+  formValues: Record<string, unknown>,
+): Set<string> => {
+  const keys = Object.keys(fields);
+  let applicable = new Set(keys);
+  let previous: Set<string>;
+
+  do {
+    previous = applicable;
+    applicable = evaluateFieldSet(previous, fields, formValues);
+  } while (!setsEqual(applicable, previous));
+
+  return applicable;
+};
diff --git a/clients/privacy-center/types/config.ts b/clients/privacy-center/types/config.ts
index 2d39bc59e8a..ff33ff2c2b9 100644
--- a/clients/privacy-center/types/config.ts
+++ b/clients/privacy-center/types/config.ts
@@ -17,11 +17,36 @@ export type CustomIdentityFields = Record<
 
 export type IdentityInputs = DefaultIdentities & CustomIdentityFields;
 
+// Display condition types — mirrors the backend's Condition schema but restricted
+// to the 5 operators allowed for display_condition on custom fields.
+export type DisplayOperator =
+  | "eq"
+  | "neq"
+  | "exists"
+  | "not_exists"
+  | "list_contains";
+
+export type DisplayGroupOperator = "and" | "or";
+
+export interface ConditionLeaf {
+  field_address: string;
+  operator: DisplayOperator;
+  value?: string | number | boolean | Array<string | number | boolean> | null;
+}
+
+export interface ConditionGroup {
+  logical_operator: DisplayGroupOperator;
+  conditions: Array<ConditionLeaf | ConditionGroup>;
+}
+
+export type Condition = ConditionLeaf | ConditionGroup;
+
 export interface ICustomField {
   label: string;
   required?: boolean;
   query_param_key?: string | null;
   hidden?: boolean;
+  display_condition?: Condition | null;
 }
 
 export interface CustomTextField extends ICustomField {
diff --git a/clients/privacy-center/types/forms.ts b/clients/privacy-center/types/forms.ts
index f5e03ad8ea0..38fb3437a82 100644
--- a/clients/privacy-center/types/forms.ts
+++ b/clients/privacy-center/types/forms.ts
@@ -11,6 +11,7 @@ export interface CustomPrivacyRequestField {
   hidden?: boolean;
   query_param_key?: string;
   ip_geolocation_hint?: boolean;
+  display_condition?: import("./config").Condition | null;
 }
 
 export interface CustomPrivacyRequestFields {

From fbb0fc0ac39ac549f2e5c224650e20a2932afc3d Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Tue, 12 May 2026 10:16:28 -0500
Subject: [PATCH 02/11] add changelog for PR #8163

---
 changelog/8163-conditional-field-validation.yaml | 4 ++++
 1 file changed, 4 insertions(+)
 create mode 100644 changelog/8163-conditional-field-validation.yaml

diff --git a/changelog/8163-conditional-field-validation.yaml b/changelog/8163-conditional-field-validation.yaml
new file mode 100644
index 00000000000..daebb3464d5
--- /dev/null
+++ b/changelog/8163-conditional-field-validation.yaml
@@ -0,0 +1,4 @@
+type: Added
+description: Added client-side conditional validation for privacy center custom form fields, allowing fields to show/hide based on display_condition rules
+pr: 8163
+labels: []

From 9a1ed3841ea92e8e33612511e899c88a55ac0562 Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Fri, 15 May 2026 11:41:26 -0500
Subject: [PATCH 03/11] fix code review findings: reset validationError,
 useEffect for ref, Alert title prop

---
 .../__tests__/lib/condition-evaluator.test.ts  |  1 +
 .../ConsentRequestForm.tsx                     | 10 +++++++++-
 .../useConsentRequestForm.ts                   | 18 +++++++++++++-----
 .../PrivacyRequestForm.tsx                     | 16 ++++++++++++++--
 .../usePrivacyRequestForm.ts                   | 10 ++++++++--
 .../hooks/useApplicableFields.ts               | 14 +-------------
 .../privacy-center/lib/condition-evaluator.ts  | 13 +------------
 clients/privacy-center/lib/set-utils.ts        | 12 ++++++++++++
 8 files changed, 59 insertions(+), 35 deletions(-)
 create mode 100644 clients/privacy-center/lib/set-utils.ts

diff --git a/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts b/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
index e789cf17b98..3595f2ba52e 100644
--- a/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
+++ b/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
@@ -464,3 +464,4 @@ describe("resolveApplicableFields", () => {
 });
 
 export {};
+
diff --git a/clients/privacy-center/components/modals/consent-request-modal/ConsentRequestForm.tsx b/clients/privacy-center/components/modals/consent-request-modal/ConsentRequestForm.tsx
index 8baf2ddd049..9ce666d00e1 100644
--- a/clients/privacy-center/components/modals/consent-request-modal/ConsentRequestForm.tsx
+++ b/clients/privacy-center/components/modals/consent-request-modal/ConsentRequestForm.tsx
@@ -1,4 +1,4 @@
-import { Button, Flex, Form, Input, Text } from "fidesui";
+import { Alert, Button, Flex, Form, Input, Text } from "fidesui";
 import React, { useEffect } from "react";
 
 import CustomFieldRenderer, {
@@ -41,6 +41,7 @@ const ConsentRequestForm = ({
     identityInputs: { email: emailInput, phone: phoneInput },
     customPrivacyRequestFields,
     applicableFields,
+    validationError,
   } = useConsentRequestForm({
     onClose,
     setCurrentView,
@@ -68,6 +69,13 @@ const ConsentRequestForm = ({
         layout="vertical"
         data-testid="consent-request-form"
       >
+        {validationError && (
+          <Alert
+            type="error"
+            title="Something went wrong. Please try again later."
+            showIcon
+          />
+        )}
         {!!emailInput && (
           <Form.Item
             validateStatus={
diff --git a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
index d84b0d8142b..252c96d6580 100644
--- a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
+++ b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
@@ -18,6 +18,7 @@ import { useSettings } from "~/features/common/settings.slice";
 import { useApplicableFields } from "~/hooks/useApplicableFields";
 import { useCustomFieldsForm } from "~/hooks/useCustomFieldsForm";
 import { PrivacyRequestSource } from "~/types/api/models/PrivacyRequestSource";
+import type { CustomConfigField } from "~/types/config";
 import { FormValues } from "~/types/forms";
 
 const useConsentRequestForm = ({
@@ -37,13 +38,15 @@ const useConsentRequestForm = ({
   const identityInputs =
     config.consent?.button.identity_inputs ?? DEFAULT_IDENTITY_INPUTS;
   const customPrivacyRequestFields =
-    config.consent?.button.custom_privacy_request_fields ?? {};
+    (config.consent?.button.custom_privacy_request_fields ??
+      {}) as Record<string, CustomConfigField>;
   const settings = useSettings();
   const { BASE_64_COOKIE } = settings;
   const toast = useToast();
   const [cookie, setCookie] = useState<Awaited<
     ReturnType<typeof getOrMakeFidesCookie>
   > | null>(null);
+  const [validationError, setValidationError] = useState(false);
 
   useEffect(() => {
     const loadCookie = async () => {
@@ -55,7 +58,7 @@ const useConsentRequestForm = ({
 
   // Use our custom hook for form field logic
   const { getInitialValues, getValidationSchema } = useCustomFieldsForm({
-    customPrivacyRequestFields: customPrivacyRequestFields as any,
+    customPrivacyRequestFields,
     searchParams: null, // ConsentRequestForm doesn't use URL params
   });
 
@@ -207,6 +210,7 @@ const useConsentRequestForm = ({
     },
 
     validate: (values) => {
+      setValidationError(false);
       const currentApplicable = applicableFieldsRef.current;
       const applicableKey = Array.from(currentApplicable).sort().join(",");
       let combinedSchema: Yup.AnyObjectSchema;
@@ -234,17 +238,20 @@ const useConsentRequestForm = ({
           });
           return errors;
         }
-        return {};
+        setValidationError(true);
+        return { _form: "An unexpected error occurred." };
       }
     },
   });
 
   // Resolve which custom fields are applicable based on current form values
   const applicableFields = useApplicableFields(
-    customPrivacyRequestFields as Record<string, any>,
+    customPrivacyRequestFields,
     formik.values,
   );
-  applicableFieldsRef.current = applicableFields;
+  useEffect(() => {
+    applicableFieldsRef.current = applicableFields;
+  }, [applicableFields]);
 
   // Clear values when fields become non-applicable
   const prevApplicable = useRef<Set<string>>(applicableFields);
@@ -268,6 +275,7 @@ const useConsentRequestForm = ({
     identityInputs,
     customPrivacyRequestFields,
     applicableFields,
+    validationError,
   };
 };
 
diff --git a/clients/privacy-center/components/modals/privacy-request-modal/PrivacyRequestForm.tsx b/clients/privacy-center/components/modals/privacy-request-modal/PrivacyRequestForm.tsx
index 18e9f8e70b8..88af26eca5f 100644
--- a/clients/privacy-center/components/modals/privacy-request-modal/PrivacyRequestForm.tsx
+++ b/clients/privacy-center/components/modals/privacy-request-modal/PrivacyRequestForm.tsx
@@ -1,4 +1,4 @@
-import { Button, Flex, Form, Input, Text } from "fidesui";
+import { Alert, Button, Flex, Form, Input, Text } from "fidesui";
 import React from "react";
 
 import CustomFieldRenderer, {
@@ -46,6 +46,7 @@ const PrivacyRequestForm = ({
     customIdentityFields,
     customPrivacyRequestFields,
     applicableFields,
+    validationError,
   } = usePrivacyRequestForm({
     onExit,
     action,
@@ -72,6 +73,13 @@ const PrivacyRequestForm = ({
             <Text size="sm">{paragraph}</Text>
           </Form.Item>
         ))}
+        {validationError && (
+          <Alert
+            type="error"
+            title="Something went wrong. Please try again later."
+            showIcon
+          />
+        )}
         {!!nameInput && (
           <Form.Item
             className="pc-field pc-field--name"
@@ -141,7 +149,11 @@ const PrivacyRequestForm = ({
           ...customIdentityFields,
           ...customPrivacyRequestFields,
         })
-          .filter(([key, field]) => !field?.hidden && applicableFields.has(key))
+          .filter(
+            ([key, field]) =>
+              !field?.hidden &&
+              (key in customIdentityFields || applicableFields.has(key)),
+          )
           .map(([key, item]) => {
             const customFieldProps = (
               value: string | string[],
diff --git a/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts b/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
index 5921b6ec7e1..51199174829 100644
--- a/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
+++ b/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
@@ -75,6 +75,7 @@ const usePrivacyRequestForm = ({
     action?.custom_privacy_request_fields ?? {};
   const toast = useToast();
   const [isSubmitPending, setIsSubmitPending] = useState(false);
+  const [validationError, setValidationError] = useState(false);
   const searchParams = useSearchParams();
 
   const property = useProperty();
@@ -311,6 +312,7 @@ const usePrivacyRequestForm = ({
     },
 
     validate: (values) => {
+      setValidationError(false);
       // Build the custom fields schema filtered by applicable fields
       const currentApplicable = applicableFieldsRef.current;
       const applicableKey = Array.from(currentApplicable).sort().join(",");
@@ -339,7 +341,8 @@ const usePrivacyRequestForm = ({
           });
           return errors;
         }
-        return {};
+        setValidationError(true);
+        return { _form: "An unexpected error occurred." };
       }
     },
   });
@@ -349,7 +352,9 @@ const usePrivacyRequestForm = ({
     customPrivacyRequestFields,
     formik.values,
   );
-  applicableFieldsRef.current = applicableFields;
+  useEffect(() => {
+    applicableFieldsRef.current = applicableFields;
+  }, [applicableFields]);
 
   // Clear values when fields become non-applicable
   const prevApplicable = useRef<Set<string>>(applicableFields);
@@ -375,6 +380,7 @@ const usePrivacyRequestForm = ({
     customIdentityFields,
     customPrivacyRequestFields,
     applicableFields,
+    validationError,
   };
 };
 
diff --git a/clients/privacy-center/hooks/useApplicableFields.ts b/clients/privacy-center/hooks/useApplicableFields.ts
index e9cfbfeda6a..5dbe7002e78 100644
--- a/clients/privacy-center/hooks/useApplicableFields.ts
+++ b/clients/privacy-center/hooks/useApplicableFields.ts
@@ -1,6 +1,7 @@
 import { useMemo, useRef } from "react";
 
 import { resolveApplicableFields } from "~/lib/condition-evaluator";
+import { setsEqual } from "~/lib/set-utils";
 import type { CustomConfigField } from "~/types/config";
 
 /**
@@ -34,19 +35,6 @@ const extractWatchedKeys = (
   return watched;
 };
 
-const setsEqual = (a: Set<string>, b: Set<string>): boolean => {
-  if (a.size !== b.size) {
-    return false;
-  }
-  let equal = true;
-  a.forEach((item) => {
-    if (!b.has(item)) {
-      equal = false;
-    }
-  });
-  return equal;
-};
-
 /**
  * React hook that resolves which custom fields are currently applicable
  * based on form values and display_condition rules.
diff --git a/clients/privacy-center/lib/condition-evaluator.ts b/clients/privacy-center/lib/condition-evaluator.ts
index bd65fa5fea0..7584fe67e96 100644
--- a/clients/privacy-center/lib/condition-evaluator.ts
+++ b/clients/privacy-center/lib/condition-evaluator.ts
@@ -1,17 +1,6 @@
 import type { Condition, ConditionGroup, ConditionLeaf } from "~/types/config";
 
-const setsEqual = (a: Set<string>, b: Set<string>): boolean => {
-  if (a.size !== b.size) {
-    return false;
-  }
-  let equal = true;
-  a.forEach((item) => {
-    if (!b.has(item)) {
-      equal = false;
-    }
-  });
-  return equal;
-};
+import { setsEqual } from "./set-utils";
 
 /**
  * Check whether a value should be considered "present" for exists/not_exists.
diff --git a/clients/privacy-center/lib/set-utils.ts b/clients/privacy-center/lib/set-utils.ts
new file mode 100644
index 00000000000..c4985f3f0ef
--- /dev/null
+++ b/clients/privacy-center/lib/set-utils.ts
@@ -0,0 +1,12 @@
+export const setsEqual = (a: Set<string>, b: Set<string>): boolean => {
+  if (a.size !== b.size) {
+    return false;
+  }
+  let equal = true;
+  a.forEach((item) => {
+    if (!b.has(item)) {
+      equal = false;
+    }
+  });
+  return equal;
+};

From 703d9d4fad796332a93d4e829bf385cc38acb7b2 Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Fri, 15 May 2026 16:37:59 -0500
Subject: [PATCH 04/11] fix phone regex rejecting empty strings when field is
 optional

---
 .../modals/consent-request-modal/useConsentRequestForm.ts | 4 +---
 .../modals/privacy-request-modal/usePrivacyRequestForm.ts | 4 +---
 clients/privacy-center/components/modals/validation.ts    | 8 ++++----
 3 files changed, 6 insertions(+), 10 deletions(-)

diff --git a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
index 252c96d6580..9b88b4e8255 100644
--- a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
+++ b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
@@ -249,9 +249,7 @@ const useConsentRequestForm = ({
     customPrivacyRequestFields,
     formik.values,
   );
-  useEffect(() => {
-    applicableFieldsRef.current = applicableFields;
-  }, [applicableFields]);
+  applicableFieldsRef.current = applicableFields;
 
   // Clear values when fields become non-applicable
   const prevApplicable = useRef<Set<string>>(applicableFields);
diff --git a/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts b/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
index 51199174829..1994f890e80 100644
--- a/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
+++ b/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
@@ -352,9 +352,7 @@ const usePrivacyRequestForm = ({
     customPrivacyRequestFields,
     formik.values,
   );
-  useEffect(() => {
-    applicableFieldsRef.current = applicableFields;
-  }, [applicableFields]);
+  applicableFieldsRef.current = applicableFields;
 
   // Clear values when fields become non-applicable
   const prevApplicable = useRef<Set<string>>(applicableFields);
diff --git a/clients/privacy-center/components/modals/validation.ts b/clients/privacy-center/components/modals/validation.ts
index 30e1aef4366..cce60a06fe7 100644
--- a/clients/privacy-center/components/modals/validation.ts
+++ b/clients/privacy-center/components/modals/validation.ts
@@ -22,10 +22,10 @@ export const emailValidation = (option?: string | null) => {
 
 export const phoneValidation = (option?: string | null) => {
   // E.164 international standard format
-  let validation = Yup.string().matches(
-    /^\+[1-9]\d{1,14}$/,
-    "Phone is invalid",
-  );
+  let validation = Yup.string().matches(/^\+[1-9]\d{1,14}$/, {
+    message: "Phone is invalid",
+    excludeEmptyString: true,
+  });
   if (option === "required") {
     validation = validation.required("Phone is required");
   } else {

From aa8bb8016a13801e079d33c4ec8ab8dbc0b02896 Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Fri, 15 May 2026 17:11:23 -0500
Subject: [PATCH 05/11] address code review findings: loop guard, dedup hooks,
 memoization, type safety

---
 .../__tests__/lib/condition-evaluator.test.ts |   3 -
 .../useConsentRequestForm.ts                  | 138 ++++++----------
 .../usePrivacyRequestForm.ts                  | 153 +++++++-----------
 .../hooks/useApplicableFields.ts              |  26 ++-
 .../hooks/useConditionalValidation.ts         | 117 ++++++++++++++
 .../hooks/useCustomFieldsForm.ts              |  18 ++-
 .../privacy-center/lib/condition-evaluator.ts |  16 +-
 7 files changed, 253 insertions(+), 218 deletions(-)
 create mode 100644 clients/privacy-center/hooks/useConditionalValidation.ts

diff --git a/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts b/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
index 3595f2ba52e..4d11f70ac2d 100644
--- a/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
+++ b/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
@@ -462,6 +462,3 @@ describe("resolveApplicableFields", () => {
     expect(result).toEqual(new Set(["a", "b"]));
   });
 });
-
-export {};
-
diff --git a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
index 9b88b4e8255..636a460e4f9 100644
--- a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
+++ b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
@@ -2,7 +2,7 @@ import { getOrMakeFidesCookie, saveFidesCookie } from "fides-js";
 import { useChakraToast as useToast } from "fidesui";
 import { useFormik } from "formik";
 import { Headers } from "headers-polyfill";
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import * as Yup from "yup";
 
 import { addCommonHeaders } from "~/common/CommonHeaders";
@@ -15,7 +15,10 @@ import {
 import { DEFAULT_IDENTITY_INPUTS } from "~/constants";
 import { useConfig } from "~/features/common/config.slice";
 import { useSettings } from "~/features/common/settings.slice";
-import { useApplicableFields } from "~/hooks/useApplicableFields";
+import {
+  useApplicabilitySync,
+  useConditionalValidate,
+} from "~/hooks/useConditionalValidation";
 import { useCustomFieldsForm } from "~/hooks/useCustomFieldsForm";
 import { PrivacyRequestSource } from "~/types/api/models/PrivacyRequestSource";
 import type { CustomConfigField } from "~/types/config";
@@ -46,8 +49,6 @@ const useConsentRequestForm = ({
   const [cookie, setCookie] = useState<Awaited<
     ReturnType<typeof getOrMakeFidesCookie>
   > | null>(null);
-  const [validationError, setValidationError] = useState(false);
-
   useEffect(() => {
     const loadCookie = async () => {
       const loadedCookie = await getOrMakeFidesCookie();
@@ -62,42 +63,45 @@ const useConsentRequestForm = ({
     searchParams: null, // ConsentRequestForm doesn't use URL params
   });
 
-  const initialValues = getInitialValues();
-
-  // Ref to hold current applicable fields — read inside validate/onSubmit closures
-  const applicableFieldsRef = useRef<Set<string>>(
-    new Set(Object.keys(customPrivacyRequestFields)),
+  const initialValues = useMemo(
+    () => getInitialValues(),
+    [getInitialValues],
   );
 
   // Build the static portion of the validation schema (identity fields)
-  const identityValidationSchema = Yup.object().shape({
-    email: emailValidation(identityInputs?.email!).test(
-      "one of email or phone entered",
-      "You must enter an email",
-      (_value, context) => {
-        if (identityInputs?.email === "required") {
-          return Boolean(context.parent.email);
-        }
-        return true;
-      },
-    ),
-    phone: phoneValidation(identityInputs?.phone!).test(
-      "one of email or phone entered",
-      "You must enter a phone number",
-      (_value, context) => {
-        if (identityInputs?.phone === "required") {
-          return Boolean(context.parent.phone);
-        }
-        return true;
-      },
-    ),
-  });
+  const identityValidationSchema = useMemo(
+    () =>
+      Yup.object().shape({
+        email: emailValidation(identityInputs?.email!).test(
+          "one of email or phone entered",
+          "You must enter an email",
+          (_value, context) => {
+            if (identityInputs?.email === "required") {
+              return Boolean(context.parent.email);
+            }
+            return true;
+          },
+        ),
+        phone: phoneValidation(identityInputs?.phone!).test(
+          "one of email or phone entered",
+          "You must enter a phone number",
+          (_value, context) => {
+            if (identityInputs?.phone === "required") {
+              return Boolean(context.parent.phone);
+            }
+            return true;
+          },
+        ),
+      }),
+    [identityInputs?.email, identityInputs?.phone],
+  );
 
-  // Cache the last applicable-aware schema
-  const schemaCache = useRef<{
-    applicableKey: string;
-    schema: Yup.AnyObjectSchema;
-  } | null>(null);
+  const { validate, applicableFieldsRef, validationError } =
+    useConditionalValidate({
+      customPrivacyRequestFields,
+      identityValidationSchema,
+      getValidationSchema,
+    });
 
   const formik = useFormik<FormValues>({
     initialValues: {
@@ -209,64 +213,16 @@ const useConsentRequestForm = ({
       }
     },
 
-    validate: (values) => {
-      setValidationError(false);
-      const currentApplicable = applicableFieldsRef.current;
-      const applicableKey = Array.from(currentApplicable).sort().join(",");
-      let combinedSchema: Yup.AnyObjectSchema;
-
-      if (schemaCache.current?.applicableKey === applicableKey) {
-        combinedSchema = schemaCache.current.schema;
-      } else {
-        const customFieldSchema = getValidationSchema(currentApplicable);
-        combinedSchema = identityValidationSchema.concat(
-          customFieldSchema,
-        ) as Yup.AnyObjectSchema;
-        schemaCache.current = { applicableKey, schema: combinedSchema };
-      }
-
-      try {
-        combinedSchema.validateSync(values, { abortEarly: false });
-        return {};
-      } catch (err) {
-        if (err instanceof Yup.ValidationError) {
-          const errors: Record<string, string> = {};
-          err.inner.forEach((e) => {
-            if (e.path && !errors[e.path]) {
-              errors[e.path] = e.message;
-            }
-          });
-          return errors;
-        }
-        setValidationError(true);
-        return { _form: "An unexpected error occurred." };
-      }
-    },
+    validate,
   });
 
-  // Resolve which custom fields are applicable based on current form values
-  const applicableFields = useApplicableFields(
+  const applicableFields = useApplicabilitySync({
     customPrivacyRequestFields,
-    formik.values,
-  );
-  applicableFieldsRef.current = applicableFields;
-
-  // Clear values when fields become non-applicable
-  const prevApplicable = useRef<Set<string>>(applicableFields);
-  useEffect(() => {
-    const prev = prevApplicable.current;
-    prevApplicable.current = applicableFields;
-
-    prev.forEach((key) => {
-      if (!applicableFields.has(key) && key in customPrivacyRequestFields) {
-        const fieldInitial = initialValues[key];
-        if (formik.values[key] !== fieldInitial) {
-          formik.setFieldValue(key, fieldInitial ?? "");
-        }
-      }
-    });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [applicableFields]);
+    applicableFieldsRef,
+    initialValues,
+    formValues: formik.values,
+    setFieldValue: formik.setFieldValue,
+  });
 
   return {
     ...formik,
diff --git a/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts b/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
index 1994f890e80..e095825fdbe 100644
--- a/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
+++ b/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
@@ -2,7 +2,7 @@ import { useChakraToast as useToast } from "fidesui";
 import { useFormik } from "formik";
 import { Headers } from "headers-polyfill";
 import { useSearchParams } from "next/navigation";
-import { useEffect, useRef, useState } from "react";
+import { useMemo, useState } from "react";
 import * as Yup from "yup";
 
 import { addCommonHeaders } from "~/common/CommonHeaders";
@@ -16,7 +16,10 @@ import {
 import { DEFAULT_IDENTITY_INPUTS } from "~/constants";
 import { useProperty } from "~/features/common/property.slice";
 import { useSettings } from "~/features/common/settings.slice";
-import { useApplicableFields } from "~/hooks/useApplicableFields";
+import {
+  useApplicabilitySync,
+  useConditionalValidate,
+} from "~/hooks/useConditionalValidation";
 import { useCustomFieldsForm } from "~/hooks/useCustomFieldsForm";
 import { PrivacyRequestStatus } from "~/types";
 import { PrivacyRequestSource } from "~/types/api/models/PrivacyRequestSource";
@@ -75,7 +78,6 @@ const usePrivacyRequestForm = ({
     action?.custom_privacy_request_fields ?? {};
   const toast = useToast();
   const [isSubmitPending, setIsSubmitPending] = useState(false);
-  const [validationError, setValidationError] = useState(false);
   const searchParams = useSearchParams();
 
   const property = useProperty();
@@ -86,51 +88,53 @@ const usePrivacyRequestForm = ({
     searchParams,
   });
 
-  const initialValues = getInitialValues();
-
-  // Ref to hold current applicable fields — updated after useApplicableFields,
-  // read inside validate/onSubmit closures to satisfy no-use-before-define
-  const applicableFieldsRef = useRef<Set<string>>(
-    new Set(Object.keys(customPrivacyRequestFields)),
+  const initialValues = useMemo(
+    () => getInitialValues(),
+    [getInitialValues],
   );
 
   // Build the static portion of the validation schema (identity fields)
-  const identityValidationSchema = Yup.object().shape({
-    name: nameValidation(nameInput),
-    email: emailValidation(emailInput).test(
-      "one of email or phone entered",
-      "You must enter either email or phone",
-      (_value, context) => {
-        if (emailInput === "optional" && phoneInput === "optional") {
-          return Boolean(context.parent.phone || context.parent.email);
-        }
-        return true;
-      },
-    ),
-    phone: phoneValidation(phoneInput).test(
-      "one of email or phone entered",
-      "You must enter either email or phone",
-      (_value, context) => {
-        if (emailInput === "optional" && phoneInput === "optional") {
-          return Boolean(context.parent.phone || context.parent.email);
-        }
-        return true;
-      },
-    ),
-    ...Object.fromEntries(
-      Object.entries(customIdentityFields).flatMap(([key, value]) => {
-        return value
-          ? [[key, Yup.string().required(`${value.label} is required`)]]
-          : [];
+  const identityValidationSchema = useMemo(
+    () =>
+      Yup.object().shape({
+        name: nameValidation(nameInput),
+        email: emailValidation(emailInput).test(
+          "one of email or phone entered",
+          "You must enter either email or phone",
+          (_value, context) => {
+            if (emailInput === "optional" && phoneInput === "optional") {
+              return Boolean(context.parent.phone || context.parent.email);
+            }
+            return true;
+          },
+        ),
+        phone: phoneValidation(phoneInput).test(
+          "one of email or phone entered",
+          "You must enter either email or phone",
+          (_value, context) => {
+            if (emailInput === "optional" && phoneInput === "optional") {
+              return Boolean(context.parent.phone || context.parent.email);
+            }
+            return true;
+          },
+        ),
+        ...Object.fromEntries(
+          Object.entries(customIdentityFields).flatMap(([key, value]) => {
+            return value
+              ? [[key, Yup.string().required(`${value.label} is required`)]]
+              : [];
+          }),
+        ),
       }),
-    ),
-  });
+    [emailInput, phoneInput, nameInput, customIdentityFields],
+  );
 
-  // Cache the last applicable-aware schema to avoid rebuilding on every keystroke
-  const schemaCache = useRef<{
-    applicableKey: string;
-    schema: Yup.AnyObjectSchema;
-  } | null>(null);
+  const { validate, applicableFieldsRef, validationError } =
+    useConditionalValidate({
+      customPrivacyRequestFields,
+      identityValidationSchema,
+      getValidationSchema,
+    });
 
   const formik = useFormik<FormValues>({
     initialValues: {
@@ -311,65 +315,16 @@ const usePrivacyRequestForm = ({
       }
     },
 
-    validate: (values) => {
-      setValidationError(false);
-      // Build the custom fields schema filtered by applicable fields
-      const currentApplicable = applicableFieldsRef.current;
-      const applicableKey = Array.from(currentApplicable).sort().join(",");
-      let combinedSchema: Yup.AnyObjectSchema;
-
-      if (schemaCache.current?.applicableKey === applicableKey) {
-        combinedSchema = schemaCache.current.schema;
-      } else {
-        const customFieldSchema = getValidationSchema(currentApplicable);
-        combinedSchema = identityValidationSchema.concat(
-          customFieldSchema,
-        ) as Yup.AnyObjectSchema;
-        schemaCache.current = { applicableKey, schema: combinedSchema };
-      }
-
-      try {
-        combinedSchema.validateSync(values, { abortEarly: false });
-        return {};
-      } catch (err) {
-        if (err instanceof Yup.ValidationError) {
-          const errors: Record<string, string> = {};
-          err.inner.forEach((e) => {
-            if (e.path && !errors[e.path]) {
-              errors[e.path] = e.message;
-            }
-          });
-          return errors;
-        }
-        setValidationError(true);
-        return { _form: "An unexpected error occurred." };
-      }
-    },
+    validate,
   });
 
-  // Resolve which custom fields are applicable based on current form values
-  const applicableFields = useApplicableFields(
+  const applicableFields = useApplicabilitySync({
     customPrivacyRequestFields,
-    formik.values,
-  );
-  applicableFieldsRef.current = applicableFields;
-
-  // Clear values when fields become non-applicable
-  const prevApplicable = useRef<Set<string>>(applicableFields);
-  useEffect(() => {
-    const prev = prevApplicable.current;
-    prevApplicable.current = applicableFields;
-
-    prev.forEach((key) => {
-      if (!applicableFields.has(key) && key in customPrivacyRequestFields) {
-        const fieldInitial = initialValues[key];
-        if (formik.values[key] !== fieldInitial) {
-          formik.setFieldValue(key, fieldInitial ?? "");
-        }
-      }
-    });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [applicableFields]);
+    applicableFieldsRef,
+    initialValues,
+    formValues: formik.values,
+    setFieldValue: formik.setFieldValue,
+  });
 
   return {
     ...formik,
diff --git a/clients/privacy-center/hooks/useApplicableFields.ts b/clients/privacy-center/hooks/useApplicableFields.ts
index 5dbe7002e78..fe823b45a6e 100644
--- a/clients/privacy-center/hooks/useApplicableFields.ts
+++ b/clients/privacy-center/hooks/useApplicableFields.ts
@@ -2,7 +2,7 @@ import { useMemo, useRef } from "react";
 
 import { resolveApplicableFields } from "~/lib/condition-evaluator";
 import { setsEqual } from "~/lib/set-utils";
-import type { CustomConfigField } from "~/types/config";
+import type { Condition, CustomConfigField } from "~/types/config";
 
 /**
  * Extracts the set of field keys that are referenced by any display_condition
@@ -13,16 +13,12 @@ const extractWatchedKeys = (
 ): Set<string> => {
   const watched = new Set<string>();
 
-  const walk = (condition: unknown): void => {
-    if (!condition || typeof condition !== "object") {
-      return;
+  const walk = (condition: Condition): void => {
+    if ("field_address" in condition) {
+      watched.add(condition.field_address);
     }
-    if ("field_address" in (condition as Record<string, unknown>)) {
-      watched.add((condition as { field_address: string }).field_address);
-    }
-    if ("conditions" in (condition as Record<string, unknown>)) {
-      const group = condition as { conditions: unknown[] };
-      group.conditions.forEach(walk);
+    if ("conditions" in condition) {
+      condition.conditions.forEach(walk);
     }
   };
 
@@ -58,14 +54,12 @@ export const useApplicableFields = (
     if (watchedKeys.size === 0) {
       return "";
     }
-    const entries: string[] = [];
+    const entries: [string, unknown][] = [];
     watchedKeys.forEach((key) => {
-      const val = formValues[key];
-      entries.push(
-        `${key}=${Array.isArray(val) ? val.join(",") : (val ?? "")}`,
-      );
+      entries.push([key, formValues[key] ?? null]);
     });
-    return entries.sort().join("|");
+    entries.sort(([a], [b]) => a.localeCompare(b));
+    return JSON.stringify(entries);
   }, [watchedKeys, formValues]);
 
   return useMemo(() => {
diff --git a/clients/privacy-center/hooks/useConditionalValidation.ts b/clients/privacy-center/hooks/useConditionalValidation.ts
new file mode 100644
index 00000000000..e72dc4e002e
--- /dev/null
+++ b/clients/privacy-center/hooks/useConditionalValidation.ts
@@ -0,0 +1,117 @@
+import { useEffect, useRef, useState } from "react";
+import * as Yup from "yup";
+
+import { useApplicableFields } from "~/hooks/useApplicableFields";
+import { CustomConfigField } from "~/types/config";
+import { FormValues } from "~/types/forms";
+
+/**
+ * Sets up the Formik `validate` function with conditional-field awareness.
+ * Call this before `useFormik` — it returns a `validate` function that reads
+ * from refs so it always sees the latest applicable field set.
+ */
+export const useConditionalValidate = ({
+  customPrivacyRequestFields,
+  identityValidationSchema,
+  getValidationSchema,
+}: {
+  customPrivacyRequestFields: Record<string, CustomConfigField>;
+  identityValidationSchema: Yup.AnyObjectSchema;
+  getValidationSchema: (applicable: Set<string>) => Yup.AnyObjectSchema;
+}) => {
+  const [validationError, setValidationError] = useState(false);
+
+  const applicableFieldsRef = useRef<Set<string>>(
+    new Set(Object.keys(customPrivacyRequestFields)),
+  );
+
+  // Cache the last applicable-aware schema to avoid rebuilding on every keystroke
+  const schemaCache = useRef<{
+    applicableKey: string;
+    schema: Yup.AnyObjectSchema;
+  } | null>(null);
+
+  const validate = (values: FormValues) => {
+    setValidationError(false);
+    const currentApplicable = applicableFieldsRef.current;
+    const applicableKey = Array.from(currentApplicable).sort().join(",");
+    let combinedSchema: Yup.AnyObjectSchema;
+
+    if (schemaCache.current?.applicableKey === applicableKey) {
+      combinedSchema = schemaCache.current.schema;
+    } else {
+      const customFieldSchema = getValidationSchema(currentApplicable);
+      combinedSchema = identityValidationSchema.concat(
+        customFieldSchema,
+      ) as Yup.AnyObjectSchema;
+      schemaCache.current = { applicableKey, schema: combinedSchema };
+    }
+
+    try {
+      combinedSchema.validateSync(values, { abortEarly: false });
+      return {};
+    } catch (err) {
+      if (err instanceof Yup.ValidationError) {
+        const errors: Record<string, string> = {};
+        err.inner.forEach((e) => {
+          if (e.path && !errors[e.path]) {
+            errors[e.path] = e.message;
+          }
+        });
+        return errors;
+      }
+      setValidationError(true);
+      return { _form: "An unexpected error occurred." };
+    }
+  };
+
+  return { validate, applicableFieldsRef, validationError };
+};
+
+/**
+ * Resolves which custom fields are currently applicable and clears values
+ * for fields that become non-applicable. Call this after `useFormik`.
+ */
+export const useApplicabilitySync = ({
+  customPrivacyRequestFields,
+  applicableFieldsRef,
+  initialValues,
+  formValues,
+  setFieldValue,
+}: {
+  customPrivacyRequestFields: Record<string, CustomConfigField>;
+  applicableFieldsRef: React.MutableRefObject<Set<string>>;
+  initialValues: FormValues;
+  formValues: FormValues;
+  setFieldValue: (field: string, value: unknown) => void;
+}): Set<string> => {
+  const applicableFields = useApplicableFields(
+    customPrivacyRequestFields,
+    formValues,
+  );
+  applicableFieldsRef.current = applicableFields;
+
+  const prevApplicable = useRef<Set<string>>(applicableFields);
+  useEffect(() => {
+    const prev = prevApplicable.current;
+    prevApplicable.current = applicableFields;
+
+    prev.forEach((key) => {
+      if (!applicableFields.has(key) && key in customPrivacyRequestFields) {
+        const fieldInitial = initialValues[key];
+        const current = formValues[key];
+        const unchanged =
+          current === fieldInitial ||
+          (Array.isArray(current) &&
+            Array.isArray(fieldInitial) &&
+            JSON.stringify(current) === JSON.stringify(fieldInitial));
+        if (!unchanged) {
+          setFieldValue(key, fieldInitial ?? "");
+        }
+      }
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [applicableFields]);
+
+  return applicableFields;
+};
diff --git a/clients/privacy-center/hooks/useCustomFieldsForm.ts b/clients/privacy-center/hooks/useCustomFieldsForm.ts
index e0c11d5baaa..fb46560fa5f 100644
--- a/clients/privacy-center/hooks/useCustomFieldsForm.ts
+++ b/clients/privacy-center/hooks/useCustomFieldsForm.ts
@@ -1,3 +1,4 @@
+import { useCallback } from "react";
 import * as Yup from "yup";
 
 import { useAppSelector } from "~/app/hooks";
@@ -56,7 +57,7 @@ export const useCustomFieldsForm = ({
 }: UseCustomFieldsFormProps) => {
   const userLocation = useAppSelector(selectUserLocation);
 
-  const getInitialValues = () => {
+  const getInitialValues = useCallback(() => {
     const values = Object.fromEntries(
       Object.entries(customPrivacyRequestFields).map(([key, field]) => {
         const valueFromQueryParam =
@@ -97,13 +98,16 @@ export const useCustomFieldsForm = ({
     );
 
     return values;
-  };
+  }, [customPrivacyRequestFields, searchParams, userLocation?.code]);
 
-  const getValidationSchema = (applicableFields?: Set<string>) =>
-    buildCustomFieldsValidationSchema(
-      customPrivacyRequestFields,
-      applicableFields,
-    );
+  const getValidationSchema = useCallback(
+    (applicableFields?: Set<string>) =>
+      buildCustomFieldsValidationSchema(
+        customPrivacyRequestFields,
+        applicableFields,
+      ),
+    [customPrivacyRequestFields],
+  );
 
   return { getInitialValues, getValidationSchema };
 };
diff --git a/clients/privacy-center/lib/condition-evaluator.ts b/clients/privacy-center/lib/condition-evaluator.ts
index 7584fe67e96..53790198640 100644
--- a/clients/privacy-center/lib/condition-evaluator.ts
+++ b/clients/privacy-center/lib/condition-evaluator.ts
@@ -1,4 +1,9 @@
-import type { Condition, ConditionGroup, ConditionLeaf } from "~/types/config";
+import type {
+  Condition,
+  ConditionGroup,
+  ConditionLeaf,
+  DisplayOperator,
+} from "~/types/config";
 
 import { setsEqual } from "./set-utils";
 
@@ -22,7 +27,7 @@ const hasValue = (val: unknown): boolean => {
 type ConditionValue = ConditionLeaf["value"];
 
 const applyOperator = (
-  operator: string,
+  operator: DisplayOperator,
   actual: unknown,
   expected: ConditionValue,
 ): boolean => {
@@ -147,10 +152,17 @@ export const resolveApplicableFields = <
   const keys = Object.keys(fields);
   let applicable = new Set(keys);
   let previous: Set<string>;
+  // Guard against cycles in case backend validation is bypassed or config is manually edited.
+  const maxIterations = keys.length + 1;
+  let iterations = 0;
 
   do {
     previous = applicable;
     applicable = evaluateFieldSet(previous, fields, formValues);
+    iterations += 1;
+    if (iterations > maxIterations) {
+      return applicable;
+    }
   } while (!setsEqual(applicable, previous));
 
   return applicable;

From bef52230dbb1bcab59aced5274144f8e162f9b52 Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Tue, 19 May 2026 11:14:57 -0500
Subject: [PATCH 06/11] Fix eslint no-param-reassign error and prettier
 formatting

---
 .../consent-request-modal/useConsentRequestForm.ts     | 10 +++-------
 .../privacy-center/hooks/useConditionalValidation.ts   |  1 +
 2 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
index 636a460e4f9..cec30d92be3 100644
--- a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
+++ b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
@@ -40,9 +40,8 @@ const useConsentRequestForm = ({
   const config = useConfig();
   const identityInputs =
     config.consent?.button.identity_inputs ?? DEFAULT_IDENTITY_INPUTS;
-  const customPrivacyRequestFields =
-    (config.consent?.button.custom_privacy_request_fields ??
-      {}) as Record<string, CustomConfigField>;
+  const customPrivacyRequestFields = (config.consent?.button
+    .custom_privacy_request_fields ?? {}) as Record<string, CustomConfigField>;
   const settings = useSettings();
   const { BASE_64_COOKIE } = settings;
   const toast = useToast();
@@ -63,10 +62,7 @@ const useConsentRequestForm = ({
     searchParams: null, // ConsentRequestForm doesn't use URL params
   });
 
-  const initialValues = useMemo(
-    () => getInitialValues(),
-    [getInitialValues],
-  );
+  const initialValues = useMemo(() => getInitialValues(), [getInitialValues]);
 
   // Build the static portion of the validation schema (identity fields)
   const identityValidationSchema = useMemo(
diff --git a/clients/privacy-center/hooks/useConditionalValidation.ts b/clients/privacy-center/hooks/useConditionalValidation.ts
index e72dc4e002e..bd4319111ce 100644
--- a/clients/privacy-center/hooks/useConditionalValidation.ts
+++ b/clients/privacy-center/hooks/useConditionalValidation.ts
@@ -89,6 +89,7 @@ export const useApplicabilitySync = ({
     customPrivacyRequestFields,
     formValues,
   );
+  // eslint-disable-next-line no-param-reassign
   applicableFieldsRef.current = applicableFields;
 
   const prevApplicable = useRef<Set<string>>(applicableFields);

From c03cc25312a9c9a6236a2e6d3499e0f5ebfe74a5 Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Thu, 21 May 2026 10:24:23 -0500
Subject: [PATCH 07/11] Add edge case tests for empty condition groups and
 empty fields

---
 .../__tests__/lib/condition-evaluator.test.ts    | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts b/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
index 4d11f70ac2d..deb6215ddd5 100644
--- a/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
+++ b/clients/privacy-center/__tests__/lib/condition-evaluator.test.ts
@@ -292,6 +292,18 @@ describe("evaluateCondition", () => {
     });
   });
 
+  describe("empty conditions array", () => {
+    it("AND with no conditions returns true (vacuous truth)", () => {
+      const group: ConditionGroup = { logical_operator: "and", conditions: [] };
+      expect(evaluateCondition(group, {})).toBe(true);
+    });
+
+    it("OR with no conditions returns false", () => {
+      const group: ConditionGroup = { logical_operator: "or", conditions: [] };
+      expect(evaluateCondition(group, {})).toBe(false);
+    });
+  });
+
   describe("nested groups", () => {
     it("handles nested group conditions", () => {
       const condition: Condition = {
@@ -330,6 +342,10 @@ describe("evaluateCondition", () => {
 });
 
 describe("resolveApplicableFields", () => {
+  it("returns an empty set when fields record is empty", () => {
+    expect(resolveApplicableFields({}, {})).toEqual(new Set());
+  });
+
   it("returns all fields when none have display_condition", () => {
     const fields = makeFields({
       name: { label: "Name" },

From f0a48aa709e1526e7a264499467bb8180f9cfaed Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Thu, 21 May 2026 11:16:37 -0500
Subject: [PATCH 08/11] Address code review feedback for conditional validation

---
 .../useConsentRequestForm.ts                  |  4 +-
 .../usePrivacyRequestForm.ts                  |  4 +-
 .../hooks/useApplicableFields.ts              | 28 +++++++----
 .../hooks/useConditionalValidation.ts         | 28 +++++++----
 .../privacy-center/lib/condition-evaluator.ts | 48 ++++++++++---------
 clients/privacy-center/lib/set-utils.ts       |  9 ++--
 6 files changed, 72 insertions(+), 49 deletions(-)

diff --git a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
index cec30d92be3..a66cc800a10 100644
--- a/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
+++ b/clients/privacy-center/components/modals/consent-request-modal/useConsentRequestForm.ts
@@ -212,7 +212,7 @@ const useConsentRequestForm = ({
     validate,
   });
 
-  const applicableFields = useApplicabilitySync({
+  const { applicableFields, conditionError } = useApplicabilitySync({
     customPrivacyRequestFields,
     applicableFieldsRef,
     initialValues,
@@ -225,7 +225,7 @@ const useConsentRequestForm = ({
     identityInputs,
     customPrivacyRequestFields,
     applicableFields,
-    validationError,
+    validationError: validationError || conditionError,
   };
 };
 
diff --git a/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts b/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
index 0d89e57f23f..51254e936c9 100644
--- a/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
+++ b/clients/privacy-center/components/modals/privacy-request-modal/usePrivacyRequestForm.ts
@@ -337,7 +337,7 @@ const usePrivacyRequestForm = ({
     validate,
   });
 
-  const applicableFields = useApplicabilitySync({
+  const { applicableFields, conditionError } = useApplicabilitySync({
     customPrivacyRequestFields,
     applicableFieldsRef,
     initialValues,
@@ -360,7 +360,7 @@ const usePrivacyRequestForm = ({
     customPrivacyRequestFields,
     orderedFields,
     applicableFields,
-    validationError,
+    validationError: validationError || conditionError,
   };
 };
 
diff --git a/clients/privacy-center/hooks/useApplicableFields.ts b/clients/privacy-center/hooks/useApplicableFields.ts
index fe823b45a6e..717b4a3fc08 100644
--- a/clients/privacy-center/hooks/useApplicableFields.ts
+++ b/clients/privacy-center/hooks/useApplicableFields.ts
@@ -1,4 +1,4 @@
-import { useMemo, useRef } from "react";
+import { useMemo, useRef, useState } from "react";
 
 import { resolveApplicableFields } from "~/lib/condition-evaluator";
 import { setsEqual } from "~/lib/set-utils";
@@ -41,15 +41,17 @@ const extractWatchedKeys = (
 export const useApplicableFields = (
   customFields: Record<string, CustomConfigField>,
   formValues: Record<string, string | string[]>,
-): Set<string> => {
+): { applicableFields: Set<string>; conditionError: boolean } => {
   const prevResult = useRef<Set<string>>(new Set());
+  const [conditionError, setConditionError] = useState(false);
 
   const watchedKeys = useMemo(
     () => extractWatchedKeys(customFields),
     [customFields],
   );
 
-  // Snapshot only the watched values into a stable string for memoization
+  // Snapshot only the watched values into a stable string for memoization.
+  // Safe to stringify because formValues are string | string[] (no circular refs).
   const watchedSnapshot = useMemo(() => {
     if (watchedKeys.size === 0) {
       return "";
@@ -62,14 +64,22 @@ export const useApplicableFields = (
     return JSON.stringify(entries);
   }, [watchedKeys, formValues]);
 
-  return useMemo(() => {
-    const result = resolveApplicableFields(customFields, formValues);
-    // Return the same reference if the set hasn't changed
-    if (setsEqual(result, prevResult.current)) {
+  const applicableFields = useMemo(() => {
+    try {
+      const result = resolveApplicableFields(customFields, formValues);
+      setConditionError(false);
+      // Return the same reference if the set hasn't changed
+      if (setsEqual(result, prevResult.current)) {
+        return prevResult.current;
+      }
+      prevResult.current = result;
+      return result;
+    } catch {
+      setConditionError(true);
       return prevResult.current;
     }
-    prevResult.current = result;
-    return result;
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [customFields, watchedSnapshot]);
+
+  return { applicableFields, conditionError };
 };
diff --git a/clients/privacy-center/hooks/useConditionalValidation.ts b/clients/privacy-center/hooks/useConditionalValidation.ts
index bd4319111ce..0b4845f4f7e 100644
--- a/clients/privacy-center/hooks/useConditionalValidation.ts
+++ b/clients/privacy-center/hooks/useConditionalValidation.ts
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 import * as Yup from "yup";
 
 import { useApplicableFields } from "~/hooks/useApplicableFields";
@@ -25,9 +25,18 @@ export const useConditionalValidate = ({
     new Set(Object.keys(customPrivacyRequestFields)),
   );
 
+  // Invalidate the schema cache when the field config changes, so a
+  // re-conditionalized field (same applicable key set, different rules)
+  // doesn't serve a stale schema.
+  const configSignature = useMemo(
+    () => JSON.stringify(Object.keys(customPrivacyRequestFields).sort()),
+    [customPrivacyRequestFields],
+  );
+
   // Cache the last applicable-aware schema to avoid rebuilding on every keystroke
   const schemaCache = useRef<{
     applicableKey: string;
+    configSignature: string;
     schema: Yup.AnyObjectSchema;
   } | null>(null);
 
@@ -37,14 +46,17 @@ export const useConditionalValidate = ({
     const applicableKey = Array.from(currentApplicable).sort().join(",");
     let combinedSchema: Yup.AnyObjectSchema;
 
-    if (schemaCache.current?.applicableKey === applicableKey) {
+    if (
+      schemaCache.current?.applicableKey === applicableKey &&
+      schemaCache.current?.configSignature === configSignature
+    ) {
       combinedSchema = schemaCache.current.schema;
     } else {
       const customFieldSchema = getValidationSchema(currentApplicable);
       combinedSchema = identityValidationSchema.concat(
         customFieldSchema,
       ) as Yup.AnyObjectSchema;
-      schemaCache.current = { applicableKey, schema: combinedSchema };
+      schemaCache.current = { applicableKey, configSignature, schema: combinedSchema };
     }
 
     try {
@@ -84,16 +96,16 @@ export const useApplicabilitySync = ({
   initialValues: FormValues;
   formValues: FormValues;
   setFieldValue: (field: string, value: unknown) => void;
-}): Set<string> => {
-  const applicableFields = useApplicableFields(
+}): { applicableFields: Set<string>; conditionError: boolean } => {
+  const { applicableFields, conditionError } = useApplicableFields(
     customPrivacyRequestFields,
     formValues,
   );
-  // eslint-disable-next-line no-param-reassign
-  applicableFieldsRef.current = applicableFields;
 
   const prevApplicable = useRef<Set<string>>(applicableFields);
   useEffect(() => {
+    // eslint-disable-next-line no-param-reassign
+    applicableFieldsRef.current = applicableFields;
     const prev = prevApplicable.current;
     prevApplicable.current = applicableFields;
 
@@ -114,5 +126,5 @@ export const useApplicabilitySync = ({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [applicableFields]);
 
-  return applicableFields;
+  return { applicableFields, conditionError };
 };
diff --git a/clients/privacy-center/lib/condition-evaluator.ts b/clients/privacy-center/lib/condition-evaluator.ts
index 53790198640..e822ad7dba6 100644
--- a/clients/privacy-center/lib/condition-evaluator.ts
+++ b/clients/privacy-center/lib/condition-evaluator.ts
@@ -9,7 +9,14 @@ import { setsEqual } from "./set-utils";
 
 /**
  * Check whether a value should be considered "present" for exists/not_exists.
- * Empty strings and empty arrays are treated as absent, matching backend behavior.
+ *
+ * Values treated as absent: null, undefined, "", and [].
+ * Values treated as present: false, 0, non-empty strings/arrays, and all other truthy values.
+ *
+ * Note: The backend operators.py checks only `is not None` for exists, but the
+ * backend's _submitted_has_value() also treats "" and [] as absent. We follow
+ * the stricter definition here because privacy center form values are always
+ * strings or string arrays — false and 0 don't occur as form values.
  */
 const hasValue = (val: unknown): boolean => {
   if (val === null || val === undefined) {
@@ -70,28 +77,24 @@ const applyOperator = (
 
 /**
  * Evaluate a single condition (leaf or group) against a flat data record.
- * Returns false on any error, matching backend behavior (conservative: field hidden).
+ * Throws on malformed conditions so callers can surface errors to the user.
  */
 export const evaluateCondition = (
   condition: Condition,
   data: Record<string, unknown>,
 ): boolean => {
-  try {
-    if ("field_address" in condition) {
-      // ConditionLeaf
-      const leaf = condition as ConditionLeaf;
-      const actual = data[leaf.field_address];
-      return applyOperator(leaf.operator, actual, leaf.value);
-    }
-    // ConditionGroup
-    const group = condition as ConditionGroup;
-    const results = group.conditions.map((c) => evaluateCondition(c, data));
-    return group.logical_operator === "and"
-      ? results.every(Boolean)
-      : results.some(Boolean);
-  } catch {
-    return false;
+  if ("field_address" in condition) {
+    // ConditionLeaf
+    const leaf = condition as ConditionLeaf;
+    const actual = data[leaf.field_address];
+    return applyOperator(leaf.operator, actual, leaf.value);
   }
+  // ConditionGroup
+  const group = condition as ConditionGroup;
+  const results = group.conditions.map((c) => evaluateCondition(c, data));
+  return group.logical_operator === "and"
+    ? results.every(Boolean)
+    : results.some(Boolean);
 };
 
 /**
@@ -105,11 +108,7 @@ const isFieldApplicable = (
   if (!condition) {
     return true;
   }
-  try {
-    return evaluateCondition(condition, dataView);
-  } catch {
-    return false;
-  }
+  return evaluateCondition(condition, dataView);
 };
 
 /**
@@ -161,7 +160,10 @@ export const resolveApplicableFields = <
     applicable = evaluateFieldSet(previous, fields, formValues);
     iterations += 1;
     if (iterations > maxIterations) {
-      return applicable;
+      throw new Error(
+        `resolveApplicableFields exceeded max iterations (${maxIterations}). ` +
+          `Possible circular dependency in display_condition config.`,
+      );
     }
   } while (!setsEqual(applicable, previous));
 
diff --git a/clients/privacy-center/lib/set-utils.ts b/clients/privacy-center/lib/set-utils.ts
index c4985f3f0ef..09162f0b8bf 100644
--- a/clients/privacy-center/lib/set-utils.ts
+++ b/clients/privacy-center/lib/set-utils.ts
@@ -2,11 +2,10 @@ export const setsEqual = (a: Set<string>, b: Set<string>): boolean => {
   if (a.size !== b.size) {
     return false;
   }
-  let equal = true;
-  a.forEach((item) => {
+  for (const item of a) {
     if (!b.has(item)) {
-      equal = false;
+      return false;
     }
-  });
-  return equal;
+  }
+  return true;
 };

From 31ccf1ad5fe122fd7c5b8892e4ac0d5c57dc51c8 Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Thu, 21 May 2026 11:25:12 -0500
Subject: [PATCH 09/11] Fix lint and prettier errors in review feedback changes

---
 clients/privacy-center/hooks/useConditionalValidation.ts | 6 +++++-
 clients/privacy-center/lib/set-utils.ts                  | 8 ++------
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/clients/privacy-center/hooks/useConditionalValidation.ts b/clients/privacy-center/hooks/useConditionalValidation.ts
index 0b4845f4f7e..1b28bc4f130 100644
--- a/clients/privacy-center/hooks/useConditionalValidation.ts
+++ b/clients/privacy-center/hooks/useConditionalValidation.ts
@@ -56,7 +56,11 @@ export const useConditionalValidate = ({
       combinedSchema = identityValidationSchema.concat(
         customFieldSchema,
       ) as Yup.AnyObjectSchema;
-      schemaCache.current = { applicableKey, configSignature, schema: combinedSchema };
+      schemaCache.current = {
+        applicableKey,
+        configSignature,
+        schema: combinedSchema,
+      };
     }
 
     try {
diff --git a/clients/privacy-center/lib/set-utils.ts b/clients/privacy-center/lib/set-utils.ts
index 09162f0b8bf..3ad4f52d452 100644
--- a/clients/privacy-center/lib/set-utils.ts
+++ b/clients/privacy-center/lib/set-utils.ts
@@ -2,10 +2,6 @@ export const setsEqual = (a: Set<string>, b: Set<string>): boolean => {
   if (a.size !== b.size) {
     return false;
   }
-  for (const item of a) {
-    if (!b.has(item)) {
-      return false;
-    }
-  }
-  return true;
+  const arr = Array.from(a);
+  return arr.every((item) => b.has(item));
 };

From fc0ad489987e63ac8b9a25de5ed539fb87c2ae85 Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Thu, 21 May 2026 11:47:40 -0500
Subject: [PATCH 10/11] Fix setState-during-render and restore synchronous ref
 update

---
 clients/privacy-center/hooks/useApplicableFields.ts  | 12 +++++++++---
 .../privacy-center/hooks/useConditionalValidation.ts |  6 ++++--
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/clients/privacy-center/hooks/useApplicableFields.ts b/clients/privacy-center/hooks/useApplicableFields.ts
index 717b4a3fc08..b453dd8f6f9 100644
--- a/clients/privacy-center/hooks/useApplicableFields.ts
+++ b/clients/privacy-center/hooks/useApplicableFields.ts
@@ -1,4 +1,4 @@
-import { useMemo, useRef, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 
 import { resolveApplicableFields } from "~/lib/condition-evaluator";
 import { setsEqual } from "~/lib/set-utils";
@@ -44,6 +44,7 @@ export const useApplicableFields = (
 ): { applicableFields: Set<string>; conditionError: boolean } => {
   const prevResult = useRef<Set<string>>(new Set());
   const [conditionError, setConditionError] = useState(false);
+  const errorRef = useRef(false);
 
   const watchedKeys = useMemo(
     () => extractWatchedKeys(customFields),
@@ -67,7 +68,7 @@ export const useApplicableFields = (
   const applicableFields = useMemo(() => {
     try {
       const result = resolveApplicableFields(customFields, formValues);
-      setConditionError(false);
+      errorRef.current = false;
       // Return the same reference if the set hasn't changed
       if (setsEqual(result, prevResult.current)) {
         return prevResult.current;
@@ -75,11 +76,16 @@ export const useApplicableFields = (
       prevResult.current = result;
       return result;
     } catch {
-      setConditionError(true);
+      errorRef.current = true;
       return prevResult.current;
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [customFields, watchedSnapshot]);
 
+  // Sync the error ref to state in an effect to avoid setState during render
+  useEffect(() => {
+    setConditionError(errorRef.current);
+  }, [applicableFields]);
+
   return { applicableFields, conditionError };
 };
diff --git a/clients/privacy-center/hooks/useConditionalValidation.ts b/clients/privacy-center/hooks/useConditionalValidation.ts
index 1b28bc4f130..69b264f3ff2 100644
--- a/clients/privacy-center/hooks/useConditionalValidation.ts
+++ b/clients/privacy-center/hooks/useConditionalValidation.ts
@@ -105,11 +105,13 @@ export const useApplicabilitySync = ({
     customPrivacyRequestFields,
     formValues,
   );
+  // Update the ref synchronously so the validate function (which reads from
+  // this ref) always sees the latest applicable set during the same render.
+  // eslint-disable-next-line no-param-reassign
+  applicableFieldsRef.current = applicableFields;
 
   const prevApplicable = useRef<Set<string>>(applicableFields);
   useEffect(() => {
-    // eslint-disable-next-line no-param-reassign
-    applicableFieldsRef.current = applicableFields;
     const prev = prevApplicable.current;
     prevApplicable.current = applicableFields;
 

From 967c3674fb3b713229fd00dd144cde2f790b9c27 Mon Sep 17 00:00:00 2001
From: Jeremy Pople <jeremy@ethyca.com>
Date: Thu, 21 May 2026 12:10:29 -0500
Subject: [PATCH 11/11] Fix prettier formatting in useCustomFieldsForm

---
 clients/privacy-center/hooks/useCustomFieldsForm.ts | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/clients/privacy-center/hooks/useCustomFieldsForm.ts b/clients/privacy-center/hooks/useCustomFieldsForm.ts
index f5640b69195..11a414dd0bb 100644
--- a/clients/privacy-center/hooks/useCustomFieldsForm.ts
+++ b/clients/privacy-center/hooks/useCustomFieldsForm.ts
@@ -95,11 +95,7 @@ export const buildCustomFieldsValidationSchema = (
           if (fieldType === "date") {
             return [
               key,
-              dateFieldValidation(
-                field as CustomDateField,
-                label,
-                isRequired,
-              ),
+              dateFieldValidation(field as CustomDateField, label, isRequired),
             ];
           }
           return [