diff --git a/src/components/Features.tsx b/src/components/Features.tsx deleted file mode 100644 index e0923a3..0000000 --- a/src/components/Features.tsx +++ /dev/null @@ -1,109 +0,0 @@ -import React from 'react'; - -interface Feature { - icon: React.ReactNode; - title: string; - description: string; -} - -const Features: React.FC = () => { - const features: Feature[] = [ - { - icon: ( - - - - ), - title: '보안 결제', - description: '최고 수준의 암호화 기술로 고객의 결제 정보를 안전하게 보호합니다.' - }, - { - icon: ( - - - - ), - title: '빠른 처리', - description: '실시간 결제 처리로 빠르고 효율적인 거래 경험을 제공합니다.' - }, - { - icon: ( - - - - ), - title: '모바일 최적화', - description: '하이브리드 앱으로 iOS, Android 모든 기기에서 완벽하게 동작합니다.' - }, - { - icon: ( - - - - ), - title: '24/7 지원', - description: '언제든지 도움이 필요할 때 전문가 팀이 즉시 지원해드립니다.' - }, - { - icon: ( - - - - ), - title: '신뢰성', - description: '15년간 축적된 노하우로 안정적이고 신뢰할 수 있는 서비스를 제공합니다.' - }, - { - icon: ( - - - - - ), - title: '맞춤 설정', - description: '비즈니스 요구사항에 맞게 유연하게 설정할 수 있는 결제 솔루션입니다.' - } - ]; - - return ( -
-
-
-

- 왜 나이스페이먼츠인가요? -

-

- 고객의 성공이 우리의 성공입니다. 최고의 기술력과 서비스로 비즈니스 성장을 지원합니다. -

-
- -
- {features.map((feature, index) => ( -
-
- {feature.icon} -
-

- {feature.title} -

-

- {feature.description} -

-
- ))} -
- -
- -
-
-
- ); -}; - -export default Features; \ No newline at end of file diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx deleted file mode 100644 index 3411991..0000000 --- a/src/components/Footer.tsx +++ /dev/null @@ -1,121 +0,0 @@ -import React from 'react'; -import { Link } from '@tanstack/react-router'; - -const Footer: React.FC = () => { - return ( - - ); -}; - -export default Footer; \ No newline at end of file diff --git a/src/components/Header.tsx b/src/components/Header.tsx deleted file mode 100644 index f560d8d..0000000 --- a/src/components/Header.tsx +++ /dev/null @@ -1,202 +0,0 @@ -import React, { useState } from 'react'; -import { Link, useRouterState } from '@tanstack/react-router'; -import { Toasts } from '@/shared/ui/toasts/toasts'; -import { ToastContainer,toast } from 'react-toastify'; - - -const Header: React.FC = () => { - const [isOpenBottomSheet, setIsOpenBottomSheet] = useState(true); - const [isMenuOpen, setIsMenuOpen] = useState(false); - const router = useRouterState(); - - const isActive = (path: string) => { - return router.location.pathname === path; - }; - const toastTest = (str: string) => { - //alert(str) - toast(str); - //notiBar(str) - - }; - - const openBottomSheet = () => { - - }; - - return ( - <> -
- -
-
- {/* Logo */} - -
- NP -
- - NicePayments - - - - {/* Desktop Navigation */} - - - {/* User Menu */} -
-
- - -
-
- - {/* Mobile Menu Button */} - -
- - {/* Mobile Menu */} - {isMenuOpen && ( -
- -
- )} -
-
- - - ); -}; - -export default Header; \ No newline at end of file diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx deleted file mode 100644 index 27c0252..0000000 --- a/src/components/Hero.tsx +++ /dev/null @@ -1,56 +0,0 @@ -import React from 'react'; - -const Hero: React.FC = () => { - return ( -
-
-
-

- 안전하고 편리한 -
- - 결제 서비스 - -

-

- 나이스페이먼츠와 함께 더 나은 결제 경험을 시작하세요. -
- 하이브리드 앱으로 언제 어디서나 간편하게! -

-
- - -
-
-
- - {/* Floating Elements */} -
-
-
- - {/* Wave Bottom */} -
- - - - - -
-
- ); -}; - -export default Hero; \ No newline at end of file diff --git a/src/components/LanguageSwitcher.tsx b/src/components/LanguageSwitcher.tsx deleted file mode 100644 index 9f5b036..0000000 --- a/src/components/LanguageSwitcher.tsx +++ /dev/null @@ -1,38 +0,0 @@ -import React from 'react'; -import { useTranslation } from 'react-i18next'; -import { appBridge } from '@/utils/appBridge'; - -const LanguageSwitcher: React.FC = () => { - const { i18n, t } = useTranslation(); - - const changeLanguage = async (language: string) => { - // 웹 언어 변경 - i18n.changeLanguage(language); - localStorage.setItem('i18nextLng', language); - - // 네이티브 환경에서 네이티브 언어도 변경 - if (appBridge.isNativeEnvironment()) { - try { - await appBridge.setLanguage(language); - } catch (error) { - console.error('Failed to set native language:', error); - } - } - }; - - return ( -
- {t('common.language')} - -
- ); -}; - -export default LanguageSwitcher; \ No newline at end of file diff --git a/src/components/SearchFilterButton.tsx b/src/components/SearchFilterButton.tsx deleted file mode 100644 index 5d2e32c..0000000 --- a/src/components/SearchFilterButton.tsx +++ /dev/null @@ -1,59 +0,0 @@ -import React from 'react'; - -interface SearchFilterButtonProps { - displayText: string; - isActive: boolean; - onClick: () => void; - className?: string; - showIcon?: boolean; - disabled?: boolean; -} - -const SearchFilterButton: React.FC = ({ - displayText, - isActive, - onClick, - className = '', - showIcon = true, - disabled = false -}) => { - const baseClasses = "inline-flex items-center px-4 py-2 text-sm font-medium rounded-lg border transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"; - - const activeClasses = isActive - ? "bg-blue-50 border-blue-500 text-blue-700 hover:bg-blue-100" - : "bg-white border-gray-300 text-gray-700 hover:bg-gray-50 hover:border-gray-400"; - - const disabledClasses = disabled - ? "opacity-50 cursor-not-allowed" - : "cursor-pointer"; - - return ( - - ); -}; - -export default SearchFilterButton; \ No newline at end of file diff --git a/src/components/Services.tsx b/src/components/Services.tsx deleted file mode 100644 index eb1e400..0000000 --- a/src/components/Services.tsx +++ /dev/null @@ -1,150 +0,0 @@ -import React from 'react'; - -interface Service { - title: string; - description: string; - features: string[]; - icon: React.ReactNode; - color: string; -} - -const Services: React.FC = () => { - const services: Service[] = [ - { - title: '카드 결제', - description: '국내외 모든 카드사와 연동된 안전한 카드 결제 서비스', - features: [ - '국내외 주요 카드사 지원', - '무이자 할부 서비스', - '실시간 승인 처리', - '3D Secure 보안 인증' - ], - icon: ( - - - - ), - color: 'from-blue-500 to-blue-600' - }, - { - title: '계좌이체', - description: '은행 계좌를 통한 직접 이체 결제 서비스', - features: [ - '전 은행 실시간 이체', - '낮은 수수료율', - '자동 입금 확인', - '환불 처리 자동화' - ], - icon: ( - - - - ), - color: 'from-green-500 to-green-600' - }, - { - title: '모바일 결제', - description: '카카오페이, 네이버페이 등 간편결제 서비스', - features: [ - '주요 간편결제 연동', - '원터치 결제', - '포인트 사용 가능', - '멤버십 혜택 적용' - ], - icon: ( - - - - ), - color: 'from-purple-500 to-purple-600' - }, - { - title: '가상계좌', - description: '개인별 전용 가상계좌를 통한 무통장 입금 서비스', - features: [ - '실시간 계좌 발급', - '자동 입금 확인', - '다중 은행 지원', - '입금 알림 서비스' - ], - icon: ( - - - - ), - color: 'from-orange-500 to-orange-600' - } - ]; - - return ( -
-
-
-

- 다양한 결제 서비스 -

-

- 고객의 다양한 결제 니즈에 맞춰 최적화된 결제 솔루션을 제공합니다. -

-
- -
- {services.map((service, index) => ( -
-
- {service.icon} -
- -

- {service.title} -

- -

- {service.description} -

- -
-

주요 기능

- {service.features.map((feature, featureIndex) => ( -
-
- {feature} -
- ))} -
- - -
- ))} -
- -
-
-

- 맞춤형 결제 솔루션이 필요하신가요? -

-

- 비즈니스 규모와 업종에 맞는 최적의 결제 솔루션을 제안해드립니다. - 전문 컨설턴트와 상담을 통해 최고의 결제 환경을 구축하세요. -

-
- - -
-
-
-
-
- ); -}; - -export default Services; \ No newline at end of file diff --git a/src/components/SlideMenu.tsx b/src/components/SlideMenu.tsx deleted file mode 100644 index 96b16ea..0000000 --- a/src/components/SlideMenu.tsx +++ /dev/null @@ -1,196 +0,0 @@ -import React, { useEffect } from 'react'; -import { useTranslation } from 'react-i18next'; - -interface SlideMenuProps { - isOpen: boolean; - onClose: () => void; -} - -const SlideMenu: React.FC = ({ isOpen, onClose }) => { - const { t } = useTranslation(); - - // ESC 키로 메뉴 닫기 - useEffect(() => { - const handleEscape = (event: KeyboardEvent) => { - if (event.key === 'Escape') { - onClose(); - } - }; - - if (isOpen) { - document.addEventListener('keydown', handleEscape); - // 배경 스크롤 방지 - document.body.style.overflow = 'hidden'; - } else { - document.body.style.overflow = 'unset'; - } - - return () => { - document.removeEventListener('keydown', handleEscape); - document.body.style.overflow = 'unset'; - }; - }, [isOpen, onClose]); - return ( - <> - {/* 오버레이 */} - {isOpen && ( -
- )} - - {/* 슬라이드 메뉴 */} -
- {/* 헤더 */} -
-

