44 lines
1.4 KiB
TypeScript

import React, { useState } from 'react';
import { View, Text } from 'react-native';
import { useNavigation } from '@react-navigation/native';
import { StackNavigationProp } from '@react-navigation/stack';
import { getStyles } from './writeReviewScreen.styles';
import { Header, RatingStars, PrimaryButton } from '@components';
import { useAppTheme } from '@theme';
import { AppStackParamList } from '../../../navigation/appStack';
type WriteReviewNavProp = StackNavigationProp<
AppStackParamList,
'WriteReviewScreen'
>;
export const WriteReviewScreen: React.FC = () => {
const { colors } = useAppTheme();
const styles = getStyles(colors);
const navigation = useNavigation<WriteReviewNavProp>();
const [rating, setRating] = useState(0);
return (
<View style={styles.container}>
<Header
title="Order Delivered"
onBack={() => navigation.navigate('MainTabs')}
/>
<View style={styles.content}>
<Text style={styles.icon}>🎉</Text>
<Text style={styles.title}>Your order has been delivered!</Text>
<Text style={styles.subtitle}>How was your experience?</Text>
<RatingStars rating={rating} onRate={setRating} size={40} />
<PrimaryButton
title="Rate & Tip"
onPress={() => navigation.navigate('MainTabs')}
disabled={rating === 0}
style={{ marginTop: 32 }}
/>
</View>
</View>
);
};