import React from 'react';
import {
  View,
  Text,
  TouchableOpacity,
  KeyboardAvoidingView,
  Platform,
  ScrollView,
} from 'react-native';
import { useNavigation } from '@react-navigation/native';
import { StackNavigationProp } from '@react-navigation/stack';
import { getStyles } from './setLocationScreen.styles';
import { PrimaryButton } from '@components';
import { useAppTheme } from '@theme';
import { AuthStackParamList } from '../../../navigation/authStack';

type NavProp = StackNavigationProp<AuthStackParamList, 'SetLocationScreen'>;

export const SetLocationScreen: React.FC = () => {
  const { colors } = useAppTheme();
  const styles = getStyles(colors);
  const navigation = useNavigation<NavProp>();

  return (
    <KeyboardAvoidingView
      style={styles.container}
      behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
    >
      <ScrollView contentContainerStyle={styles.scrollContainer}>
        <View style={styles.mapPlaceholder}>
          <Text style={styles.mapIcon}>🗺️</Text>
          <Text style={styles.mapText}>Map View</Text>
          <Text style={styles.mapSubtext}>
            (react-native-maps integration)
          </Text>
        </View>

        <View style={styles.card}>
          <Text style={styles.cardTitle}>Delivery Location</Text>
          <Text style={styles.cardAddress}>
            Koramangala 4th Block, Bengaluru, 560034
          </Text>
          <TouchableOpacity style={styles.changeLink} activeOpacity={0.7}>
            <Text style={styles.changeText}>Change</Text>
          </TouchableOpacity>
        </View>

        <PrimaryButton
          title="Use this location"
          onPress={() => navigation.navigate('CompleteProfileScreen')}
          style={{ marginHorizontal: 24 }}
        />

        <TouchableOpacity
          style={styles.manualButton}
          onPress={() => navigation.navigate('CompleteProfileScreen')}
          activeOpacity={0.7}
        >
          <Text style={styles.manualButtonText}>Enter address manually</Text>
        </TouchableOpacity>
      </ScrollView>
    </KeyboardAvoidingView>
  );
};