Prepare CTRL for C24_WMDE_Mobile_DE_10

- based on mob 09 https://phabricator.wikimedia.org/T380461
wmde · Nov 22, 2024 · 8a52cfa · 8a52cfa
1 parent d24ce4e
commit 8a52cfa
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 82 deletions.
diff --git a/banners/mobile/C24_WMDE_Mobile_DE_10/banner_var.ts b/banners/mobile/C24_WMDE_Mobile_DE_10/banner_var.ts
@@ -1,6 +1,6 @@
 import { createVueApp } from '@src/createVueApp';
 
-import './styles/styles_var.scss';
+import './styles/styles.scss';
 
 import BannerConductor from '@src/components/BannerConductor/BannerConductor.vue';
 import Banner from './components/BannerVar.vue';
@@ -16,8 +16,8 @@ import DynamicTextPlugin from '@src/DynamicTextPlugin';
 import { LocalImpressionCount } from '@src/utils/LocalImpressionCount';
 import { WindowPageScroller } from '@src/utils/PageScroller/WindowPageScroller';
 import { LegacyTrackerWPORG } from '@src/tracking/LegacyTrackerWPORG';
-import eventMappings from './event_map_var';
-import messages from './messages_var';
+import eventMappings from './event_map';
+import messages from './messages';
 import { LocaleFactoryDe } from '@src/utils/LocaleFactory/LocaleFactoryDe';
 import { createFormItems } from './form_items';
 import { createFormActions } from '@src/createFormActions';

diff --git a/banners/mobile/C24_WMDE_Mobile_DE_10/components/BannerVar.vue b/banners/mobile/C24_WMDE_Mobile_DE_10/components/BannerVar.vue
@@ -9,11 +9,7 @@
 				<KeenSlider :with-navigation="false" :play="slideshowShouldPlay" :interval="5000">
 
 					<template #slides="{ currentSlide }: any">
-						<BannerSlides
-							:currentSlide="currentSlide"
-							:play-live-text="contentState === ContentStates.Mini"
-							@showReasonsToDonate="onShowReasonsToDonate"
-						/>
+						<BannerSlides :currentSlide="currentSlide" :play-live-text="contentState === ContentStates.Mini"/>
 					</template>
 
 				</KeenSlider>
@@ -25,10 +21,7 @@
 			@close="() => onClose( 'FullPageBanner', CloseChoices.Hide )"
 		>
 			<template #banner-text>
-				<BannerText
-					:play-live-text="contentState === ContentStates.FullPage"
-					@showReasonsToDonate="onShowReasonsToDonate"
-				/>
+				<BannerText :play-live-text="contentState === ContentStates.FullPage"/>
 			</template>
 
 			<template #progress>
@@ -105,13 +98,6 @@
 				<WMDEFundsForwardingDE/>
 			</template>
 		</FundsModal>
-
-		<ReasonsToDonate
-			:visible="isReasonsToDonateVisible"
-			@accordionItemClicked="onReasonsToDonateAccordionItemClicked"
-			@callToActionClicked="onReasonsToDonateCallToActionClicked"
-			@hide="onHideReasonsToDonate"
-		/>
 	</div>
 </template>
 
@@ -126,8 +112,8 @@ import { UseOfFundsCloseSources } from '@src/components/UseOfFunds/UseOfFundsClo
 import { PageScroller } from '@src/utils/PageScroller/PageScroller';
 import MainDonationForm from '@src/components/DonationForm/Forms/MainDonationForm.vue';
 import MultiStepDonation from '@src/components/DonationForm/MultiStepDonation.vue';
-import BannerText from '../content/BannerText_var.vue';
-import BannerSlides from '../content/BannerSlides_var.vue';
+import BannerText from '../content/BannerText.vue';
+import BannerSlides from '../content/BannerSlides.vue';
 import BannerFooter from '@src/components/Footer/BannerFooter.vue';
 import KeenSlider from '@src/components/Slider/KeenSlider.vue';
 import { Tracker } from '@src/tracking/Tracker';
