Fix date/time formatting to use es-ES locale

- Update all date/time formatting functions to use 'es-ES' locale instead of 'en-US' or 'de-DE'
- Update utility functions in utils/date.ts and utils/exchange.ts
- Update all component files that use date formatting
- Update e2e test helper to match new Spanish date format
- All formatting now uses Spanish locale regardless of selected language as per PR requirements
This commit is contained in:
counterweight 2025-12-26 11:38:17 +01:00
parent d2fc7d8850
commit e35e79e84d
Signed by: counterweight
GPG key ID: 883EDBAA726BD96C
19 changed files with 146 additions and 50 deletions

View file

@ -116,7 +116,7 @@ export default function AdminInvitesPage() {
};
const formatDate = (dateStr: string) => {
return new Date(dateStr).toLocaleString();
return new Date(dateStr).toLocaleString("es-ES");
};
const getStatusBadgeVariant = (status: string): "ready" | "success" | "error" | undefined => {

View file

@ -39,11 +39,11 @@ export default function AdminPriceHistoryPage() {
};
const formatDate = (dateStr: string) => {
return new Date(dateStr).toLocaleString();
return new Date(dateStr).toLocaleString("es-ES");
};
const formatPrice = (price: number) => {
return new Intl.NumberFormat("en-US", {
return new Intl.NumberFormat("es-ES", {
style: "currency",
currency: "EUR",
minimumFractionDigits: 2,

View file

@ -262,7 +262,7 @@ export default function AdminTradesPage() {
<span style={tradeCardStyles.rateLabel}>Rate:</span>
<span style={tradeCardStyles.rateValue}>
{trade.agreed_price_eur.toLocaleString("de-DE", {
{trade.agreed_price_eur.toLocaleString("es-ES", {
maximumFractionDigits: 0,
})}
/BTC
@ -270,7 +270,7 @@ export default function AdminTradesPage() {
<span style={tradeCardStyles.rateLabel}>Market:</span>
<span style={tradeCardStyles.rateValue}>
{trade.market_price_eur.toLocaleString("de-DE", {
{trade.market_price_eur.toLocaleString("es-ES", {
maximumFractionDigits: 0,
})}
</span>

View file

@ -277,10 +277,10 @@ export function BookingStep({
}}
>
<div style={styles.dateWeekday}>
{date.toLocaleDateString("en-US", { weekday: "short" })}
{date.toLocaleDateString("es-ES", { weekday: "short" })}
</div>
<div style={styles.dateDay}>
{date.toLocaleDateString("en-US", {
{date.toLocaleDateString("es-ES", {
month: "short",
day: "numeric",
})}
@ -312,7 +312,7 @@ export function BookingStep({
<div style={styles.section}>
<h2 style={styles.sectionTitle}>
{t("bookingStep.availableSlots")}{" "}
{selectedDate.toLocaleDateString("en-US", {
{selectedDate.toLocaleDateString("es-ES", {
weekday: "long",
month: "long",
day: "numeric",

View file

@ -30,7 +30,7 @@ interface ConfirmationStepProps {
* Format price for display
*/
function formatPrice(price: number): string {
return `${price.toLocaleString("de-DE", { maximumFractionDigits: 0 })}`;
return `${price.toLocaleString("es-ES", { maximumFractionDigits: 0 })}`;
}
const styles: Record<string, CSSProperties> = {
@ -168,7 +168,7 @@ export function ConfirmationStep({
</div>
<div style={styles.compressedBookingDetails}>
<span>
{selectedDate?.toLocaleDateString("en-US", {
{selectedDate?.toLocaleDateString("es-ES", {
weekday: "short",
month: "short",
day: "numeric",

View file

@ -19,7 +19,7 @@ interface PriceDisplayProps {
* Format price for display
*/
function formatPrice(price: number): string {
return `${price.toLocaleString("de-DE", { maximumFractionDigits: 0 })}`;
return `${price.toLocaleString("es-ES", { maximumFractionDigits: 0 })}`;
}
const styles: Record<string, CSSProperties> = {
@ -121,7 +121,7 @@ export function PriceDisplay({
</div>
{lastUpdate && (
<div style={styles.priceTimestamp}>
{t("priceDisplay.updated")} {lastUpdate.toLocaleTimeString()}
{t("priceDisplay.updated")} {lastUpdate.toLocaleTimeString("es-ES")}
{isPriceStale && <span style={styles.staleWarning}> {t("priceDisplay.stale")}</span>}
</div>
)}

View file

@ -15,18 +15,15 @@ interface LanguageContextType {
const LanguageContext = createContext<LanguageContextType | undefined>(undefined);
export function LanguageProvider({ children }: { children: ReactNode }) {
// Start with default locale for SSR consistency
const [locale, setLocaleState] = useState<Locale>(DEFAULT_LOCALE);
const [isHydrated, setIsHydrated] = useState(false);
// Load locale from localStorage on mount
// Load locale from localStorage after hydration
useEffect(() => {
const stored = localStorage.getItem(LOCALE_STORAGE_KEY);
console.log("[useLanguage] Loading locale from localStorage:", stored);
if (stored && (stored === "es" || stored === "en" || stored === "ca")) {
console.log("[useLanguage] Setting locale to:", stored);
setLocaleState(stored as Locale);
} else {
console.log("[useLanguage] No valid stored locale, using default:", DEFAULT_LOCALE);
}
setIsHydrated(true);
}, []);

View file

@ -154,7 +154,7 @@ export default function TradeDetailPage() {
<span style={styles.detailLabel}>Market Price:</span>
<span style={styles.detailValue}>
{trade.market_price_eur.toLocaleString("de-DE", {
{trade.market_price_eur.toLocaleString("es-ES", {
maximumFractionDigits: 0,
})}
/BTC
@ -164,7 +164,7 @@ export default function TradeDetailPage() {
<span style={styles.detailLabel}>Agreed Price:</span>
<span style={styles.detailValue}>
{trade.agreed_price_eur.toLocaleString("de-DE", {
{trade.agreed_price_eur.toLocaleString("es-ES", {
maximumFractionDigits: 0,
})}
/BTC

View file

@ -140,7 +140,7 @@ export default function TradesPage() {
<span style={tradeCardStyles.rateLabel}>{t("trade.rate")}</span>
<span style={tradeCardStyles.rateValue}>
{trade.agreed_price_eur.toLocaleString("de-DE", {
{trade.agreed_price_eur.toLocaleString("es-ES", {
maximumFractionDigits: 0,
})}
/BTC

View file

@ -17,7 +17,7 @@ export function formatDate(d: Date): string {
*/
export function formatTime(isoString: string): string {
const d = new Date(isoString);
return d.toLocaleTimeString("en-US", {
return d.toLocaleTimeString("es-ES", {
hour: "2-digit",
minute: "2-digit",
hour12: false,
@ -29,7 +29,7 @@ export function formatTime(isoString: string): string {
*/
export function formatDateTime(isoString: string): string {
const d = new Date(isoString);
return d.toLocaleString("en-US", {
return d.toLocaleString("es-ES", {
weekday: "short",
month: "short",
day: "numeric",
@ -43,7 +43,7 @@ export function formatDateTime(isoString: string): string {
* Format date for display (e.g., "Mon, Jan 15").
*/
export function formatDisplayDate(d: Date): string {
return d.toLocaleDateString("en-US", { weekday: "short", month: "short", day: "numeric" });
return d.toLocaleDateString("es-ES", { weekday: "short", month: "short", day: "numeric" });
}
/**

View file

@ -7,7 +7,7 @@
* e.g., 10000 -> "€100"
*/
export function formatEur(cents: number): string {
return `${(cents / 100).toLocaleString("de-DE")}`;
return `${(cents / 100).toLocaleString("es-ES")}`;
}
/**