// Contact — full-bleed dark cinematic, asymmetric headline + minimal form.
const CONTACT_IMG = "https://images.unsplash.com/photo-1600585154363-67eb9e2e2099?w=2200&q=80&auto=format&fit=crop";
// Stable, language-neutral interest keys + their displayed labels per language.
const INTEREST_OPTIONS = [
{ key: 'buy', bg: 'Покупка на имот', en: 'Buying property' },
{ key: 'sell', bg: 'Продажба на имот', en: 'Selling property' },
{ key: 'credit', bg: 'Кредитен консултант', en: 'Credit consultation' },
{ key: 'interior', bg: 'Интериорен дизайн', en: 'Interior design' },
{ key: 'renovation', bg: 'Ремонт от А до Я', en: 'Renovation' },
];
function Contact({ lang = 'bg' }) {
const isBg = lang !== 'en';
const [sent, setSent] = React.useState(false);
const [name, setName] = React.useState('');
const [phone, setPhone] = React.useState('');
const [budget, setBudget] = React.useState('');
const [interest, setInterest] = React.useState('buy'); // stores the stable key
const [message, setMessage] = React.useState('');
const [loading, setLoading] = React.useState(false);
const [error, setError] = React.useState(''); // '' | 'validation' | 'network'
const [errorMsg, setErrorMsg] = React.useState(''); // specific message; falls back to generic text
const [honeypot, setHoneypot] = React.useState(''); // bots fill this; humans never see it
const mountedAt = React.useRef(Date.now());
// Maps a Supabase/Postgres error to a more specific, user-readable message.
// Returns '' when no specific match is found (caller shows the generic text).
const resolveErrorMsg = (err) => {
const code = err && err.code ? String(err.code) : '';
const msg = (err && err.message ? String(err.message) : '').toLowerCase();
// relation/table missing — 42P01
if (code === '42P01' || msg.includes('does not exist') || msg.includes('could not find the table')) {
return isBg
? 'Таблицата за запитвания липсва. Моля, свържете се с нас директно.'
: 'The inquiries table is missing. Please contact us directly.';
}
// permission / RLS denied — 42501 or PostgREST RLS message
if (code === '42501' || msg.includes('row-level security') || msg.includes('permission denied')) {
return isBg
? 'Изпращането не е разрешено в момента. Моля, свържете се с нас директно.'
: 'Submission is not permitted right now. Please contact us directly.';
}
// check constraint violation — 23514
if (code === '23514' || msg.includes('check constraint') || msg.includes('violates check')) {
return isBg
? 'Някои данни не са валидни. Моля, проверете полетата и опитайте отново.'
: 'Some details are invalid. Please check the fields and try again.';
}
return '';
};
const handleSubmit = async (e) => {
e.preventDefault();
setError('');
setErrorMsg('');
// Spam guard 1 — honeypot filled → silently show success, never insert.
if (honeypot.trim()) { setSent(true); return; }
// Spam guard 2 — submitted suspiciously fast → silently show success, never insert.
if (Date.now() - mountedAt.current < 2000) { setSent(true); return; }
const nm = name.trim();
const ph = phone.trim();
// Validation — require at least name + phone.
if (!nm || !ph) { setError('validation'); return; }
if (!window.akSupabase) {
console.error('Contact insert: window.akSupabase is not available.');
setError('network');
setErrorMsg(isBg
? 'Услугата не е достъпна. Моля, свържете се с нас директно.'
: 'Service unavailable. Please contact us directly.');
return;
}
// interest must always be one of the stable keys the table expects.
const VALID_INTEREST = ['buy', 'sell', 'credit', 'interior', 'renovation'];
const selected = INTEREST_OPTIONS.find(o => o.key === interest) || INTEREST_OPTIONS[0];
const interestKey = VALID_INTEREST.includes(selected.key) ? selected.key : 'buy';
const interestLabel = isBg ? selected.bg : selected.en;
// Keys here must match the contact_inquiries table columns exactly.
const payload = {
name: nm,
phone: ph,
budget: budget.trim(),
interest: interestKey,
interest_label: interestLabel,
message: message.trim(),
lang,
source: 'website_contact',
user_agent: navigator.userAgent,
};
setLoading(true);
// No .select() — anon has INSERT but not SELECT; chaining .select() would
// require a SELECT and fail on an otherwise successful insert.
const { error: insErr } = await window.akSupabase
.from('contact_inquiries')
.insert([payload]);
setLoading(false);
if (insErr) {
// Sanitized diagnostics only — error metadata + payload field NAMES,
// never the submitted values (name/phone/message stay private).
console.error('Contact insert error:', {
code: insErr.code,
message: insErr.message,
details: insErr.details,
hint: insErr.hint,
payloadKeys: Object.keys(payload),
});
setError('network'); // form values are preserved
setErrorMsg(resolveErrorMsg(insErr)); // '' → generic text shown
return;
}
setSent(true);
};
return (
);
}
const fieldLabelStyle = {
fontFamily: 'var(--font-body)', fontSize: 10, fontWeight: 500,
letterSpacing: '0.28em', textTransform: 'uppercase',
color: 'var(--fg-2)',
};
function Field({ label, value, onChange, placeholder, textarea, type = 'text' }) {
const Tag = textarea ? 'textarea' : 'input';
return (
{label}
onChange(e.target.value)}
placeholder={placeholder}
rows={textarea ? 4 : undefined}
style={{
marginTop: 10, display: 'block', width: '100%',
background: 'transparent', color: 'var(--fg)',
fontFamily: 'var(--font-body)', fontSize: 15, fontWeight: 300,
border: 0, borderBottom: '1px solid var(--hairline-light)',
padding: '10px 0', outline: 'none', resize: 'vertical',
}}
/>
);
}
function ContactLine({ label, value }) {
return (
);
}
Object.assign(window, { Contact });