Files
goodgo-platform/apps/web/lib/du-an-api.ts
Ho Ngoc Hai e21e096e54 feat(web): complete du-an project pages, neighborhood components, and public notification bell
- Add grid/map view toggle on /du-an listing page with Mapbox project markers
- Enhance du-an detail with master plan viewer, neighborhood radar chart, POI map, and price history chart
- Create neighborhood component suite: radar chart (Recharts), POI map (Mapbox), score badges
- Add du-an API client, server-side fetching, and React Query hooks
- Wire NotificationBell into public layout header for authenticated users
- Fix missing PROJECT_STATUS_COLORS import in du-an detail client

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-04-16 05:11:21 +07:00

200 lines
5.0 KiB
TypeScript

import { apiClient } from './api-client';
import type { ListingDetail } from './listings-api';
// ─── Enums ───────────────────────────────────────────────
export type ProjectStatus =
| 'UPCOMING'
| 'SELLING'
| 'HANDOVER'
| 'COMPLETED';
export type ProjectPropertyType =
| 'APARTMENT'
| 'VILLA'
| 'TOWNHOUSE'
| 'SHOPHOUSE'
| 'LAND'
| 'MIXED';
// ─── Interfaces ──────────────────────────────────────────
export interface ProjectMedia {
id: string;
url: string;
type: 'image' | 'video' | 'master_plan' | 'document';
order: number;
caption: string | null;
}
export interface ProjectBlock {
id: string;
name: string;
totalUnits: number;
availableUnits: number;
floors: number;
}
export interface ProjectAmenity {
id: string;
name: string;
icon: string;
category: string;
}
export interface ProjectPriceRange {
propertyType: ProjectPropertyType;
minPrice: string;
maxPrice: string;
pricePerM2Min: number | null;
pricePerM2Max: number | null;
}
export interface ProjectPriceHistory {
period: string;
avgPricePerM2: number;
transactionCount: number;
}
export interface NeighborhoodScore {
category: string;
score: number;
label: string;
}
export interface ProjectPOI {
id: string;
name: string;
type: string;
distance: number;
latitude: number;
longitude: number;
}
export interface ProjectDeveloper {
id: string;
name: string;
logoUrl: string | null;
totalProjects: number;
}
export interface ProjectDocument {
id: string;
name: string;
url: string;
type: string;
sizeBytes: number;
}
export interface ProjectSummary {
id: string;
slug: string;
name: string;
status: ProjectStatus;
developer: ProjectDeveloper;
city: string;
district: string;
address: string;
latitude: number | null;
longitude: number | null;
thumbnailUrl: string | null;
totalArea: number;
totalUnits: number;
propertyTypes: ProjectPropertyType[];
minPrice: string | null;
maxPrice: string | null;
completionDate: string | null;
createdAt: string;
}
export interface ProjectDetail extends ProjectSummary {
description: string;
media: ProjectMedia[];
blocks: ProjectBlock[];
amenities: ProjectAmenity[];
priceRanges: ProjectPriceRange[];
priceHistory: ProjectPriceHistory[];
neighborhoodScores: NeighborhoodScore[];
pois: ProjectPOI[];
documents: ProjectDocument[];
linkedListingCount: number;
}
export interface PaginatedResult<T> {
data: T[];
total: number;
page: number;
limit: number;
totalPages: number;
}
export interface SearchProjectsParams {
city?: string;
district?: string;
developerId?: string;
status?: ProjectStatus;
propertyType?: ProjectPropertyType;
minPrice?: string;
maxPrice?: string;
sort?: string;
page?: number;
limit?: number;
q?: string;
}
// ─── Status Labels ───────────────────────────────────────
export const PROJECT_STATUS_LABELS: Record<ProjectStatus, string> = {
UPCOMING: 'Sắp mở bán',
SELLING: 'Đang bán',
HANDOVER: 'Đang bàn giao',
COMPLETED: 'Đã hoàn thành',
};
export const PROJECT_STATUS_COLORS: Record<ProjectStatus, string> = {
UPCOMING: 'bg-blue-100 text-blue-800',
SELLING: 'bg-green-100 text-green-800',
HANDOVER: 'bg-amber-100 text-amber-800',
COMPLETED: 'bg-gray-100 text-gray-800',
};
export const PROJECT_PROPERTY_TYPE_LABELS: Record<ProjectPropertyType, string> = {
APARTMENT: 'Căn hộ',
VILLA: 'Biệt thự',
TOWNHOUSE: 'Nhà phố',
SHOPHOUSE: 'Shophouse',
LAND: 'Đất nền',
MIXED: 'Tổng hợp',
};
// ─── API Functions ───────────────────────────────────────
export const duAnApi = {
search: (params: SearchProjectsParams = {}) => {
const query = new URLSearchParams();
Object.entries(params).forEach(([key, value]) => {
if (value !== undefined && value !== '') query.append(key, String(value));
});
const qs = query.toString();
return apiClient.get<PaginatedResult<ProjectSummary>>(
`/projects${qs ? `?${qs}` : ''}`,
);
},
getBySlug: (slug: string) =>
apiClient.get<ProjectDetail>(`/projects/${slug}`),
getLinkedListings: (projectId: string, params: { page?: number; limit?: number } = {}) => {
const query = new URLSearchParams();
if (params.page) query.append('page', String(params.page));
if (params.limit) query.append('limit', String(params.limit));
const qs = query.toString();
return apiClient.get<PaginatedResult<ListingDetail>>(
`/projects/${projectId}/listings${qs ? `?${qs}` : ''}`,
);
},
submitInquiry: (projectId: string, data: { name: string; phone: string; message: string }) =>
apiClient.post<{ inquiryId: string }>(`/projects/${projectId}/inquiries`, data),
};