@@ -150,10 +136,6 @@ import ProgressBar from '@src/components/ProgressBar/ProgressBar.vue';
 import { LocalCloseTracker } from '@src/utils/LocalCloseTracker';
 import { BannerSubmitOnReturnEvent } from '@src/tracking/events/BannerSubmitOnReturnEvent';
 import SoftClose from '@src/components/SoftClose/SoftClose.vue';
-import ReasonsToDonate from '@src/components/ReasonsToDonate/ReasonsToDonate.vue';
-import { ReasonsToDonateCTAClickedEvent } from '@src/tracking/events/ReasonsToDonateCTAClickedEvent';
-import { ReasonsToDonateShownEvent } from '@src/tracking/events/ReasonsToDonateShownEvent';
-import { ReasonsToDonateItemClickedEvent } from '@src/tracking/events/ReasonsToDonateItemClickedEvent';
 
 enum ContentStates {
 	Mini = 'wmde-banner-wrapper--mini',
@@ -175,12 +157,11 @@ interface Props {
 }
 
 const props = defineProps<Props>();
-const emit = defineEmits( [ 'bannerClosed', 'bannerContentChanged', 'reasonsToDonate' ] );
+const emit = defineEmits( [ 'bannerClosed', 'bannerContentChanged' ] );
 
 const tracker = inject<Tracker>( 'tracker' );
 
 const isFundsModalVisible = ref<boolean>( false );
-const isReasonsToDonateVisible = ref<boolean>( false );
 const slideShowStopped = ref<boolean>( false );
 const slideshowShouldPlay = computed( () => props.bannerState === BannerStates.Visible && !slideShowStopped.value );
 const contentState = ref<ContentStates>( ContentStates.Mini );
@@ -240,26 +221,4 @@ const onHideFundsModal = ( payload: { source: UseOfFundsCloseSources } ): void =
 	isFundsModalVisible.value = false;
 };
 
-const onShowReasonsToDonate = (): void => {
-	isReasonsToDonateVisible.value = true;
-	tracker.trackEvent( new ReasonsToDonateShownEvent() );
-};
-
-const onReasonsToDonateAccordionItemClicked = ( payload: { itemNumber: string } ): void => {
-	tracker.trackEvent( new ReasonsToDonateItemClickedEvent( payload.itemNumber ) );
-};
-
-const onReasonsToDonateCallToActionClicked = (): void => {
-	tracker.trackEvent( new ReasonsToDonateCTAClickedEvent() );
-
-	slideShowStopped.value = true;
-	contentState.value = ContentStates.FullPage;
-
-	props.pageScroller.scrollIntoView( '.wmde-banner-form' );
-	isReasonsToDonateVisible.value = false;
-};
-const onHideReasonsToDonate = (): void => {
-	isReasonsToDonateVisible.value = false;
-};
-
 </script>
diff --git a/banners/mobile/C24_WMDE_Mobile_DE_10/styles/styles_var.scss b/banners/mobile/C24_WMDE_Mobile_DE_10/styles/styles_var.scss
@@ -9,7 +9,7 @@
 @use 'src/themes/UseOfFunds/UseOfFunds';
 @use 'src/themes/Mikings/defaults';
 @use './Banner';
