From 75e4ad8881cafa4923514872804f3acadf07bbda Mon Sep 17 00:00:00 2001
From: Roger Gutierrez <rogelio.gutierrez@contractors.kiva.org>
Date: Wed, 22 Nov 2023 10:18:14 -0600
Subject: [PATCH 1/2] feat: lend menu buttons test code removed

---
 src/components/WwwFrame/TheHeader.vue | 119 ++------------------------
 test/e2e/specs/HeaderNavigation.cy.js |   1 -
 2 files changed, 9 insertions(+), 111 deletions(-)

diff --git a/src/components/WwwFrame/TheHeader.vue b/src/components/WwwFrame/TheHeader.vue
index 53bd21e1ae..cd44e04e3f 100644
--- a/src/components/WwwFrame/TheHeader.vue
+++ b/src/components/WwwFrame/TheHeader.vue
@@ -93,12 +93,9 @@
 							tw-grid xl:tw-gap-x-4 tw-items-center"
 						:class="{
 							'tw-gap-x-1 ': isMobile,
-							'tw-gap-x-2.5': !lendMenuButtonExp || !isMobile,
-							'header-lend-menu-button-exp tw-gap-x-1': lendMenuButtonExp,
-							'header-lend-menu-button-exp-visitor': lendMenuButtonExp && isVisitor,
+							'tw-gap-x-2.5': !isMobile,
 							'header--mobile-open': searchOpen || isVisitor,
 							'header--tablet-open': openTabletVariant,
-							'mobile-lend-menu-button-exp': searchOpen && lendMenuButtonExp,
 						}"
 					>
 						<!-- Logo -->
@@ -114,39 +111,7 @@
 							</a>
 						</div>
 
-						<template v-if="lendMenuButtonExp">
-							<div class="tw-flex tw-gap-1.5">
-								<!-- Explore -->
-								<router-link
-									to="/lend-by-category"
-									data-testid="header-explore"
-									class="header__button header__explore"
-									v-kv-track-event="['TopNav','click-Lend']"
-								>
-									<span class="tw-hidden lg:tw-inline-block">Explore loans</span>
-								</router-link>
-
-								<!-- Categories -->
-								<div
-									data-testid="header-lend"
-									class="header__button header__lend"
-									@pointerenter.stop="onLendLinkPointerEnter"
-									@pointerleave.stop="onLendLinkPointerLeave"
-									@pointerup.stop="onLendLinkPointerEnter"
-									@click="onCategoriesClick"
-								>
-									<span class="tw-flex tw-items-center">Categories
-										<kv-material-icon
-											class="tw-w-3 tw-h-3 tw-transition-transform tw-duration-300"
-											:icon="mdiChevronDown"
-											:class="{'tw-rotate-180' : isLendMenuVisible}"
-										/>
-									</span>
-								</div>
-							</div>
-						</template>
-
-						<template v-else>
+						<template>
 							<!-- Lend -->
 							<router-link
 								:id="lendMenuId"
@@ -203,9 +168,9 @@
 							:class="{
 								'tw-hidden': !searchOpen || isVisitor,
 								'md:tw-hidden': hasBasket && isVisitor && !searchOpen || !searchOpen,
-								'md:tw-block': !lendMenuButtonExp || searchOpen || !isVisitor,
+								'md:tw-block': searchOpen || !isVisitor,
 								'md:!tw-block': searchOpen && hasBasket && balance || !hasBasket,
-								'lg:tw-block': lendMenuButtonExp || hasBasket,
+								'lg:tw-block': hasBasket,
 							}"
 						>
 							<search-bar ref="search" />
@@ -216,8 +181,7 @@
 						tw-flex tw-justify-end xl:tw-gap-4 align-middle"
 							:class="{
 								'tw-gap-1': isMobile,
-								'tw-gap-2.5': !lendMenuButtonExp && !isMobile,
-								'tw-gap-1.5': lendMenuButtonExp,
+								'tw-gap-2.5': !isMobile,
 							}"
 						>
 							<!-- Mobile Search Toggle -->
@@ -225,9 +189,9 @@
 								class="header__button header__search-icon tw-inline-flex"
 								:class="{
 									'!tw-hidden': isVisitor,
-									'md:!tw-hidden': !lendMenuButtonExp && !hasBasket,
+									'md:!tw-hidden': !hasBasket,
 									'md:!tw-inline-flex lg:!tw-hidden': isVisitor && hasBasket,
