Skip to content

Commit

Permalink
VACMS-18855 Add Find Forms download modal back to form detail page (#…
Browse files Browse the repository at this point in the history 
…2239)

* VACMS-18855 Add Find Forms download modal back to form detail page

* adding ID to container

* Add feature flag

* finishing up feature flag
  • Loading branch information
@randimays
randimays authored Sep 16, 2024
1 parent 06361ac commit fe16835
Show file tree
Hide file tree
Showing 3 changed files with 112 additions and 57 deletions.
46 changes: 46 additions & 0 deletions src/site/components/va_related_form.drupal.liquid
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
{% if vaForm.entityUrl.path and vaForm.entityPublished %}
<a href="{{ vaForm.entityUrl.path }}">
<h3 class="vads-u-display--inline-block vads-u-text-decoration--underline">VA Form {{ vaForm.fieldVaFormNumber }}</h3>
</a>
{% else %}
<h3 class="vads-u-display--inline-block">VA Form {{ vaForm.fieldVaFormNumber }}</h3>
{% endif %}
<p class="vads-u-margin-top--0 vads-u-font-size--h4 vads-u-font-weight--bold">
<dfn class="vads-u-visibility--screen-reader">Form name:</dfn> {{ vaForm.fieldVaFormName }}
</p>

{{ vaForm.fieldVaFormUsage.processed }}

{% assign showPDFModal = ''| featureFindFormsPDFModal %}

{% if showPDFModal %}
<div id="{{ vaForm.fieldVaFormNumber }}-download-button-{{ vaForm.fieldVaFormLanguage }}-parent">
<button
class="va-button-link vads-u-display--flex vads-u-align-items--center"
data-widget-type="find-va-forms-pdf-download-helper"
data-href="{{ vaForm.fieldVaFormUrl.uri }}"
data-form-number="{{ vaForm.fieldVaFormNumber }}"
id="{{ vaForm.fieldVaFormNumber }}-download-button-{{ vaForm.fieldVaFormLanguage }}"
lang="{{ vaForm.fieldVaFormLanguage }}"
>
{% assign translatedDownloadText = vaForm.fieldVaFormLanguage | deriveLanguageTranslation: 'downloadVaForm', vaForm.fieldVaFormNumber %}
<va-icon class="vads-u-margin-right--0p5" icon="file_download" size="3"></va-icon>
{{ translatedDownloadText }} (PDF)
</button>
</div>
{% else %}
<a
href="{{ vaForm.fieldVaFormUrl.uri }}"
download
data-form-number="{{ vaForm.fieldVaFormNumber }}"
lang="{{ vaForm.fieldVaFormLanguage }}"
>
<va-icon
class="vads-u-margin-right--0p5"
icon="file_download"
size="3"
></va-icon>
{% assign translatedDownloadText = vaForm.fieldVaFormLanguage | deriveLanguageTranslation: 'downloadVaForm', vaForm.fieldVaFormNumber %}
{{ translatedDownloadText }} (PDF)
</a>
{% endif %}
4 changes: 4 additions & 0 deletions src/site/filters/liquid.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2191,4 +2191,8 @@ module.exports = function registerFilters() {
}
return null;
};

liquid.filters.featureFindFormsPDFModal = () => {
return cmsFeatureFlags.FEATURE_FIND_FORMS_MODAL;
};
};
119 changes: 62 additions & 57 deletions src/site/layouts/va_form.drupal.liquid
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
{% include "src/site/includes/preview-edit.drupal.liquid" %}
{% include "src/site/includes/breadcrumbs.drupal.liquid" %}

<div id="content" class="interior">
<div id="content">
<main class="va-l-detail-page">
<div class="usa-grid usa-grid-full">

Expand Down Expand Up @@ -70,9 +70,9 @@
</dl>

{% if fieldVaFormUsage %}
<h2 class="vads-u-margin-top--4" data-testid="va_form--when-to-use-this-form-header">When to use this form</h3>
<h2 class="vads-u-margin-top--4">When to use this form</h3>
{% if fieldVaFormLanguage %}
<div data-testid="va_form--when-to-use-this-form-text" lang="{{ fieldVaFormLanguage }}">
<div lang="{{ fieldVaFormLanguage }}">
{{ fieldVaFormUsage.processed }}
</div>
{% else %}
Expand All @@ -82,33 +82,52 @@
{% endif %}

{% if fieldVaFormUpload %}
<h3 class="vads-u-margin-bottom--2" data-testid="va_form--downloadable-pdf">Download form</h3>
<h3 class="vads-u-margin-bottom--2">Download form</h3>
<p class="vads-u-margin-bottom--2">
Download this PDF form and fill it out. Then submit your completed form on this page. Or you can print the form and mail it to the address listed on the form.
</p>
{% else %}
<h3 class="vads-u-margin-bottom--2" data-testid="va_form--downloadable-pdf">Downloadable PDF</h3>
<h3 class="vads-u-margin-bottom--2">Downloadable PDF</h3>
{% endif %}
{% endif %}

