From 1fa2e83a2f29ed479a7c2ceb3853c04ecb79dd20 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 1 Sep 2023 10:32:52 +0100 Subject: [PATCH 1/2] Use Intl.RelativeTimeFormat for "last week" and "last month" --- src/components/views/messages/DateSeparator.tsx | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/src/components/views/messages/DateSeparator.tsx b/src/components/views/messages/DateSeparator.tsx index 69f85f73d69..8c8b1eefb88 100644 --- a/src/components/views/messages/DateSeparator.tsx +++ b/src/components/views/messages/DateSeparator.tsx @@ -18,6 +18,7 @@ limitations under the License. import React from "react"; import { Direction, ConnectionError, MatrixError, HTTPError } from "matrix-js-sdk/src/matrix"; import { logger } from "matrix-js-sdk/src/logger"; +import { capitalize } from "lodash"; import { _t, getUserLanguage } from "../../../languageHandler"; import { formatFullDateNoDay, formatFullDateNoTime, getDaysArray } from "../../../DateUtils"; @@ -92,6 +93,10 @@ export default class DateSeparator extends React.Component { }); }; + private get relativeTimeFormat(): Intl.RelativeTimeFormat { + return new Intl.RelativeTimeFormat(getUserLanguage(), { style: "long", numeric: "auto" }); + } + private getLabel(): string { const date = new Date(this.props.ts); const disableRelativeTimestamps = !SettingsStore.getValue(UIFeature.TimelineEnableRelativeDates); @@ -104,11 +109,10 @@ export default class DateSeparator extends React.Component { const days = getDaysArray("long"); yesterday.setDate(today.getDate() - 1); - const relativeTimeFormat = new Intl.RelativeTimeFormat(getUserLanguage(), { style: "long", numeric: "auto" }); if (date.toDateString() === today.toDateString()) { - return relativeTimeFormat.format(0, "day"); // Today + return this.relativeTimeFormat.format(0, "day"); // Today } else if (date.toDateString() === yesterday.toDateString()) { - return relativeTimeFormat.format(-1, "day"); // Yesterday + return this.relativeTimeFormat.format(-1, "day"); // Yesterday } else if (today.getTime() - date.getTime() < 6 * 24 * 60 * 60 * 1000) { return days[date.getDay()]; // Sunday-Saturday } else { @@ -263,6 +267,7 @@ export default class DateSeparator extends React.Component { private renderJumpToDateMenu(): React.ReactElement { let contextMenu: JSX.Element | undefined; if (this.state.contextMenuPosition) { + const relativeTimeFormat = this.relativeTimeFormat; contextMenu = ( { > From 23b5d1aa61f1b9c3903fc92edc7910950159074e Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 1 Sep 2023 10:33:02 +0100 Subject: [PATCH 2/2] i18n --- src/i18n/strings/en_EN.json | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index c46c2003348..26841c317ac 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -215,9 +215,7 @@ "short_seconds": "%(value)ss", "short_days_hours_minutes_seconds": "%(days)sd %(hours)sh %(minutes)sm %(seconds)ss", "short_hours_minutes_seconds": "%(hours)sh %(minutes)sm %(seconds)ss", - "short_minutes_seconds": "%(minutes)sm %(seconds)ss", - "last_week": "Last week", - "last_month": "Last month" + "short_minutes_seconds": "%(minutes)sm %(seconds)ss" }, "Identity server has no terms of service": "Identity server has no terms of service", "This action requires accessing the default identity server to validate an email address or phone number, but the server does not have any terms of service.": "This action requires accessing the default identity server to validate an email address or phone number, but the server does not have any terms of service.",