Description

Due to the GDPR, the customer must always be aware of how, where and who will have access to the data shared and with this a field will be added to the support forms with a translated text. This text will be filled in by the franchisee in sanity and with the appropriate translation fields, just as it works for the birthday and catering screen.

Figma

https://www.figma.com/design/TXlz4Fm91IstXnwIByTUtJ/Draft---List-Item?node-id=365-33948&t=t3ckclnaCZ8pDpB2-0

Development

Feature Flag - Temporarily

Suggested Name
support-policy-cover-to-contact

Code Changes

Intl-whitelabel-cms

schemas/support/documents/supportData.tsx

Add the support policy cover in “fields” property

fields: [
  ...,
  {
    title: 'Support Policy Cover',
    name: 'supportPolicyCover',
    type: 'array',
    of: [
      {
        title: 'Privacy Policy Disclaimers Cell',
        name: 'privacyPolicyDisclaimersCell',
        type: 'privacyPolicyDisclaimersCell',
      },
    ],
  },
  ...,
]

Intl-whitelabel-app

src/queries/sanity/support.graphql

Following the privacyPolicy implementation: src/queries/sanity/feature-birthday-and-catering.graphql

supportPolicyCover {
  privacyPolicyDisclaimersCells {
    disclaimerTitle
    disclaimerDescription
    disclaimerContent {
      locale: enRaw
    }
    border
    fontSize
    paddingTop
    paddingRight
    paddingBottom
    paddingLeft
    radius
  }
}

src/hooks/use-support-data/use-feature-navigation.ts

{
...
const {
    ...,
    supportPolicyCover,
  } = data?.SupportData ?? {};
  
  const isSupportDataLoading = featureIdsLoading || loading;

  return {
    ...,
    supportPolicyCover,
  };
};

src/pages/support-v2/support-v2-form-page/support-v2-form-view.tsx

Import the component below the form as birthday and catering feature: src/components/catering-birthday/client-information/catering-birthday-client-information.tsx

Optional: Create a SupportPolicyCoverContainer, SupportPolicyCoverDisclaimerBox and SupportPolicyCoverDisclaimerBox.

const { supportPolicyCover } = useSupportData();
const privacyPolicyDisclaimersCells =
    supportPolicyCover?.privacyPolicyDisclaimersCells;

<PoliciesContainer>
      {privacyPolicyDisclaimersCells?.map(item => {
        return (
          item?.disclaimerContent?.locale && (
            <PrivacyPolicyDisclaimerBox radius={item?.radius} border={item?.border}>
              <PrivacyPolicyDisclaimer
                fontSize={item?.fontSize}
                paddingTop={item?.paddingTop}
                paddingRight={item?.paddingRight}
                paddingBottom={item?.paddingBottom}
                paddingLeft={item?.paddingLeft}
              >
                <SanityBlockRenderer content={item?.disclaimerContent?.locale} />
              </PrivacyPolicyDisclaimer>
            </PrivacyPolicyDisclaimerBox>
          )
        );
      })}
</PoliciesContainer>

Tests

Scenario	Steps	Result
Open the support form and show the policy cover field	Enable the feature flag Go to support page Select the reason for support The support form will appear	A policy coverage field should appear below the “Describe your problem” field.
Open the support form and not show the policy cover field	Disable the feature flag Go to support page Select the reason for support The support form will appear	A policy coverage field should not appear below the “Describe your problem” field.
Open the support form and show the policy cover field translated	Enable the feature flag Change the language Go to support page Select the reason for support The support form will appear	A policy coverage field should appear below the “Describe your problem” field with the text translated.

Tech Discovery - Policy cover to contact (WIP)