diff --git a/src/blocks/ContactInfo/Component.tsx b/src/blocks/ContactInfo/Component.tsx new file mode 100644 index 0000000..99fd480 --- /dev/null +++ b/src/blocks/ContactInfo/Component.tsx @@ -0,0 +1,218 @@ +'use client' +import React, { useState } from 'react' +import { usePathname } from 'next/navigation' +import { MapPin, Phone, Mail, Clock, MessageCircle, Send } from 'lucide-react' +import type { Page } from '../../payload-types' + +type Props = Extract[0], { blockType: 'contactInfo' }> + +export const ContactInfoBlock: React.FC = ({ + address = 'DO POTWIERDZENIA PRZEZ KLIENTA', + phone = '+49 123 456 789', + email = 'kontakt@example.com', + hours = 'Pon-Pt: 9:00 - 17:00\nPo wcześniejszym umówieniu', +}) => { + const pathname = usePathname() + const isDe = pathname?.startsWith('/de') + + const [formData, setFormData] = useState({ name: '', email: '', message: '' }) + const [submitted, setSubmitted] = useState(false) + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault() + // TODO: Podłączyć logikę wysyłki formularza przez backend API (np. Resend / SMTP / Payload custom endpoint) + setSubmitted(true) + } + + return ( +
+
+
+ + {/* Kolumna 1: Dane kontaktowe + WhatsApp CTA (Główna opcja) */} +
+
+

+ {isDe ? 'Direkter Kontakt' : 'Bezpośredni kontakt'} +

+ +
    + {address && ( +
  • +
    + +
    +
    + + {isDe ? 'Adresse' : 'Adres'} + + {address} +
    +
  • + )} + + {phone && ( +
  • +
    + +
    +
    + + {isDe ? 'Telefon' : 'Telefon'} + + + {phone} + +
    +
  • + )} + + {email && ( +
  • +
    + +
    +
    + + {isDe ? 'E-Mail' : 'E-mail'} + + + {email} + +
    +
  • + )} + + {hours && ( +
  • +
    + +
    +
    + + {isDe ? 'Öffnungszeiten' : 'Godziny pracy'} + + {hours} +
    +
  • + )} +
+
+ + {/* Główne CTA: WhatsApp */} +
+ + {isDe ? 'Empfohlen & Am schnellsten' : 'Zalecany i najszybszy kontakt'} + +

+ {isDe ? 'Schreiben Sie auf WhatsApp' : 'Napisz na WhatsApp'} +

+

+ {isDe + ? 'Erhalten Sie schnelle Antworten auf Ihre Fragen direkt von Dipl.-Ing. Janusz Kędzierski.' + : 'Najszybsza forma kontaktu. Prześlij zapytanie lub dokumenty i uzyskaj szybką odpowiedź.'} +

+ + + {isDe ? 'WhatsApp Chat starten' : 'Napisz na WhatsApp'} + +
+
+ + {/* Kolumna 2: Prosty formularz kontaktowy (Drugorzędna opcja) */} +
+
+ + {isDe ? 'Nachricht senden' : 'Napisz wiadomość'} + +

+ {isDe ? 'Kontaktformular' : 'Formularz kontaktowy'} +

+

+ {isDe + ? 'Bevorzugen Sie eine schriftliche Nachricht? Füllen Sie das folgende Formular aus — wir antworten in der Regel innerhalb von 24 Stunden.' + : 'Wolisz kontakt tradycyjny? Wypełnij formularz, a odpowiemy najszybciej jak to możliwe.'} +

+
+ + {submitted ? ( +
+

+ {isDe ? 'Vielen Dank für Ihre Nachricht!' : 'Dziękujemy za wiadomość!'} +

+

+ {isDe + ? 'Ihre Anfrage wurde entgegengenommen. Wir melden uns in Kürze.' + : 'Twoje zapytanie zostało zarejestrowane. Skontaktujemy się wkrótce.'} +

+
+ ) : ( +
+
+ + setFormData({ ...formData, name: e.target.value })} + placeholder={isDe ? 'z. B. Jan Kowalski' : 'np. Jan Kowalski'} + className="w-full px-4 py-3 bg-background border border-border rounded-lg text-foreground focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent transition-all" + /> +
+ +
+ + setFormData({ ...formData, email: e.target.value })} + placeholder="kontakt@example.com" + className="w-full px-4 py-3 bg-background border border-border rounded-lg text-foreground focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent transition-all" + /> +
+ +
+ +