{% if !fieldVaFormUsage %}
<h2 class="vads-u-margin-bottom--2" data-testid="va_form--downloadable-pdf">Downloadable PDF</h2>
<h2 class="vads-u-margin-bottom--2">Downloadable PDF</h2>
{% endif %}
<a
href="{{ fieldVaFormUrl.uri }}"
download
data-widget-type="find-va-forms-pdf-download-helper"
data-form-number="{{ fieldVaFormNumber }}"
lang="{{ fieldVaFormLanguage }}"

{% assign showPDFModal = ''| featureFindFormsPDFModal %}

{% if showPDFModal %}
<div id="main-download-container">
<button
class="va-button-link vads-u-display--flex vads-u-align-items--center"
data-widget-type="find-va-forms-pdf-download-helper"
data-href="{{ fieldVaFormUrl.uri }}"
data-form-number="{{ fieldVaFormNumber }}"
id="main-download-button"
lang="{{ fieldVaFormLanguage }}"
>
{% assign translatedDownloadText = fieldVaFormLanguage | deriveLanguageTranslation: 'downloadVaForm', fieldVaFormNumber %}
<va-icon class="vads-u-margin-right--0p5" icon="file_download" size="3"></va-icon>
{{ translatedDownloadText }} (PDF)
</button>
</div>
{% else %}
<a
href="{{ fieldVaFormUrl.uri }}"
download
data-form-number="{{ fieldVaFormNumber }}"
lang="{{ fieldVaFormLanguage }}"
>
<va-icon
class="vads-u-margin-right--0p5"
icon="file_download"
size="3"
></va-icon>
{% assign translatedDownloadText = fieldVaFormLanguage | deriveLanguageTranslation: 'downloadVaForm', fieldVaFormNumber %}
{{ translatedDownloadText }} (PDF)
</a>
<va-icon
class="vads-u-margin-right--0p5"
icon="file_download"
size="3"
></va-icon>
{% assign translatedDownloadText = fieldVaFormLanguage | deriveLanguageTranslation: 'downloadVaForm', fieldVaFormNumber %}
{{ translatedDownloadText }} (PDF)
</a>
{% endif %}

{% if fieldVaFormUpload %}
<div
Expand All @@ -133,7 +152,7 @@
{% endif %}

{% if fieldVaFormToolUrl %}
<h3 data-testid="va_form--online-tool">Online tool</h3>
<h3>Online tool</h3>
<p>{{ fieldVaFormToolIntro }}</p>
<va-link-action
href="{{ fieldVaFormToolUrl.uri }}"
Expand All @@ -143,44 +162,30 @@
</va-link-action>
{% endif %}


{% if fieldVaFormRelatedForms.length > 0 %}
<section>
<h2 data-testid="va_form--related-forms-and-instructions">Related forms and instructions</h2>
<ul class="usa-unstyled-list" role="list">
{% for vaForm in fieldVaFormRelatedForms %}
<li>
{% if vaForm.entity.entityUrl.path and vaForm.entity.entityPublished %}
<a href="{{ vaForm.entity.entityUrl.path }}">
<h3 class="vads-u-display--inline-block vads-u-text-decoration--underline">VA Form {{ vaForm.entity.fieldVaFormNumber }}</h3>
</a>
{% else %}
<h3 class="vads-u-display--inline-block">VA Form {{ vaForm.entity.fieldVaFormNumber }}</h3>
{% endif %}
<p class="vads-u-margin-top--0 vads-u-font-size--h4 vads-u-font-weight--bold">
<dfn class="vads-u-visibility--screen-reader">Form name:</dfn> {{ vaForm.entity.fieldVaFormName }}
</p>

{{ vaForm.entity.fieldVaFormUsage.processed }}

<a
href="{{ vaForm.entity.fieldVaFormUrl.uri }}"
download
data-widget-type="find-va-forms-pdf-download-helper"
data-form-number="{{ vaForm.entity.fieldVaFormNumber }}"
lang="{{ vaForm.entity.fieldVaFormLanguage }}"
>
<va-icon
class="vads-u-margin-right--0p5"
icon="file_download"
size="3"
></va-icon>
{% assign translatedDownloadText = vaForm.entity.fieldVaFormLanguage | deriveLanguageTranslation: 'downloadVaForm', vaForm.entity.fieldVaFormNumber %}
{{ translatedDownloadText }} (PDF)
</a>
</li>
{% endfor %}
</ul>
<h2>Related forms and instructions</h2>
{% if fieldVaFormRelatedForms.length > 1 %}
<ul class="usa-unstyled-list" role="list">
{% for vaForm in fieldVaFormRelatedForms %}
<li id="{{ fieldVaFormNumber }}-download-button-{{ vaForm.entity.fieldVaFormLanguage }}-parent">
{% include "src/site/components/va_related_form.drupal.liquid" with
vaForm = vaForm.entity
fieldVaFormNumber = fieldVaFormNumber
translatedDownloadText = translatedDownloadText
%}
</li>
{% endfor %}
</ul>
{% elsif fieldVaFormRelatedForms.length == 1 %}
{% for vaForm in fieldVaFormRelatedForms %}
{% include "src/site/components/va_related_form.drupal.liquid" with
vaForm = vaForm.entity
fieldVaFormNumber = fieldVaFormNumber
translatedDownloadText = translatedDownloadText
%}
{% endfor %}
{% endif %}
</section>
{% endif %}

Expand Down

0 comments on commit fe16835

Please sign in to comment.