feat: F030 Anfragencenter — Aktive & Latente Anfragen + Angebot-Wizard

Neuer Menüpunkt «Anfragencenter» (ehemals «Eingehende Bedarfe»): Aktive Anfragen: - Split-View: Anfrageliste (Liste/Grid-Toggle) + Chat-Detailansicht - Chat-Verlauf mit Sender-Styling (Mieter links, Supply rechts) - Antwortformular mit Betreff, Nachricht, Anhänge, Statuswechsel - Zugehörige Property Card neben dem Chat Latente Anfragen: - Drei-Spalten-Layout: Need-Liste | Need-Detail | Eigene Objekte - Need Cards mit AI-Zusammenfassung, Must-Haves, Präferenzen - Eigene Portfolio-Objekte sortiert nach deterministischem Match-Score - Checkbox-Selektion für Angebotsauswahl Angebot-Wizard (4 Schritte): - Schritt 1: Objekte auswählen (mit Score-Vorschau) - Schritt 2: PDF-Vorschau + editierbare Textfelder - Schritt 3: Angebot prüfen & bestätigen - Schritt 4: Nachricht an Suchenden mit KI-generierter Mail Architektur: - Domain: Inquiry, LatentNeed, OfferDraft Types - Provider: IInquiryProvider, ILatentNeedProvider, IOfferProvider + Mockups - Services: inquiryService, latentNeedService, offerService - Hooks: useInquiries, useLatentNeeds, useOffers (TanStack Query) - Store: offerWizardStore (Zustand, lokaler Wizard-State) - 27 neue Komponenten, alle Loading/Empty/Error States Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-18 18:03:05 +02:00
parent 05ac0083b2
commit c4c29ef7d3
51 changed files with 4000 additions and 1 deletions
@@ -0,0 +1,87 @@
+import { Box, CircularProgress, Typography } from '@mui/material'
+import { Sparkles } from 'lucide-react'
+import { usePublicNeeds } from '../../hooks/useLatentNeeds'
+import { PublicNeedCard } from './PublicNeedCard'
+import { EmptyState } from '../ui'
+
+interface PublicNeedListProps {
+  selectedNeedId: string | null
+  onSelect: (id: string) => void
+}
+
+export function PublicNeedList({ selectedNeedId, onSelect }: PublicNeedListProps) {
+  const { data: needs = [], isLoading, error } = usePublicNeeds()
+
+  return (
+    <Box
+      sx={{
+        width: 280,
+        minWidth: 280,
+        flexShrink: 0,
+        borderRight: '1px solid #e2e8f0',
+        bgcolor: 'white',
+        display: 'flex',
+        flexDirection: 'column',
+        overflow: 'hidden',
+      }}
+    >
+      <Box
+        sx={{
+          px: 2,
+          py: 1.25,
+          borderBottom: '1px solid #e2e8f0',
+          display: 'flex',
+          alignItems: 'center',
+          gap: 1,
+          flexShrink: 0,
+        }}
+      >
+        <Sparkles size={14} color="#7c3aed" />
+        <Typography variant="body2" sx={{ fontWeight: 600, color: '#0f172a' }}>
+          Latente Bedarfe
+        </Typography>
+        <Box
+          sx={{
+            ml: 'auto',
+            px: 1,
+            py: 0.125,
+            borderRadius: 1,
+            bgcolor: '#1e3a5f',
+            color: 'white',
+            fontWeight: 600,
+            fontSize: '0.7rem',
+          }}
+        >
+          {needs.length}
+        </Box>
+      </Box>
+
+      <Box sx={{ flex: 1, overflowY: 'auto', p: 1.25, display: 'flex', flexDirection: 'column', gap: 1 }}>
+        {isLoading && (
+          <Box sx={{ display: 'flex', justifyContent: 'center', p: 4 }}>
+            <CircularProgress size={20} />
+          </Box>
+        )}
+        {error && (
+          <Typography variant="body2" color="error">
+            Fehler beim Laden
+          </Typography>
+        )}
+        {!isLoading && needs.length === 0 && (
+          <EmptyState
+            title="Keine Bedarfe"
+            description="Aktuell sind keine öffentlichen Bedarfe verfügbar."
+          />
+        )}
+        {needs.map(n => (
+          <PublicNeedCard
+            key={n.id}
+            need={n}
+            selected={n.id === selectedNeedId}
+            onClick={() => onSelect(n.id)}
+          />
+        ))}
+      </Box>
+    </Box>
+  )
+}