-									'lg:!tw-hidden': lendMenuButtonExp || !isVisitor,
+									'lg:!tw-hidden': !isVisitor,
 								}"
 								v-show="!hideSearchInHeader"
 								data-testid="header-mobile-search-toggle"
@@ -572,8 +536,6 @@ import KivaLogo from '@/assets/inline-svgs/logos/kiva-logo.svg';
 import KvDropdown from '@/components/Kv/KvDropdown';
 import { mdiAccountCircle, mdiChevronDown, mdiMagnify } from '@mdi/js';
 import CampaignLogoGroup from '@/components/CorporateCampaign/CampaignLogoGroup';
-import experimentVersionFragment from '@/graphql/fragments/experimentVersion.graphql';
-import experimentAssignmentQuery from '@/graphql/query/experimentAssignment.graphql';
 import _throttle from 'lodash/throttle';
 import KvButton from '~/@kiva/kv-components/vue/KvButton';
 import KvMaterialIcon from '~/@kiva/kv-components/vue/KvMaterialIcon';
@@ -596,8 +558,6 @@ const optimizelyUserDataQuery = gql`query optimizelyUserDataQuery {
 	}
 }`;
 
-const LEND_MENU_BUTTONS_EXP = 'lend_menu_buttons';
-
 export default {
 	name: 'TheHeader',
 	components: {
@@ -637,7 +597,6 @@ export default {
 			mdiMagnify,
 			userId: null,
 			hasEverLoggedIn: false,
-			lendMenuButtonExp: false,
 			isMobile: false,
 		};
 	},
@@ -726,11 +685,8 @@ export default {
 				const hasLentBeforeValue = cookieStore.get(hasLentBeforeCookie);
 				const hasDepositBeforeValue = cookieStore.get(hasDepositBeforeCookie);
 
-				return Promise.all([
-					// eslint-disable-next-line max-len
-					data?.my?.userAccount?.id && (hasLentBeforeValue === undefined || hasDepositBeforeValue === undefined) ? client.query({ query: optimizelyUserDataQuery }) : Promise.resolve(),
-					client.query({ query: experimentAssignmentQuery, variables: { id: LEND_MENU_BUTTONS_EXP } }),
-				]);
+				// eslint-disable-next-line max-len
+				return (data?.my?.userAccount?.id && (hasLentBeforeValue === undefined || hasDepositBeforeValue === undefined)) ? client.query({ query: optimizelyUserDataQuery }) : Promise.resolve();
 			});
 		},
 		result({ data }) {
@@ -782,8 +738,6 @@ export default {
 
 		userHasLentBefore(this.cookieStore.get(hasLentBeforeCookie) === 'true');
 		userHasDepositBefore(this.cookieStore.get(hasLentBeforeCookie) === 'true');
-
-		this.initializeLendMenuButtonExp();
 	},
 	mounted() {
 		// MARS-246 Hotjar user attributes
@@ -852,11 +806,6 @@ export default {
 				}).catch(() => {});
 			}
 		},
