diff --git a/client/src/mobile/screens/dashboard/MDashWidgets.tsx b/client/src/mobile/screens/dashboard/MDashWidgets.tsx index b45513e37..3c92c5569 100644 --- a/client/src/mobile/screens/dashboard/MDashWidgets.tsx +++ b/client/src/mobile/screens/dashboard/MDashWidgets.tsx @@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useRef, useState } from 'react' import { useNavigate } from 'react-router' import { ArrowRight, ArrowRightLeft, Bookmark, Calendar, ChevronDown, ChevronRight, - Clock, Hotel, MapPin, Plane, Plus, RefreshCw, Ticket, Utensils, X, + Clock, Hotel, LogIn, LogOut, MapPin, Plane, Plus, RefreshCw, Ticket, Utensils, X, } from 'lucide-react' import { useTranslation } from '../../../i18n' import { useSettingsStore } from '../../../store/settingsStore' @@ -12,14 +12,21 @@ import { entityGradient } from '../../../utils/gradients' import { CURRENCIES } from '../../../components/Budget/BudgetPanel.constants' import { formatTime, splitReservationDateTime } from '../../../utils/formatters' import { normalizeAppearance, MOBILE_DASH_TOKENS, type MobileDashToken, type Collection } from '@trek/shared' -import type { UpcomingReservation } from '../../../pages/dashboard/dashboardModel' +import { upcomingKey, type UpcomingReservation } from '../../../pages/dashboard/dashboardModel' const RES_ICON: Record = { flight: , hotel: , restaurant: , + // A stay's two moments (#1934) — the stay itself covers a range and stays out + // of a list of what happens next; arriving and leaving are points in time. + checkin: , + checkout: , } +/** The label a stay's moment carries in place of a location. */ +const MOMENT_LABEL: Record = { checkin: 'day.checkIn', checkout: 'day.checkOut' } + /** * Inline dashboard widget panels (currency, collections, timezones, upcoming * reservations) for the mobile dashboard. The blocks are rendered individually @@ -409,8 +416,8 @@ function MUpcomingWidget({ items }: { items: UpcomingReservation[] }): React.Rea ? date.toLocaleDateString(locale, { day: 'numeric', month: 'short', timeZone: 'UTC' }) : null const timeStr = parsed.time ? formatTime(parsed.time, locale, timeFormat) : null - const place = r.location || r.place_name || r.trip_title || null - return [dateStr, timeStr, place].filter(Boolean).join(' · ') + const tail = MOMENT_LABEL[r.type] ? t(MOMENT_LABEL[r.type]) : (r.location || r.place_name || r.trip_title || null) + return [dateStr, timeStr, tail].filter(Boolean).join(' · ') } return ( @@ -420,7 +427,7 @@ function MUpcomingWidget({ items }: { items: UpcomingReservation[] }): React.Rea ) : ( items.map(r => (