From b5ee94c2b1f8d096b039a04b38042689d16d2a12 Mon Sep 17 00:00:00 2001
From: Eddie Ferrer <eddieferrer@user.noreply.github.com>
Date: Tue, 30 Nov 2021 16:10:32 -0800
Subject: [PATCH] fix: fixes the drop in error in a more robust way

---
 .../AutoDepositDropInPaymentWrapper.vue       |  20 +-
 .../Causes/CausesDropInPaymentWrapper.vue     |  20 +-
 .../Checkout/CheckoutDropInPaymentWrapper.vue |  22 +-
 .../MonthlyGoodDropInPaymentWrapper.vue       |  20 +-
 .../Payment/BraintreeDropInInterface.vue      |   2 +-
 src/components/WwwFrame/FooterContent.vue     | 740 ++++++++++++++++++
 src/components/WwwFrame/TheFooter.vue         | 725 +----------------
 .../Donate/DonateFormDropInPaymentWrapper.vue |  20 +-
 src/pages/Settings/PaymentSettings.vue        |  18 +-
 9 files changed, 798 insertions(+), 789 deletions(-)
 create mode 100644 src/components/WwwFrame/FooterContent.vue

diff --git a/src/components/AutoDeposit/AutoDepositDropInPaymentWrapper.vue b/src/components/AutoDeposit/AutoDepositDropInPaymentWrapper.vue
index 1bf44425a6..467f2d7831 100644
--- a/src/components/AutoDeposit/AutoDepositDropInPaymentWrapper.vue
+++ b/src/components/AutoDeposit/AutoDepositDropInPaymentWrapper.vue
@@ -1,17 +1,15 @@
 <template>
 	<div class="row">
 		<div class="dropin-payment-holder small-12 columns">
-			<keep-alive>
-				<braintree-drop-in-interface
-					v-if="isClientReady"
-					ref="braintreeDropInInterface"
-					:amount="amount | numeral('0.00')"
-					flow="vault"
-					:payment-types="['paypal', 'card']"
-					:preselect-vaulted-payment-method="action === 'Registration'"
-					@transactions-enabled="enableConfirmButton = $event"
-				/>
-			</keep-alive>
+			<braintree-drop-in-interface
+				v-if="isClientReady"
+				ref="braintreeDropInInterface"
+				:amount="amount | numeral('0.00')"
+				flow="vault"
+				:payment-types="['paypal', 'card']"
+				:preselect-vaulted-payment-method="action === 'Registration'"
+				@transactions-enabled="enableConfirmButton = $event"
+			/>
 			<div id="dropin-button">
 				<kv-button
 					value="submit"
diff --git a/src/components/Causes/CausesDropInPaymentWrapper.vue b/src/components/Causes/CausesDropInPaymentWrapper.vue
index c966d6da8f..bab9fbb525 100644
--- a/src/components/Causes/CausesDropInPaymentWrapper.vue
+++ b/src/components/Causes/CausesDropInPaymentWrapper.vue
@@ -1,16 +1,14 @@
 <template>
 	<div class="dropin-payment-holder tw-px-0 tw-max-w-md">
-		<keep-alive>
-			<braintree-drop-in-interface
-				v-if="isClientReady"
-				ref="braintreeDropInInterface"
-				:amount="amount | numeral('0.00')"
-				flow="vault"
-				:payment-types="['paypal', 'card']"
-				:preselect-vaulted-payment-method="action === 'Registration'"
-				@transactions-enabled="enableConfirmButton = $event"
-			/>
-		</keep-alive>
+		<braintree-drop-in-interface
+			v-if="isClientReady"
+			ref="braintreeDropInInterface"
+			:amount="amount | numeral('0.00')"
+			flow="vault"
+			:payment-types="['paypal', 'card']"
+			:preselect-vaulted-payment-method="action === 'Registration'"
+			@transactions-enabled="enableConfirmButton = $event"
+		/>
 		<div id="dropin-submit" class="tw-w-full">
 			<kv-button
 				:state="buttonState"
diff --git a/src/components/Checkout/CheckoutDropInPaymentWrapper.vue b/src/components/Checkout/CheckoutDropInPaymentWrapper.vue
index ddea6f63b3..a0abadff25 100644
--- a/src/components/Checkout/CheckoutDropInPaymentWrapper.vue
+++ b/src/components/Checkout/CheckoutDropInPaymentWrapper.vue
@@ -1,18 +1,16 @@
 <template>
 	<div class="row align-right">
 		<div class="dropin-payment-holder small-12 columns">
-			<keep-alive>
-				<braintree-drop-in-interface
-					v-if="isClientReady"
-					ref="braintreeDropInInterface"
-					:amount="amount"
-					flow="checkout"
-					:payment-types="paymentTypes"
-					:preselect-vaulted-payment-method="!isGuestCheckout"
-					:auth="isGuestCheckout ? 'token-key' : 'client-token'"
-					@transactions-enabled="enableCheckoutButton = $event"
-				/>
-			</keep-alive>
+			<braintree-drop-in-interface
+				v-if="isClientReady"
+				ref="braintreeDropInInterface"
+				:amount="amount"
+				flow="checkout"
+				:payment-types="paymentTypes"
+				:preselect-vaulted-payment-method="!isGuestCheckout"
+				:auth="isGuestCheckout ? 'token-key' : 'client-token'"
+				@transactions-enabled="enableCheckoutButton = $event"
+			/>
 			<div v-if="isGuestCheckout" id="guest-checkout">
 				<label class="input-label" for="email">
 					Where should we email your receipt?
diff --git a/src/components/MonthlyGood/MonthlyGoodDropInPaymentWrapper.vue b/src/components/MonthlyGood/MonthlyGoodDropInPaymentWrapper.vue
index 3ea8e5408f..efc200b0b7 100644
--- a/src/components/MonthlyGood/MonthlyGoodDropInPaymentWrapper.vue
+++ b/src/components/MonthlyGood/MonthlyGoodDropInPaymentWrapper.vue
@@ -1,17 +1,15 @@
 <template>
 	<div class="row align-center">
 		<div class="dropin-payment-holder small-12 columns">
