55 lines
2.3 KiB
TypeScript
55 lines
2.3 KiB
TypeScript
import React from 'react';
|
||
import { View, Text, ScrollView, TouchableOpacity } from 'react-native';
|
||
import { useNavigation } from '@react-navigation/native';
|
||
import { StackNavigationProp } from '@react-navigation/stack';
|
||
import { getStyles } from './helpSupportScreen.styles';
|
||
import { Header } from '@components';
|
||
import { useAppTheme } from '@theme';
|
||
import { AppStackParamList } from '../../../navigation/appStack';
|
||
|
||
type HelpSupportNavProp = StackNavigationProp<AppStackParamList, 'HelpSupportScreen'>;
|
||
|
||
const FAQS = [
|
||
{ q: 'How do I track my order?', a: 'Go to Orders tab and tap on your active order to see tracking.' },
|
||
{ q: 'What is the delivery time?', a: 'Standard delivery takes 25-30 min, Express takes 10-15 min.' },
|
||
{ q: 'How do I cancel an order?', a: 'Contact support to cancel an order before it is dispatched.' },
|
||
{ q: 'What payment methods are accepted?', a: 'UPI, Credit/Debit Card, Wallet, and Cash on Delivery.' },
|
||
];
|
||
|
||
export const HelpSupportScreen: React.FC = () => {
|
||
const { colors } = useAppTheme();
|
||
const styles = getStyles(colors);
|
||
const navigation = useNavigation<HelpSupportNavProp>();
|
||
|
||
return (
|
||
<View style={styles.container}>
|
||
<Header title="Help & Support" onBack={() => navigation.goBack()} />
|
||
<ScrollView contentContainerStyle={styles.content}>
|
||
<Text style={styles.sectionTitle}>Frequently Asked Questions</Text>
|
||
{FAQS.map((faq, index) => (
|
||
<View key={index} style={styles.faqItem}>
|
||
<Text style={styles.faqQuestion}>{faq.q}</Text>
|
||
<Text style={styles.faqAnswer}>{faq.a}</Text>
|
||
</View>
|
||
))}
|
||
|
||
<Text style={styles.sectionTitle}>Contact Support</Text>
|
||
<TouchableOpacity style={styles.supportCard} activeOpacity={0.7}>
|
||
<Text style={styles.supportIcon}>📞</Text>
|
||
<View>
|
||
<Text style={styles.supportLabel}>Call us</Text>
|
||
<Text style={styles.supportValue}>+91 1800 123 4567</Text>
|
||
</View>
|
||
</TouchableOpacity>
|
||
<TouchableOpacity style={styles.supportCard} activeOpacity={0.7}>
|
||
<Text style={styles.supportIcon}>✉️</Text>
|
||
<View>
|
||
<Text style={styles.supportLabel}>Email us</Text>
|
||
<Text style={styles.supportValue}>support@sgdelivery.com</Text>
|
||
</View>
|
||
</TouchableOpacity>
|
||
</ScrollView>
|
||
</View>
|
||
);
|
||
};
|