diff --git a/app/features/notifications/components/NotificationList.tsx b/app/features/notifications/components/NotificationList.tsx index ea6650f6c..af244fa00 100644 --- a/app/features/notifications/components/NotificationList.tsx +++ b/app/features/notifications/components/NotificationList.tsx @@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next"; import { Image } from "~/components/Image"; import type { LoaderNotification } from "~/components/layout/NotificationPopover"; import { + mapMetaForTranslation, notificationLink, notificationNavIcon, } from "~/features/notifications/notifications-utils"; @@ -20,7 +21,7 @@ export function NotificationItem({ }: { notification: LoaderNotification; }) { - const { t } = useTranslation(["common"]); + const { t, i18n } = useTranslation(["common"]); return ( @@ -28,7 +29,10 @@ export function NotificationItem({ {!notification.seen ?
: null}
- {t(`common:notifications.text.${notification.type}`, notification.meta)} + {t( + `common:notifications.text.${notification.type}`, + mapMetaForTranslation(notification, i18n.language), + )}
{formatDistance( diff --git a/app/features/notifications/notifications-types.ts b/app/features/notifications/notifications-types.ts index 08cee8e3a..e76a0ebcd 100644 --- a/app/features/notifications/notifications-types.ts +++ b/app/features/notifications/notifications-types.ts @@ -62,7 +62,7 @@ export type Notification = > | NotificationItem<"SEASON_STARTED", { seasonNth: number }> | NotificationItem<"SCRIM_NEW_REQUEST", { fromUsername: string }> - | NotificationItem<"SCRIM_SCHEDULED", { id: number; timeString: string }>; + | NotificationItem<"SCRIM_SCHEDULED", { id: number; at: number }>; type NotificationItem< T extends string, diff --git a/app/features/notifications/notifications-utils.ts b/app/features/notifications/notifications-utils.ts index 0ba6ffa3f..33b1830c3 100644 --- a/app/features/notifications/notifications-utils.ts +++ b/app/features/notifications/notifications-utils.ts @@ -85,3 +85,25 @@ export const notificationLink = (notification: Notification) => { assertUnreachable(notification); } }; + +/** Takes the `meta` object of a notification and transforms it (if needed) to show the translated string to user */ +export const mapMetaForTranslation = ( + notification: Notification, + language: string, +) => { + if (notification.type === "SCRIM_SCHEDULED") { + return { + ...notification.meta, + timeString: notification.meta.at // TODO: after two weeks this check can be removed (all notifications will have `at`) + ? new Date(notification.meta.at).toLocaleString(language, { + day: "numeric", + month: "numeric", + hour: "numeric", + minute: "numeric", + }) + : undefined, + }; + } + + return notification.meta; +}; diff --git a/app/features/scrims/actions/scrims.server.ts b/app/features/scrims/actions/scrims.server.ts index a055ef5b4..4b2aae3f3 100644 --- a/app/features/scrims/actions/scrims.server.ts +++ b/app/features/scrims/actions/scrims.server.ts @@ -2,7 +2,7 @@ import type { ActionFunctionArgs } from "@remix-run/node"; import { requireUser } from "~/features/auth/core/user.server"; import { notify } from "~/features/notifications/core/notify.server"; import { requirePermission } from "~/modules/permissions/guards.server"; -import { databaseTimestampToDate } from "~/utils/dates"; +import { databaseTimestampToJavascriptTimestamp } from "~/utils/dates"; import { errorToastIfFalsy, parseRequestPayload } from "~/utils/remix.server"; import { assertUnreachable } from "~/utils/types"; import * as ScrimPostRepository from "../ScrimPostRepository.server"; @@ -79,15 +79,7 @@ export const action = async ({ request }: ActionFunctionArgs) => { type: "SCRIM_SCHEDULED", meta: { id: post.id, - timeString: databaseTimestampToDate(post.at).toLocaleString( - "en-US", - { - day: "numeric", - month: "numeric", - hour: "numeric", - minute: "numeric", - }, - ), + at: databaseTimestampToJavascriptTimestamp(post.at), }, }, });