/opt/canhelp/apps/web/src/app/support
NameSizeModeActions
page.tsx86500644editdlrm
Edit: /opt/canhelp/apps/web/src/app/support/page.tsx (8650B)
'use client' import { useState } from 'react' import Link from 'next/link' import { useLocale } from '@/context/locale' import { CAPTCHA_ENABLED, TurnstileWidget } from '@/components/Turnstile' import { sendPublicSupportMessage } from '@/lib/api' const SUPPORT_EMAIL = 'info@canhelp.gr' const CONTENT = { el: { title: 'Υποστήριξη CanHelp', intro: 'Αν χρειάζεστε βοήθεια με την εφαρμογή, στείλτε μας email ή χρησιμοποιήστε τη φόρμα επικοινωνίας μέσα στην εφαρμογή.', points: [ 'Περιγράψτε σύντομα το πρόβλημα και, αν γίνεται, επισυνάψτε στιγμιότυπο οθόνης.', 'Αν το ζήτημα αφορά σύνδεση, αναφέρετε τη συσκευή και την έκδοση της εφαρμογής.', 'Απαντάμε συνήθως μέσα σε 1-2 εργάσιμες ημέρες.', ], }, en: { title: 'CanHelp Support', intro: 'If you need help with the app, email us or use the in-app contact form.', points: [ 'Briefly describe the issue and attach a screenshot if possible.', 'If it is a login problem, include your device and app version.', 'We usually reply within 1-2 business days.', ], }, ru: { title: 'Поддержка CanHelp', intro: 'Если вам нужна помощь с приложением, напишите нам на email или используйте форму связи в приложении.', points: [ 'Кратко опишите проблему и, если возможно, приложите скриншот.', 'Если проблема со входом, укажите устройство и версию приложения.', 'Обычно мы отвечаем в течение 1-2 рабочих дней.', ], }, uk: { title: 'Підтримка CanHelp', intro: 'Якщо вам потрібна допомога з додатком, напишіть нам на email або скористайтеся формою зв’язку в додатку.', points: [ 'Коротко опишіть проблему та, якщо можливо, додайте скріншот.', 'Якщо проблема зі входом, вкажіть пристрій і версію додатка.', 'Зазвичай ми відповідаємо протягом 1-2 робочих днів.', ], }, } as const export default function SupportPage() { const { locale, t } = useLocale() const content = CONTENT[locale as keyof typeof CONTENT] ?? CONTENT.en const [name, setName] = useState('') const [email, setEmail] = useState('') const [subject, setSubject] = useState('') const [body, setBody] = useState('') const [captchaToken, setCaptchaToken] = useState(CAPTCHA_ENABLED ? '' : 'dev') const [loading, setLoading] = useState(false) const [sent, setSent] = useState(false) const [error, setError] = useState('') async function handleSubmit(e: React.FormEvent) { e.preventDefault() setError('') setLoading(true) try { await sendPublicSupportMessage({ name: name.trim(), email: email.trim(), subject: subject.trim(), body: body.trim(), captchaToken, }) setSent(true) } catch (err: any) { if ((err?.message || '').toLowerCase().includes('captcha')) { setError('Security check failed. Please try again.') setCaptchaToken('') } else { setError('Failed to send message. Please try again.') } } finally { setLoading(false) } } return (
← {t('nav.home')}

{content.title}

{content.intro}

{content.points.map((point) => (
{point}
))}
{SUPPORT_EMAIL} {t('nav.privacy')}

Send a message to support

We will forward it directly to the admin team.

setName(e.target.value)} required minLength={2} maxLength={100} className="w-full rounded-xl border border-gray-300 bg-white px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-500" placeholder="Your name" />
setEmail(e.target.value)} required maxLength={200} className="w-full rounded-xl border border-gray-300 bg-white px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-500" placeholder="name@example.com" />
setSubject(e.target.value)} required minLength={3} maxLength={200} className="w-full rounded-xl border border-gray-300 bg-white px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-500" placeholder="What do you need help with?" />