-		onCategoriesClick(e) {
-			if (e.pointerType === 'touch') {
-				this.toggleLendMenu();
-			}
-		},
 		onLendLinkClick(e) {
 			if (e.pointerType === 'touch') {
 				return;
@@ -915,22 +864,6 @@ export default {
 				this.toggleLendMenu(true);
 			}
 		},
-		initializeLendMenuButtonExp() {
-			const experiment = this.apollo.readFragment({
-				id: `Experiment:${LEND_MENU_BUTTONS_EXP}`,
-				fragment: experimentVersionFragment,
-			}) || {};
-
-			this.lendMenuButtonExp = experiment.version === 'b';
-
-			if (experiment.version) {
-				this.$kvTrackEvent(
-					'Lend',
-					'EXP-CORE-1035-Feb-2023',
-					experiment.version
-				);
-			}
-		},
 	},
 	watch: {
 		isVisitor(newVal, oldVal) {
@@ -986,11 +919,6 @@ export default {
 	grid-template-columns: 1fr auto auto;
 }
 
-.header.header-lend-menu-button-exp {
-	grid-template-areas: "logo explore right-side";
-	grid-template-columns: 1fr auto auto;
-}
-
 .header--mobile-open {
 	grid-template-areas:
 		"logo lend right-side"
@@ -998,17 +926,6 @@ export default {
 	grid-template-columns: 1fr auto auto;
 }
 
-.header--mobile-open.mobile-lend-menu-button-exp {
-	grid-template-areas:
-		"logo explore right-side"
-		"search search search";
-	grid-template-columns: 1fr auto auto;
-}
-
-.header--mobile-open.header-lend-menu-button-exp-visitor {
-	grid-template-areas: "logo explore right-side";
-}
-
 @screen md {
 	.header {
 		grid-template-areas: "logo lend search right-side";
@@ -1021,27 +938,9 @@ export default {
 			"search search search";
 		grid-template-columns: 1fr auto auto;
 	}
-
-	.header.header-lend-menu-button-exp {
-		grid-template-areas: "logo explore lend search right-side";
-		grid-template-columns: auto auto auto 1fr auto;
-	}
-
-	.header.header-lend-menu-button-exp-visitor {
-		grid-template-areas: "logo explore lend right-side";
-		grid-template-columns: auto auto 1fr auto;
-	}
-
-	.header--mobile-open.header-lend-menu-button-exp-visitor {
-		grid-template-areas:
-			"logo explore lend right-side"
-			"search search search search";
-		grid-template-columns: auto auto 1fr auto;
-	}
 }
 
 @screen lg {
-	.header.header-lend-menu-button-exp-visitor,
 	.header.header--tablet-open {
 		grid-template-areas: "logo explore lend search right-side";
 		grid-template-columns: auto auto auto 1fr auto;
diff --git a/test/e2e/specs/HeaderNavigation.cy.js b/test/e2e/specs/HeaderNavigation.cy.js
index 74c7405583..21e2e4647d 100644
--- a/test/e2e/specs/HeaderNavigation.cy.js
+++ b/test/e2e/specs/HeaderNavigation.cy.js
@@ -11,7 +11,6 @@ describe('Header Navigation', () => {
 
 		// Go to the lend/filter page
 		cy.visit('ui-site-map');
-		cy.visit('ui-site-map?setuiab=lend_menu_buttons.a');
 		// Type 'f' in the search bar
 		cy.findByPlaceholderText('Search all loans').type('f');
 		// Wait for search results request to complete

From b42bc0746d7f2783d3071a02a1a6d89393a40a69 Mon Sep 17 00:00:00 2001
From: Roger Gutierrez <rogelio.gutierrez@contractors.kiva.org>
Date: Wed, 22 Nov 2023 12:50:56 -0600
Subject: [PATCH 2/2] fix: template element removed for lend cta

---
 src/components/WwwFrame/TheHeader.vue | 42 +++++++++++++--------------
 1 file changed, 20 insertions(+), 22 deletions(-)

diff --git a/src/components/WwwFrame/TheHeader.vue b/src/components/WwwFrame/TheHeader.vue
index cd44e04e3f..346cbef8e4 100644
--- a/src/components/WwwFrame/TheHeader.vue
+++ b/src/components/WwwFrame/TheHeader.vue
@@ -111,28 +111,26 @@
 							</a>
 						</div>
 
-						<template>
-							<!-- Lend -->
-							<router-link
-								:id="lendMenuId"
-								to="/lend-by-category"
-								data-testid="header-lend"
-								class="header__button header__lend"
-								v-kv-track-event="['TopNav','click-Lend']"
-								@pointerenter.native.stop="onLendLinkPointerEnter"
-								@pointerleave.native.stop="onLendLinkPointerLeave"
-								@pointerup.native.stop="onLendLinkPointerUp"
-								@click.native.stop="onLendLinkClick"
-							>
-								<span class="tw-flex tw-items-center">Lend
-									<kv-material-icon
-										class="tw-w-3 tw-h-3 tw-transition-transform tw-duration-300"
-										:icon="mdiChevronDown"
-										:class="{'tw-rotate-180' : isLendMenuVisible}"
-									/>
-								</span>
-							</router-link>
-						</template>
+						<!-- Lend -->
+						<router-link
+							:id="lendMenuId"
+							to="/lend-by-category"
+							data-testid="header-lend"
+							class="header__button header__lend"
+							v-kv-track-event="['TopNav','click-Lend']"
+							@pointerenter.native.stop="onLendLinkPointerEnter"
+							@pointerleave.native.stop="onLendLinkPointerLeave"
+							@pointerup.native.stop="onLendLinkPointerUp"
+							@click.native.stop="onLendLinkClick"
+						>
+							<span class="tw-flex tw-items-center">Lend
+								<kv-material-icon
+									class="tw-w-3 tw-h-3 tw-transition-transform tw-duration-300"
+									:icon="mdiChevronDown"
+									:class="{'tw-rotate-180' : isLendMenuVisible}"
+								/>
+							</span>
+						</router-link>
 
 						<transition name="kvfastfade">
 							<div