@kiva/kv-components 3.46.1 → 3.46.3

package/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.46.3](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@3.46.2...@kiva/kv-components@3.46.3) (2023-10-17)
+
+
+### Bug Fixes
+
+* kvcountdowtimer component updated to show the remaining hours correctly ([#307](https://github.com/kiva/kv-ui-elements/issues/307)) ([1ea593c](https://github.com/kiva/kv-ui-elements/commit/1ea593ce88339fff9e9bf2bcd1e33bed46a8b09a))
+
+
+
+
+
+## [3.46.2](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@3.46.1...@kiva/kv-components@3.46.2) (2023-10-12)
+
+**Note:** Version bump only for package @kiva/kv-components
+
+
+
+
+
 ## [3.46.1](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@3.46.0...@kiva/kv-components@3.46.1) (2023-10-04)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kiva/kv-components",
-  "version": "3.46.1",
+  "version": "3.46.3",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -75,5 +75,5 @@
       "optional": true
     }
   },
-  "gitHead": "201eca0ab06b21641368158c0a8bec0cc482c275"
+  "gitHead": "6fc84d328af54b57e6f9b9b1c409ce4a695d2b10"
 }

package/vue/KvCountdownTimer.vue

@@ -1,6 +1,6 @@
 <template>
 	<span v-if="timeLeft">
-		{{ timeLeft.hours() }}h {{ timeLeft.minutes() }}m {{ timeLeft.seconds() }}s
+		{{ remainingHours }}h {{ timeLeft.minutes() }}m {{ timeLeft.seconds() }}s
 	</span>
 </template>
 
@@ -10,6 +10,7 @@ import {
 	toRefs,
 	onBeforeUnmount,
 	onMounted,
+	computed,
 } from 'vue-demi';
 import moment from 'moment';
 
@@ -26,6 +27,10 @@ export default {
 		const interval = ref(null);
 		const timeLeft = ref(null);
 
+		const remainingHours = computed(() => {
+			return Math.floor(timeLeft.value.asHours());
+		});
+
 		onMounted(() => {
 			timeLeft.value = moment.duration(msLeft.value > 0 ? msLeft.value : 0, 'milliseconds');
 
@@ -48,7 +53,7 @@ export default {
 			}
 		});
 
-		return { timeLeft };
+		return { timeLeft, remainingHours };
 	},
 };
 </script>

package/vue/KvLoanTag.vue

@@ -41,13 +41,18 @@ export default {
 		};
 	},
 	computed: {
+		isLseLoan() {
+			return this.loan?.partnerName?.toUpperCase().includes(LSE_LOAN_KEY) ?? false;
+		},
 		amountLeft() {
 			const loanFundraisingInfo = this.loan?.loanFundraisingInfo ?? { fundedAmount: 0, reservedAmount: 0 };
 			const { fundedAmount, reservedAmount } = loanFundraisingInfo;
 			return numeral(this.loan?.loanAmount).subtract(fundedAmount).subtract(reservedAmount).value();
 		},
 		variation() {
-			if (differenceInDays(parseISO(this.loan?.plannedExpirationDate), Date.now()) <= 3) {
+			if (this.isLseLoan) {
+				return 'lse-loan';
+			} if (differenceInDays(parseISO(this.loan?.plannedExpirationDate), Date.now()) <= 3) {
 				return 'ending-soon';
 			} if (this.amountLeft < 100 && this.amountLeft >= 0) {
 				return 'almost-funded';
@@ -57,11 +62,8 @@ export default {
 			return null;
 		},
 		tagText() {
-			const partnerName = this.loan?.partnerName ?? '';
-			if (partnerName.toUpperCase().includes(LSE_LOAN_KEY)) {
-				return 'High community impact';
-			}
 			switch (this.variation) {
+				case 'lse-loan': return 'High community impact';
 				case 'almost-funded': return 'Almost funded';
 				case 'matched-loan': return `${this.matchRatio + 1}x matching by ${this.loan?.matchingText}`;
 				default: return 'Ending soon: ';

package/vue/stories/KvCountdownTimer.stories.js

@@ -23,7 +23,8 @@ const story = (args) => {
 
 export const Seconds = story({ msLeft: 1000 * 10 });
 
-// One second less than 24 hours (since we don't show days in timer)
-export const Tomorrow = story({ msLeft: 1000 * 60 * 60 * 24 - 1000 });
+export const Tomorrow = story({ msLeft: 1000 * 60 * 60 * 24 });
 
 export const Expired = story({ msLeft: 0 });
+
+export const Overmorrow = story({ msLeft: 1000 * 60 * 60 * 48 });