From 259b4e3c686a4f2f2ae0c90db90605760e7d360e Mon Sep 17 00:00:00 2001
From: Benjamin Sutter <beni_sutter@hotmail.com>
Date: Mon, 18 May 2026 21:11:38 +0200
Subject: [PATCH] fix: compact side-by-side image+map in PropertyDetailView
 drawer (140px)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/components/supply/PropertyDetailView.tsx | 47 +++++++++++---------
 1 file changed, 25 insertions(+), 22 deletions(-)

diff --git a/src/components/supply/PropertyDetailView.tsx b/src/components/supply/PropertyDetailView.tsx
index dacd1ce..fc2e547 100644
--- a/src/components/supply/PropertyDetailView.tsx
+++ b/src/components/supply/PropertyDetailView.tsx
@@ -13,7 +13,7 @@ import {
 import { X } from 'lucide-react'
 import { NegotiationInsightsPanel } from './NegotiationInsightsPanel'
 import { DataQualityPanel as DQPanel, ProvenancePanel } from '../data-quality'
-import { LocationPreview, PropertyMap } from '../shared'
+import { PropertyMap } from '../shared'
 import type { Property } from '../../domain/property'
 import type { Match } from '../../domain/match'
 import type { FutureSignal } from '../../domain/futureSignal'
@@ -366,27 +366,30 @@ export function PropertyDetailView({ propertyId, onClose }: PropertyDetailViewPr
         )}
       </Box>
 
-      {/* Photo + Map */}
-      <Box sx={{ flexShrink: 0 }}>
-        {property.images?.[0] && (
-          <LocationPreview
-            imageUrl={property.images[0]}
-            lat={property.location.coordinates?.lat}
-            lng={property.location.coordinates?.lng}
-            address={`${property.address.street} ${property.address.houseNumber}, ${property.address.city}`}
-            cityLabel={property.location.city}
-            height={180}
-          />
-        )}
-        {property.location.coordinates && (
-          <PropertyMap
-            lat={property.location.coordinates.lat}
-            lng={property.location.coordinates.lng}
-            label={property.title}
-            height={240}
-          />
-        )}
-      </Box>
+      {/* Photo + Map — side by side, compact */}
+      {(property.images?.[0] || property.location.coordinates) && (
+        <Box sx={{ display: 'flex', flexShrink: 0, height: 140, borderBottom: '1px solid #e2e8f0' }}>
+          {property.images?.[0] && (
+            <Box sx={{ flex: property.location.coordinates ? '0 0 55%' : 1, overflow: 'hidden' }}>
+              <img
+                src={property.images[0]}
+                alt={property.title}
+                style={{ width: '100%', height: '100%', objectFit: 'cover', display: 'block' }}
+              />
+            </Box>
+          )}
+          {property.location.coordinates && (
+            <Box sx={{ flex: 1, overflow: 'hidden' }}>
+              <PropertyMap
+                lat={property.location.coordinates.lat}
+                lng={property.location.coordinates.lng}
+                label={property.title}
+                height={140}
+              />
+            </Box>
+          )}
+        </Box>
+      )}
 
       {/* Tabs */}
       <Tabs