Files
goodgo-platform/apps/web/lib/analytics-api.ts
Ho Ngoc Hai 3a9e44758c fix(web): unwrap CacheMetaInterceptor envelope + dev port migration + homepage diacritic
Several fixes discovered while smoke-testing the homepage under the new
port layout (web 3200 / api 3201) to avoid clashing with a sibling project:

- analytics-api: add `unwrap<T>()` helper for the `{ data, cacheMeta }`
  envelope the backend CacheMetaInterceptor appends to every
  `/analytics/*` response. Apply to all 9 analytics methods. Without this
  `data.activeCount` (etc.) were `undefined`, crashing KpiStrip with
  `TypeError: Cannot read properties of undefined (reading 'toLocaleString')`.
- public page: hard-coded `city = 'Ho Chi Minh'` returned 0 rows because
  the DB stores `'Hồ Chí Minh'` and the SQL filter is case-insensitive but
  not diacritic-insensitive. Use the accented spelling.
- use-analytics hooks: add `useAuthedAnalytics()` gate so unauthenticated
  visitors on public routes no longer fire 401s from analytics queries.
- next.config.js CSP: add localhost:3200/3201 (http + ws) to connect-src so
  the web origin can reach the relocated API. Without this fetches hit
  `TypeError: Failed to fetch` on login.
- .claude/launch.json + package.json: web → 3200, api → 3201 (was 3000/3001,
  conflicting with the sibling psyforge project also using 3000).
- Minor follow-ups from parallel QA work on this branch (analytics modules,
  notifications gateway, auth test fixtures, trending-areas handler + DTO
  + tests, a few E2E smoke specs).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-22 16:54:44 +07:00

308 lines
7.9 KiB
TypeScript

