import { BadgePercent, Crown } from "lucide-react-native";
import { Pressable, StyleSheet, Text, View } from "react-native";
import { colors } from "../theme/colors";
import { radius, spacing } from "../theme/spacing";
import type { Business, Deal } from "../types/domain";
import { getAudienceLabel } from "../utils/format";

interface OfferCardProps {
  deal: Deal;
  business?: Business;
  onPress?: () => void;
}

export function OfferCard({ deal, business, onPress }: OfferCardProps) {
  const premium = deal.audience === "premium";
  const Icon = premium ? Crown : BadgePercent;

  return (
    <Pressable
      accessibilityRole={onPress ? "button" : "summary"}
      onPress={onPress}
      style={({ pressed }) => [styles.card, pressed && onPress && styles.pressed]}
    >
      <View style={[styles.iconWrap, { backgroundColor: deal.coverColor }]}>
        <Icon color={premium ? colors.violet : colors.success} size={24} strokeWidth={2.5} />
      </View>
      <View style={styles.body}>
        <View style={styles.topLine}>
          <Text style={[styles.audience, premium && styles.premium]}>
            {getAudienceLabel(deal.audience)}
          </Text>
          <Text style={styles.validity}>{deal.validUntil}</Text>
        </View>
        <Text style={styles.title}>{deal.title}</Text>
        {business ? <Text style={styles.business}>{business.name}</Text> : null}
        <Text style={styles.conditions} numberOfLines={2}>
          {deal.conditions}
        </Text>
      </View>
    </Pressable>
  );
}

const styles = StyleSheet.create({
  card: {
    borderRadius: radius.lg,
    backgroundColor: colors.surface,
    borderWidth: 1,
    borderColor: colors.line,
    padding: spacing.md,
    flexDirection: "row",
    gap: spacing.md
  },
  pressed: {
    opacity: 0.82
  },
  iconWrap: {
    width: 52,
    height: 52,
    borderRadius: radius.md,
    alignItems: "center",
    justifyContent: "center"
  },
  body: {
    flex: 1,
    gap: 5
  },
  topLine: {
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "space-between",
    gap: spacing.sm
  },
  audience: {
    color: colors.success,
    fontSize: 11,
    fontWeight: "900"
  },
  premium: {
    color: colors.violet
  },
  validity: {
    color: colors.muted,
    fontSize: 11,
    fontWeight: "800"
  },
  title: {
    color: colors.ink,
    fontSize: 16,
    lineHeight: 20,
    fontWeight: "900"
  },
  business: {
    color: colors.primary,
    fontSize: 12,
    fontWeight: "800"
  },
  conditions: {
    color: colors.muted,
    fontSize: 12,
    lineHeight: 17,
    fontWeight: "600"
  }
});