Merge remote-tracking branch 'origin/staging' into production

CHANGELOG.md

@@ -1,3 +1,38 @@
+## [2.753.0-rc.1](https://github.com/kiva/ui/compare/v2.752.0...v2.753.0-rc.1) (2024-09-09)
+
+
+### 🎉 New Features
+
+* add loan display snowplow events to funded bp ([93bb3b6](https://github.com/kiva/ui/commit/93bb3b62f56794743a9b36bae92a363f2218db03))
+* handle goal in portfolio for all users in experiment ([05a7f04](https://github.com/kiva/ui/commit/05a7f046e3caaff15300ec600a370a98e76ac123))
+* my kiva experiment setup added ([#5480](https://github.com/kiva/ui/issues/5480)) ([beb8b23](https://github.com/kiva/ui/commit/beb8b23cc309ae69b9d444111d5dea1efb882a94))
+* roll out TY page experiment ([2765bb6](https://github.com/kiva/ui/commit/2765bb62889d762b8f276566f92ba4060c70f1c4))
+* tracking events added to lender profile ([#5472](https://github.com/kiva/ui/issues/5472)) ([bf30028](https://github.com/kiva/ui/commit/bf30028ffc486ecd8857ed2396297f4e0ae2475d))
+
+
+### 🐛 Bugfixes
+
+* add number of loans within badge category in anaylitics ([3799cd4](https://github.com/kiva/ui/commit/3799cd468894becc58c9744f526d91b39c0befc8))
+* bg was wrong when user not opted in and no loans in checkout ([52367d0](https://github.com/kiva/ui/commit/52367d03d62142c8e602e3e36bd299eec82780e9))
+* carousel design ([c386c31](https://github.com/kiva/ui/commit/c386c31314b403b3e9744182fdfb2991876fb750))
+* conflict ([c228fdb](https://github.com/kiva/ui/commit/c228fdb82fb12be724381a22d86d7d9a858d6966))
+* design tweaks ([541f95c](https://github.com/kiva/ui/commit/541f95c2b70aff6c7fbd4aa9f4bc888fa79fd092))
+* ensure show available upsell loan ([#5485](https://github.com/kiva/ui/issues/5485)) ([8eee617](https://github.com/kiva/ui/commit/8eee6177e395eedd1043efdfbb771e3df5165ce1))
+* evaluate some tags and themes ([80f3b3b](https://github.com/kiva/ui/commit/80f3b3b6bf45abb9f1c1e5cdfcbfbd8016687bf0))
+* goal name and handling create user preference before storing goal ([03af218](https://github.com/kiva/ui/commit/03af2187d8eb6e6956e6e238a7ca1c03ff2ba677))
+* index was incorrect on recommended loan on funded BP for interaction snowplow ([9ebc14c](https://github.com/kiva/ui/commit/9ebc14ceb812f95eae2c5d6d08aeb3ff4c14734b))
+* line length ([3e864cb](https://github.com/kiva/ui/commit/3e864cbe8fcd75e025c504c769913ff9c3c8a1b4))
+* lint ([386b92d](https://github.com/kiva/ui/commit/386b92d563fea5faa2525e2f482ab74c413dd739))
+* long line ([aed018f](https://github.com/kiva/ui/commit/aed018fe721265c355357fff03965d6bc766288b))
+* missing tracking information ([6ad1d97](https://github.com/kiva/ui/commit/6ad1d970c3fa2b4658256f1fec88026c51e7bb5b))
+* moving logic to mounted ([fa2d9d9](https://github.com/kiva/ui/commit/fa2d9d9959d7de50b2ab524c25e6d7236558d1b5))
+* remove optional chaining ([56397b9](https://github.com/kiva/ui/commit/56397b91489b3ce871f3e7c24b5690f964ea73fe))
+* resolve potential loan country undefined server error ([8ff58dd](https://github.com/kiva/ui/commit/8ff58dd101f4f753c58efaafcd03bd57db863337))
+* show new TY experience for more users ([ec62bb9](https://github.com/kiva/ui/commit/ec62bb927aba37c1a0776f9b88cb3ebf4f12d597))
+* show old ty page for non-loan purchases ([5cd8808](https://github.com/kiva/ui/commit/5cd88085a5891ce95001914025a9f4b91a27e1ce))
+* try commenting out unshift in effort to track down memory leak ([bf9a23a](https://github.com/kiva/ui/commit/bf9a23ac79c8d97e515a53bb249d877e7a826094))
+* upgrading components library to make sure tree map still works ([b7f6ebf](https://github.com/kiva/ui/commit/b7f6ebffd798351a069f3cafb9cb56a0b79439c2))
+
 ## [2.752.0](https://github.com/kiva/ui/compare/v2.751.0...v2.752.0) (2024-08-29)
 
 

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "kvue",
-	"version": "2.752.0",
+	"version": "2.753.0-rc.1",
 	"description": "The Kiva ui",
 	"author": "braincrave",
 	"private": true,
@@ -49,7 +49,7 @@
 		"@godaddy/terminus": "^4.11.0",
 		"@graphql-tools/load": "^7.7.0",
 		"@graphql-tools/url-loader": "^7.17.18",
-		"@kiva/kv-components": "^3.96.0",
+		"@kiva/kv-components": "^3.101.2",
 		"@kiva/kv-shop": "^1.12.8",
 		"@kiva/kv-tokens": "^2.11.1",
 		"@mdi/js": "^7",

src/components/BorrowerProfile/FundedBorrowerProfile.vue

@@ -85,7 +85,7 @@
 						:loan="category.loan"
 						loan-card-type="FeaturedHeroLoan"
 						:position="1"
-						:row-number="0"
+						:row-number="index + 1"
 						:is-visitor="isVisitor"
 					/>
 				</div>
@@ -218,6 +218,8 @@ export default {
 		this.createViewportObserver();
 		this.rows = [
 			{
+				identifier: 'sector',
+				rowIndex: 1,
 				heading: 'Support these ',
 				subHeading: '',
 				onlyLoan: false,
@@ -226,6 +228,8 @@ export default {
 				loanIds: []
 			},
 			{
+				identifier: 'recommended',
+				rowIndex: 2,
 				heading: 'Recommended Borrower',
 				subHeading: 'We selected this loan for you because it\'s similar to ',
 				onlyLoan: true,
@@ -234,6 +238,8 @@ export default {
 				loan: null
 			},
 			{
+				identifier: 'gender',
+				rowIndex: 3,
 				heading: 'Support these ',
 				subHeading: '',
 				onlyLoan: false,
@@ -242,6 +248,8 @@ export default {
 				loanIds: []
 			},
 			{
+				identifier: 'country',
+				rowIndex: 4,
 				heading: 'Support these borrowers in ',
 				subHeading: '',
 				onlyLoan: false,
@@ -260,6 +268,26 @@ export default {
 				&& top < vHeight
 			);
 		},
+		trackDisplayedLoans(sectionIdentifier, sectionPosition, loans) {
+			const loansDisplayed = loans?.filter(l => !!l?.id)?.map((l, i) => ({
+				position: i + 1,
+				loanId: l.id,
+			})) ?? [];
+
+			if (loansDisplayed.length) {
+				const event = {
+					// eslint-disable-next-line max-len
+					schema: 'https://raw.githubusercontent.com/kiva/snowplow/master/conf/snowplow_lend_by_category_loan_display_event_v3_schema_1_0_0.json#',
+					data: {
+						sectionIdentifier,
+						sectionPosition,
+						loansDisplayed,
+					},
+				};
+
+				this.$kvTrackSelfDescribingEvent(event);
+			}
+		},
 		fetchLoanData() {
 			const row = this.rows.shift();
 			if (row) {
@@ -307,6 +335,7 @@ export default {
 									expLabel
 								}
 							];
+							this.trackDisplayedLoans(row.identifier, row.rowIndex, personalizedLoans);
 							this.isLoading = false;
 							if (this.refIsVisible()) {
 								this.fetchLoanData();
@@ -325,13 +354,14 @@ export default {
 								limit: row.limit
 							}
 						}).then(({ data }) => {
-							const loans = data?.ml?.relatedLoansByTopics?.[0]?.values ?? [];
+							const loan = (data?.ml?.relatedLoansByTopics?.[0]?.values ?? [])[0];
 							this.categories = [
 								...this.categories,
 								{
-									heading: row.heading, loan: loans[0], loanIds: [], subHeading: row.subHeading
+									heading: row.heading, loan, loanIds: [], subHeading: row.subHeading
 								}
 							];
+							this.trackDisplayedLoans(row.identifier, row.rowIndex, [loan]);
 							this.isLoading = false;
 							if (this.refIsVisible()) {
 								this.fetchLoanData();

src/components/LenderProfile/LenderDedicationsList.vue

@@ -27,12 +27,26 @@
 					<div v-else>
 						<a
 							:href="`/dedication/${dedication.loanId}`"
+							v-kv-track-event="[
+								'lender-profile',
+								'click',
+								'lender-received-dedication',
+								dedication.senderName,
+								dedication.loanId
+							]"
 						>
 							<dedicate-heart class="tw-w-full tw-px-4 tw-fill-brand" />
 						</a>
 						<a
 							:href="`/dedication/${dedication.loanId}`"
 							class="data-hj-suppress"
+							v-kv-track-event="[
+								'lender-profile',
+								'click',
+								'lender-received-dedication',
+								dedication.senderName,
+								dedication.loanId
+							]"
 						>
 							Dedicated by {{ dedication.senderName }}
 						</a>
@@ -46,6 +60,7 @@
 				:total="totalCount"
 				:offset="dedicationsOffset"
 				:scroll-to-top="false"
+				track-event-category="lender-profile-dedications"
 				@page-changed="pageChange"
 			/>
 		</section>

src/components/LenderProfile/LenderInviteesList.vue

@@ -27,6 +27,7 @@
 						<component
 							:is="!invitee.publicId ? 'span' : 'a'"
 							:href="`/lender/${invitee.publicId}`"
+							v-kv-track-event="['lender-profile', 'click', 'lender-invitee', invitee.publicId]"
 						>
 							<kv-material-icon
 								v-if="!getImageUrl(invitee)"
@@ -44,6 +45,7 @@
 							class="data-hj-suppress"
 							:is="!invitee.publicId ? 'span' : 'a'"
 							:href="`/lender/${invitee.publicId}`"
+							v-kv-track-event="['lender-profile', 'click', 'lender-invitee', invitee.publicId]"
 						>
 							{{ invitee.name }}
 						</component>
@@ -60,6 +62,7 @@
 				:total="totalCount"
 				:offset="inviteesOffset"
 				:scroll-to-top="false"
+				track-event-category="lender-profile-invitees"
 				@page-changed="pageChange"
 			/>
 		</section>

src/components/LenderProfile/LenderLoansList.vue

@@ -22,6 +22,7 @@
 				:key="`loan-${loan.id}-${index}`"
 				:loan-id="loan.id"
 				:lender-public-id="publicId"
+				@dedication-click="trackDedication"
 			/>
 		</div>
 		<kv-pagination
@@ -30,6 +31,7 @@
 			:limit="loansLimit"
 			:total="totalCount"
 			:offset="loansOffset"
+			track-event-category="lender-profile-loans"
 			@page-changed="pageChange"
 		/>
 	</section>
@@ -130,7 +132,16 @@ export default {
 			const elementToScrollTo = document.querySelector(sectionId);
 			const topOfSectionToScrollTo = elementToScrollTo?.offsetTop - 50 ?? 0;
 			this.smoothScrollTo({ yPosition: topOfSectionToScrollTo, millisecondsToAnimate: 750 });
-		}
+		},
+		trackDedication(dedication) {
+			this.$kvTrackEvent(
+				'lender-profile',
+				'click',
+				'lender-made-dedication',
+				dedication.dedicationCopy,
+				dedication.loanId
+			);
+		},
 	},
 	mounted() {
 		this.fetchLenderLoans();

src/components/LenderProfile/LenderMap.vue

@@ -72,6 +72,7 @@
 					<kv-checkbox
 						class="tw-text-small tw-font-medium custom-checkbox"
 						v-model="showFundraisingLoans"
+						@click="showFundraisingLoansEvent"
 					>
 						Show fundraising loans
 					</kv-checkbox>
@@ -184,13 +185,23 @@ export default {
 	},
 	methods: {
 		countryFilterClicked(countryIso) {
+			this.$kvTrackEvent('lender-profile', 'click', 'lender-loans-map-country-fundraising-loans', countryIso);
 			this.$router.push({
 				path: '/lend/filter',
 				query: {
 					country: countryIso,
 				},
 			});
 		},
+		showFundraisingLoansEvent() {
+			this.$kvTrackEvent(
+				'lender-profile',
+				'toggle',
+				'lender-loans-map-show-fundraising-loans',
+				null,
+				this.showFundraisingLoans ? 0 : 1
+			);
+		},
 	},
 };
 </script>

src/components/LenderProfile/LenderStats.vue

@@ -20,8 +20,9 @@
 					:gender-stats="genderStats"
 					:sector-stats="sectorStats"
 					:partner-stats="partnerStats"
-					track-category="lender"
+					track-category="lender-profile"
 					chart="pie"
+					@click="handleChartClick"
 				/>
 			</div>
 		</section>
@@ -61,6 +62,9 @@ export default {
 				percent: stat.value / total,
 			}));
 		},
+		handleChartClick(label) {
+			this.$kvTrackEvent('lender-profile', 'click', 'lender-distribution-chart', label);
+		},
 	},
 	computed: {
 		locationStats() {