diff --git a/src/components/anfragencenter/InquiryCard.tsx b/src/components/anfragencenter/InquiryCard.tsx
index 348100d..46776fd 100644
--- a/src/components/anfragencenter/InquiryCard.tsx
+++ b/src/components/anfragencenter/InquiryCard.tsx
@@ -96,19 +96,9 @@ export function InquiryCard({ inquiry, selected, onClick }: InquiryCardProps) {
{formatInquiryDate(inquiry.createdAt)}
{inquiry.matchScore !== undefined && (
-
- Match {inquiry.matchScore}%
-
+
+ {inquiry.matchScore}%
+
)}
diff --git a/src/components/anfragencenter/InquiryDetailPanel.tsx b/src/components/anfragencenter/InquiryDetailPanel.tsx
index 7336ea5..03ee75e 100644
--- a/src/components/anfragencenter/InquiryDetailPanel.tsx
+++ b/src/components/anfragencenter/InquiryDetailPanel.tsx
@@ -92,17 +92,18 @@ export function InquiryDetailPanel({ inquiryId }: InquiryDetailPanelProps) {
)}
-
+
setOfferWizardOpen(true)}
pendingAttachment={pendingAttachment}
onPendingAttachmentConsumed={() => setPendingAttachment(null)}
/>
-
+
diff --git a/src/components/anfragencenter/InquiryListRow.tsx b/src/components/anfragencenter/InquiryListRow.tsx
index d462237..e80aac4 100644
--- a/src/components/anfragencenter/InquiryListRow.tsx
+++ b/src/components/anfragencenter/InquiryListRow.tsx
@@ -17,11 +17,11 @@ export function InquiryListRow({ inquiry, selected, onClick }: InquiryListRowPro
onClick={onClick}
sx={{
px: 2,
- py: 1.5,
+ py: 1,
borderBottom: '1px solid #e2e8f0',
borderLeft: '3px solid',
borderLeftColor: selected ? '#152642' : hasUnread ? '#2563eb' : 'transparent',
- bgcolor: selected ? '#f1f5f9' : 'white',
+ bgcolor: selected ? '#eef2f8' : 'white',
cursor: 'pointer',
transition: 'background-color 0.15s, border-color 0.15s',
'&:hover': { bgcolor: selected ? '#f1f5f9' : '#f8fafc' },
@@ -76,20 +76,9 @@ export function InquiryListRow({ inquiry, selected, onClick }: InquiryListRowPro
{propertyLabelFromId(inquiry.propertyId)}
{inquiry.matchScore !== undefined && (
-
+
{inquiry.matchScore}%
-
+
)}
diff --git a/src/components/anfragencenter/RelatedPropertyCardPanel.tsx b/src/components/anfragencenter/RelatedPropertyCardPanel.tsx
index 572bdaf..6c61a8e 100644
--- a/src/components/anfragencenter/RelatedPropertyCardPanel.tsx
+++ b/src/components/anfragencenter/RelatedPropertyCardPanel.tsx
@@ -1,5 +1,5 @@
import { Box, Button, CircularProgress, Divider, Typography } from '@mui/material'
-import { ArrowRight, Building2, Calendar, MapPin, Ruler, Trophy } from 'lucide-react'
+import { ArrowRight, Building2, Calendar, MapPin, Ruler } from 'lucide-react'
import { useNavigate } from 'react-router'
import { usePropertyById } from '../../hooks/useProperties'
import { useAdditionalMatchesForInquiry } from '../../hooks/useMatches'
@@ -8,9 +8,10 @@ import type { AdditionalPropertyMatch } from '../../domain/additionalMatch'
interface RelatedPropertyCardPanelProps {
propertyId: string
inquiryId: string
+ compact?: boolean
}
-export function RelatedPropertyCardPanel({ propertyId, inquiryId }: RelatedPropertyCardPanelProps) {
+export function RelatedPropertyCardPanel({ propertyId, inquiryId, compact }: RelatedPropertyCardPanelProps) {
const { data: property, isLoading } = usePropertyById(propertyId)
const navigate = useNavigate()
const {
@@ -38,6 +39,76 @@ export function RelatedPropertyCardPanel({ propertyId, inquiryId }: RelatedPrope
const image = property.images?.[0]
+ const detailRows = (
+
+
+
+
+ {property.location.city}
+ {property.location.district ? `, ${property.location.district}` : ''}
+
+
+
+
+
+ {property.areaSqm.toLocaleString('de-CH')} m² · CHF {property.rentPricePerSqm}/m²/Jahr
+
+
+
+
+
+ Verfügbar ab {new Date(property.availabilityDate).toLocaleDateString('de-CH')}
+
+
+
+ )
+
+ const matchesSection = (
+ <>
+
+ Weitere passende Objekte
+
+ {loadingMatches ? (
+
+ ) : additionalMatches.length === 0 ? (
+
+ Keine weiteren Matches
+
+ ) : (
+
+ {additionalMatches.map(m => (
+
+ ))}
+
+ )}
+ >
+ )
+
+ if (compact) {
+ return (
+
+
+
+ {property.title}
+
+ {detailRows}
+ }
+ onClick={() => navigate('/supply/properties')}
+ sx={{ textTransform: 'none', alignSelf: 'flex-start', mt: 'auto' }}
+ >
+ Objekt ansehen
+
+
+
+ {matchesSection}
+
+
+ )
+ }
+
return (
-
- Bezogenes Objekt
-
-
-
-
-
-
- {property.location.city}
- {property.location.district ? `, ${property.location.district}` : ''}
-
-
-
-
-
- {property.areaSqm.toLocaleString('de-CH')} m² · CHF {property.rentPricePerSqm}/m²/Jahr
-
-
-
-
-
- Verfügbar ab {new Date(property.availabilityDate).toLocaleDateString('de-CH')}
-
-
-
+ {detailRows}
{property.description && (
@@ -114,28 +161,10 @@ export function RelatedPropertyCardPanel({ propertyId, inquiryId }: RelatedPrope
Objekt ansehen
- {/* Weitere Matches */}
-
-
-
- Weitere passende Objekte
-
+
+ {matchesSection}
-
- {loadingMatches ? (
-
- ) : additionalMatches.length === 0 ? (
-
- Keine weiteren Matches
-
- ) : (
-
- {additionalMatches.map(m => (
-
- ))}
-
- )}
)
}
@@ -145,69 +174,35 @@ function AdditionalMatchCard({ match }: { match: AdditionalPropertyMatch }) {
return (
- {match.imageUrl && (
-
- )}
-
-
-
- {match.title}
-
- = 90 ? '#fef3c7' : '#e0e7ff',
- color: match.matchScore >= 90 ? '#92400e' : '#3730a3',
- fontWeight: 700,
- fontSize: '0.65rem',
- flexShrink: 0,
- ml: 0.5,
- }}
- >
- {match.matchScore}%
-
-
-
- {match.location} · {match.areaSqm.toLocaleString('de-CH')} m² · CHF {match.rentPricePerSqm}/m²/Jahr
+
+
+ {match.title}
+
+
+ {match.matchScore}%
- {match.reasons.length > 0 && (
-
- {match.reasons.map((r, i) => (
-
- + {r}
-
- ))}
-
- )}
- {match.topUncertainty && (
-
- ⚠ {match.topUncertainty}
-
- )}
- }
- onClick={() => navigate('/supply/properties')}
- sx={{ textTransform: 'none', fontSize: '0.7rem', mt: 0.5, p: 0, minWidth: 0, color: '#152642' }}
- >
- Ansehen
-
+
+ {match.location} · {match.areaSqm.toLocaleString('de-CH')} m²
+
+ {match.reasons[0] && (
+
+ + {match.reasons[0]}
+
+ )}
+ }
+ onClick={() => navigate('/supply/properties')}
+ sx={{ textTransform: 'none', fontSize: '0.7rem', p: 0, minWidth: 0, color: '#152642' }}
+ >
+ Ansehen
+
)
}