npm - @burdenoff/microfe-housingvista - Versions diffs - 2026.709.2 → 2026.709.3 - Mend

@burdenoff/microfe-housingvista 2026.709.2 → 2026.709.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (83) hide show

package/dist/housingvista/pages/chat/ChatPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatPage.js","names":[],"sources":["../../../../src/housingvista/pages/chat/ChatPage.tsx"],"sourcesContent":["/*\n Messages — the real HousingVista inbox. A two-pane conversations UI (thread\n * list + chat thread with bubbles) backed by wspace-conversations-svc:\n * - `useHousingVistaConversations` lists the user's product threads,\n * - `useConversationMessages` streams the selected thread,\n * - `useSendMessage` posts new messages.\n * Everything is persisted server-side; when there are no threads yet we show a\n * tasteful empty state (never fabricated rows). Fully responsive: on mobile the\n * list and the open thread swap places (back button), on desktop they sit\n * side-by-side.\n * @module housingvista\n /\n\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { useNavigate } from 'react-router-dom';\nimport { ArrowLeft, MapPin, MessageSquare, Search, Send } from 'lucide-react';\nimport { Button, EmphasisPanel, GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout, EmptyState, StatCard } from '../../components';\nimport { useHousingVistaConversations, type HvConversationSummary } from '../../hooks/messages';\nimport { useConversationMessages, useSendMessage } from '../../hooks';\nimport { useHousingVista } from '../../context/HousingVistaContext';\nimport { notify } from '../../lib/toast';\nimport { cn, getRelativeTime } from '../../utils/helpers';\n\n/* Deterministic accent for an avatar chip, derived from the thread title. /\nconst AVATAR_ACCENTS = [\n 'bg-status-info-bg-subtle text-status-info-text',\n 'bg-status-success-bg-subtle text-status-success-text',\n 'bg-status-warning-bg-subtle text-status-warning-text',\n 'bg-action-primary-bg/15 text-primary',\n];\n\nfunction initials(title: string): string {\n const parts = title.trim().split(/\\s+/).filter(Boolean);\n if (parts.length === 0) return '?';\n if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();\n return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();\n}\n\nfunction accentFor(id: string): string {\n let sum = 0;\n for (let i = 0; i < id.length; i += 1) sum += id.charCodeAt(i);\n return AVATAR_ACCENTS[sum % AVATAR_ACCENTS.length];\n}\n\nfunction messageTime(iso: string): string {\n const date = new Date(iso);\n if (Number.isNaN(date.getTime())) return '';\n return date.toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit' });\n}\n\nfunction Avatar({ title, id, size = 'md' }: { title: string; id: string; size?: 'sm' \| 'md' }) {\n return (\n <span\n className={cn(\n 'inline-flex shrink-0 items-center justify-center rounded-full font-semibold',\n size === 'md' ? 'h-10 w-10 text-sm' : 'h-9 w-9 text-xs',\n accentFor(id)\n )}\n aria-hidden\n >\n {initials(title)}\n </span>\n );\n}\n\nexport function ChatPage() {\n const navigate = useNavigate();\n const { currentUser } = useHousingVista();\n const currentUserId = currentUser?.id ?? '';\n\n const { data: conversations, loading, refetch } = useHousingVistaConversations();\n const { sendMessage, loading: sending } = useSendMessage();\n\n const [selectedId, setSelectedId] = useState<string \| undefined>();\n const [query, setQuery] = useState('');\n const [draft, setDraft] = useState('');\n const scrollRef = useRef<HTMLDivElement>(null);\n\n // Default-select the first thread on desktop once data lands.\n useEffect(() => {\n if (!selectedId && conversations.length > 0 && typeof window !== 'undefined' && window.innerWidth >= 1024) {\n setSelectedId(conversations[0].id);\n }\n }, [conversations, selectedId]);\n\n const selected: HvConversationSummary \| undefined = useMemo(\n () => conversations.find((c) => c.id === selectedId),\n [conversations, selectedId]\n );\n\n const { data: messages, loading: loadingMessages } = useConversationMessages(selectedId);\n\n useEffect(() => {\n scrollRef.current?.scrollTo({ top: scrollRef.current.scrollHeight });\n }, [messages, selectedId]);\n\n const filtered = useMemo(() => {\n const q = query.trim().toLowerCase();\n if (!q) return conversations;\n return conversations.filter(\n (c) => c.title.toLowerCase().includes(q) \|\| c.lastMessageText.toLowerCase().includes(q)\n );\n }, [conversations, query]);\n\n const unreadThreads = conversations.filter((c) => c.unreadCount > 0).length;\n\n const handleSend = async () => {\n const text = draft.trim();\n if (!text \|\| !selectedId) return;\n try {\n await sendMessage(selectedId, text);\n setDraft('');\n void refetch();\n } catch (err) {\n notify.error('Message not sent', (err as Error).message);\n }\n };\n\n const emptyInbox = !loading && conversations.length === 0;\n\n return (\n <PageLayout\n title=\"Messages\"\n description=\"Your conversations with property owners, agents, and service providers\"\n purpose=\"Every thread you start from a property, listing, or service lands here — read the full history, pick up where you left off, and reply. Messages are delivered to the other party's inbox in real time.\"\n >\n <EmphasisPanel className=\"p-4\">\n <div className=\"grid grid-cols-2 gap-4 sm:grid-cols-3\">\n <StatCard label=\"Conversations\" value={conversations.length} icon={<MessageSquare className=\"h-4 w-4\" />} />\n <StatCard label=\"Unread threads\" value={unreadThreads} icon={<MessageSquare className=\"h-4 w-4\" />} />\n <StatCard\n label=\"With updates today\"\n value={conversations.filter((c) => c.lastMessageAt && getRelativeTime(c.lastMessageAt) === 'Today').length}\n icon={<Send className=\"h-4 w-4\" />}\n />\n </div>\n </EmphasisPanel>\n\n {emptyInbox ? (\n <EmptyState\n illustration=\"empty-generic\"\n icon={<MessageSquare className=\"h-12 w-12\" />}\n title=\"No messages yet\"\n description=\"Start a conversation from any property or service — reach out to an owner or provider and your thread will show up here.\"\n action={<Button onClick={() => navigate('../properties')}>Browse properties</Button>}\n />\n ) : (\n <GlassCard treatment=\"plain\" className=\"overflow-hidden p-0\">\n <div className=\"grid h-[68vh] min-h-[26rem] grid-cols-1 lg:grid-cols-[20rem_1fr]\">\n {/ Thread list /}\n <aside\n className={cn('flex flex-col border-border-subtle lg:border-r', selectedId ? 'hidden lg:flex' : 'flex')}\n >\n <div className=\"border-b border-border-subtle p-3\">\n <div className=\"relative\">\n <Search className=\"pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n <input\n type=\"search\"\n value={query}\n onChange={(event) => setQuery(event.target.value)}\n placeholder=\"Search conversations\"\n aria-label=\"Search conversations\"\n className=\"h-10 w-full rounded-md border border-border-subtle bg-bg-surface pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n </div>\n </div>\n <div className=\"min-h-0 flex-1 overflow-y-auto\">\n {loading && conversations.length === 0 ? (\n <p className=\"p-6 text-center text-sm text-text-secondary\">Loading conversations…</p>\n ) : filtered.length === 0 ? (\n <p className=\"p-6 text-center text-sm text-text-secondary\">No conversations match your search.</p>\n ) : (\n <ul>\n {filtered.map((conversation) => {\n const active = conversation.id === selectedId;\n return (\n <li key={conversation.id}>\n <button\n type=\"button\"\n onClick={() => {\n setSelectedId(conversation.id);\n setDraft('');\n }}\n className={cn(\n 'flex w-full items-start gap-3 border-b border-border-subtle px-3 py-3 text-left transition-colors',\n active ? 'bg-action-primary-bg/10' : 'hover:bg-bg-sunken'\n )}\n >\n <Avatar title={conversation.title} id={conversation.id} />\n <div className=\"min-w-0 flex-1\">\n <div className=\"flex items-center justify-between gap-2\">\n <span className=\"truncate text-sm font-semibold text-text-primary\">\n {conversation.title}\n </span>\n {conversation.lastMessageAt && (\n <span className=\"shrink-0 text-xs text-text-secondary\">\n {getRelativeTime(conversation.lastMessageAt)}\n </span>\n )}\n </div>\n <div className=\"mt-0.5 flex items-center gap-2\">\n <span className=\"min-w-0 flex-1 truncate text-xs text-text-secondary\">\n {conversation.lastMessageText \|\| 'No messages yet'}\n </span>\n {conversation.unreadCount > 0 && (\n <span className=\"inline-flex h-5 min-w-5 shrink-0 items-center justify-center rounded-full bg-action-primary-bg px-1.5 text-[0.65rem] font-semibold text-action-primary-text\">\n {conversation.unreadCount}\n </span>\n )}\n </div>\n </div>\n </button>\n </li>\n );\n })}\n </ul>\n )}\n </div>\n </aside>\n\n {/ Thread */}\n <section className={cn('flex min-h-0 flex-col', selectedId ? 'flex' : 'hidden lg:flex')}>\n {selected ? (\n <>\n <header className=\"flex items-center gap-3 border-b border-border-subtle p-3\">\n <button\n type=\"button\"\n onClick={() => setSelectedId(undefined)}\n className=\"rounded-md p-1.5 text-text-secondary transition-colors hover:bg-bg-sunken lg:hidden\"\n aria-label=\"Back to conversations\"\n >\n <ArrowLeft className=\"h-5 w-5\" />\n </button>\n <Avatar title={selected.title} id={selected.id} size=\"sm\" />\n <div className=\"min-w-0 flex-1\">\n <h2 className=\"truncate text-sm font-semibold text-text-primary\">{selected.title}</h2>\n {selected.contextHref && (\n <button\n type=\"button\"\n onClick={() => navigate(`..${selected.contextHref}`)}\n className=\"flex items-center gap-1 text-xs text-text-secondary transition-colors hover:text-primary\"\n >\n <MapPin className=\"h-3 w-3\" />\n View listing\n </button>\n )}\n </div>\n </header>\n\n <div ref={scrollRef} className=\"min-h-0 flex-1 space-y-2 overflow-y-auto bg-bg-sunken/40 p-4\">\n {loadingMessages && messages.length === 0 ? (\n <p className=\"py-10 text-center text-sm text-text-secondary\">Loading messages…</p>\n ) : messages.length === 0 ? (\n <p className=\"py-10 text-center text-sm text-text-secondary\">\n No messages yet. Say hello to get the conversation started.\n </p>\n ) : (\n messages.map((message) => {\n const mine = message.authorId === currentUserId;\n return (\n <div key={message.id} className={cn('flex', mine ? 'justify-end' : 'justify-start')}>\n <div className={cn('max-w-[78%]', mine ? 'items-end' : 'items-start')}>\n <div\n className={cn(\n 'rounded-2xl px-3.5 py-2 text-sm',\n mine\n ? 'rounded-br-sm bg-action-primary-bg text-action-primary-text'\n : 'rounded-bl-sm border border-border-subtle bg-bg-surface text-text-primary'\n )}\n >\n {message.text}\n </div>\n <div className={cn('mt-1 px-1 text-[0.65rem] text-text-secondary', mine && 'text-right')}>\n {messageTime(message.createdAt)}\n </div>\n </div>\n </div>\n );\n })\n )}\n </div>\n\n <div className=\"flex items-end gap-2 border-t border-border-subtle p-3\">\n <textarea\n value={draft}\n onChange={(event) => setDraft(event.target.value)}\n onKeyDown={(event) => {\n if (event.key === 'Enter' && !event.shiftKey) {\n event.preventDefault();\n void handleSend();\n }\n }}\n rows={1}\n placeholder=\"Type a message…\"\n aria-label=\"Message\"\n className=\"max-h-32 min-h-10 flex-1 resize-none rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n <Button type=\"button\" onClick={handleSend} disabled={!draft.trim() \|\| sending}>\n <Send className=\"h-4 w-4\" />\n <span className=\"ml-1 hidden sm:inline\">Send</span>\n </Button>\n </div>\n </>\n ) : (\n <div className=\"hidden flex-1 items-center justify-center p-8 lg:flex\">\n <div className=\"text-center\">\n <MessageSquare className=\"mx-auto h-10 w-10 text-text-secondary\" />\n <p className=\"mt-3 text-sm text-text-secondary\">Select a conversation to read and reply.</p>\n </div>\n </div>\n )}\n </section>\n </div>\n </GlassCard>\n )}\n </PageLayout>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"ChatPage.js","names":[],"sources":["../../../../src/housingvista/pages/chat/ChatPage.tsx"],"sourcesContent":["/*\n Messages — the real HousingVista inbox. A two-pane conversations UI (thread\n * list + chat thread with bubbles) backed by wspace-conversations-svc:\n * - `useHousingVistaConversations` lists the user's product threads,\n * - `useConversationMessages` streams the selected thread,\n * - `useSendMessage` posts new messages.\n * Everything is persisted server-side; when there are no threads yet we show a\n * tasteful empty state (never fabricated rows). Fully responsive: on mobile the\n * list and the open thread swap places (back button), on desktop they sit\n * side-by-side.\n * @module housingvista\n /\n\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { useNavigate } from 'react-router-dom';\nimport { ArrowLeft, MapPin, MessageSquare, Search, Send } from 'lucide-react';\nimport { Button, EmphasisPanel, GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout, EmptyState, StatCard } from '../../components';\nimport { useHousingVistaConversations, type HvConversationSummary } from '../../hooks/messages';\nimport { useConversationMessages, useSendMessage } from '../../hooks';\nimport { useHousingVista } from '../../context/HousingVistaContext';\nimport { notify } from '../../lib/toast';\nimport { cn, getRelativeTime } from '../../utils/helpers';\nimport { useTrackPageView } from '../../hooks/useHousingVistaAnalytics';\n\n/* Deterministic accent for an avatar chip, derived from the thread title. /\nconst AVATAR_ACCENTS = [\n 'bg-status-info-bg-subtle text-status-info-text',\n 'bg-status-success-bg-subtle text-status-success-text',\n 'bg-status-warning-bg-subtle text-status-warning-text',\n 'bg-action-primary-bg/15 text-primary',\n];\n\nfunction initials(title: string): string {\n const parts = title.trim().split(/\\s+/).filter(Boolean);\n if (parts.length === 0) return '?';\n if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();\n return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();\n}\n\nfunction accentFor(id: string): string {\n let sum = 0;\n for (let i = 0; i < id.length; i += 1) sum += id.charCodeAt(i);\n return AVATAR_ACCENTS[sum % AVATAR_ACCENTS.length];\n}\n\nfunction messageTime(iso: string): string {\n const date = new Date(iso);\n if (Number.isNaN(date.getTime())) return '';\n return date.toLocaleTimeString('en-US', { hour: 'numeric', minute: '2-digit' });\n}\n\nfunction Avatar({ title, id, size = 'md' }: { title: string; id: string; size?: 'sm' \| 'md' }) {\n return (\n <span\n className={cn(\n 'inline-flex shrink-0 items-center justify-center rounded-full font-semibold',\n size === 'md' ? 'h-10 w-10 text-sm' : 'h-9 w-9 text-xs',\n accentFor(id)\n )}\n aria-hidden\n >\n {initials(title)}\n </span>\n );\n}\n\nexport function ChatPage() {\n useTrackPageView('housingvista.chat.viewed');\n const navigate = useNavigate();\n const { currentUser } = useHousingVista();\n const currentUserId = currentUser?.id ?? '';\n\n const { data: conversations, loading, refetch } = useHousingVistaConversations();\n const { sendMessage, loading: sending } = useSendMessage();\n\n const [selectedId, setSelectedId] = useState<string \| undefined>();\n const [query, setQuery] = useState('');\n const [draft, setDraft] = useState('');\n const scrollRef = useRef<HTMLDivElement>(null);\n\n // Default-select the first thread on desktop once data lands.\n useEffect(() => {\n if (!selectedId && conversations.length > 0 && typeof window !== 'undefined' && window.innerWidth >= 1024) {\n setSelectedId(conversations[0].id);\n }\n }, [conversations, selectedId]);\n\n const selected: HvConversationSummary \| undefined = useMemo(\n () => conversations.find((c) => c.id === selectedId),\n [conversations, selectedId]\n );\n\n const { data: messages, loading: loadingMessages } = useConversationMessages(selectedId);\n\n useEffect(() => {\n scrollRef.current?.scrollTo({ top: scrollRef.current.scrollHeight });\n }, [messages, selectedId]);\n\n const filtered = useMemo(() => {\n const q = query.trim().toLowerCase();\n if (!q) return conversations;\n return conversations.filter(\n (c) => c.title.toLowerCase().includes(q) \|\| c.lastMessageText.toLowerCase().includes(q)\n );\n }, [conversations, query]);\n\n const unreadThreads = conversations.filter((c) => c.unreadCount > 0).length;\n\n const handleSend = async () => {\n const text = draft.trim();\n if (!text \|\| !selectedId) return;\n try {\n await sendMessage(selectedId, text);\n setDraft('');\n void refetch();\n } catch (err) {\n notify.error('Message not sent', (err as Error).message);\n }\n };\n\n const emptyInbox = !loading && conversations.length === 0;\n\n return (\n <PageLayout\n title=\"Messages\"\n description=\"Your conversations with property owners, agents, and service providers\"\n purpose=\"Every thread you start from a property, listing, or service lands here — read the full history, pick up where you left off, and reply. Messages are delivered to the other party's inbox in real time.\"\n >\n <EmphasisPanel className=\"p-4\">\n <div className=\"grid grid-cols-2 gap-4 sm:grid-cols-3\">\n <StatCard label=\"Conversations\" value={conversations.length} icon={<MessageSquare className=\"h-4 w-4\" />} />\n <StatCard label=\"Unread threads\" value={unreadThreads} icon={<MessageSquare className=\"h-4 w-4\" />} />\n <StatCard\n label=\"With updates today\"\n value={conversations.filter((c) => c.lastMessageAt && getRelativeTime(c.lastMessageAt) === 'Today').length}\n icon={<Send className=\"h-4 w-4\" />}\n />\n </div>\n </EmphasisPanel>\n\n {emptyInbox ? (\n <EmptyState\n illustration=\"empty-generic\"\n icon={<MessageSquare className=\"h-12 w-12\" />}\n title=\"No messages yet\"\n description=\"Start a conversation from any property or service — reach out to an owner or provider and your thread will show up here.\"\n action={<Button onClick={() => navigate('../properties')}>Browse properties</Button>}\n />\n ) : (\n <GlassCard treatment=\"plain\" className=\"overflow-hidden p-0\">\n <div className=\"grid h-[68vh] min-h-[26rem] grid-cols-1 lg:grid-cols-[20rem_1fr]\">\n {/ Thread list /}\n <aside\n className={cn('flex flex-col border-border-subtle lg:border-r', selectedId ? 'hidden lg:flex' : 'flex')}\n >\n <div className=\"border-b border-border-subtle p-3\">\n <div className=\"relative\">\n <Search className=\"pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n <input\n type=\"search\"\n value={query}\n onChange={(event) => setQuery(event.target.value)}\n placeholder=\"Search conversations\"\n aria-label=\"Search conversations\"\n className=\"h-10 w-full rounded-md border border-border-subtle bg-bg-surface pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n </div>\n </div>\n <div className=\"min-h-0 flex-1 overflow-y-auto\">\n {loading && conversations.length === 0 ? (\n <p className=\"p-6 text-center text-sm text-text-secondary\">Loading conversations…</p>\n ) : filtered.length === 0 ? (\n <p className=\"p-6 text-center text-sm text-text-secondary\">No conversations match your search.</p>\n ) : (\n <ul>\n {filtered.map((conversation) => {\n const active = conversation.id === selectedId;\n return (\n <li key={conversation.id}>\n <button\n type=\"button\"\n onClick={() => {\n setSelectedId(conversation.id);\n setDraft('');\n }}\n className={cn(\n 'flex w-full items-start gap-3 border-b border-border-subtle px-3 py-3 text-left transition-colors',\n active ? 'bg-action-primary-bg/10' : 'hover:bg-bg-sunken'\n )}\n >\n <Avatar title={conversation.title} id={conversation.id} />\n <div className=\"min-w-0 flex-1\">\n <div className=\"flex items-center justify-between gap-2\">\n <span className=\"truncate text-sm font-semibold text-text-primary\">\n {conversation.title}\n </span>\n {conversation.lastMessageAt && (\n <span className=\"shrink-0 text-xs text-text-secondary\">\n {getRelativeTime(conversation.lastMessageAt)}\n </span>\n )}\n </div>\n <div className=\"mt-0.5 flex items-center gap-2\">\n <span className=\"min-w-0 flex-1 truncate text-xs text-text-secondary\">\n {conversation.lastMessageText \|\| 'No messages yet'}\n </span>\n {conversation.unreadCount > 0 && (\n <span className=\"inline-flex h-5 min-w-5 shrink-0 items-center justify-center rounded-full bg-action-primary-bg px-1.5 text-[0.65rem] font-semibold text-action-primary-text\">\n {conversation.unreadCount}\n </span>\n )}\n </div>\n </div>\n </button>\n </li>\n );\n })}\n </ul>\n )}\n </div>\n </aside>\n\n {/ Thread */}\n <section className={cn('flex min-h-0 flex-col', selectedId ? 'flex' : 'hidden lg:flex')}>\n {selected ? (\n <>\n <header className=\"flex items-center gap-3 border-b border-border-subtle p-3\">\n <button\n type=\"button\"\n onClick={() => setSelectedId(undefined)}\n className=\"rounded-md p-1.5 text-text-secondary transition-colors hover:bg-bg-sunken lg:hidden\"\n aria-label=\"Back to conversations\"\n >\n <ArrowLeft className=\"h-5 w-5\" />\n </button>\n <Avatar title={selected.title} id={selected.id} size=\"sm\" />\n <div className=\"min-w-0 flex-1\">\n <h2 className=\"truncate text-sm font-semibold text-text-primary\">{selected.title}</h2>\n {selected.contextHref && (\n <button\n type=\"button\"\n onClick={() => navigate(`..${selected.contextHref}`)}\n className=\"flex items-center gap-1 text-xs text-text-secondary transition-colors hover:text-primary\"\n >\n <MapPin className=\"h-3 w-3\" />\n View listing\n </button>\n )}\n </div>\n </header>\n\n <div ref={scrollRef} className=\"min-h-0 flex-1 space-y-2 overflow-y-auto bg-bg-sunken/40 p-4\">\n {loadingMessages && messages.length === 0 ? (\n <p className=\"py-10 text-center text-sm text-text-secondary\">Loading messages…</p>\n ) : messages.length === 0 ? (\n <p className=\"py-10 text-center text-sm text-text-secondary\">\n No messages yet. Say hello to get the conversation started.\n </p>\n ) : (\n messages.map((message) => {\n const mine = message.authorId === currentUserId;\n return (\n <div key={message.id} className={cn('flex', mine ? 'justify-end' : 'justify-start')}>\n <div className={cn('max-w-[78%]', mine ? 'items-end' : 'items-start')}>\n <div\n className={cn(\n 'rounded-2xl px-3.5 py-2 text-sm',\n mine\n ? 'rounded-br-sm bg-action-primary-bg text-action-primary-text'\n : 'rounded-bl-sm border border-border-subtle bg-bg-surface text-text-primary'\n )}\n >\n {message.text}\n </div>\n <div className={cn('mt-1 px-1 text-[0.65rem] text-text-secondary', mine && 'text-right')}>\n {messageTime(message.createdAt)}\n </div>\n </div>\n </div>\n );\n })\n )}\n </div>\n\n <div className=\"flex items-end gap-2 border-t border-border-subtle p-3\">\n <textarea\n value={draft}\n onChange={(event) => setDraft(event.target.value)}\n onKeyDown={(event) => {\n if (event.key === 'Enter' && !event.shiftKey) {\n event.preventDefault();\n void handleSend();\n }\n }}\n rows={1}\n placeholder=\"Type a message…\"\n aria-label=\"Message\"\n className=\"max-h-32 min-h-10 flex-1 resize-none rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n <Button type=\"button\" onClick={handleSend} disabled={!draft.trim() \|\| sending}>\n <Send className=\"h-4 w-4\" />\n <span className=\"ml-1 hidden sm:inline\">Send</span>\n </Button>\n </div>\n </>\n ) : (\n <div className=\"hidden flex-1 items-center justify-center p-8 lg:flex\">\n <div className=\"text-center\">\n <MessageSquare className=\"mx-auto h-10 w-10 text-text-secondary\" />\n <p className=\"mt-3 text-sm text-text-secondary\">Select a conversation to read and reply.</p>\n </div>\n </div>\n )}\n </section>\n </div>\n </GlassCard>\n )}\n </PageLayout>\n );\n}\n"],"mappings":"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"}

package/dist/housingvista/pages/finance/HomeLoanDetailPage.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HomeLoanDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/housingvista/pages/finance/HomeLoanDetailPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;~~AA6CH~~,wBAAgB,kBAAkB,~~gCAqQjC~~"}
1	+ {"version":3,"file":"HomeLoanDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/housingvista/pages/finance/HomeLoanDetailPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AA8CH,wBAAgB,kBAAkB,gCAuQjC"}

package/dist/housingvista/pages/finance/HomeLoanDetailPage.js CHANGED Viewed

@@ -3,210 +3,213 @@ import { StatusBadge as r } from "../../components/StatusBadge.js";
 import { EmptyState as i } from "../../components/EmptyState.js";
 import { Breadcrumbs as a } from "../../components/Breadcrumbs.js";
 import { LoadingSkeleton as o } from "../../components/LoadingSkeleton.js";
-import { useHomeLoanOffer as s } from "../../hooks/index.js";
-import { ContactOwnerDialog as c } from "../../components/ContactOwnerDialog.js";
+import { useTrackPageView as s } from "../../hooks/useHousingVistaAnalytics.js";
+import { useHomeLoanOffer as c } from "../../hooks/index.js";
+import { ContactOwnerDialog as l } from "../../components/ContactOwnerDialog.js";
 import "../../components/index.js";
-import { useMemo as l, useState as u } from "react";
-import { ArrowLeft as d, Building2 as f, Calculator as p, CalendarClock as m, CheckCircle as h, Gift as g, Percent as _, Star as v, Wallet as y } from "lucide-react";
-import { useLocation as b, useNavigate as x, useParams as S } from "react-router-dom";
-import { jsx as C, jsxs as w } from "react/jsx-runtime";
-import { Button as T, EmphasisPanel as E, GlassCard as D, PagePurpose as O } from "@burdenoff/fe-libs/ui";
+import { useMemo as u, useState as d } from "react";
+import { ArrowLeft as f, Building2 as p, Calculator as m, CalendarClock as h, CheckCircle as g, Gift as _, Percent as v, Star as y, Wallet as b } from "lucide-react";
+import { useLocation as x, useNavigate as S, useParams as C } from "react-router-dom";
+import { jsx as w, jsxs as T } from "react/jsx-runtime";
+import { Button as E, EmphasisPanel as D, GlassCard as O, PagePurpose as k } from "@burdenoff/fe-libs/ui";
 //#region src/housingvista/pages/finance/HomeLoanDetailPage.tsx
-var k = "w-full accent-[var(--color-action-primary-bg)]";
-function A(e, t, n) {
+var A = "w-full accent-[var(--color-action-primary-bg)]";
+function j(e, t, n) {
 	if (e <= 0 || t <= 0 || n <= 0) return 0;
 	let r = t / 12 / 100, i = n * 12, a = e * r * (1 + r) ** +i / ((1 + r) ** +i - 1);
 	return Math.round(a);
 }
-function j({ rating: t }) {
-	return /* @__PURE__ */ C("div", {
+function M({ rating: t }) {
+	return /* @__PURE__ */ w("div", {
 		className: "flex items-center gap-0.5 text-status-warning-text",
-		children: Array.from({ length: 5 }).map((n, r) => /* @__PURE__ */ C(v, { className: e("h-4 w-4", r < Math.floor(t) ? "fill-current" : "fill-none text-text-secondary/30") }, r))
+		children: Array.from({ length: 5 }).map((n, r) => /* @__PURE__ */ w(y, { className: e("h-4 w-4", r < Math.floor(t) ? "fill-current" : "fill-none text-text-secondary/30") }, r))
 	});
 }
-function M() {
-	let { id: v } = S(), M = x(), N = b(), { data: P, loading: F } = s(v), [I, L] = u(5e5), [R, z] = u(20), [B, V] = u(!1), H = P?.interestRate ?? 0, U = l(() => A(I, H, R), [
-		I,
-		H,
-		R
-	]), W = U * R * 12, G = W - I;
-	if (F) return /* @__PURE__ */ C("div", {
+function N() {
+	let { id: y } = C();
+	s("housingvista.home_loan.viewed", y);
+	let N = S(), P = x(), { data: F, loading: I } = c(y), [L, R] = d(5e5), [z, B] = d(20), [V, H] = d(!1), U = F?.interestRate ?? 0, W = u(() => j(L, U, z), [
+		L,
+		U,
+		z
+	]), G = W * z * 12, K = G - L;
+	if (I) return /* @__PURE__ */ w("div", {
 		className: "p-6",
-		children: /* @__PURE__ */ C(o, { variant: "detail" })
+		children: /* @__PURE__ */ w(o, { variant: "detail" })
 	});
-	if (!P) return /* @__PURE__ */ C("div", {
+	if (!F) return /* @__PURE__ */ w("div", {
 		className: "p-6",
-		children: /* @__PURE__ */ C(i, {
+		children: /* @__PURE__ */ w(i, {
 			illustration: "empty-data",
-			icon: /* @__PURE__ */ C(f, { className: "h-12 w-12" }),
+			icon: /* @__PURE__ */ w(p, { className: "h-12 w-12" }),
 			title: "Loan Offer Not Found",
 			description: "The loan offer you're looking for doesn't exist or is no longer available.",
-			action: /* @__PURE__ */ w("button", {
-				onClick: () => M("../home-loans"),
+			action: /* @__PURE__ */ T("button", {
+				onClick: () => N("../home-loans"),
 				className: "inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg-hover",
-				children: [/* @__PURE__ */ C(d, { className: "h-4 w-4" }), "Back to Home Loans"]
+				children: [/* @__PURE__ */ w(f, { className: "h-4 w-4" }), "Back to Home Loans"]
 			})
 		})
 	});
-	let K = P.features ?? [];
-	return /* @__PURE__ */ w("div", {
+	let q = F.features ?? [];
+	return /* @__PURE__ */ T("div", {
 		className: "flex flex-col gap-6 p-6",
 		children: [
-			/* @__PURE__ */ C(a, { items: [{
+			/* @__PURE__ */ w(a, { items: [{
 				label: "Home Loans",
 				href: "../"
-			}, { label: P.bankName }] }),
-			/* @__PURE__ */ w("div", {
+			}, { label: F.bankName }] }),
+			/* @__PURE__ */ T("div", {
 				className: "flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between",
-				children: [/* @__PURE__ */ w("div", {
+				children: [/* @__PURE__ */ T("div", {
 					className: "flex items-start gap-4",
-					children: [/* @__PURE__ */ C("div", {
+					children: [/* @__PURE__ */ w("div", {
 						className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-lg bg-bg-sunken text-text-secondary",
-						children: /* @__PURE__ */ C(f, { className: "h-6 w-6" })
-					}), /* @__PURE__ */ w("div", { children: [
-						/* @__PURE__ */ w("button", {
-							onClick: () => M("../home-loans"),
+						children: /* @__PURE__ */ w(p, { className: "h-6 w-6" })
+					}), /* @__PURE__ */ T("div", { children: [
+						/* @__PURE__ */ T("button", {
+							onClick: () => N("../home-loans"),
 							className: "mb-2 inline-flex items-center gap-2 rounded-md px-2 py-1 text-sm text-text-secondary transition-colors hover:bg-bg-sunken hover:text-text-primary",
-							children: [/* @__PURE__ */ C(d, { className: "h-4 w-4" }), "Back to Home Loans"]
+							children: [/* @__PURE__ */ w(f, { className: "h-4 w-4" }), "Back to Home Loans"]
 						}),
-						/* @__PURE__ */ C("h1", {
+						/* @__PURE__ */ w("h1", {
 							className: "text-2xl font-semibold text-text-primary",
-							children: P.bankName
+							children: F.bankName
 						}),
-						/* @__PURE__ */ w("div", {
+						/* @__PURE__ */ T("div", {
 							className: "mt-2 flex flex-wrap items-center gap-2",
-							children: [P.rating != null && /* @__PURE__ */ w("span", {
+							children: [F.rating != null && /* @__PURE__ */ T("span", {
 								className: "inline-flex items-center gap-1.5",
-								children: [/* @__PURE__ */ C(j, { rating: P.rating }), /* @__PURE__ */ C("span", {
+								children: [/* @__PURE__ */ w(M, { rating: F.rating }), /* @__PURE__ */ w("span", {
 									className: "text-sm text-text-secondary",
-									children: P.rating
+									children: F.rating
 								})]
-							}), P.specialOffer && /* @__PURE__ */ C(r, {
+							}), F.specialOffer && /* @__PURE__ */ w(r, {
 								label: "Special Offer",
 								variant: "warning"
 							})]
 						})
 					] })]
-				}), /* @__PURE__ */ C(T, {
+				}), /* @__PURE__ */ w(E, {
 					type: "button",
 					variant: "default",
-					onClick: () => V(!0),
+					onClick: () => H(!0),
 					children: "Apply Now"
 				})]
 			}),
-			/* @__PURE__ */ w(O, {
+			/* @__PURE__ */ T(k, {
 				className: "max-w-3xl",
 				children: [
 					"The full terms of this offer with a live EMI estimate at the bank's headline rate. Model your loan amount and tenure to see the real monthly cost, then apply to connect with ",
-					P.bankName,
+					F.bankName,
 					" through Messages."
 				]
 			}),
-			P.specialOffer && /* @__PURE__ */ w("div", {
+			F.specialOffer && /* @__PURE__ */ T("div", {
 				className: "flex items-center gap-2 rounded-lg bg-status-warning-bg-subtle p-3 text-sm text-status-warning-text",
-				children: [/* @__PURE__ */ C(g, { className: "h-4 w-4 shrink-0" }), P.specialOffer]
+				children: [/* @__PURE__ */ w(_, { className: "h-4 w-4 shrink-0" }), F.specialOffer]
 			}),
-			/* @__PURE__ */ w(E, {
+			/* @__PURE__ */ T(D, {
 				className: "p-5",
-				children: [/* @__PURE__ */ w("div", {
+				children: [/* @__PURE__ */ T("div", {
 					className: "mb-4 flex items-center gap-2",
-					children: [/* @__PURE__ */ C(p, { className: "h-5 w-5 text-text-secondary" }), /* @__PURE__ */ w("h2", {
+					children: [/* @__PURE__ */ w(m, { className: "h-5 w-5 text-text-secondary" }), /* @__PURE__ */ T("h2", {
 						className: "text-lg font-semibold text-text-primary",
 						children: [
 							"EMI Estimate at ",
-							P.interestRate,
+							F.interestRate,
 							"%"
 						]
 					})]
-				}), /* @__PURE__ */ w("div", {
+				}), /* @__PURE__ */ T("div", {
 					className: "grid gap-6 md:grid-cols-2",
-					children: [/* @__PURE__ */ w("div", {
+					children: [/* @__PURE__ */ T("div", {
 						className: "space-y-5",
-						children: [/* @__PURE__ */ w("div", { children: [
-							/* @__PURE__ */ w("div", {
+						children: [/* @__PURE__ */ T("div", { children: [
+							/* @__PURE__ */ T("div", {
 								className: "mb-2 flex items-center justify-between",
-								children: [/* @__PURE__ */ C("label", {
+								children: [/* @__PURE__ */ w("label", {
 									className: "text-sm font-medium text-text-primary",
 									children: "Loan Amount"
-								}), /* @__PURE__ */ C("span", {
+								}), /* @__PURE__ */ w("span", {
 									className: "text-sm font-semibold text-text-primary",
-									children: t(I)
+									children: t(L)
 								})]
 							}),
-							/* @__PURE__ */ C("input", {
+							/* @__PURE__ */ w("input", {
 								type: "range",
 								min: 5e4,
-								max: Math.max(P.maxAmount, 1e5),
+								max: Math.max(F.maxAmount, 1e5),
 								step: 1e4,
-								value: Math.min(I, P.maxAmount),
-								onChange: (e) => L(Number(e.target.value)),
+								value: Math.min(L, F.maxAmount),
+								onChange: (e) => R(Number(e.target.value)),
 								"aria-label": "Loan amount",
-								className: k
+								className: A
 							}),
-							/* @__PURE__ */ w("div", {
+							/* @__PURE__ */ T("div", {
 								className: "mt-1 flex justify-between text-xs text-text-secondary",
-								children: [/* @__PURE__ */ C("span", { children: "₹50K" }), /* @__PURE__ */ w("span", { children: ["Max ", n(P.maxAmount)] })]
+								children: [/* @__PURE__ */ w("span", { children: "₹50K" }), /* @__PURE__ */ T("span", { children: ["Max ", n(F.maxAmount)] })]
 							})
-						] }), /* @__PURE__ */ w("div", { children: [
-							/* @__PURE__ */ w("div", {
+						] }), /* @__PURE__ */ T("div", { children: [
+							/* @__PURE__ */ T("div", {
 								className: "mb-2 flex items-center justify-between",
-								children: [/* @__PURE__ */ C("label", {
+								children: [/* @__PURE__ */ w("label", {
 									className: "text-sm font-medium text-text-primary",
 									children: "Tenure (years)"
-								}), /* @__PURE__ */ w("span", {
+								}), /* @__PURE__ */ T("span", {
 									className: "text-sm font-semibold text-text-primary",
-									children: [R, " years"]
+									children: [z, " years"]
 								})]
 							}),
-							/* @__PURE__ */ C("input", {
+							/* @__PURE__ */ w("input", {
 								type: "range",
 								min: 1,
-								max: P.maxTenure,
+								max: F.maxTenure,
 								step: 1,
-								value: Math.min(R, P.maxTenure),
-								onChange: (e) => z(Number(e.target.value)),
+								value: Math.min(z, F.maxTenure),
+								onChange: (e) => B(Number(e.target.value)),
 								"aria-label": "Tenure in years",
-								className: k
+								className: A
 							}),
-							/* @__PURE__ */ w("div", {
+							/* @__PURE__ */ T("div", {
 								className: "mt-1 flex justify-between text-xs text-text-secondary",
-								children: [/* @__PURE__ */ C("span", { children: "1 yr" }), /* @__PURE__ */ w("span", { children: [
+								children: [/* @__PURE__ */ w("span", { children: "1 yr" }), /* @__PURE__ */ T("span", { children: [
 									"Max ",
-									P.maxTenure,
+									F.maxTenure,
 									" yrs"
 								] })]
 							})
 						] })]
-					}), /* @__PURE__ */ w("div", {
+					}), /* @__PURE__ */ T("div", {
 						className: "flex flex-col items-center justify-center rounded-lg bg-bg-sunken/50 p-6",
 						children: [
-							/* @__PURE__ */ C("p", {
+							/* @__PURE__ */ w("p", {
 								className: "text-sm text-text-secondary",
 								children: "Monthly EMI"
 							}),
-							/* @__PURE__ */ C("p", {
+							/* @__PURE__ */ w("p", {
 								className: "my-2 text-4xl font-bold text-text-primary",
-								children: t(U)
+								children: t(W)
 							}),
-							/* @__PURE__ */ w("div", {
+							/* @__PURE__ */ T("div", {
 								className: "mt-4 grid w-full grid-cols-2 gap-4",
-								children: [/* @__PURE__ */ w("div", {
+								children: [/* @__PURE__ */ T("div", {
 									className: "text-center",
-									children: [/* @__PURE__ */ C("p", {
+									children: [/* @__PURE__ */ w("p", {
 										className: "text-xs text-text-secondary",
 										children: "Total Payment"
-									}), /* @__PURE__ */ C("p", {
+									}), /* @__PURE__ */ w("p", {
 										className: "text-sm font-semibold text-text-primary",
-										children: t(W)
+										children: t(G)
 									})]
-								}), /* @__PURE__ */ w("div", {
+								}), /* @__PURE__ */ T("div", {
 									className: "text-center",
-									children: [/* @__PURE__ */ C("p", {
+									children: [/* @__PURE__ */ w("p", {
 										className: "text-xs text-text-secondary",
 										children: "Total Interest"
-									}), /* @__PURE__ */ C("p", {
+									}), /* @__PURE__ */ w("p", {
 										className: "text-sm font-semibold text-status-error-text",
-										children: t(G)
+										children: t(K)
 									})]
 								})]
 							})
@@ -214,138 +217,138 @@ function M() {
 					})]
 				})]
 			}),
-			/* @__PURE__ */ w("div", {
+			/* @__PURE__ */ T("div", {
 				className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
-				children: [/* @__PURE__ */ w("div", {
+				children: [/* @__PURE__ */ T("div", {
 					className: "space-y-6 lg:col-span-2",
-					children: [/* @__PURE__ */ w(D, {
+					children: [/* @__PURE__ */ T(O, {
 						treatment: "plain",
 						className: "border-border-seam p-6",
-						children: [/* @__PURE__ */ C("h2", {
+						children: [/* @__PURE__ */ w("h2", {
 							className: "mb-4 text-base font-semibold text-text-primary",
 							children: "Loan Terms"
-						}), /* @__PURE__ */ w("div", {
+						}), /* @__PURE__ */ T("div", {
 							className: "grid grid-cols-2 gap-4 sm:grid-cols-3",
 							children: [
-								/* @__PURE__ */ w("div", {
+								/* @__PURE__ */ T("div", {
 									className: "rounded-lg bg-bg-sunken/50 p-4",
-									children: [/* @__PURE__ */ w("div", {
+									children: [/* @__PURE__ */ T("div", {
 										className: "flex items-center gap-1.5 text-xs text-text-secondary",
-										children: [/* @__PURE__ */ C(_, { className: "h-3.5 w-3.5" }), "Interest Rate"]
-									}), /* @__PURE__ */ w("div", {
+										children: [/* @__PURE__ */ w(v, { className: "h-3.5 w-3.5" }), "Interest Rate"]
+									}), /* @__PURE__ */ T("div", {
 										className: "mt-1 text-lg font-bold text-text-primary",
-										children: [P.interestRate, "%"]
+										children: [F.interestRate, "%"]
 									})]
 								}),
-								/* @__PURE__ */ w("div", {
+								/* @__PURE__ */ T("div", {
 									className: "rounded-lg bg-bg-sunken/50 p-4",
-									children: [/* @__PURE__ */ w("div", {
+									children: [/* @__PURE__ */ T("div", {
 										className: "flex items-center gap-1.5 text-xs text-text-secondary",
-										children: [/* @__PURE__ */ C(y, { className: "h-3.5 w-3.5" }), "EMI / Lakh"]
-									}), /* @__PURE__ */ C("div", {
+										children: [/* @__PURE__ */ w(b, { className: "h-3.5 w-3.5" }), "EMI / Lakh"]
+									}), /* @__PURE__ */ w("div", {
 										className: "mt-1 text-lg font-bold text-text-primary",
-										children: P.emiPerLakh == null ? "—" : n(P.emiPerLakh)
+										children: F.emiPerLakh == null ? "—" : n(F.emiPerLakh)
 									})]
 								}),
-								/* @__PURE__ */ w("div", {
+								/* @__PURE__ */ T("div", {
 									className: "rounded-lg bg-bg-sunken/50 p-4",
-									children: [/* @__PURE__ */ w("div", {
+									children: [/* @__PURE__ */ T("div", {
 										className: "flex items-center gap-1.5 text-xs text-text-secondary",
-										children: [/* @__PURE__ */ C(m, { className: "h-3.5 w-3.5" }), "Max Tenure"]
-									}), /* @__PURE__ */ w("div", {
+										children: [/* @__PURE__ */ w(h, { className: "h-3.5 w-3.5" }), "Max Tenure"]
+									}), /* @__PURE__ */ T("div", {
 										className: "mt-1 text-lg font-bold text-text-primary",
-										children: [P.maxTenure, " yrs"]
+										children: [F.maxTenure, " yrs"]
 									})]
 								}),
-								/* @__PURE__ */ w("div", {
+								/* @__PURE__ */ T("div", {
 									className: "rounded-lg bg-bg-sunken/50 p-4",
-									children: [/* @__PURE__ */ C("div", {
+									children: [/* @__PURE__ */ w("div", {
 										className: "text-xs text-text-secondary",
 										children: "Max Amount"
-									}), /* @__PURE__ */ C("div", {
+									}), /* @__PURE__ */ w("div", {
 										className: "mt-1 text-sm font-semibold text-text-primary",
-										children: n(P.maxAmount)
+										children: n(F.maxAmount)
 									})]
 								}),
-								/* @__PURE__ */ w("div", {
+								/* @__PURE__ */ T("div", {
 									className: "rounded-lg bg-bg-sunken/50 p-4",
-									children: [/* @__PURE__ */ C("div", {
+									children: [/* @__PURE__ */ w("div", {
 										className: "text-xs text-text-secondary",
 										children: "Processing Fee"
-									}), /* @__PURE__ */ C("div", {
+									}), /* @__PURE__ */ w("div", {
 										className: "mt-1 text-sm font-semibold text-text-primary",
-										children: P.processingFee ?? "—"
+										children: F.processingFee ?? "—"
 									})]
 								}),
-								/* @__PURE__ */ w("div", {
+								/* @__PURE__ */ T("div", {
 									className: "rounded-lg bg-bg-sunken/50 p-4",
-									children: [/* @__PURE__ */ C("div", {
+									children: [/* @__PURE__ */ w("div", {
 										className: "text-xs text-text-secondary",
 										children: "Prepayment"
-									}), /* @__PURE__ */ C("div", {
-										className: e("mt-1 text-sm font-semibold", P.prepaymentCharges === "None" ? "text-status-success-text" : "text-text-primary"),
-										children: P.prepaymentCharges ?? "—"
+									}), /* @__PURE__ */ w("div", {
+										className: e("mt-1 text-sm font-semibold", F.prepaymentCharges === "None" ? "text-status-success-text" : "text-text-primary"),
+										children: F.prepaymentCharges ?? "—"
 									})]
 								})
 							]
 						})]
-					}), K.length > 0 && /* @__PURE__ */ w(D, {
+					}), q.length > 0 && /* @__PURE__ */ T(O, {
 						treatment: "plain",
 						className: "border-border-seam p-6",
-						children: [/* @__PURE__ */ C("h2", {
+						children: [/* @__PURE__ */ w("h2", {
 							className: "mb-4 text-base font-semibold text-text-primary",
 							children: "Features"
-						}), /* @__PURE__ */ C("ul", {
+						}), /* @__PURE__ */ w("ul", {
 							className: "grid grid-cols-1 gap-2 sm:grid-cols-2",
-							children: K.map((e, t) => /* @__PURE__ */ w("li", {
+							children: q.map((e, t) => /* @__PURE__ */ T("li", {
 								className: "flex items-center gap-2 text-sm text-text-secondary",
-								children: [/* @__PURE__ */ C(h, { className: "h-4 w-4 shrink-0 text-status-success-text" }), e]
+								children: [/* @__PURE__ */ w(g, { className: "h-4 w-4 shrink-0 text-status-success-text" }), e]
 							}, t))
 						})]
 					})]
-				}), /* @__PURE__ */ C("div", {
+				}), /* @__PURE__ */ w("div", {
 					className: "space-y-6",
-					children: /* @__PURE__ */ w(D, {
+					children: /* @__PURE__ */ T(O, {
 						treatment: "plain",
 						className: "border-border-seam p-5",
 						children: [
-							/* @__PURE__ */ C("h3", {
+							/* @__PURE__ */ w("h3", {
 								className: "mb-2 text-base font-semibold text-text-primary",
 								children: "Ready to apply?"
 							}),
-							/* @__PURE__ */ w("p", {
+							/* @__PURE__ */ T("p", {
 								className: "mb-4 text-sm text-text-secondary",
 								children: [
 									"Applications are handled directly with ",
-									P.bankName,
+									F.bankName,
 									" through HousingVista Messages. Start an enquiry and the bank will guide you through eligibility and paperwork."
 								]
 							}),
-							/* @__PURE__ */ C(T, {
+							/* @__PURE__ */ w(E, {
 								type: "button",
 								variant: "default",
 								className: "w-full justify-center",
-								onClick: () => V(!0),
+								onClick: () => H(!0),
 								children: "Apply Now"
 							})
 						]
 					})
 				})]
 			}),
-			/* @__PURE__ */ C(c, {
-				open: B,
-				onOpenChange: V,
-				entityId: P.id,
+			/* @__PURE__ */ w(l, {
+				open: V,
+				onOpenChange: H,
+				entityId: F.id,
 				entityType: "housingvista-home-loan",
-				title: P.bankName,
-				pagePath: N.pathname,
-				heading: `Apply with ${P.bankName}`,
-				description: `Start your application with ${P.bankName}. Messages are saved and delivered in your inbox.`
+				title: F.bankName,
+				pagePath: P.pathname,
+				heading: `Apply with ${F.bankName}`,
+				description: `Start your application with ${F.bankName}. Messages are saved and delivered in your inbox.`
 			})
 		]
 	});
 }
 //#endregion
-export { M as HomeLoanDetailPage };
+export { N as HomeLoanDetailPage };
 //# sourceMappingURL=HomeLoanDetailPage.js.map