From 98a84e9e3f5ed8e5e61eccc8f621e59faf919ba0 Mon Sep 17 00:00:00 2001
From: Ho Ngoc Hai <hongochai10@icloud.com>
Date: Sun, 19 Apr 2026 14:24:20 +0700
Subject: [PATCH] fix(web): decode \uXXXX escapes that were rendering as
 literal text
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

listing-detail-client.tsx had three more spots that wrote Unicode
escape sequences as JSX text or as JSX attribute strings (no braces),
which JSX does NOT decode — so "Di\u1ec7n t\u00edch" rendered as the
literal 18 characters instead of "Diện tích":

- QuickStat label="Di\u1ec7n t\u00edch"  → "Diện tích"
- QuickStat label="Ph\u00f2ng ng\u1ee7"  → "Phòng ngủ"
- >Thu\u00ea: {price}/th\u00e1ng<        → "Thuê: {price}/tháng"

Same class of bug as the previously-fixed breadcrumb. Audited the
rest of apps/web for `\u[0-9a-fA-F]{4}` — every remaining occurrence
is inside a JS string literal or template literal (escapes are
honoured there), so no further cases to fix.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 apps/web/components/listings/listing-detail-client.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/apps/web/components/listings/listing-detail-client.tsx b/apps/web/components/listings/listing-detail-client.tsx
index ac94e8f..ad8b0e2 100644
--- a/apps/web/components/listings/listing-detail-client.tsx
+++ b/apps/web/components/listings/listing-detail-client.tsx
@@ -117,7 +117,7 @@ export function ListingDetailClient({ listing }: ListingDetailClientProps) {
           )}
           {listing.rentPriceMonthly && (
             <p className="text-sm text-muted-foreground">
-              Thu\u00ea: {formatPrice(listing.rentPriceMonthly)}/th\u00e1ng
+              Thuê: {formatPrice(listing.rentPriceMonthly)}/tháng
             </p>
           )}
           <div className="mt-3">
@@ -131,9 +131,9 @@ export function ListingDetailClient({ listing }: ListingDetailClientProps) {
 
       {/* Quick specs bar */}
       <div className="my-6 flex flex-wrap gap-4 rounded-lg border bg-card p-4">
-        <QuickStat icon="area" label="Di\u1ec7n t\u00edch" value={`${property.areaM2} m\u00B2`} />
+        <QuickStat icon="area" label="Diện tích" value={`${property.areaM2} m²`} />
         {property.bedrooms != null && (
-          <QuickStat icon="bed" label="Ph\u00f2ng ng\u1ee7" value={`${property.bedrooms}`} />
+          <QuickStat icon="bed" label="Phòng ngủ" value={`${property.bedrooms}`} />
         )}
         {property.bathrooms != null && (
           <QuickStat icon="bath" label="Phòng tắm" value={`${property.bathrooms}`} />