Remove email and chat cards

Removed the email inquiry and real-time chat cards from the help page.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-15 23:29:06 +00:00
parent 9631303b3c
commit c277ee51a8

View File

@@ -1,38 +1,51 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { ArrowLeft, HelpCircle, MessageCircle, Mail, ShieldQuestion, Info, ExternalLink } from 'lucide-react'; import { ArrowLeft, HelpCircle, Info, ExternalLink, ShieldQuestion } from 'lucide-react';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion'; import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';
import { Card } from '@/components/ui/card'; import { Card } from '@/components/ui/card';
import { toast } from 'sonner'; import { toast } from 'sonner';
const HelpSupport = () => { const HelpSupport = () => {
const navigate = useNavigate(); const navigate = useNavigate();
const [messageText, setMessageText] = useState(''); const [messageText, setMessageText] = useState('');
const faqItems = [{
question: '앱을 어떻게 사용하나요?', const faqItems = [
answer: '앱은 간단합니다. 홈 화면에서 수입과 지출을 추가할 수 있으며, 거래 내역 화면에서 모든 거래를 확인할 수 있습니다. 분석 화면에서는 지출 패턴을 확인하세요.' {
}, { question: '앱을 어떻게 사용하나요?',
question: '거래를 어떻게 추가하나요?', answer: '앱은 간단합니다. 홈 화면에서 수입과 지출을 추가할 수 있으며, 거래 내역 화면에서 모든 거래를 확인할 수 있습니다. 분석 화면에서는 지출 패턴을 확인하세요.'
answer: '홈 화면 하단의 "+" 버튼을 눌러 새 거래를 추가할 수 있습니다. 금액, 카테고리, 날짜를 입력하고 저장하세요.' },
}, { {
question: '예산을 어떻게 설정하나요?', question: '거래를 어떻게 추가하나요?',
answer: '홈 화면에서 예산 카드를 찾아 카테고리별 예산을 설정할 수 있습니다. 카테고리에 원하는 금액을 입력하여 월별 예산을 관리하세요.' answer: '홈 화면 하단의 "+" 버튼을 눌러 새 거래를 추가할 수 있습니다. 금액, 카테고리, 날짜를 입력하고 저장하세요.'
}, { },
question: '계정 정보를 어떻게 변경하나요?', {
answer: '설정 > 프로필 관리 메뉴에서 이름, 이메일, 전화번호 등의 개인 정보를 변경할 수 있습니다.' question: '예산을 어떻게 설정하나요?',
}, { answer: '홈 화면에서 예산 카드를 찾아 카테고리별 예산을 설정할 수 있습니다. 각 카테고리에 원하는 금액을 입력하여 월별 예산을 관리하세요.'
question: '알림 설정은 어디서 변경하나요?', },
answer: '설정 > 알림 설정 메뉴에서 원하는 알림 유형을 켜거나 끌 수 있습니다.' {
}]; question: '계정 정보를 어떻게 변경하나요?',
answer: '설정 > 프로필 관리 메뉴에서 이름, 이메일, 전화번호 등의 개인 정보를 변경할 수 있습니다.'
},
{
question: '알림 설정은 어디서 변경하나요?',
answer: '설정 > 알림 설정 메뉴에서 원하는 알림 유형을 켜거나 끌 수 있습니다.'
}
];
const sendMessage = () => { const sendMessage = () => {
if (!messageText.trim()) { if (!messageText.trim()) {
toast.error('메시지를 입력해주세요.'); toast.error('메시지를 입력해주세요.');
return; return;
} }
toast.success('문의가 접수되었습니다. 빠른 시일 내에 답변 드리겠습니다.'); toast.success('문의가 접수되었습니다. 빠른 시일 내에 답변 드리겠습니다.');
setMessageText(''); setMessageText('');
}; };
return <div className="min-h-screen bg-neuro-background pb-24">
return (
<div className="min-h-screen bg-neuro-background pb-24">
<div className="max-w-md mx-auto px-6"> <div className="max-w-md mx-auto px-6">
{/* Header */} {/* Header */}
<header className="py-8"> <header className="py-8">
@@ -53,20 +66,6 @@ const HelpSupport = () => {
<h3 className="font-medium"> </h3> <h3 className="font-medium"> </h3>
</Card> </Card>
<Card className="neuro-flat p-4 flex flex-col items-center text-center cursor-pointer hover:shadow-neuro-convex transition-all duration-300">
<div className="neuro-pressed p-3 rounded-full text-neuro-income mb-2">
<Mail size={24} />
</div>
<h3 className="font-medium"> </h3>
</Card>
<Card className="neuro-flat p-4 flex flex-col items-center text-center cursor-pointer hover:shadow-neuro-convex transition-all duration-300">
<div className="neuro-pressed p-3 rounded-full text-neuro-income mb-2">
<MessageCircle size={24} />
</div>
<h3 className="font-medium"> </h3>
</Card>
<Card className="neuro-flat p-4 flex flex-col items-center text-center cursor-pointer hover:shadow-neuro-convex transition-all duration-300"> <Card className="neuro-flat p-4 flex flex-col items-center text-center cursor-pointer hover:shadow-neuro-convex transition-all duration-300">
<div className="neuro-pressed p-3 rounded-full text-neuro-income mb-2"> <div className="neuro-pressed p-3 rounded-full text-neuro-income mb-2">
<Info size={24} /> <Info size={24} />
@@ -79,12 +78,14 @@ const HelpSupport = () => {
<div className="neuro-flat p-6 mb-8"> <div className="neuro-flat p-6 mb-8">
<h2 className="text-xl font-semibold mb-4"> </h2> <h2 className="text-xl font-semibold mb-4"> </h2>
<Accordion type="single" collapsible className="w-full"> <Accordion type="single" collapsible className="w-full">
{faqItems.map((item, index) => <AccordionItem key={index} value={`item-${index}`}> {faqItems.map((item, index) => (
<AccordionItem key={index} value={`item-${index}`}>
<AccordionTrigger className="text-left">{item.question}</AccordionTrigger> <AccordionTrigger className="text-left">{item.question}</AccordionTrigger>
<AccordionContent> <AccordionContent>
{item.answer} {item.answer}
</AccordionContent> </AccordionContent>
</AccordionItem>)} </AccordionItem>
))}
</Accordion> </Accordion>
</div> </div>
@@ -92,8 +93,18 @@ const HelpSupport = () => {
<div className="neuro-flat p-6 mb-8"> <div className="neuro-flat p-6 mb-8">
<h2 className="text-xl font-semibold mb-4"> </h2> <h2 className="text-xl font-semibold mb-4"> </h2>
<div className="space-y-4"> <div className="space-y-4">
<textarea className="w-full p-3 rounded-md neuro-pressed resize-none min-h-[120px]" placeholder="문의 내용을 입력해주세요..." value={messageText} onChange={e => setMessageText(e.target.value)} /> <textarea
<Button onClick={sendMessage} className="w-full bg-neuro-income text-white hover:bg-neuro-income/90"></Button> className="w-full p-3 rounded-md neuro-pressed resize-none min-h-[120px]"
placeholder="문의 내용을 입력해주세요..."
value={messageText}
onChange={e => setMessageText(e.target.value)}
/>
<Button
onClick={sendMessage}
className="w-full bg-neuro-income text-white hover:bg-neuro-income/90"
>
</Button>
</div> </div>
</div> </div>
@@ -119,6 +130,8 @@ const HelpSupport = () => {
</div> </div>
</div> </div>
</div> </div>
</div>; </div>
);
}; };
export default HelpSupport; export default HelpSupport;