From 9c7b86c9b79a18d24cdd355e86719ec447d09651 Mon Sep 17 00:00:00 2001
From: yurytut1993 <yurii.zusik@bigcommerce.com>
Date: Thu, 21 Mar 2024 15:27:51 +0200
Subject: [PATCH] feat(client): add customer & address form fields queries

---
 .changeset/poor-pens-matter.md                |  5 ++
 apps/core/client/fragments/form-fields.ts     | 54 +++++++++++++++++++
 .../client/queries/get-address-form-fields.ts | 46 ++++++++++++++++
 .../queries/get-customer-form-fields.ts       | 46 ++++++++++++++++
 4 files changed, 151 insertions(+)
 create mode 100644 .changeset/poor-pens-matter.md
 create mode 100644 apps/core/client/fragments/form-fields.ts
 create mode 100644 apps/core/client/queries/get-address-form-fields.ts
 create mode 100644 apps/core/client/queries/get-customer-form-fields.ts

diff --git a/.changeset/poor-pens-matter.md b/.changeset/poor-pens-matter.md
new file mode 100644
index 000000000..6ed40762b
--- /dev/null
+++ b/.changeset/poor-pens-matter.md
@@ -0,0 +1,5 @@
+---
+"@bigcommerce/catalyst-core": patch
+---
+
+add customer & address form fields queries
diff --git a/apps/core/client/fragments/form-fields.ts b/apps/core/client/fragments/form-fields.ts
new file mode 100644
index 000000000..dfacf9c59
--- /dev/null
+++ b/apps/core/client/fragments/form-fields.ts
@@ -0,0 +1,54 @@
+import { graphql } from '../graphql';
+
+export const FORM_FIELDS_FRAGMENT = graphql(`
+  fragment FormFields on FormField {
+    entityId
+    label
+    sortOrder
+    isBuiltIn
+    isRequired
+    __typename
+    ... on CheckboxesFormField {
+      options {
+        entityId
+        label
+      }
+    }
+    ... on DateFormField {
+      defaultDate
+      minDate
+      maxDate
+    }
+    ... on MultilineTextFormField {
+      defaultText
+      rows
+    }
+    ... on NumberFormField {
+      defaultNumber
+      maxLength
+      minNumber
+      maxNumber
+    }
+    ... on PasswordFormField {
+      defaultText
+      maxLength
+    }
+    ... on PicklistFormField {
+      choosePrefix
+      options {
+        entityId
+        label
+      }
+    }
+    ... on RadioButtonsFormField {
+      options {
+        entityId
+        label
+      }
+    }
+    ... on TextFormField {
+      defaultText
+      maxLength
+    }
+  }
+`);
diff --git a/apps/core/client/queries/get-address-form-fields.ts b/apps/core/client/queries/get-address-form-fields.ts
new file mode 100644
index 000000000..69fc78bfc
--- /dev/null
+++ b/apps/core/client/queries/get-address-form-fields.ts
@@ -0,0 +1,46 @@
+import { cache } from 'react';
+
+import { client } from '..';
+import { FORM_FIELDS_FRAGMENT } from '../fragments/form-fields';
+import { graphql, VariablesOf } from '../graphql';
+import { revalidate } from '../revalidate-target';
+
+const GET_ADDRESS_FORM_FIELDS = graphql(
+  `
+    query getAddressFormFields($filters: FormFieldFiltersInput, $sortBy: FormFieldSortInput) {
+      site {
+        settings {
+          formFields {
+            shippingAddress(filters: $filters, sortBy: $sortBy) {
+              ...FormFields
+            }
+          }
+        }
+      }
+    }
+  `,
+  [FORM_FIELDS_FRAGMENT],
+);
+
+type Variables = VariablesOf<typeof GET_ADDRESS_FORM_FIELDS>;
+
+interface AddressFormFields {
+  filters?: Variables['filters'];
+  sortBy?: Variables['sortBy'];
+}
+
+export const getAddressFormFields = cache(async ({ filters, sortBy }: AddressFormFields) => {
+  const response = await client.fetch({
+    document: GET_ADDRESS_FORM_FIELDS,
+    variables: { filters, sortBy },
+    fetchOptions: { next: { revalidate } },
+  });
+
+  const { settings } = response.data.site;
+
+  if (!settings) {
+    return null;
+  }
+
+  return settings.formFields.shippingAddress;
+});
diff --git a/apps/core/client/queries/get-customer-form-fields.ts b/apps/core/client/queries/get-customer-form-fields.ts
new file mode 100644
index 000000000..3f674e37b
--- /dev/null
+++ b/apps/core/client/queries/get-customer-form-fields.ts
@@ -0,0 +1,46 @@
+import { cache } from 'react';
+
+import { client } from '..';
+import { FORM_FIELDS_FRAGMENT } from '../fragments/form-fields';
+import { graphql, VariablesOf } from '../graphql';
+import { revalidate } from '../revalidate-target';
+
+const GET_CUSTOMER_FORM_FIELDS = graphql(
+  `
+    query getCustomerFormFields($filters: FormFieldFiltersInput, $sortBy: FormFieldSortInput) {
+      site {
+        settings {
+          formFields {
+            customer(filters: $filters, sortBy: $sortBy) {
+              ...FormFields
+            }
+          }
+        }
+      }
+    }
+  `,
+  [FORM_FIELDS_FRAGMENT],
+);
+
+type Variables = VariablesOf<typeof GET_CUSTOMER_FORM_FIELDS>;
+
+interface CustomerFormFields {
+  filters?: Variables['filters'];
+  sortBy?: Variables['sortBy'];
+}
+
+export const getCustomerFormFields = cache(async ({ filters, sortBy }: CustomerFormFields) => {
+  const response = await client.fetch({
+    document: GET_CUSTOMER_FORM_FIELDS,
+    variables: { filters, sortBy },
+    fetchOptions: { next: { revalidate } },
+  });
+
+  const { settings } = response.data.site;
+
+  if (!settings) {
+    return null;
+  }
+
+  return settings.formFields.customer;
+});