Three asks after a walk-through of the dashboard:
1. Dashboard navigation was missing direct entry points to the two
catalog surfaces (Dự án, Khu Công Nghiệp) even though both exist at
/du-an and /khu-cong-nghiep. Users landing in the dashboard had to
go back out to the public header to reach them.
2. The "Tin đăng" (dashboard listings) page defaulted to a 3-column
grid which shows only a handful of properties per viewport. Scanning
many listings at once is easier as a vertical list of horizontal
rows.
3. The public /search results used the same 3-column grid via
PropertyCard. Asked to flip to list there too.
Changes
- (dashboard)/layout.tsx: new `catalogs` nav group with Building2 +
Factory icons pointing at /du-an and /khu-cong-nghiep. Primary
desktop nav also exposes both so they're reachable without opening
the hamburger. Uses existing `nav.projects` / `nav.industrialParks`
i18n keys plus a new `dashboard.catalogs` label in vi/en.
- (dashboard)/listings/page.tsx: default viewMode flipped from 'grid'
to 'list'. The list mode renders a horizontal row per listing
(thumbnail + title/location + price + badges + engagement counters)
inside an <ul>. Toggle button relabelled "Danh sách".
- components/search/search-results.tsx + property-card.tsx: add a
`layout?: 'card' | 'list'` prop to PropertyCard. When `list`, the
card renders as a horizontal row with 224px thumbnail on sm+,
stacked on mobile. SearchResults wraps items in a <ul><li> and asks
for list layout. Default card layout preserved so other callers
(compare, related, etc.) keep their vertical card view.
No API / DB changes. Typecheck clean for the touched surfaces.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Five compounding problems caused hundreds of "Console ApiError:
Unauthorized" entries on every load of /dashboard (and friends) while
unauthenticated or while the auth cookie was stale:
1. QueryClient had `throwOnError: true` as a blanket default, so every
401 from any react-query hook propagated to the nearest error
boundary instead of staying in the query's `error` state. That
also invited React to re-render and re-fire the boundary multiple
times per failing query.
2. React Query retried all failures 3 times with exponential backoff,
so a single 401 became four requests. 401 isn't fixable by retry,
so this is just noise.
3. Dashboard layout rendered `<NotificationBell />` unconditionally,
which polled /notifications/unread-count on mount even when no user
was signed in → 401 on every mount.
4. Dashboard + Admin layouts had no redirect-to-login guard, so
protected queries (market-report, heatmap, admin/dashboard, …) all
mounted and fired against the API before the user ever saw the
login screen.
5. Admin layout waited on `user` but had no way to distinguish "store
still initialising" from "user genuinely absent" — so an expired
cookie left the page stuck on a spinner while the same 401 storm
played out in the background.
Fixes
- query-client.ts: `throwOnError` and `retry` are now predicates. Only
5xx / network errors bubble to boundaries and are retried; 4xx
(auth, validation, not-found) stay in query error state so the
component can render an empty/auth placeholder.
- auth-store.ts: new `isInitialized` flag set in a finally block at
the end of `initialize()`. Downstream guards use it to distinguish
"still booting" from "definitely logged out".
- (dashboard)/layout.tsx: redirects to /login?next=<path> once
initialised and unauthenticated, and renders a lightweight loading
screen in the meantime so child queries never mount.
- (admin)/layout.tsx: same guard. Non-ADMIN logged-in users still
bounce to /dashboard.
- notification-bell.tsx: short-circuits `fetchUnreadCount` when
`isAuthenticated` is false.
Verified in dev: visiting /vi/dashboard unauthenticated now redirects
to /login?redirect=/dashboard with zero console errors and no
/analytics/… calls to the backend.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Map API 429/402/503 errors to Vietnamese banners (rate-limit,
quota-exhausted, model-unavailable) via getValuationErrorMessage helper
in dashboard/valuation/page.tsx.
- Error banner now carries role="alert" + data-testid="valuation-error"
for a11y and Playwright test targeting.
- Add e2e/web/valuation.spec.ts covering happy-path render, rate-limit
banner, and PDF export button visibility.
Partial cherry-pick of TEC-2736 — skipped the sibling commit 4ee0129
(image upload progress + AVM v2 form fields) because its v2 schema
additions (distanceToHospitalKm, floodZoneRisk, hasElevator, ...) are
not yet modelled in master's valuation-api.ts Zod schema. Parking on
the task/tec-2725 branch for later.
Also fix 3 DI regressions from earlier cherry-picks: the branches were
authored before the mass type-only import cleanup, so they brought back
`type LoggerService` (analytics) and `type EventBus` (auth) on DI
constructor params. Removed the `type` modifier so emitDecoratorMetadata
sees runtime references.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
R5.4 ships the upgraded AVM UI behind the `avm_v2` A/B flag. When the
flag is on, the dashboard exposes:
- Tab switch between single valuation and multi-property compare
- Waterfall drivers chart (ValueDriversChart) alongside the existing
horizontal bar breakdown
- Mapbox comparables map with similarity-coloured markers and an
optional highlighted subject pin
- Confidence interval + range bar and PDF export remain available
- Valuation history chart surface unchanged (still lazy-loaded)
Flag plumbing (useAvmV2Flag):
- NEXT_PUBLIC_FEATURE_AVM_V2=1 enables by default
- `?avm_v2=1|0` URL param forces + persists to localStorage
- safe localStorage handling (no throw when storage is blocked)
Tests: comparables-map, value-drivers-chart, use-avm-v2-flag specs
added. Pre-existing "Yếu tố chính" assertion in valuation-results.spec
updated to match the current copy ("Yếu tố ảnh hưởng giá") so the
valuation suite is green (7 files, 52 tests).
Co-Authored-By: Paperclip <noreply@paperclip.ing>
- Add file type (JPG/PNG/WEBP/PDF) and 5MB size validation
- Show image previews with cleanup of object URLs
- Add data-testid attributes on inputs, buttons, previews, alerts for E2E
- Improve error messaging for expired/failed presigned uploads (403 vs other)
- Guard step 2->3 advance when front image missing
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Add three new frontend page sections:
- Industrial parks (khu-cong-nghiep): listing, detail, filter bar
- Transfer listings (chuyen-nhuong): search, category tabs, detail
- AI reports dashboard: list, create, viewer with TOC
Includes components, API clients, hooks, server helpers, i18n keys,
navigation links in public and dashboard layouts, and lint fixes.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Add batch valuation (POST /analytics/valuation/batch, max 50 properties),
valuation comparison (POST /analytics/valuation/compare, 2-5 properties),
and history endpoint (GET /analytics/valuation/history/:propertyId) with
confidence explanation helper. Frontend: enhanced valuation form with project
autocomplete and deep analysis toggle, results with confidence badges and
price range visualization, comparables table, history chart, market context
card, and PDF export.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Implements the frontend notification client for TEC-2217:
1. notifications-api.ts — API client for list, unread-count,
markAsRead, markAllAsRead endpoints
2. notifications-store.ts — Zustand store for notification state
(recent list, unread count, dropdown open state)
3. use-socket-notifications.ts — Socket.IO hook that connects with
httpOnly cookie auth, listens for notification:new events,
auto-reconnects, and syncs unread count on (re)connect
4. notification-bell.tsx — Bell icon with unread badge + dropdown
showing 10 most recent notifications with time-ago formatting,
mark-as-read on click, mark-all-as-read, and "Xem tất cả" link
5. notifications-provider.tsx — Provider wired into locale layout
(inside AuthProvider) to initialize Socket.IO connection
6. Dashboard header — NotificationBell placed before LanguageSwitcher
Added socket.io-client dependency.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
- Add proper Vietnamese diacritics to all valuation components
(form, results, history) and their test assertions
- Fix valuation API client to use /analytics/valuation endpoint
- Return empty history gracefully (no server endpoint yet)
Co-Authored-By: Claude Opus 4 (1M context) <noreply@anthropic.com>
- Rewrite prisma/seed.ts to populate all 27 models with realistic
Vietnamese real estate data (8 users with login, 10 properties,
10 listings, orders, payments, reviews, notifications, etc.)
- Replace all emoji icons with Lucide React SVG icons across frontend
for consistent rendering, sizing, and accessibility
- Redesign dashboard nav: grouped sidebar with section headers,
primary/secondary split on desktop, icon-only secondary items
- Replace language switcher flag emoji with Globe icon
- Replace SVG theme toggle with Lucide Moon/Sun icons
- Fix API startup: graceful fallback for Sentry profiling, Google OAuth,
and Zalo OAuth when credentials are not configured
- Relax rate limiting in development mode (10k req/min)
- Fix listings API to include media[] array in search response
- Add optional chaining for property.media across frontend components
- Update OAuth strategy tests to match graceful fallback behavior
Co-Authored-By: Claude Opus 4 (1M context) <noreply@anthropic.com>
Add vitest/globals types to web tsconfig to fix TS2593 errors in 7 test
files. Fix pricing and subscription test mocks to include all required
lucide-react icons and module dependencies (payment-api, auth-store,
next-intl, i18n/navigation).
All 66 test files now pass (593 tests), typecheck clean, lint clean.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Update 12 page/layout files across auth, dashboard, listings, and search
routes to improve type safety, fix component imports, and align with
latest API changes.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
- Remove unused imports (waitFor, useAuthStore) in dashboard test files
- Convert import() type annotation to import type in comparison-store spec
- Add next-env.d.ts to ESLint ignores (auto-generated file)
- Fix empty object pattern in auth.fixture.ts
- Sort import order alphabetically in 5 API test files
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Create a single `currency.ts` utility with `formatPrice`, `formatVND`,
`formatPricePerM2`, and `parseVND` to replace 9+ duplicated inline
formatters. This fixes inconsistent decimal handling (1.5M was truncated
to "1 triệu") and standardises price/m² display. Integrated across
property cards, listing detail, dashboard, analytics, payments, pricing,
and admin moderation pages with 19 new unit tests.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
Add locale-prefixed routes for admin, auth, dashboard, and public pages.
Add error, loading, and not-found pages for locale context. Add language
switcher UI component for Vietnamese/English toggle.
Co-Authored-By: Paperclip <noreply@paperclip.ing>
