import { View, ScrollView, Pressable } from 'react-native';
import { Text } from '@/components/ui/text';
import { Button } from '@/components/ui/button';
import { Card, CardContent, CardHeader, CardTitle, CardDescription, CardFooter } from '@/components/ui/card';
import { MOCK_PROFORMA } from '@/lib/mock-data';
import { router } from 'expo-router';

export default function ProformaScreen() {
  return (
    <ScrollView className="flex-1 bg-background" contentContainerStyle={{ padding: 16, paddingBottom: 32 }}>
      <Text className="text-muted-foreground mb-4">
        Create or select proforma requests and share with contacts via email or SMS.
      </Text>

      <Button className="mb-4 bg-primary" onPress={() => {}}>
        <Text className="text-primary-foreground font-medium">Create new proforma</Text>
      </Button>

      <Text className="text-muted-foreground mb-2 text-sm">Your proforma requests</Text>
      {MOCK_PROFORMA.map((pf) => (
        <Card key={pf.id} className="mb-3">
          <CardHeader>
            <CardTitle>{pf.title}</CardTitle>
            <CardDescription>{pf.description}</CardDescription>
            <Text className="text-muted-foreground mt-1 text-xs">Deadline: {pf.deadline} · {pf.itemCount} items</Text>
          </CardHeader>
          <CardFooter className="flex-row justify-between">
            <Text className="text-muted-foreground text-sm">Sent to {pf.sentCount} contacts</Text>
            <Button variant="outline" size="sm">
              <Text className="font-medium">Send to contacts</Text>
            </Button>
          </CardFooter>
        </Card>
      ))}
    </ScrollView>
  );
}