feat(forms): add local Form A presentation preview

This commit is contained in:
DeCentN2Madness committed 2026-10-25 13:04:00 -07:00
1 parent b102a061fe
commit 7a6cab29db
13 files changed
+983 -8

No files matched your search

@@ -1,5 +1,7 @@
---
import Icon from './Icon.astro';
import FormAPreview from '../FormAPreview.astro';
import { formAPreviewEnabled, formModeForRuntime, resolveFormMode } from '../../utils/form-integration';
interface Props {
sourcePage: 'general' | 'commercial' | 'ahcccs' | 'private_pay';
title: string;
@@ -9,6 +11,8 @@ interface Props {
const { sourcePage, title, intro, buttonText } = Astro.props;
const phone = import.meta.env.PUBLIC_AIA_PHONE || '480-687-7099';
const tel = phone.replace(/[^0-9+]/g, '');
const formConfig = resolveFormMode(import.meta.env.PUBLIC_AIA_FORMS_MODE, import.meta.env.PUBLIC_AIA_FORMS_LIVE_APPROVED);
const formPreview = formAPreviewEnabled(import.meta.env.PUBLIC_AIA_FORM_A_PREVIEW, import.meta.env.PUBLIC_ALLOW_INDEXING, formModeForRuntime(formConfig));
---
<section class="section consultation" id="consultation" aria-labelledby="consultation-heading">
<div class="container consultation__panel grid-2">
@@ -18,9 +22,9 @@ const tel = phone.replace(/[^0-9+]/g, '');
<p class="lede">{intro}</p>
</div>
<div class="form-wrap">
<!-- TODO: Replace this inactive presentation with the approved Jotform integration under P9-03. -->
<!-- TODO: Verify privacy, spam protection and notifications before production activation. -->
<div id="lead-form" role="group" aria-labelledby="campaign-form-heading" data-forms-mode="off">
{formPreview ? <FormAPreview lang="en" variant="compact" submitText={buttonText} /> : <div id="lead-form" role="group" aria-labelledby="campaign-form-heading" data-forms-mode="off">
<!-- TODO: Replace this inactive presentation with the approved Jotform integration under P9-03. -->
<!-- TODO: Verify privacy, spam protection and notifications before production activation. -->
<h3 id="campaign-form-heading">Start with your contact details</h3>
<p class="form-note form-intro">Use this form to request a conversation. An AIA team member can explain the next steps for your family.</p>
<input disabled type="hidden" name="sourcePage" value={sourcePage} />
@@ -53,7 +57,7 @@ const tel = phone.replace(/[^0-9+]/g, '');
<div id="form-error" class="form-error" role="alert" tabindex="-1"></div>
<button class="button" type="button" disabled>{buttonText}<Icon name="arrow" /></button>
<p class="form-note">Questions? <a href={`tel:${tel}`}>Call AIA at {phone}</a>. Review AIA's <a href="/privacy-policy">privacy policy</a>.</p>
</div>
</div>}
</div>
<div class="consultation__details">
<div class="consultation__contact">