import { apiClient } from './api-client';
/**
* Backend `/analytics/*` endpoints are wrapped by `CacheMetaInterceptor`,
* returning `{ data: T, cacheMeta: {...} }`. This helper unwraps so callers
* receive plain `T` (the cacheMeta field is currently unused on the client).
*/
interface CacheMetaEnvelope<T> {
data: T;
cacheMeta: { cachedAt: string | null; nextRefreshAt: string | null; source: string };
}
async function unwrap<T>(p: Promise<CacheMetaEnvelope<T> | T>): Promise<T> {
const raw = await p;
if (raw && typeof raw === 'object' && 'data' in raw && 'cacheMeta' in raw) {
return (raw as CacheMetaEnvelope<T>).data;
}
return raw as T;
}
export interface MarketReportDistrict {
district: string;
city: string;
propertyType: string;
period: string;
medianPrice: string;
avgPriceM2: number;
totalListings: number;
daysOnMarket: number;
inventoryLevel: number;
absorptionRate: number | null;
yoyChange: number | null;
}
export interface MarketReportResponse {
city: string;
period: string;
districts: MarketReportDistrict[];
}
export interface HeatmapDataPoint {
district: string;
city: string;
avgPriceM2: number;
totalListings: number;
medianPrice: string;
}
export interface HeatmapResponse {
city: string;
period: string;
dataPoints: HeatmapDataPoint[];
}
export interface PriceTrendPoint {
period: string;
medianPrice: string;
avgPriceM2: number;
totalListings: number;
}
export interface PriceTrendResponse {
district: string;
city: string;
propertyType: string;
trend: PriceTrendPoint[];
}
export interface DistrictStats {
district: string;
city: string;
propertyType: string;
medianPrice: string;
avgPriceM2: number;
totalListings: number;
daysOnMarket: number;
inventoryLevel: number;
absorptionRate: number | null;
yoyChange: number | null;
}
export interface DistrictStatsResponse {
city: string;
period: string;
districts: DistrictStats[];
}
export type NearbyPOICategory =
| 'school'
| 'hospital'
| 'transit'
| 'shopping'
| 'restaurant'
| 'park';
export interface NearbyPOI {
id: string;
name: string;
type: string;
category: NearbyPOICategory;
lat: number;
lng: number;
distance: number;
address: string | null;
}
export interface NearbyPOIsResponse {
pois: NearbyPOI[];
center: { lat: number; lng: number };
}
export type AiConfidence = 'low' | 'medium' | 'high';
export interface ListingAiValuation {
estimateVND: number;
lowVND: number;
highVND: number;
confidence: AiConfidence;
rationale: string;
}
export interface ListingAiAdviceBody {
summary: string;
pros: string[];
cons: string[];
suitableFor: string[];
}
export interface ListingAiAdvice {
valuation: ListingAiValuation;
advice: ListingAiAdviceBody;
model: string;
cacheHit: boolean;
cacheUsage?: {
input: number;
cacheCreation: number;
cacheRead: number;
output: number;
};
}
/** Project AI advice — same advice block as listings but no valuation. */
export interface ProjectAiAdvice {
advice: ListingAiAdviceBody;
model: string;
cacheHit: boolean;
cacheUsage?: {
input: number;
cacheCreation: number;
cacheRead: number;
output: number;
};
}
/* ------------------------------------------------------------------ */
/* Market Snapshot */
/* ------------------------------------------------------------------ */
export interface PriceChangePct {
d1: number;
d7: number;
d30: number;
}
export interface MarketSnapshotResponse {
city: string;
propertyType?: string;
activeCount: number;
avgPrice: number;
medianPrice: number;
priceChangePct: PriceChangePct;
avgPricePerM2: number;
daysOnMarket: number;
newListings24h: number;
cachedAt: string | null;
nextRefreshAt: string | null;
}
/* ------------------------------------------------------------------ */
/* Price Movers */
/* ------------------------------------------------------------------ */
export interface PriceMoverItem {
districtId: string;
name: string;
currentAvgPrice: number;
previousAvgPrice: number;
changePct: number;
sampleSize: number;
}
export interface PriceMoversResponse {
direction: 'up' | 'down';
period: string;
level: string;
limit: number;
movers: PriceMoverItem[];
}
/* ------------------------------------------------------------------ */
/* Trending Areas */
/* ------------------------------------------------------------------ */
export interface TrendingAreaItem {
districtId: string;
name: string;
listings: number;
inquiries: number;
views: number;
priceChangePct: number | null;
scoreRank: number;
}
export interface TrendingAreasResponse {
period: number;
level: string;
limit: number;
areas: TrendingAreaItem[];
}
export const analyticsApi = {
// All /analytics/* endpoints are wrapped by the backend CacheMetaInterceptor.
// We unwrap the `{ data, cacheMeta }` envelope so callers get the plain DTO.
getMarketReport: (city: string, period: string, propertyType?: string) => {
const params = new URLSearchParams({ city, period });
if (propertyType) params.set('propertyType', propertyType);
return unwrap<MarketReportResponse>(
apiClient.get<CacheMetaEnvelope<MarketReportResponse>>(
`/analytics/market-report?${params}`,
),
);
},
getHeatmap: (city: string, period: string) => {
const params = new URLSearchParams({ city, period });
return unwrap<HeatmapResponse>(
apiClient.get<CacheMetaEnvelope<HeatmapResponse>>(`/analytics/heatmap?${params}`),
);
},
getPriceTrend: (district: string, city: string, propertyType: string, periods: string[]) => {
const params = new URLSearchParams({ district, city, propertyType, periods: periods.join(',') });
return unwrap<PriceTrendResponse>(
apiClient.get<CacheMetaEnvelope<PriceTrendResponse>>(
`/analytics/price-trend?${params}`,
),
);
},
getDistrictStats: (city: string, period: string) => {
const params = new URLSearchParams({ city, period });
return unwrap<DistrictStatsResponse>(
apiClient.get<CacheMetaEnvelope<DistrictStatsResponse>>(
`/analytics/district-stats?${params}`,
),
);
},
getNearbyPOIs: (lat: number, lng: number, radius = 2000, limit = 30) =>
unwrap<NearbyPOIsResponse>(
apiClient.get<CacheMetaEnvelope<NearbyPOIsResponse>>(
`/analytics/pois/nearby?lat=${lat}&lng=${lng}&radius=${radius}&limit=${limit}`,
),
),
getListingAiAdvice: (listingId: string) =>
unwrap<ListingAiAdvice>(
apiClient.post<CacheMetaEnvelope<ListingAiAdvice>>(
`/analytics/listings/${listingId}/ai-advice`,
),
),
getProjectAiAdvice: (projectId: string) =>
unwrap<ProjectAiAdvice>(
apiClient.post<CacheMetaEnvelope<ProjectAiAdvice>>(
`/analytics/projects/${projectId}/ai-advice`,
),
),
getMarketSnapshot: (city: string, propertyType?: string) => {
const params = new URLSearchParams({ city });
if (propertyType) params.set('propertyType', propertyType);
return unwrap<MarketSnapshotResponse>(
apiClient.get<CacheMetaEnvelope<MarketSnapshotResponse>>(
`/analytics/market-snapshot?${params}`,
),
);
},
getPriceMovers: (direction: 'up' | 'down', period = '7d', limit = 5) => {
const params = new URLSearchParams({ direction, period, limit: String(limit) });
return unwrap<PriceMoversResponse>(
apiClient.get<CacheMetaEnvelope<PriceMoversResponse>>(
`/analytics/price-movers?${params}`,
),
);
},
getTrendingAreas: (period = 7, limit = 10) => {
const params = new URLSearchParams({ period: String(period), limit: String(limit) });
return unwrap<TrendingAreasResponse>(
apiClient.get<CacheMetaEnvelope<TrendingAreasResponse>>(
`/analytics/trending-areas?${params}`,
),
);
},
};