scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in LOY-493/Sidepeek-upcoming-stays (pull request #3315)

Browse Source 
LOY-493/Sidepeek upcoming stays

* chore(LOY-493): Add icon to next stay card cta

* chore(LOY-493): better folder org for stays

* chore(LOY-494): more folder reorg

* feat(LOY-493): Implement Sidepeek for Upcoming Stays


Approved-by: Matilda Landström
This commit is contained in:
Chuma Mcphoy (We Ahead)
2025-12-09 10:54:57 +00:00
parent 8764945b2f
commit f40035baa9
35 changed files with 527 additions and 272 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
apps/scandic-web/utils/getRelativePastTime.test.ts → apps/scandic-web/utils/getTimeAgoText.test.ts
View File

@@ -2,7 +2,7 @@ import { describe, expect, it } from "vitest"
import { dt } from "@scandic-hotels/common/dt"
import { getRelativePastTime } from "./getRelativePastTime"
import { getTimeAgoText } from "./getTimeAgoText"
import type { IntlShape, MessageDescriptor } from "react-intl"
@@ -53,32 +53,32 @@ const mockIntl = {
},
} as IntlShape
describe("getRelativePastTime", () => {
describe("getTimeAgoText", () => {
describe("days ago (1-30 days)", () => {
it("should return '1 day ago' for yesterday", () => {
const yesterday = dt().subtract(1, "day").format("YYYY-MM-DD")
const result = getRelativePastTime(yesterday, mockIntl)
const result = getTimeAgoText(yesterday, mockIntl)
expect(result).toBe("1 day ago")
})
it("should return '2 days ago' for 2 days ago", () => {
const twoDaysAgo = dt().subtract(2, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(twoDaysAgo, mockIntl)
const result = getTimeAgoText(twoDaysAgo, mockIntl)
expect(result).toBe("2 days ago")
})
it("should return '15 days ago' for 15 days ago", () => {
const fifteenDaysAgo = dt().subtract(15, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(fifteenDaysAgo, mockIntl)
const result = getTimeAgoText(fifteenDaysAgo, mockIntl)
expect(result).toBe("15 days ago")
})
it("should return '30 days ago' for exactly 30 days ago (boundary)", () => {
const thirtyDaysAgo = dt().subtract(30, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(thirtyDaysAgo, mockIntl)
const result = getTimeAgoText(thirtyDaysAgo, mockIntl)
expect(result).toBe("30 days ago")
})
@@ -86,7 +86,7 @@ describe("getRelativePastTime", () => {
it("should handle the full range from 1 to 30 days ago", () => {
for (let days = 1; days <= 30; days++) {
const pastDate = dt().subtract(days, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(pastDate, mockIntl)
const result = getTimeAgoText(pastDate, mockIntl)
if (days === 1) {
expect(result).toBe("1 day ago")
@@ -100,42 +100,42 @@ describe("getRelativePastTime", () => {
describe("months ago (31-364 days)", () => {
it("should return '1 month ago' for 31 days ago", () => {
const thirtyOneDaysAgo = dt().subtract(31, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(thirtyOneDaysAgo, mockIntl)
const result = getTimeAgoText(thirtyOneDaysAgo, mockIntl)
expect(result).toBe("1 month ago")
})
it("should return '1 month ago' for 45 days ago", () => {
const fortyFiveDaysAgo = dt().subtract(45, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(fortyFiveDaysAgo, mockIntl)
const result = getTimeAgoText(fortyFiveDaysAgo, mockIntl)
expect(result).toBe("1 month ago")
})
it("should return '2 months ago' for 60 days ago", () => {
const sixtyDaysAgo = dt().subtract(60, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(sixtyDaysAgo, mockIntl)
const result = getTimeAgoText(sixtyDaysAgo, mockIntl)
expect(result).toBe("2 months ago")
})
it("should return '6 months ago' for 180 days ago", () => {
const sixMonthsAgo = dt().subtract(180, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(sixMonthsAgo, mockIntl)
const result = getTimeAgoText(sixMonthsAgo, mockIntl)
expect(result).toBe("6 months ago")
})
it("should return '11 months ago' for 330 days ago", () => {
const elevenMonthsAgo = dt().subtract(330, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(elevenMonthsAgo, mockIntl)
const result = getTimeAgoText(elevenMonthsAgo, mockIntl)
expect(result).toBe("11 months ago")
})
it("should return '12 months ago' for 364 days ago (boundary)", () => {
const twelveMonthsAgo = dt().subtract(364, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(twelveMonthsAgo, mockIntl)
const result = getTimeAgoText(twelveMonthsAgo, mockIntl)
expect(result).toBe("12 months ago")
})
@@ -144,28 +144,28 @@ describe("getRelativePastTime", () => {
describe("years ago (365+ days)", () => {
it("should return '1 year ago' for exactly 365 days ago", () => {
const oneYearAgo = dt().subtract(365, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(oneYearAgo, mockIntl)
const result = getTimeAgoText(oneYearAgo, mockIntl)
expect(result).toBe("1 year ago")
})
it("should return '1 year ago' for 400 days ago", () => {
const fourHundredDaysAgo = dt().subtract(400, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(fourHundredDaysAgo, mockIntl)
const result = getTimeAgoText(fourHundredDaysAgo, mockIntl)
expect(result).toBe("1 year ago")
})
it("should return '2 years ago' for 730 days ago", () => {
const twoYearsAgo = dt().subtract(730, "days").format("YYYY-MM-DD")
const result = getRelativePastTime(twoYearsAgo, mockIntl)
const result = getTimeAgoText(twoYearsAgo, mockIntl)
expect(result).toBe("2 years ago")
})
it("should return '5 years ago' for 5 years ago", () => {
const fiveYearsAgo = dt().subtract(5, "years").format("YYYY-MM-DD")
const result = getRelativePastTime(fiveYearsAgo, mockIntl)
const result = getTimeAgoText(fiveYearsAgo, mockIntl)
expect(result).toBe("5 years ago")
})
@@ -184,8 +184,8 @@ describe("getRelativePastTime", () => {
.startOf("day")
.format("YYYY-MM-DD HH:mm")
const result1 = getRelativePastTime(dateWithTime1, mockIntl)
const result2 = getRelativePastTime(dateWithTime2, mockIntl)
const result1 = getTimeAgoText(dateWithTime1, mockIntl)
const result2 = getTimeAgoText(dateWithTime2, mockIntl)
expect(result1).toBe("5 days ago")
expect(result2).toBe("5 days ago")
@@ -193,18 +193,24 @@ describe("getRelativePastTime", () => {
it("should handle ISO date strings with timezone", () => {
const isoDate = dt().subtract(7, "days").toISOString()
const result = getRelativePastTime(isoDate, mockIntl)
const result = getTimeAgoText(isoDate, mockIntl)
expect(result).toBe("7 days ago")
})
it("should handle future dates (should return 0 days ago for same day)", () => {
// The function doesn't handle negative days specially - it just uses the diff calculation
// For future dates on the same day, diff will be 0
const futureDate = dt().add(1, "day").startOf("day").format("YYYY-MM-DD")
const result = getRelativePastTime(futureDate, mockIntl)
it("should return empty string for future dates", () => {
// Add 2 days to ensure it's definitely in the future regardless of time of day
const futureDate = dt().add(2, "days").format("YYYY-MM-DD")
const result = getTimeAgoText(futureDate, mockIntl)
expect(result).toBe("0 days ago")
expect(result).toBe("")
})
it("should return empty string for dates far in the future", () => {
const farFutureDate = dt().add(1, "year").format("YYYY-MM-DD")
const result = getTimeAgoText(farFutureDate, mockIntl)
expect(result).toBe("")
})
})
@@ -213,24 +219,24 @@ describe("getRelativePastTime", () => {
const date30 = dt().subtract(30, "days").format("YYYY-MM-DD")
const date31 = dt().subtract(31, "days").format("YYYY-MM-DD")
expect(getRelativePastTime(date30, mockIntl)).toBe("30 days ago")
expect(getRelativePastTime(date31, mockIntl)).toBe("1 month ago")
expect(getTimeAgoText(date30, mockIntl)).toBe("30 days ago")
expect(getTimeAgoText(date31, mockIntl)).toBe("1 month ago")
})
it("should transition correctly from months to years at 365 days", () => {
const date364 = dt().subtract(364, "days").format("YYYY-MM-DD")
const date365 = dt().subtract(365, "days").format("YYYY-MM-DD")
expect(getRelativePastTime(date364, mockIntl)).toBe("12 months ago")
expect(getRelativePastTime(date365, mockIntl)).toBe("1 year ago")
expect(getTimeAgoText(date364, mockIntl)).toBe("12 months ago")
expect(getTimeAgoText(date365, mockIntl)).toBe("1 year ago")
})
it("should handle the transition from 1 day to multiple days", () => {
const date1 = dt().subtract(1, "day").format("YYYY-MM-DD")
const date2 = dt().subtract(2, "days").format("YYYY-MM-DD")
expect(getRelativePastTime(date1, mockIntl)).toBe("1 day ago")
expect(getRelativePastTime(date2, mockIntl)).toBe("2 days ago")
expect(getTimeAgoText(date1, mockIntl)).toBe("1 day ago")
expect(getTimeAgoText(date2, mockIntl)).toBe("2 days ago")
})
})
})

12
apps/scandic-web/utils/getRelativePastTime.ts → apps/scandic-web/utils/getTimeAgoText.ts
View File

@@ -9,15 +9,19 @@ import type { IntlShape } from "react-intl"
* - 1-30 days: "1 day ago", "15 days ago", "30 days ago"
* - 31-364 days: "1 month ago", "6 months ago", "12 months ago"
* - 365+ days: "1 year ago", "2 years ago", "5 years ago"
* - Returns empty string for future dates.
*
*/
export function getRelativePastTime(
checkoutDate: string,
intl: IntlShape
): string {
export function getTimeAgoText(checkoutDate: string, intl: IntlShape): string {
const now = dt()
const checkout = dt(checkoutDate)
const daysDiff = now.diff(checkout, "days")
// Return empty string for future dates
if (daysDiff < 0) {
return ""
}
if (daysDiff <= 30) {
// 1-30 days
return intl.formatMessage(