-@use './MiniBanner_var' with (
+@use './MiniBanner' with (
 	$height: 306px
 );
 @use './FullPageBanner';
@@ -21,12 +21,9 @@
 @use 'src/themes/Mikings/DonationForm/SubComponents/SelectGroup';
 @use 'src/themes/Mikings/DonationForm/SubComponents/SelectCustomAmount';
 @use 'src/themes/Mikings/DonationForm/SubComponents/SmsBox';
-@use 'src/themes/Mikings/Message/Message';
 @use 'src/themes/Mikings/Slider/Slider' with (
 	$pagination-padding: 10px,
 	$pagination-height: 40px
 );
 @use 'src/themes/Mikings/SoftClose/SoftClose';
 @use 'src/themes/Mikings/ProgressBar/ProgressBar';
-@use 'src/components/ReasonsToDonate/styles/swatches/skin_default' as reasons-default;
-@use 'src/components/ReasonsToDonate/styles/ReasonsToDonate';
diff --git a/campaign_info.toml b/campaign_info.toml
@@ -35,7 +35,7 @@ resolution = ["800x600", "1024x768", "1280x960", "1600x1200", "1920x1200", "2560
 name = "Mobile"
 icon = "mobile"
 campaign = "C24_WMDE_Mobile_DE_10"
-description = ""
+description = " based on C24_WMDE_Mobile_DE_09, var has special amount handling"
 campaign_tracking = "mob-de-10-ba-241125"
 preview_link = "/mobile/wiki/Wikipedia:Hauptseite?devbanner={{banner}}&banner=B22_WMDE_local_prototype&useskin=minerva"
 preview_link_darkmode = "/mobile/wiki/Wikipedia:Hauptseite?devbanner={{banner}}&banner=B22_WMDE_local_prototype&useskin=minerva&minervanightmode=1"

diff --git a/test/banners/mobile/C24_WMDE_Mobile_DE_10/components/BannerVar.spec.ts b/test/banners/mobile/C24_WMDE_Mobile_DE_10/components/BannerVar.spec.ts
@@ -1,4 +1,4 @@
-import { afterEach, beforeEach, describe, Mock, test, vi } from 'vitest';
+import { afterEach, beforeEach, describe, test, vi } from 'vitest';
 import { mount, VueWrapper } from '@vue/test-utils';
 import Banner from '@banners/mobile/C24_WMDE_Mobile_DE_10/components/BannerVar.vue';
 import { BannerStates } from '@src/components/BannerConductor/StateMachine/BannerStates';
@@ -21,15 +21,12 @@ import { bannerContentAnimatedTextFeatures, bannerContentDateAndTimeFeatures } f
 import { softCloseSubmitTrackingFeatures } from '@test/features/SoftCloseSubmitTracking';
 import { Timer } from '@src/utils/Timer';
 import { TimerStub } from '@test/fixtures/TimerStub';
-import { useReasonsToDonateFeatures, useReasonsToDonateScrollFeatures } from '@test/features/ReasonsToDonate';
 
 let pageScroller: PageScroller;
 let tracker: Tracker;
 const formModel = useFormModel();
 const translator = ( key: string ): string => key;
 describe( 'BannerVar.vue', () => {
-	let showCallback: Mock;
-	let closeCallback: Mock;
 
 	let wrapper: VueWrapper<any>;
 	beforeEach( () => {
@@ -43,12 +40,6 @@ describe( 'BannerVar.vue', () => {
 		tracker = {
 			trackEvent: vi.fn()
 		};
-
-		// for the reasonsToDonate feature
-		showCallback = vi.fn();
-		closeCallback = vi.fn();
-		HTMLDialogElement.prototype.showModal = showCallback;
-		HTMLDialogElement.prototype.close = closeCallback;
 	} );
 
 	afterEach( () => {
@@ -80,7 +71,7 @@ describe( 'BannerVar.vue', () => {
 					formActions: { donateWithAddressAction: 'https://example.com/with-address', donateAnonymouslyAction: 'https://example.com/without-address' },
 					currencyFormatter: new CurrencyEn(),
 					formItems,
-					tracker: tracker,
+					tracker,
 					timer: timer ?? new TimerStub()
 				}
 			}
@@ -169,23 +160,6 @@ describe( 'BannerVar.vue', () => {
 		} );
 	} );
 
-	describe( 'Reasons to Donate', () => {
-		test.each( [
-			[ 'expectContainsReasonsToDonateDialogue' ],
-			[ 'expectTracksReasonsToDonateShownEvent' ],
-			[ 'expectTracksReasonsToDonateCTAClickedEvent' ],
-			[ 'expectTracksReasonsToDonateItemClickedEvent' ]
-		] )( '%s', async ( testName: string ) => {
-			await useReasonsToDonateFeatures[ testName ]( getWrapper(), tracker );
-		} );
-
-		test.each( [
-			[ 'expectScrollsToFormWhenCallToActionIsClicked' ]
-		] )( '%s', async ( testName: string ) => {
-			await useReasonsToDonateScrollFeatures[ testName ]( getWrapper(), pageScroller );
-		} );
-	} );
-
 	describe( 'Mini Banner', () => {
 		test.each( [
 			[ 'expectSlideShowPlaysWhenMiniBannerBecomesVisible' ],