{t('slideMenu.title')}

- -
- - {/* 메뉴 콘텐츠 */} -
- -
-
- - ); -}; - -export default SlideMenu; \ No newline at end of file diff --git a/src/components/TabBar.tsx b/src/components/TabBar.tsx deleted file mode 100644 index aaa4f24..0000000 --- a/src/components/TabBar.tsx +++ /dev/null @@ -1,114 +0,0 @@ -import React, { useState } from 'react'; -import { Link, useRouterState } from '@tanstack/react-router'; -import { useScrollDirection } from '../hooks/useScrollDirection'; -import SlideMenu from './SlideMenu'; -import { useTranslation } from 'react-i18next'; - -const TabBar: React.FC = () => { - const router = useRouterState(); - const { translateY, isScrollingState } = useScrollDirection(); - const [isMenuOpen, setIsMenuOpen] = useState(false); - const { t } = useTranslation(); - - const isActive = (path: string) => { - return router.location.pathname === path; - }; - - const tabs = [ - { - path: '/', - label: t('menu.home'), - icon: ( - - - - ) - }, - { - path: '/about', - label: t('menu.about'), - icon: ( - - - - ) - }, - { - path: '/contact', - label: t('menu.contact'), - icon: ( - - - - ) - }, - { - path: '/test', - label: t('menu.test'), - icon: ( - - - - ) - } - ]; - - return ( - <> -
-
-
- {tabs.map((tab) => ( - -
- {tab.icon} -
- {tab.label} - - ))} - - {/* 메뉴 탭 */} - -
-
-
- - {/* 슬라이드 메뉴 */} - setIsMenuOpen(false)} /> - - ); -}; - -export default TabBar; \ No newline at end of file diff --git a/src/components/index.ts b/src/components/index.ts deleted file mode 100644 index 19b495e..0000000 --- a/src/components/index.ts +++ /dev/null @@ -1,9 +0,0 @@ -export { default as Header } from './Header'; -export { default as Footer } from './Footer'; -export { default as Hero } from './Hero'; -export { default as Features } from './Features'; -export { default as Services } from './Services'; -export { default as TabBar } from './TabBar'; -export { default as SlideMenu } from './SlideMenu'; -export { default as SearchFilterButton } from './SearchFilterButton'; -export { default as LanguageSwitcher } from './LanguageSwitcher'; \ No newline at end of file diff --git a/src/pages/Contact.tsx b/src/pages/Contact.tsx deleted file mode 100644 index 29bf6df..0000000 --- a/src/pages/Contact.tsx +++ /dev/null @@ -1,318 +0,0 @@ -import React, { useState } from 'react'; - -interface FormData { - name: string; - email: string; - phone: string; - subject: string; - message: string; -} - -interface FormErrors { - name?: string; - email?: string; - phone?: string; - subject?: string; - message?: string; -} - -const Contact: React.FC = () => { - const [formData, setFormData] = useState({ - name: '', - email: '', - phone: '', - subject: '', - message: '', - }); - - const [errors, setErrors] = useState({}); - const [isSubmitting, setIsSubmitting] = useState(false); - const [isSubmitted, setIsSubmitted] = useState(false); - - const validateForm = (): boolean => { - const newErrors: FormErrors = {}; - - if (!formData.name.trim()) { - newErrors.name = '이름을 입력해주세요.'; - } - - if (!formData.email.trim()) { - newErrors.email = '이메일을 입력해주세요.'; - } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(formData.email)) { - newErrors.email = '올바른 이메일 형식을 입력해주세요.'; - } - - if (!formData.phone.trim()) { - newErrors.phone = '전화번호를 입력해주세요.'; - } else if (!/^[0-9-+\s()]+$/.test(formData.phone)) { - newErrors.phone = '올바른 전화번호 형식을 입력해주세요.'; - } - - if (!formData.subject.trim()) { - newErrors.subject = '문의 제목을 입력해주세요.'; - } - - if (!formData.message.trim()) { - newErrors.message = '문의 내용을 입력해주세요.'; - } else if (formData.message.length < 10) { - newErrors.message = '문의 내용을 최소 10자 이상 입력해주세요.'; - } - - setErrors(newErrors); - return Object.keys(newErrors).length === 0; - }; - - const handleChange = (e: React.ChangeEvent) => { - const { name, value } = e.target; - setFormData(prev => ({ - ...prev, - [name]: value, - })); - - if (errors[name as keyof FormErrors]) { - setErrors(prev => ({ - ...prev, - [name]: undefined, - })); - } - }; - - const handleSubmit = async (e: React.FormEvent) => { - e.preventDefault(); - - if (!validateForm()) return; - - setIsSubmitting(true); - - try { - // 실제 구현에서는 API 호출 - await new Promise(resolve => setTimeout(resolve, 1000)); - - setIsSubmitted(true); - setFormData({ - name: '', - email: '', - phone: '', - subject: '', - message: '', - }); - } catch (error) { - console.error('Form submission error:', error); - } finally { - setIsSubmitting(false); - } - }; - - if (isSubmitted) { - return ( -
-
-
-
- - - -
-

- 문의가 접수되었습니다 -

-

- 빠른 시일 내에 답변 드리겠습니다. -

- -
-
-
- ); - } - - return ( -
-
-
-
-

- 문의하기 -

-

- 궁금한 사항이나 문의사항이 있으시면 언제든지 연락주세요. -

-
- -
- {/* Contact Information */} -
-

- 연락처 정보 -

-
-
-
- - - -
-
-
주소
-
서울시 강남구 테헤란로 123
-
-
-
-
- - - -
-
-
이메일
-
contact@nicepayments.com
-
-
-
-
- - - -
-
-
전화번호
-
02-1234-5678
-
-
-
-
- - - -
-
-
운영시간
-
평일 09:00 - 18:00
-
-
-
-
- - {/* Contact Form */} -
-

- 문의 양식 -

-
-
- - - {errors.name &&

{errors.name}

} -
- -
- - - {errors.email &&

{errors.email}

} -
- -
- - - {errors.phone &&

{errors.phone}

} -
- -
- - - {errors.subject &&

{errors.subject}

} -
- -
- -