From 72b0fd692c395e6e89ae1feac333c7ec185d63ed Mon Sep 17 00:00:00 2001
From: Roger Gutierrez <rogelio.gutierrez@contractors.kiva.org>
Date: Thu, 28 Sep 2023 12:45:32 -0500
Subject: [PATCH] feat: onetime removed from ui components

---
 src/components/Checkout/AutoDepositUpsell.vue |   1 -
 .../MonthlyGoodDropInPaymentWrapper.vue       |   5 -
 .../Settings/SubscriptionsSettingsCards.vue   |  24 +-
 .../Subscriptions/SubscriptionsOneTime.vue    | 310 ------------------
 ...ntreeCreateMonthlyGoodSubscription.graphql |   3 +-
 .../MonthlyGood/MonthlyGoodSetupPage.vue      |   4 -
 .../MonthlyGood/MonthlyGoodThanksPage.vue     |   1 -
 7 files changed, 3 insertions(+), 345 deletions(-)
 delete mode 100644 src/components/Subscriptions/SubscriptionsOneTime.vue

diff --git a/src/components/Checkout/AutoDepositUpsell.vue b/src/components/Checkout/AutoDepositUpsell.vue
index 2badaba01d..d5c31feab0 100644
--- a/src/components/Checkout/AutoDepositUpsell.vue
+++ b/src/components/Checkout/AutoDepositUpsell.vue
@@ -121,7 +121,6 @@ const eligibilityCheckQuery = gql`query autoDepositEligibilityQuery {
 		autoDeposit {
 			id
 			isSubscriber
-			isOnetime
 		}
 		subscriptions {
 			values {
diff --git a/src/components/MonthlyGood/MonthlyGoodDropInPaymentWrapper.vue b/src/components/MonthlyGood/MonthlyGoodDropInPaymentWrapper.vue
index d3b71332dc..ce656043ea 100644
--- a/src/components/MonthlyGood/MonthlyGoodDropInPaymentWrapper.vue
+++ b/src/components/MonthlyGood/MonthlyGoodDropInPaymentWrapper.vue
@@ -67,10 +67,6 @@ export default {
 			type: String,
 			default: ''
 		},
-		isOneTime: {
-			type: Boolean,
-			default: false
-		},
 		currentNonce: {
 			type: String,
 			default: ''
@@ -171,7 +167,6 @@ export default {
 						donateAmount: numeral(this.donateAmount).format('0.00'),
 						dayOfMonth: numeral(this.dayOfMonth).value(),
 						category: this.category,
-						isOnetime: this.isOneTime,
 						deviceData,
 					}
 				}).then(kivaBraintreeResponse => {
diff --git a/src/components/Settings/SubscriptionsSettingsCards.vue b/src/components/Settings/SubscriptionsSettingsCards.vue
index 9c6f34ef70..449916e07a 100644
--- a/src/components/Settings/SubscriptionsSettingsCards.vue
+++ b/src/components/Settings/SubscriptionsSettingsCards.vue
@@ -1,16 +1,7 @@
 <template>
 	<div class="subscriptions-settings-page">
-		<!-- One Time Settings -->
-		<subscriptions-one-time
-			v-if="isOnetime"
-			@cancel-subscription="showConfirmationPrompt('Contribution')"
-			@unsaved-changes="setUnsavedChanges"
-			ref="subscriptionsOneTimeComponent"
-		/>
-
 		<!-- Monthly Good Settings -->
 		<subscriptions-monthly-good
-			v-if="!isOnetime"
 			@cancel-subscription="cancelSubscription"
 			@unsaved-changes="setUnsavedChanges"
 			ref="subscriptionsMonthlyGoodComponent"
@@ -18,7 +9,7 @@
 
 		<!-- Auto Deposit Settings -->
 		<subscriptions-auto-deposit
-			v-if="!isOnetime && !isMonthlyGoodSubscriber && !isLegacySubscriber && !hasModernSub"
+			v-if="!isMonthlyGoodSubscriber && !isLegacySubscriber && !hasModernSub"
 			@cancel-subscription="showConfirmationPrompt('Auto Deposit')"
 			@unsaved-changes="setUnsavedChanges"
 			ref="subscriptionsAutoDepositComponent"
@@ -26,7 +17,7 @@
 
 		<!-- Legacy Subscriptions-->
 		<subscriptions-legacy
-			v-if="!isOnetime && !isMonthlyGoodSubscriber && isLegacySubscriber"
+			v-if="!isMonthlyGoodSubscriber && isLegacySubscriber"
 		/>
 
 		<!-- Are you sure? -->
@@ -79,7 +70,6 @@ import { gql } from '@apollo/client';
 import KvLoadingOverlay from '@/components/Kv/KvLoadingOverlay';
 
 import SubscriptionsMonthlyGood from '@/components/Subscriptions/SubscriptionsMonthlyGood';
-import SubscriptionsOneTime from '@/components/Subscriptions/SubscriptionsOneTime';
 import SubscriptionsAutoDeposit from '@/components/Subscriptions/SubscriptionsAutoDeposit';
 import SubscriptionsLegacy from '@/components/Subscriptions/SubscriptionsLegacy';
 import KvButton from '~/@kiva/kv-components/vue/KvButton';
@@ -91,7 +81,6 @@ const pageQuery = gql`query subscriptionSettingsPage {
 		autoDeposit {
 			id
 			isSubscriber
-			isOnetime
 		}
 		subscriptions {
 			values {
@@ -120,7 +109,6 @@ export default {
 		SubscriptionsAutoDeposit,
 		SubscriptionsLegacy,
 		SubscriptionsMonthlyGood,
-		SubscriptionsOneTime,
 	},
 	inject: ['apollo', 'cookieStore'],
 	data() {
@@ -129,7 +117,6 @@ export default {
 			isChanged: false,
 			isLegacySubscriber: false,
 			isMonthlyGoodSubscriber: false,
-			isOnetime: false,
 			isSaving: false,
 			showLightbox: false,
 			showLoadingOverlay: false,
@@ -141,7 +128,6 @@ export default {
 		query: pageQuery,
 		preFetch: true,
 		result({ data }) {
-			this.isOnetime = data?.my?.autoDeposit?.isOnetime ?? false;
 			this.isMonthlyGoodSubscriber = data?.my?.autoDeposit?.isSubscriber ?? false;
 
 			const legacySubs = data?.my?.subscriptions?.values ?? [];
@@ -192,12 +178,6 @@ export default {
 		},
 		saveSubscription() {
 			this.isSaving = true;
-			// Calls the save method in the component if component isChanged is true.
-			if (this.$refs?.subscriptionsOneTimeComponent?.isChanged) {
-				this.$refs.subscriptionsOneTimeComponent.saveOneTime().finally(() => {
-					this.isSaving = false;
-				});
-			}
 			if (this.$refs?.subscriptionsMonthlyGoodComponent?.isChanged) {
 				this.$refs.subscriptionsMonthlyGoodComponent.saveMonthlyGood().finally(() => {
 					this.isSaving = false;
diff --git a/src/components/Subscriptions/SubscriptionsOneTime.vue b/src/components/Subscriptions/SubscriptionsOneTime.vue
deleted file mode 100644
index 941a5e00e6..0000000000
--- a/src/components/Subscriptions/SubscriptionsOneTime.vue
+++ /dev/null
@@ -1,310 +0,0 @@
-<template>
-	<div class="row">
-		<kv-settings-card class="column large-8" title="Global COVID-19 Response Lending">
-			<template #content>
-				<p>
-					Thank you for supporting those affected by COVID-19. Your deposit of <kv-button
-						class="text-link"
-						@click.native.prevent="showLightbox = true;"
-					>
-						{{ totalCombinedDeposit | numeral('$0,0.00') }}
-					</kv-button> will occur within one hour,
-					after which you will be unable to cancel.
-				</p>
-				<p>
-					<kv-button
-						class="text-link"
-						@click.native.prevent="$emit('cancel-subscription')"
-					>
-						Cancel Contribution
-					</kv-button>
-				</p>
-				<kv-lightbox
-					class="one-time-settings-lightbox"
-					:visible="showLightbox"
-					title="Change your contribution"
-					@lightbox-closed="closeLightbox"
-				>
-					<form
-						@submit.prevent
-						novalidate
-					>
-						<div class="row align-center tw-text-left">
-							<div class="small-12 columns">
-								<div class="row align-middle">
-									<div class="columns">
-										<span>
-											Deposit for lending
-										</span>
-									</div>
-
-									<div class="small-6 medium-4 columns">
-										<label
-											class="tw-sr-only"
-											:class="{ 'error': $v.mgAmount.$invalid }"
-											for="amount"
-										>
-											Amount
-										</label>
-										<kv-currency-input
-											class="text-input"
-											id="amount"
-											v-model="mgAmount"
-										/>
-									</div>
-								</div>
-								<div class="row columns align-middle">
-									<ul class="tw-text-right validation-errors" v-if="$v.mgAmount.$invalid">
-										<li v-if="!$v.mgAmount.required">
-											Field is required
-										</li>
-										<li v-if="!$v.mgAmount.minValue || !$v.mgAmount.maxValue">
-											Enter an amount of $5-$10,000
-										</li>
-									</ul>
-								</div>
-
-								<div class="row align-middle">
-									<div class="columns">
-										<span>
-											Optional donation to support Kiva
-										</span>
-									</div>
-
-									<div class="small-6 medium-4 columns">
-										<label
-											class="tw-sr-only"
-											:class="{ 'error': $v.donation.$invalid }"
-											for="amount"
-										>
-											Donation
-										</label>
-										<kv-currency-input
-											class="text-input"
-											id="donation"
-											v-model="donation"
-										/>
-									</div>
-								</div>
-								<div class="row column align-middle">
-									<ul class="tw-text-right validation-errors" v-if="$v.donation.$invalid">
-										<li v-if="!$v.donation.minValue || !$v.donation.maxValue">
-											Enter an amount of $0-$10,000
-										</li>
-									</ul>
-								</div>
-
-								<div class="row">
-									<div class="columns">
-										<strong>Total</strong>
-									</div>
-
-									<div class="small-6 medium-4 columns">
-										<strong
-											class="additional-left-pad-currency"
-										>{{ totalCombinedDeposit | numeral('$0,0.00') }}</strong>
-									</div>
-								</div>
-								<div class="row column">
-									<ul
-										class="tw-text-center validation-errors"
-										v-if="!$v.mgAmount.maxTotal || !$v.donation.maxTotal"
-									>
-										<li>
-											The maximum Contribution total is $10,000.<br>
-											Please try again by entering in a smaller amount.
-										</li>
-									</ul>
-								</div>
-							</div>
-						</div>
-					</form>
-					<template #controls>
-						<kv-button
-							data-test="one-time-save-button"
-							class="smaller button"
-							v-if="!isSaving"
-							@click.native="saveOneTime"
-							:disabled="!isChanged || $v.$invalid"
-						>
-							Save
-						</kv-button>
-						<kv-button data-test="one-time-save-button" class="smaller button" v-else>
-							Saving <kv-loading-spinner />
-						</kv-button>
-					</template>
-				</kv-lightbox>
-			</template>
-		</kv-settings-card>
-	</div>
-</template>
-
-<script>
-import _get from 'lodash/get';
-import { gql } from '@apollo/client';
-import { validationMixin } from 'vuelidate';
-import { required, minValue, maxValue } from 'vuelidate/lib/validators';
-
-import KvButton from '@/components/Kv/KvButton';
-import KvCurrencyInput from '@/components/Kv/KvCurrencyInput';
-import KvLightbox from '@/components/Kv/KvLightbox';
-import KvLoadingSpinner from '@/components/Kv/KvLoadingSpinner';
-import KvSettingsCard from '@/components/Kv/KvSettingsCard';
-
-const pageQuery = gql`query oneTimeSubscription {
-	my {
-		id
-		autoDeposit {
-			id
-			amount
-			donateAmount
-		}
-	}
-}`;
-
-export default {
-	name: 'SubscriptionsOneTime',
-	inject: ['apollo', 'cookieStore'],
-	components: {
-		KvButton,
-		KvCurrencyInput,
-		KvLightbox,
-		KvLoadingSpinner,
-		KvSettingsCard,
-	},
-	data() {
-		return {
-			isSaving: false,
-			donation: 0,
-			mgAmount: 0,
-			showLightbox: false,
-		};
-	},
-	mixins: [
-		validationMixin,
-	],
-	validations: {
-		mgAmount: {
-			required,
-			minValue: minValue(5),
-			maxValue: maxValue(10000),
-			maxTotal(value) {
-				return value + this.donation < 10000;
-			}
-		},
-		donation: {
-			minValue: minValue(0),
-			maxValue: maxValue(10000),
-			maxTotal(value) {
-				return value + this.mgAmount < 10000;
-			}
-		},
-	},
-	apollo: {
-		query: pageQuery,
-		preFetch(config, client) {
-			return client.query({
-				query: pageQuery
-			});
-		},
-		result({ data }) {
-			const autoDepositAmount = parseFloat(_get(data, 'my.autoDeposit.amount', 0));
-			this.donation = parseFloat(_get(data, 'my.autoDeposit.donateAmount', 0));
-			this.mgAmount = autoDepositAmount - this.donation;
-		},
-	},
-	mounted() {
-		// After initial value is loaded, setup watch to make form dirty on value changes
-		this.$watch('mgAmount', () => {
-			this.$v.$touch();
-		});
-		this.$watch('donation', () => {
-			this.$v.$touch();
-		});
-	},
-	computed: {
-		totalCombinedDeposit() {
-			return this.donation + this.mgAmount;
-		},
-		isChanged() {
-			return this.$v.$dirty;
-		}
-	},
-	methods: {
-		closeLightbox() {
-			// This will not trigger when lightbox is closed after saving
-			this.$emit('unsaved-changes', true);
-			this.showLightbox = false;
-		},
-		saveOneTime() {
-			this.isSaving = true;
-			const updateOneTimeSettings = this.apollo.mutate({
-				mutation: gql`mutation updateAutoDeposit($amount: Money, $donateAmount: Money) {
-					my {
-						updateAutoDeposit( autoDeposit: {
-							amount: $amount, donateAmount: $donateAmount
-						}) {
-							id amount donateAmount
-						}
-					}
-				}`,
-				variables: {
-					amount: this.totalCombinedDeposit,
-					donateAmount: this.donation,
-				}
-			});
-			return updateOneTimeSettings.then(() => {
-				this.$showTipMsg('Contribution saved!');
-			}).catch(e => {
-				console.error(e);
-				this.$showTipMsg('There was a problem saving your settings', 'error');
-			}).finally(() => {
-				this.isSaving = false;
-				this.$emit('unsaved-changes', false);
-				this.showLightbox = false;
-			});
-		},
-	},
-};
-</script>
-
-<style lang="scss" scoped>
-@import 'settings';
-
-form {
-	margin-top: 2rem;
-
-	.row {
-		margin-bottom: 0.25em;
-	}
-
-	// styles to match KvSelect
-	input.text-input {
-		border: 1px solid $charcoal;
-		border-radius: $button-radius;
-		color: $charcoal;
-		font-size: $medium-text-font-size;
-		font-weight: $global-weight-highlight;
-		margin: 0;
-	}
-
-	.additional-left-pad-currency {
-		padding-left: 0.65rem;
-	}
-
-	.text-input,
-	.validation-errors {
-		margin: 0;
-	}
-
-	::v-deep .loading-spinner {
-		vertical-align: middle;
-		width: 1rem;
-		height: 1rem;
-	}
-
-	::v-deep .loading-spinner .line {
-		background-color: $white;
-	}
-}
-</style>
diff --git a/src/graphql/mutation/braintreeCreateMonthlyGoodSubscription.graphql b/src/graphql/mutation/braintreeCreateMonthlyGoodSubscription.graphql
index 7950c348dd..a962785fa9 100644
--- a/src/graphql/mutation/braintreeCreateMonthlyGoodSubscription.graphql
+++ b/src/graphql/mutation/braintreeCreateMonthlyGoodSubscription.graphql
@@ -1,11 +1,10 @@
-mutation braintreeCreateMonthlyGoodSubscription($paymentMethodNonce: String!, $deviceData: String, $amount: Money!, $donateAmount: Money!, $dayOfMonth: Int!, $category: MonthlyGoodCategoryEnum, $isOnetime: Boolean) {
+mutation braintreeCreateMonthlyGoodSubscription($paymentMethodNonce: String!, $deviceData: String, $amount: Money!, $donateAmount: Money!, $dayOfMonth: Int!, $category: MonthlyGoodCategoryEnum) {
 	my {
 		createMonthlyGoodSubscription (
 			autoDeposit: {
 				amount: $amount,
 				donateAmount: $donateAmount,
 				dayOfMonth: $dayOfMonth,
-				isOnetime: $isOnetime
 			},
 			paymentMethodNonce: $paymentMethodNonce,
 			category: $category,
diff --git a/src/pages/MonthlyGood/MonthlyGoodSetupPage.vue b/src/pages/MonthlyGood/MonthlyGoodSetupPage.vue
index de9ecd7efa..b43db585ba 100644
--- a/src/pages/MonthlyGood/MonthlyGoodSetupPage.vue
+++ b/src/pages/MonthlyGood/MonthlyGoodSetupPage.vue
@@ -659,7 +659,6 @@ export default {
 				mgDayOfMonth: this.dayOfMonth,
 				mgCategory: this.selectedGroup,
 				isFTD: false,
-				mgIsOneTime: false,
 			};
 
 			// check ftd status
@@ -700,9 +699,6 @@ export default {
 			if (this.source) {
 				redirectString += `&source=${this.source}`;
 			}
-			if (this.onetime) {
-				redirectString += `&onetime=${this.onetime}`;
-			}
 			return encodeURIComponent(redirectString);
 		},
 		totalCombinedDeposit() {
diff --git a/src/pages/MonthlyGood/MonthlyGoodThanksPage.vue b/src/pages/MonthlyGood/MonthlyGoodThanksPage.vue
index a671d34393..182951af08 100644
--- a/src/pages/MonthlyGood/MonthlyGoodThanksPage.vue
+++ b/src/pages/MonthlyGood/MonthlyGoodThanksPage.vue
@@ -91,7 +91,6 @@ export default {
 			this.mgAmount = this.autoDepositAmount - this.donation;
 			this.dayOfMonth = _get(data, 'my.autoDeposit.dayOfMonth');
 			this.category = _get(data, 'my.monthlyGoodCategory');
-			this.isOnetimePayment = _get(data, 'my.autoDeposit.isOnetime');
 			this.autoDepositId = _get(data, 'my.autoDeposit.id');
 		},
 	},