johannes.gasser/property-match
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: architecture compliance pass — DS tokens, hook boundary, god component split, AI hardening

Browse Source 
- DS token migration: Anfragen.tsx + child components (AnfragenInquiryItem, AnfragenMessageBubble)
  fully migrated; DS_TEXT.brandDark added; scoreTheme.ts moved to src/lib/ with re-export proxy
- Hook boundary: Results.tsx no longer calls needService directly — routes through useNeeds()
  with optional refetchOnMount/gcTime overrides
- NewListing.tsx (440L) split into useNewListingForm hook + 8 section components under
  src/components/new-listing/; page shell reduced to 121 lines
- AI hardening: Zod .strict() on all schemas, AIProvenance extended with schemaVersion/
  fallbackReason/traceId/latencyMs, AITraceStore stats with p50/p90/p99 + failure breakdowns,
  MockAIService buildFollowUpQuestions with priority ordering + area-ambiguity detection,
  prompt templates updated (LIGHT_INDUSTRIAL, budget unit, ambiguity detection, decimal precision)
- Tests: all 154 passing; fixed test regression caused by OfferEmailResponseSchema body min(50)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Benjamin Sutter
2026-05-24 16:10:39 +02:00
parent e36c5bc979
commit e1f4beb898
44 changed files with 1610 additions and 1058 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/supply/NeedMatchCard.tsx
+17 -16
View File
@@ -1,6 +1,7 @@
import { Box, Card, Chip, Stack, Typography } from '@mui/material'
import { MapPin, Ruler, Wallet, Calendar, CheckCircle } from 'lucide-react'
import type { PropertyNeedMatch } from '../../domain/match'
import { DS_TEXT, DS_BG, DS_SURFACE, DS_BORDER } from '../../lib/ds'
interface Props {
match: PropertyNeedMatch
@@ -9,9 +10,9 @@ interface Props {
function ScoreBadge({ score }: { score: number }) {
const isGold = score >= 90
const bg = isGold ? '#fef3c7' : '#f1f5f9'
const color = isGold ? '#d97706' : '#64748b'
const borderColor = isGold ? '#fde68a' : '#e2e8f0'
const bg = isGold ? DS_SURFACE.warning.bg : DS_BG.subtle
const color = isGold ? DS_TEXT.warning : DS_TEXT.muted
const borderColor = isGold ? DS_SURFACE.warning.border : DS_BORDER.default
return (
<Box
@@ -37,9 +38,9 @@ function ScoreBadge({ score }: { score: number }) {
function InfoRow({ icon, label, value }: { icon: React.ReactNode; label: string; value: string }) {
return (
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.75 }}>
<Box sx={{ color: '#94a3b8', display: 'flex', alignItems: 'center' }}>{icon}</Box>
<Typography variant="caption" sx={{ color: '#64748b', minWidth: 70 }}>{label}</Typography>
<Typography variant="caption" sx={{ color: '#0f172a', fontWeight: 500 }}>{value}</Typography>
<Box sx={{ color: DS_TEXT.disabled, display: 'flex', alignItems: 'center' }}>{icon}</Box>
<Typography variant="caption" sx={{ color: DS_TEXT.muted, minWidth: 70 }}>{label}</Typography>
<Typography variant="caption" sx={{ color: DS_TEXT.primary, fontWeight: 500 }}>{value}</Typography>
</Box>
)
}
@@ -52,10 +53,10 @@ export function NeedMatchCard({ match, onClick }: Props) {
sx={{
p: 2,
mb: 1.5,
border: '1px solid #e2e8f0',
border: `1px solid ${DS_BORDER.default}`,
borderRadius: 1.5,
cursor: onClick ? 'pointer' : 'default',
'&:hover': onClick ? { borderColor: '#1e3a5f', bgcolor: '#f8fafc', boxShadow: '0 2px 8px rgba(30,58,95,0.08)' } : { borderColor: '#cbd5e1', bgcolor: '#fafafa' },
'&:hover': onClick ? { borderColor: DS_TEXT.brand, bgcolor: DS_BG.page, boxShadow: '0 2px 8px rgba(30,58,95,0.08)' } : { borderColor: DS_BORDER.strong, bgcolor: DS_BG.page },
transition: 'border-color 0.15s, background-color 0.15s, box-shadow 0.15s',
}}
>
@@ -64,7 +65,7 @@ export function NeedMatchCard({ match, onClick }: Props) {
<Box sx={{ flex: 1, minWidth: 0 }}>
<Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', mb: 0.5 }}>
<Typography variant="body2" sx={{ fontWeight: 700, color: '#0f172a' }}>
<Typography variant="body2" sx={{ fontWeight: 700, color: DS_TEXT.primary }}>
{match.company}
</Typography>
<Chip
@@ -73,10 +74,10 @@ export function NeedMatchCard({ match, onClick }: Props) {
sx={{
fontSize: '0.65rem',
height: 18,
bgcolor: match.score >= 90 ? '#fef3c7' : '#f1f5f9',
color: match.score >= 90 ? '#92400e' : '#475569',
bgcolor: match.score >= 90 ? DS_SURFACE.warning.bg : DS_BG.subtle,
color: match.score >= 90 ? DS_TEXT.warningDark : DS_TEXT.secondary,
border: '1px solid',
borderColor: match.score >= 90 ? '#fde68a' : '#e2e8f0',
borderColor: match.score >= 90 ? DS_SURFACE.warning.border : DS_BORDER.default,
}}
/>
</Box>
@@ -96,8 +97,8 @@ export function NeedMatchCard({ match, onClick }: Props) {
<Box sx={{ mb: 1 }}>
{match.matchHighlights.slice(0, 2).map((h, i) => (
<Box key={i} sx={{ display: 'flex', alignItems: 'flex-start', gap: 0.5, mb: 0.25 }}>
<CheckCircle size={11} color="#1a7a4a" style={{ marginTop: 2, flexShrink: 0 }} />
<Typography variant="caption" sx={{ color: '#374151', lineHeight: 1.4 }}>{h}</Typography>
<CheckCircle size={11} color={DS_TEXT.success} style={{ marginTop: 2, flexShrink: 0 }} />
<Typography variant="caption" sx={{ color: DS_TEXT.primary, lineHeight: 1.4 }}>{h}</Typography>
</Box>
))}
</Box>
@@ -110,11 +111,11 @@ export function NeedMatchCard({ match, onClick }: Props) {
key={mh}
label={mh}
size="small"
sx={{ fontSize: '0.62rem', height: 18, bgcolor: '#f0fdf4', color: '#166534', border: '1px solid #bbf7d0' }}
sx={{ fontSize: '0.62rem', height: 18, bgcolor: DS_SURFACE.success.bg, color: DS_TEXT.successDark, border: `1px solid ${DS_SURFACE.success.border}` }}
/>
))}
{match.mustHaves.length > 3 && (
<Typography variant="caption" sx={{ color: '#94a3b8', alignSelf: 'center' }}>
<Typography variant="caption" sx={{ color: DS_TEXT.disabled, alignSelf: 'center' }}>
+{match.mustHaves.length - 3}
</Typography>
)}