diff --git a/src/components/Thanks/ThanksPageDonationOnly.vue b/src/components/Thanks/ThanksPageDonationOnly.vue
index 33deabbdaf..9af4ffac02 100644
--- a/src/components/Thanks/ThanksPageDonationOnly.vue
+++ b/src/components/Thanks/ThanksPageDonationOnly.vue
@@ -1,9 +1,34 @@
+
+
+
+
+
+ {{ headerMsg }}
+
+
+
+
+
+
-
+
-
+
{{ headerMsg }}
@@ -110,6 +135,20 @@
+
@@ -120,6 +159,9 @@ import socialSharingMixin from '@/plugins/social-sharing-mixin';
import KvIcon from '@/components/Kv/KvIcon';
import { getFullUrl } from '@/util/urlUtils';
import { gql } from '@apollo/client';
+import KvFrequentlyAskedQuestions from '@/components/Kv/KvFrequentlyAskedQuestions';
+import { formatContentGroupsFlat } from '@/util/contentfulUtils';
+import smoothScrollMixin from '@/plugins/smooth-scroll-mixin';
import KvMaterialIcon from '~/@kiva/kv-components/vue/KvMaterialIcon';
import KvGrid from '~/@kiva/kv-components/vue/KvGrid';
import KvPageContainer from '~/@kiva/kv-components/vue/KvPageContainer';
@@ -138,12 +180,34 @@ const userQuery = gql`query userQuery {
export default {
name: 'ThanksPageDonationOnly',
- inject: ['apollo'],
+ inject: ['apollo', 'cookieStore'],
+ apollo: {
+ query: gql`query OnlyDonationThanksPageContentful {
+ contentful {
+ entries(contentType: "contentGroup", contentKey: "thanks-page-only-donation")
+ }
+ general {
+ doubleDonationEnabled: featureSetting(key: "doubledonation.enabled") {
+ key
+ value
+ description
+ }
+ }
+ }
+ `,
+ preFetch: true,
+ result({ data }) {
+ const contentfulData = data?.contentful?.entries?.items ?? null;
+ this.contentfulContent = contentfulData ? formatContentGroupsFlat(contentfulData) : {};
+ this.doubleDonationEnabled = data?.general?.doubleDonationEnabled?.value === 'true' ?? false;
+ }
+ },
components: {
KvIcon,
KvMaterialIcon,
KvPageContainer,
- KvGrid
+ KvGrid,
+ KvFrequentlyAskedQuestions
},
props: {
monthlyDonationAmount: {
@@ -151,7 +215,7 @@ export default {
default: ''
}
},
- mixins: [socialSharingMixin],
+ mixins: [socialSharingMixin, smoothScrollMixin],
data() {
return {
lender: null,
@@ -165,8 +229,23 @@ export default {
isGuest: false,
message: '',
utmCampaign: 'social_share_checkout',
+ contentfulContent: null,
+ doubleDonationEnabled: false,
};
},
+ mounted() {
+ if (this.doubleDonationEnabled) {
+ const doubleDonationScript = document.createElement('script');
+ doubleDonationScript.setAttribute('src', 'https://doublethedonation.com/api/js/ddplugin.js');
+ document.head.appendChild(doubleDonationScript);
+
+ window.DDCONF = { API_KEY: 'ODBlMWJiZGItZTY4' };
+ if (window.doublethedonation) {
+ // eslint-disable-next-line no-undef
+ doublethedonation.plugin.load_streamlined_input();
+ }
+ }
+ },
computed: {
shareMessage() {
return this.message.trim();
@@ -195,7 +274,12 @@ export default {
if (this.lender?.public && this.lender?.inviterName) return this.lender?.inviterName;
return 'anonymous';
},
-
+ frequentlyAskedQuestionsHeadline() {
+ return this.contentfulContent?.frequentlyAskedQuestions?.title ?? null;
+ },
+ frequentlyAskedQuestions() {
+ return this.contentfulContent?.frequentlyAskedQuestions?.contents ?? null;
+ },
},
methods: {
gatherCurrentUserData() {
@@ -205,6 +289,11 @@ export default {
this.isGuest = !data?.my?.userAccount;
this.lender = data?.my?.userAccount ?? {};
});
+ },
+ scrollToSection(sectionId) {
+ const elementToScrollTo = document.querySelector(sectionId);
+ const topOfSectionToScrollTo = elementToScrollTo?.offsetTop ?? 0;
+ this.smoothScrollTo({ yPosition: topOfSectionToScrollTo, millisecondsToAnimate: 750 });
}
},
created() {
@@ -220,6 +309,8 @@ export default {