-			<keep-alive>
-				<braintree-drop-in-interface
-					v-if="isClientReady"
-					ref="braintreeDropInInterface"
-					:amount="amount | numeral('0.00')"
-					flow="vault"
-					:payment-types="['paypal', 'card']"
-					:preselect-vaulted-payment-method="action === 'Registration'"
-					@transactions-enabled="enableConfirmButton = $event"
-				/>
-			</keep-alive>
+			<braintree-drop-in-interface
+				v-if="isClientReady"
+				ref="braintreeDropInInterface"
+				:amount="amount | numeral('0.00')"
+				flow="vault"
+				:payment-types="['paypal', 'card']"
+				:preselect-vaulted-payment-method="action === 'Registration'"
+				@transactions-enabled="enableConfirmButton = $event"
+			/>
 			<div id="dropin-button">
 				<kv-button
 					value="submit"
diff --git a/src/components/Payment/BraintreeDropInInterface.vue b/src/components/Payment/BraintreeDropInInterface.vue
index 546481f6b2..bdedf12245 100644
--- a/src/components/Payment/BraintreeDropInInterface.vue
+++ b/src/components/Payment/BraintreeDropInInterface.vue
@@ -227,7 +227,7 @@ export default {
 	},
 	mounted() {
 		// Prevents BT error in the case this component gets initialized multiple times
-		const isElementEmpty = document.getElementById('dropin-container').innerHTML === '';
+		const isElementEmpty = document?.getElementById('dropin-container')?.innerHTML === '';
 		if (isElementEmpty) {
 			this.getDropInAuthToken();
 		}
diff --git a/src/components/WwwFrame/FooterContent.vue b/src/components/WwwFrame/FooterContent.vue
new file mode 100644
index 0000000000..f2c24f686c
--- /dev/null
+++ b/src/components/WwwFrame/FooterContent.vue
@@ -0,0 +1,740 @@
+<template>
+	<div>
+		<nav class="small-footer hide-for-large" aria-label="Footer navigation">
+			<div class="row collapse">
+				<div class="column">
+					<h2>Borrow</h2>
+					<p>Loans for entrepreneurs doing amazing things.</p>
+					<ul>
+						<li>
+							<router-link
+								:to="applyUrl"
+								v-kv-track-event="['Footer', 'click-Borrow-Apply now']"
+							>
+								Apply now
+							</router-link>
+						</li>
+					</ul>
+				</div>
+			</div>
+			<div class="row collapse">
+				<div class="column">
+					<h2>Lend</h2>
+					<p>Make a loan, change a life.</p>
+					<ul>
+						<li>
+							<router-link
+								:to="lendByCategoryUrl"
+								v-kv-track-event="['Footer', 'click-Lend-lend now']"
+							>
+								Lend now
+							</router-link>
+						</li>
+						<li>
+							<router-link
+								:to="monthlyGoodUrl"
+								v-kv-track-event="['Footer', 'click-Lend-Monthly Good']"
+							>
+								Monthly Good
+							</router-link>
+						</li>
+					</ul>
+				</div>
+			</div>
+			<div class="row collapse">
+				<div class="column">
+					<h2>Donate</h2>
+					<p>
+						Kiva is a 501(c)3 U.S. nonprofit fueled by passionate people.
+						Founded in 2005, and based in San Francisco, with offices in Bangkok, Nairobi,
+						Portland and staff around the globe.
+					</p>
+					<ul>
+						<li>
+							<router-link
+								to="/donate/supportus"
+								v-kv-track-event="['Footer', 'click-Donate', 'Donate to Kiva here']"
+							>
+								Donate to Kiva
+							</router-link>
+						</li>
+					</ul>
+					<hr>
+				</div>
+			</div>
+			<div class="row collapse">
+				<div class="column">
+					<kv-accordion-item
+						id="get-to-know-us_accordion"
+						:open="false"
+					>
+						<template #header>
+							<h2>Get to know us</h2>
+						</template>
+						<ul>
+							<li>
+								<router-link
+									:to="aboutUrl"
+									v-kv-track-event="['Footer', 'click-Get to know us-About us']"
+								>
+									About us
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/about/how"
+									v-kv-track-event="['Footer', 'click-Get to know us-How Kiva works']"
+								>
+									How Kiva works
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/about/how#faq-hkw-section"
+									v-kv-track-event="['Footer', 'click-Get to know us-FAQs']"
+								>
+									FAQs
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/about/where-kiva-works"
+									v-kv-track-event="['Footer', 'click-Get to know us-Where Kiva works']"
+								>
+									Where Kiva works
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/blog"
+									v-kv-track-event="['Footer', 'click-Get to know us-Blog']"
+								>
+									Blog
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/partner-with-us"
+									v-kv-track-event="['Footer', 'click-Get to know us-Partner with us']"
+								>
+									Partner with us
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/help/contact-us"
+									v-kv-track-event="['Footer', 'click-Get to know us-Contact us']"
+								>
+									Contact us
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									:to="helpUrl"
+									v-kv-track-event="['Footer', 'click-Get to know us-Help']"
+								>
+									Help
+								</router-link>
+							</li>
+						</ul>
+					</kv-accordion-item>
+					<kv-accordion-item
+						id="community_accordion"
+						:open="false"
+					>
+						<template #header>
+							<h2>Community</h2>
+						</template>
+						<ul>
+							<li>
+								<router-link
+									to="/teams"
+									v-kv-track-event="['Footer', 'click-Community-Teams']"
+								>
+									Teams
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/kivau/intro"
+									v-kv-track-event="['Footer', 'click-Community-Students and educators']"
+								>
+									Students and educators
+								</router-link>
+							</li>
+						</ul>
+					</kv-accordion-item>
+					<kv-accordion-item
+						id="explore_accordion"
+						:open="false"
+					>
+						<template #header>
+							<h2>Explore</h2>
+						</template>
+						<ul>
+							<li>
+								<router-link
+									to="/protocol"
+									v-kv-track-event="['Footer', 'click-Explore-Protocol']"
+								>
+									Protocol
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/gifts"
+									v-kv-track-event="['Footer', 'click-Explore-Gifts']"
+								>
+									Gifts
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/live"
+									v-kv-track-event="['Footer', 'click-Explore-Happening now']"
+								>
+									Happening now
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/build"
+									v-kv-track-event="['Footer', 'click-Explore-Developer API']"
+								>
+									Developer API
+								</router-link>
+							</li>
+						</ul>
+					</kv-accordion-item>
+					<kv-accordion-item
+						id="work-with-us_accordion"
+						:open="false"
+					>
+						<template #header>
+							<h2>Work with us</h2>
+						</template>
+						<ul>
+							<li>
+								<a
+									:href="careersUrl"
+									target="_blank"
+									rel="noopener"
+									v-kv-track-event="['Footer', 'click-Work with us-Careers']"
+								>
+									Careers
+								</a>
+							</li>
+							<li>
+								<router-link
+									to="/work-with-us/internvolunteers"
+									v-kv-track-event="['Footer', 'click-Work with us-Volunteer interships']"
+								>
+									Volunteer internships
+								</router-link>
+							</li>
+							<li>
+								<a
+									href="https://www.careers.kiva.org/fellowships"
+									target="_blank"
+									rel="noopener"
+									v-kv-track-event="['Footer', 'click-Work with us-Kiva fellows']"
+								>
+									Kiva fellows
+								</a>
+							</li>
+							<li>
+								<router-link
+									to="/work-with-us/reviewers"
+									v-kv-track-event="['Footer', 'click-Work with us-Review and translation']"
+								>
+									Review and translation
+								</router-link>
+							</li>
+							<li>
+								<a
+									href="https://www.kivaushub.org/hubs"
+									target="_blank"
+									rel="noopener"
+									v-kv-track-event="['Footer', 'click-Work with us-US Hubs']"
+								>
+									US Hubs
+								</a>
+							</li>
+						</ul>
+					</kv-accordion-item>
+					<span></span>
+				</div>
+			</div>
+			<div class="row collapse">
+				<div class="column">
+					<ul class=" download-app-icons">
+						<li>
+							<a
+								:href="appStoreUrl"
+								target="_blank"
+								rel="noopener"
+								v-kv-track-event="['global', 'click-app-badge-footer', 'App Store']"
+							>
+								<img
+									class="download-app-ios"
+									src="@/assets/icons/app-store.svg"
+									loading="lazy"
+									alt="Check out our new app on the App Store"
+								>
+							</a>
+						</li>
+						<li>
+							<a
+								:href="playStoreUrl"
+								target="_blank"
+								rel="noopener"
+								v-kv-track-event="['global', 'click-app-badge-footer', 'Google Store']"
+							>
+								<img
+									class="download-app-android"
+									src="@/assets/icons/play-store.svg"
+									loading="lazy"
+									alt="Check out our new app on the Play Store"
+								>
+							</a>
+						</li>
+					</ul>
+				</div>
+			</div>
+			<div class="row collapse small-footer__social-icon-row">
+				<div class="column">
+					<a
+						href="//www.facebook.com/kiva/"
+						target="_blank"
+						rel="noopener"
+						v-kv-track-event="['Footer', 'click-social-icon', 'Facebook']"
+					>
+						<kv-icon name="facebook-round" title="Facebook" class="small-footer__social-icon" />
+					</a>
+					<a
+						href="//www.instagram.com/kiva.org"
+						target="_blank"
+						rel="noopener"
+						v-kv-track-event="['Footer', 'click-social-icon', 'Instagram']"
+					>
+						<kv-icon name="instagram" title="Instagram" class="small-footer__social-icon" />
+					</a>
+					<a
+						href="//twitter.com/kiva"
+						target="_blank"
+						rel="noopener"
+						v-kv-track-event="['Footer', 'click-social-icon', 'Twitter']"
+					>
+						<kv-icon name="twitter" title="Twitter" class="small-footer__social-icon" />
+					</a>
+				</div>
+			</div>
+
+			<div class="row collapse">
+				<div class="column">
+					<ul class="small-footer__single-line-links">
+						<li>
+							<router-link
+								:to="privacyUrl"
+								v-kv-track-event="['Footer', 'click-Privacy policy']"
+							>
+								Privacy policy
+							</router-link>
+						</li>
+						<li>
+							<router-link
+								:to="cookiesUrl"
+								v-kv-track-event="['Footer', 'click-Cookie policy']"
+							>
+								Cookie and Data Settings
+							</router-link>
+						</li>
+						<li>
+							<router-link
+								:to="termsUrl"
+								v-kv-track-event="['Footer', 'click-Terms of use']"
+							>
+								Terms of use
+							</router-link>
+						</li>
+						<li>
+							<router-link
+								:to="sitemapUrl"
+								v-kv-track-event="['Footer', 'click-Site map']"
+							>
+								Site map
+							</router-link>
+						</li>
+					</ul>
+				</div>
+			</div>
+			<div class="row collapse">
+				<div class="column">
+					<p class="small-footer__disclaimer">
+						Lending through Kiva involves risk of principal loss.
+						Kiva does not guarantee repayment or offer a financial return on your loan.
+						<br><br>
+						&copy; {{ year }} Kiva. All rights reserved.
+					</p>
+				</div>
+			</div>
+		</nav>
+		<nav class="large-footer show-for-large" aria-label="Footer navigation">
+			<div class="row collapse text-left">
+				<div class="column narrow hide-for-print">
+					<div class="large-footer__block">
+						<h2>Borrow</h2>
+						<p>Loans for entrepreneurs doing <br class="xxlu">amazing things.</p>
+						<ul>
+							<li>
+								<router-link
+									:to="applyUrl"
+									v-kv-track-event="['Footer', 'click-Borrow-Apply now']"
+								>
+									Apply now
+								</router-link>
+							</li>
+						</ul>
+					</div>
+					<div class="large-footer__block">
+						<h2>Lend</h2>
+						<p>Make a loan, change a life.</p>
+						<ul>
+							<li>
+								<router-link
+									:to="lendByCategoryUrl"
+									v-kv-track-event="['Footer', 'click-Lend-lend now']"
+								>
+									Lend now
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									:to="monthlyGoodUrl"
+									v-kv-track-event="['Footer', 'click-Lend-Monthly Good']"
+								>
+									Monthly Good
+								</router-link>
+							</li>
+						</ul>
+					</div>
+					<div class="large-footer__block">
+						<h2>Explore</h2>
+						<ul>
+							<li>
+								<router-link
+									to="/protocol"
+									v-kv-track-event="['Footer', 'click-Explore-Protocol']"
+								>
+									Protocol
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/gifts"
+									v-kv-track-event="['Footer', 'click-Explore-Gifts']"
+								>
+									Gifts
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/live"
+									v-kv-track-event="['Footer', 'click-Explore-Happening now']"
+								>
+									Happening now
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/build"
+									v-kv-track-event="['Footer', 'click-Explore-Developer API']"
+								>
+									Developer API
+								</router-link>
+							</li>
+						</ul>
+					</div>
+				</div>
+				<div class="column narrow hide-for-print">
+					<div class="large-footer__block hide-for-print">
+						<h2>Get to know us</h2>
+						<ul>
+							<li>
+								<router-link
+									:to="aboutUrl"
+									v-kv-track-event="['Footer', 'click-Get to know us-About us']"
+								>
+									About us
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/about/how"
+									v-kv-track-event="['Footer', 'click-Get to know us-How Kiva works']"
+								>
+									How Kiva works
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/about/how#faq-hkw-section"
+									v-kv-track-event="['Footer', 'click-Get to know us-FAQs']"
+								>
+									FAQs
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/about/where-kiva-works"
+									v-kv-track-event="['Footer', 'click-Get to know us-Where Kiva works']"
+								>
+									Where Kiva works
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/blog"
+									v-kv-track-event="['Footer', 'click-Get to know us-Blog']"
+								>
+									Blog
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/partner-with-us"
+									v-kv-track-event="['Footer', 'click-Get to know us-Partner with us']"
+								>
+									Partner with us
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/help/contact-us"
+									v-kv-track-event="['Footer', 'click-Get to know us-Contact us']"
+								>
+									Contact us
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									:to="helpUrl"
+									v-kv-track-event="['Footer', 'click-Get to know us-Help']"
+								>
+									Help
+								</router-link>
+							</li>
+						</ul>
+					</div>
+					<div class="large-footer__block hide-for-print">
+						<h2>Community</h2>
+						<ul>
+							<li>
+								<router-link
+									to="/teams"
+									v-kv-track-event="['Footer', 'click-Community-Teams']"
+								>
+									Teams
+								</router-link>
+							</li>
+							<li>
+								<router-link
+									to="/kivau/intro"
+									v-kv-track-event="['Footer', 'click-Community-Students and educators']"
+								>
+									Students and educators
+								</router-link>
+							</li>
+						</ul>
+					</div>
+				</div>
+				<div class="column large-6 expand-for-print">
+					<div class="large-footer__block">
+						<p>
+							Kiva is a 501(c)3 U.S. nonprofit fueled by passionate people.
+							Founded in 2005, and based in San Francisco, with offices in Bangkok, Nairobi,
+							Portland and staff around the globe.
+						</p>
+						<ul class="hide-for-print">
+							<li>
+								<router-link
+									to="/donate/supportus"
+									v-kv-track-event="['Footer', 'click-Donate', 'Donate to Kiva here']"
+								>
+									Donate to Kiva
+								</router-link>
+							</li>
+						</ul>
+					</div>
+					<div class="large-footer__block hide-for-print">
+						<ul class=" download-app-icons">
+							<li>
+								<a
+									:href="appStoreUrl"
+									target="_blank"
+									rel="noopener"
+									v-kv-track-event="['global', 'click-app-badge-footer', 'App Store']"
+								>
+									<img
+										class="download-app-ios"
+										src="@/assets/icons/app-store.svg"
+										loading="lazy"
+										alt="Check out our new app on the App Store"
+									>
+								</a>
+							</li>
+							<li>
+								<a
+									:href="playStoreUrl"
+									target="_blank"
+									rel="noopener"
+									v-kv-track-event="['global', 'click-app-badge-footer', 'Google Store']"
+								>
+									<img
+										class="download-app-android"
+										src="@/assets/icons/play-store.svg"
+										loading="lazy"
+										alt="Check out our new app on the Play Store"
+									>
+								</a>
+							</li>
+						</ul>
+					</div>
+					<div class="large-footer__block hide-for-print">
+						<h2>Work with us</h2>
+						<ul class="large-footer__single-line-links large-footer__single-line-links--work-with-us">
+							<li>
+								<a
+									:href="careersUrl"
+									target="_blank"
+									rel="noopener"
+									v-kv-track-event="['Footer', 'click-Work with us-Careers']"
+								>
+									Careers
+								</a>
+							</li>
+							<li>
+								<router-link
+									to="/work-with-us/internvolunteers"
+									v-kv-track-event="['Footer', 'click-Work with us-Volunteer interships']"
+								>
+									Volunteer internships
+								</router-link>
+							</li>
+							<li>
+								<a
+									href="https://www.careers.kiva.org/fellowships"
+									target="_blank"
+									rel="noopener"
+									v-kv-track-event="['Footer', 'click-Work with us-Kiva fellows']"
+								>
+									Kiva fellows
+								</a>
+							</li>
+							<li>
+								<router-link
+									to="/work-with-us/reviewers"
+									v-kv-track-event="['Footer', 'click-Work with us-Review and translation']"
+								>
+									Review and translation
+								</router-link>
+							</li>
+							<li>
+								<a
+									href="https://www.kivaushub.org/hubs"
+									target="_blank"
+									rel="noopener"
+									v-kv-track-event="['Footer', 'click-Work with us-US Hubs']"
+								>
+									US Hubs
+								</a>
+							</li>
+						</ul>
+					</div>
+				</div>
+			</div>
+			<div class="row column collapse text-left">
+				<ul class="large-footer__single-line-links">
+					<li>
+						<router-link
+							:to="privacyUrl"
+							v-kv-track-event="['Footer', 'click-Privacy policy']"
+						>
+							Privacy policy
+						</router-link>
+					</li>
+					<li>
+						<router-link
+							:to="cookiesUrl"
+							v-kv-track-event="['Footer', 'click-Cookie policy']"
+						>
+							Cookie and Data Settings
+						</router-link>
+					</li>
+					<li>
+						<router-link
+							:to="termsUrl"
+							v-kv-track-event="['Footer', 'click-Terms of use']"
+						>
+							Terms of use
+						</router-link>
+					</li>
+					<li>
+						<router-link
+							:to="sitemapUrl"
+							v-kv-track-event="['Footer', 'click-Site map']"
+						>
+							Site map
+						</router-link>
+					</li>
+				</ul>
+			</div>
+			<div class="row column collapse text-left">
+				<p class="large-footer__disclaimer">
+					Lending through Kiva involves risk of principal loss.
+					Kiva does not guarantee repayment or offer a financial return on your loan.
+					<br><br>
+					&copy; {{ year }} Kiva. All rights reserved.
+				</p>
+			</div>
+		</nav>
+	</div>
+</template>
+
+<script>
+import { getYear } from 'date-fns';
+import getCacheKey from '@/util/getCacheKey';
+import KvAccordionItem from '@/components/Kv/KvAccordionItem';
+import KvIcon from '@/components/Kv/KvIcon';
+
+export default {
+	components: {
+		KvAccordionItem,
+		KvIcon,
+	},
+	serverCacheKey: props => getCacheKey(props.theme ? `footerThemed${props.theme.themeKey}` : 'footer'),
+	props: {
+		theme: {
+			type: Object,
+			default: () => {}
+		}
+	},
+	data() {
+		return {
+			year: getYear(new Date()),
+			applyUrl: '/borrow',
+			monthlyGoodUrl: '/monthlygood',
+			aboutUrl: '/about',
+			lendByCategoryUrl: '/lend-by-category',
+			helpUrl: '/help',
+			careersUrl: 'https://www.careers.kiva.org/',
+			cookiesUrl: '/legal/cookies#manage-settings',
+			sitemapUrl: '/sitemap',
+			privacyUrl: '/legal/privacy',
+			termsUrl: '/legal/terms',
+			appStoreUrl: 'https://apps.apple.com/app/id1453093374',
+			playStoreUrl: 'https://play.google.com/store/apps/details?id=org.kiva.lending'
+		};
+	},
+};
+</script>
diff --git a/src/components/WwwFrame/TheFooter.vue b/src/components/WwwFrame/TheFooter.vue
index 07d92c637f..91126659f8 100644
--- a/src/components/WwwFrame/TheFooter.vue
+++ b/src/components/WwwFrame/TheFooter.vue
@@ -1,745 +1,26 @@
 <template>
 	<footer class="www-footer" :style="cssVars">
 		<disclaimers />
-		<nav class="small-footer hide-for-large" aria-label="Footer navigation">
-			<div class="row collapse">
-				<div class="column">
-					<h2>Borrow</h2>
-					<p>Loans for entrepreneurs doing amazing things.</p>
-					<ul>
-						<li>
-							<router-link
-								:to="applyUrl"
-								v-kv-track-event="['Footer', 'click-Borrow-Apply now']"
-							>
-								Apply now
-							</router-link>
-						</li>
-					</ul>
-				</div>
-			</div>
-			<div class="row collapse">
-				<div class="column">
-					<h2>Lend</h2>
-					<p>Make a loan, change a life.</p>
-					<ul>
-						<li>
-							<router-link
-								:to="lendByCategoryUrl"
-								v-kv-track-event="['Footer', 'click-Lend-lend now']"
-							>
-								Lend now
-							</router-link>
-						</li>
-						<li>
-							<router-link
-								:to="monthlyGoodUrl"
-								v-kv-track-event="['Footer', 'click-Lend-Monthly Good']"
-							>
-								Monthly Good
-							</router-link>
-						</li>
-					</ul>
-				</div>
-			</div>
-			<div class="row collapse">
-				<div class="column">
-					<h2>Donate</h2>
-					<p>
-						Kiva is a 501(c)3 U.S. nonprofit fueled by passionate people.
-						Founded in 2005, and based in San Francisco, with offices in Bangkok, Nairobi,
-						Portland and staff around the globe.
-					</p>
-					<ul>
-						<li>
-							<router-link
-								to="/donate/supportus"
-								v-kv-track-event="['Footer', 'click-Donate', 'Donate to Kiva here']"
-							>
-								Donate to Kiva
-							</router-link>
-						</li>
-					</ul>
-					<hr>
-				</div>
-			</div>
-			<div class="row collapse">
-				<div class="column">
-					<kv-accordion-item
-						id="get-to-know-us_accordion"
-						:open="false"
-					>
-						<template #header>
-							<h2>Get to know us</h2>
-						</template>
-						<ul>
-							<li>
-								<router-link
-									:to="aboutUrl"
-									v-kv-track-event="['Footer', 'click-Get to know us-About us']"
-								>
-									About us
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/about/how"
-									v-kv-track-event="['Footer', 'click-Get to know us-How Kiva works']"
-								>
-									How Kiva works
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/about/how#faq-hkw-section"
-									v-kv-track-event="['Footer', 'click-Get to know us-FAQs']"
-								>
-									FAQs
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/about/where-kiva-works"
-									v-kv-track-event="['Footer', 'click-Get to know us-Where Kiva works']"
-								>
-									Where Kiva works
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/blog"
-									v-kv-track-event="['Footer', 'click-Get to know us-Blog']"
-								>
-									Blog
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/partner-with-us"
-									v-kv-track-event="['Footer', 'click-Get to know us-Partner with us']"
-								>
-									Partner with us
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/help/contact-us"
-									v-kv-track-event="['Footer', 'click-Get to know us-Contact us']"
-								>
-									Contact us
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									:to="helpUrl"
-									v-kv-track-event="['Footer', 'click-Get to know us-Help']"
-								>
-									Help
-								</router-link>
-							</li>
-						</ul>
-					</kv-accordion-item>
-					<kv-accordion-item
-						id="community_accordion"
-						:open="false"
-					>
-						<template #header>
-							<h2>Community</h2>
-						</template>
-						<ul>
-							<li>
-								<router-link
-									to="/teams"
-									v-kv-track-event="['Footer', 'click-Community-Teams']"
-								>
-									Teams
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/kivau/intro"
-									v-kv-track-event="['Footer', 'click-Community-Students and educators']"
-								>
-									Students and educators
-								</router-link>
-							</li>
-						</ul>
-					</kv-accordion-item>
-					<kv-accordion-item
-						id="explore_accordion"
-						:open="false"
-					>
-						<template #header>
-							<h2>Explore</h2>
-						</template>
-						<ul>
-							<li>
-								<router-link
-									to="/protocol"
-									v-kv-track-event="['Footer', 'click-Explore-Protocol']"
-								>
-									Protocol
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/gifts"
-									v-kv-track-event="['Footer', 'click-Explore-Gifts']"
-								>
-									Gifts
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/live"
-									v-kv-track-event="['Footer', 'click-Explore-Happening now']"
-								>
-									Happening now
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/build"
-									v-kv-track-event="['Footer', 'click-Explore-Developer API']"
-								>
-									Developer API
-								</router-link>
-							</li>
-						</ul>
-					</kv-accordion-item>
-					<kv-accordion-item
-						id="work-with-us_accordion"
-						:open="false"
-					>
-						<template #header>
-							<h2>Work with us</h2>
-						</template>
-						<ul>
-							<li>
-								<a
-									:href="careersUrl"
-									target="_blank"
-									rel="noopener"
-									v-kv-track-event="['Footer', 'click-Work with us-Careers']"
-								>
-									Careers
-								</a>
-							</li>
-							<li>
-								<router-link
-									to="/work-with-us/internvolunteers"
-									v-kv-track-event="['Footer', 'click-Work with us-Volunteer interships']"
-								>
-									Volunteer internships
-								</router-link>
-							</li>
-							<li>
-								<a
-									href="https://www.careers.kiva.org/fellowships"
-									target="_blank"
-									rel="noopener"
-									v-kv-track-event="['Footer', 'click-Work with us-Kiva fellows']"
-								>
-									Kiva fellows
-								</a>
-							</li>
-							<li>
-								<router-link
-									to="/work-with-us/reviewers"
-									v-kv-track-event="['Footer', 'click-Work with us-Review and translation']"
-								>
-									Review and translation
-								</router-link>
-							</li>
-							<li>
-								<a
-									href="https://www.kivaushub.org/hubs"
-									target="_blank"
-									rel="noopener"
-									v-kv-track-event="['Footer', 'click-Work with us-US Hubs']"
-								>
-									US Hubs
-								</a>
-							</li>
-						</ul>
-					</kv-accordion-item>
-					<span></span>
-				</div>
-			</div>
-			<div class="row collapse">
-				<div class="column">
-					<ul class=" download-app-icons">
-						<li>
-							<a
-								:href="appStoreUrl"
-								target="_blank"
-								rel="noopener"
-								v-kv-track-event="['global', 'click-app-badge-footer', 'App Store']"
-							>
-								<img
-									class="download-app-ios"
-									src="@/assets/icons/app-store.svg"
-									loading="lazy"
-									alt="Check out our new app on the App Store"
-								>
-							</a>
-						</li>
-						<li>
-							<a
-								:href="playStoreUrl"
-								target="_blank"
-								rel="noopener"
-								v-kv-track-event="['global', 'click-app-badge-footer', 'Google Store']"
-							>
-								<img
-									class="download-app-android"
-									src="@/assets/icons/play-store.svg"
-									loading="lazy"
-									alt="Check out our new app on the Play Store"
-								>
-							</a>
-						</li>
-					</ul>
-				</div>
-			</div>
-			<div class="row collapse small-footer__social-icon-row">
-				<div class="column">
-					<a
-						href="//www.facebook.com/kiva/"
-						target="_blank"
-						rel="noopener"
-						v-kv-track-event="['Footer', 'click-social-icon', 'Facebook']"
-					>
-						<kv-icon name="facebook-round" title="Facebook" class="small-footer__social-icon" />
-					</a>
-					<a
-						href="//www.instagram.com/kiva.org"
-						target="_blank"
-						rel="noopener"
-						v-kv-track-event="['Footer', 'click-social-icon', 'Instagram']"
-					>
-						<kv-icon name="instagram" title="Instagram" class="small-footer__social-icon" />
-					</a>
-					<a
-						href="//twitter.com/kiva"
-						target="_blank"
-						rel="noopener"
-						v-kv-track-event="['Footer', 'click-social-icon', 'Twitter']"
-					>
-						<kv-icon name="twitter" title="Twitter" class="small-footer__social-icon" />
-					</a>
-				</div>
-			</div>
-
-			<div class="row collapse">
-				<div class="column">
-					<ul class="small-footer__single-line-links">
-						<li>
-							<router-link
-								:to="privacyUrl"
-								v-kv-track-event="['Footer', 'click-Privacy policy']"
-							>
-								Privacy policy
-							</router-link>
-						</li>
-						<li>
-							<router-link
-								:to="cookiesUrl"
-								v-kv-track-event="['Footer', 'click-Cookie policy']"
-							>
-								Cookie and Data Settings
-							</router-link>
-						</li>
-						<li>
-							<router-link
-								:to="termsUrl"
-								v-kv-track-event="['Footer', 'click-Terms of use']"
-							>
-								Terms of use
-							</router-link>
-						</li>
-						<li>
-							<router-link
-								:to="sitemapUrl"
-								v-kv-track-event="['Footer', 'click-Site map']"
-							>
-								Site map
-							</router-link>
-						</li>
-					</ul>
-				</div>
-			</div>
-			<div class="row collapse">
-				<div class="column">
-					<p class="small-footer__disclaimer">
-						Lending through Kiva involves risk of principal loss.
-						Kiva does not guarantee repayment or offer a financial return on your loan.
-						<br><br>
-						&copy; {{ year }} Kiva. All rights reserved.
-					</p>
-				</div>
-			</div>
-		</nav>
-		<nav class="large-footer show-for-large" aria-label="Footer navigation">
-			<div class="row collapse text-left">
-				<div class="column narrow hide-for-print">
-					<div class="large-footer__block">
-						<h2>Borrow</h2>
-						<p>Loans for entrepreneurs doing <br class="xxlu">amazing things.</p>
-						<ul>
-							<li>
-								<router-link
-									:to="applyUrl"
-									v-kv-track-event="['Footer', 'click-Borrow-Apply now']"
-								>
-									Apply now
-								</router-link>
-							</li>
-						</ul>
-					</div>
-					<div class="large-footer__block">
-						<h2>Lend</h2>
-						<p>Make a loan, change a life.</p>
-						<ul>
-							<li>
-								<router-link
-									:to="lendByCategoryUrl"
-									v-kv-track-event="['Footer', 'click-Lend-lend now']"
-								>
-									Lend now
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									:to="monthlyGoodUrl"
-									v-kv-track-event="['Footer', 'click-Lend-Monthly Good']"
-								>
-									Monthly Good
-								</router-link>
-							</li>
-						</ul>
-					</div>
-					<div class="large-footer__block">
-						<h2>Explore</h2>
-						<ul>
-							<li>
-								<router-link
-									to="/protocol"
-									v-kv-track-event="['Footer', 'click-Explore-Protocol']"
-								>
-									Protocol
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/gifts"
-									v-kv-track-event="['Footer', 'click-Explore-Gifts']"
-								>
-									Gifts
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/live"
-									v-kv-track-event="['Footer', 'click-Explore-Happening now']"
-								>
-									Happening now
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/build"
-									v-kv-track-event="['Footer', 'click-Explore-Developer API']"
-								>
-									Developer API
-								</router-link>
-							</li>
-						</ul>
-					</div>
-				</div>
-				<div class="column narrow hide-for-print">
-					<div class="large-footer__block hide-for-print">
-						<h2>Get to know us</h2>
-						<ul>
-							<li>
-								<router-link
-									:to="aboutUrl"
-									v-kv-track-event="['Footer', 'click-Get to know us-About us']"
-								>
-									About us
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/about/how"
-									v-kv-track-event="['Footer', 'click-Get to know us-How Kiva works']"
-								>
-									How Kiva works
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/about/how#faq-hkw-section"
-									v-kv-track-event="['Footer', 'click-Get to know us-FAQs']"
-								>
-									FAQs
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/about/where-kiva-works"
-									v-kv-track-event="['Footer', 'click-Get to know us-Where Kiva works']"
-								>
-									Where Kiva works
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/blog"
-									v-kv-track-event="['Footer', 'click-Get to know us-Blog']"
-								>
-									Blog
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/partner-with-us"
-									v-kv-track-event="['Footer', 'click-Get to know us-Partner with us']"
-								>
-									Partner with us
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/help/contact-us"
-									v-kv-track-event="['Footer', 'click-Get to know us-Contact us']"
-								>
-									Contact us
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									:to="helpUrl"
-									v-kv-track-event="['Footer', 'click-Get to know us-Help']"
-								>
-									Help
-								</router-link>
-							</li>
-						</ul>
-					</div>
-					<div class="large-footer__block hide-for-print">
-						<h2>Community</h2>
-						<ul>
-							<li>
-								<router-link
-									to="/teams"
-									v-kv-track-event="['Footer', 'click-Community-Teams']"
-								>
-									Teams
-								</router-link>
-							</li>
-							<li>
-								<router-link
-									to="/kivau/intro"
-									v-kv-track-event="['Footer', 'click-Community-Students and educators']"
-								>
-									Students and educators
-								</router-link>
-							</li>
-						</ul>
-					</div>
-				</div>
-				<div class="column large-6 expand-for-print">
-					<div class="large-footer__block">
-						<p>
-							Kiva is a 501(c)3 U.S. nonprofit fueled by passionate people.
-							Founded in 2005, and based in San Francisco, with offices in Bangkok, Nairobi,
-							Portland and staff around the globe.
-						</p>
-						<ul class="hide-for-print">
-							<li>
-								<router-link
-									to="/donate/supportus"
-									v-kv-track-event="['Footer', 'click-Donate', 'Donate to Kiva here']"
-								>
-									Donate to Kiva
-								</router-link>
-							</li>
-						</ul>
-					</div>
-					<div class="large-footer__block hide-for-print">
-						<ul class=" download-app-icons">
-							<li>
-								<a
-									:href="appStoreUrl"
-									target="_blank"
-									rel="noopener"
-									v-kv-track-event="['global', 'click-app-badge-footer', 'App Store']"
-								>
-									<img
-										class="download-app-ios"
-										src="@/assets/icons/app-store.svg"
-										loading="lazy"
-										alt="Check out our new app on the App Store"
-									>
-								</a>
-							</li>
-							<li>
-								<a
-									:href="playStoreUrl"
-									target="_blank"
-									rel="noopener"
-									v-kv-track-event="['global', 'click-app-badge-footer', 'Google Store']"
-								>
-									<img
-										class="download-app-android"
-										src="@/assets/icons/play-store.svg"
-										loading="lazy"
-										alt="Check out our new app on the Play Store"
-									>
-								</a>
-							</li>
-						</ul>
-					</div>
-					<div class="large-footer__block hide-for-print">
-						<h2>Work with us</h2>
-						<ul class="large-footer__single-line-links large-footer__single-line-links--work-with-us">
-							<li>
-								<a
-									:href="careersUrl"
-									target="_blank"
-									rel="noopener"
-									v-kv-track-event="['Footer', 'click-Work with us-Careers']"
-								>
-									Careers
-								</a>
-							</li>
-							<li>
-								<router-link
-									to="/work-with-us/internvolunteers"
-									v-kv-track-event="['Footer', 'click-Work with us-Volunteer interships']"
-								>
-									Volunteer internships
-								</router-link>
-							</li>
-							<li>
-								<a
-									href="https://www.careers.kiva.org/fellowships"
-									target="_blank"
-									rel="noopener"
-									v-kv-track-event="['Footer', 'click-Work with us-Kiva fellows']"
-								>
-									Kiva fellows
-								</a>
-							</li>
-							<li>
-								<router-link
-									to="/work-with-us/reviewers"
-									v-kv-track-event="['Footer', 'click-Work with us-Review and translation']"
-								>
-									Review and translation
-								</router-link>
-							</li>
-							<li>
-								<a
-									href="https://www.kivaushub.org/hubs"
-									target="_blank"
-									rel="noopener"
-									v-kv-track-event="['Footer', 'click-Work with us-US Hubs']"
-								>
-									US Hubs
-								</a>
-							</li>
-						</ul>
-					</div>
-				</div>
-			</div>
-			<div class="row column collapse text-left">
-				<ul class="large-footer__single-line-links">
-					<li>
-						<router-link
-							:to="privacyUrl"
-							v-kv-track-event="['Footer', 'click-Privacy policy']"
-						>
-							Privacy policy
-						</router-link>
-					</li>
-					<li>
-						<router-link
-							:to="cookiesUrl"
-							v-kv-track-event="['Footer', 'click-Cookie policy']"
-						>
-							Cookie and Data Settings
-						</router-link>
-					</li>
-					<li>
-						<router-link
-							:to="termsUrl"
-							v-kv-track-event="['Footer', 'click-Terms of use']"
-						>
-							Terms of use
-						</router-link>
-					</li>
-					<li>
-						<router-link
-							:to="sitemapUrl"
-							v-kv-track-event="['Footer', 'click-Site map']"
-						>
-							Site map
-						</router-link>
-					</li>
-				</ul>
-			</div>
-			<div class="row column collapse text-left">
-				<p class="large-footer__disclaimer">
-					Lending through Kiva involves risk of principal loss.
-					Kiva does not guarantee repayment or offer a financial return on your loan.
-					<br><br>
-					&copy; {{ year }} Kiva. All rights reserved.
-				</p>
-			</div>
-		</nav>
+		<footer-content :theme="theme" />
 	</footer>
 </template>
 
 <script>
-import { getYear } from 'date-fns';
-import getCacheKey from '@/util/getCacheKey';
-import KvAccordionItem from '@/components/Kv/KvAccordionItem';
-import KvIcon from '@/components/Kv/KvIcon';
 import Disclaimers from '@/components/WwwFrame/DisclaimersContentful';
+import FooterContent from '@/components/WwwFrame/FooterContent';
 
 export default {
 	name: 'TheFooter',
 	components: {
-		KvAccordionItem,
-		KvIcon,
 		Disclaimers,
+		FooterContent,
 	},
-	serverCacheKey: props => getCacheKey(props.theme ? `footerThemed${props.theme.themeKey}` : 'footer'),
 	props: {
 		theme: {
 			type: Object,
 			default: () => {}
 		}
 	},
-	data() {
-		return {
-			year: getYear(new Date()),
-			applyUrl: '/borrow',
-			monthlyGoodUrl: '/monthlygood',
-			aboutUrl: '/about',
-			lendByCategoryUrl: '/lend-by-category',
-			helpUrl: '/help',
-			careersUrl: 'https://www.careers.kiva.org/',
-			cookiesUrl: '/legal/cookies#manage-settings',
-			sitemapUrl: '/sitemap',
-			privacyUrl: '/legal/privacy',
-			termsUrl: '/legal/terms',
-			appStoreUrl: 'https://apps.apple.com/app/id1453093374',
-			playStoreUrl: 'https://play.google.com/store/apps/details?id=org.kiva.lending'
-		};
-	},
 	computed: {
 		cssVars() {
 			if (this.theme) {
diff --git a/src/pages/Donate/DonateFormDropInPaymentWrapper.vue b/src/pages/Donate/DonateFormDropInPaymentWrapper.vue
index f1ef92a57b..a7a9f640ed 100644
--- a/src/pages/Donate/DonateFormDropInPaymentWrapper.vue
+++ b/src/pages/Donate/DonateFormDropInPaymentWrapper.vue
@@ -18,17 +18,15 @@
 					subscription settings
 				</router-link>.
 			</kv-alert>
-			<keep-alive>
-				<braintree-drop-in-interface
-					v-if="isClientReady && isLoggedIn && !hasExistingAutoDeposit"
-					ref="braintreeDropInInterface"
-					:amount="donateAmountAsString"
-					flow="vault"
-					:payment-types="['paypal', 'card']"
-					:preselect-vaulted-payment-method="true"
-					@transactions-enabled="enableConfirmButton = $event"
-				/>
-			</keep-alive>
+			<braintree-drop-in-interface
+				v-if="isClientReady && isLoggedIn && !hasExistingAutoDeposit"
+				ref="braintreeDropInInterface"
+				:amount="donateAmountAsString"
+				flow="vault"
+				:payment-types="['paypal', 'card']"
+				:preselect-vaulted-payment-method="true"
+				@transactions-enabled="enableConfirmButton = $event"
+			/>
 			<kv-button
 				v-if="isLoggedIn && !hasExistingAutoDeposit"
 				class="dropin-submit"
diff --git a/src/pages/Settings/PaymentSettings.vue b/src/pages/Settings/PaymentSettings.vue
index a4f0f18342..bb0d18e696 100644
--- a/src/pages/Settings/PaymentSettings.vue
+++ b/src/pages/Settings/PaymentSettings.vue
@@ -61,16 +61,14 @@
 							</kv-button>
 							<transition name="kvfade">
 								<div v-show="showAddACard">
-									<keep-alive>
-										<braintree-drop-in-interface
-											v-if="isClientReady"
-											ref="braintreeDropInInterface"
-											:payment-types="['card']"
-											auth="token-key"
-											:key="dropInComponentKey"
-											@transactions-enabled="enableAddCardButton = $event"
-										/>
-									</keep-alive>
+									<braintree-drop-in-interface
+										v-if="isClientReady"
+										ref="braintreeDropInInterface"
+										:payment-types="['card']"
+										auth="token-key"
+										:key="dropInComponentKey"
+										@transactions-enabled="enableAddCardButton = $event"
+									/>
 								</div>
 							</transition>
 						</fieldset>