"use client"

/**
 * ProductRevealCard Component
 * 
 * Reusable service card wrapper connecting to the unified <ServiceCard /> design.
 */

import React from "react"
import { ServiceCard } from "@/components/ServiceCard"

export interface ProductRevealCardProps {
  name?: string
  price?: string | number
  originalPrice?: string | number
  image?: string
  description?: string
  rating?: number
  reviewCount?: number
  bookText?: string
  detailsText?: string
  detailsHref?: string
  feature1Title?: string
  feature1Sub?: string
  feature2Title?: string
  feature2Sub?: string
  feature2Icon?: React.ReactNode
  isFeatured?: boolean
  isAr?: boolean
  onAdd?: () => void
  onDetails?: () => void
  onFavorite?: () => void
  enableAnimations?: boolean
  className?: string
}

export function ProductRevealCard({
  name = "Signature Gel Manicure",
  price = 180,
  originalPrice = 240,
  image = "https://images.unsplash.com/photo-1632345031435-8727f6897d53?w=800&h=600&fit=crop",
  description = "Precision Russian cuticle care, long-lasting diamond gel polish, and relaxing organic hand massage delivered to your home.",
  rating = 5.0,
  reviewCount = 0,
  detailsHref,
  feature2Title,
  isFeatured = false,
  isAr = false,
  onAdd,
  onFavorite,
  className,
}: ProductRevealCardProps) {
  const numPrice = typeof price === 'number' ? price : parseFloat(String(price).replace(/[^0-9.]/g, '')) || 0
  const numOrig = originalPrice ? (typeof originalPrice === 'number' ? originalPrice : parseFloat(String(originalPrice).replace(/[^0-9.]/g, '')) || 0) : undefined
  const slug = detailsHref ? detailsHref.split('/').pop() || '' : ''

  return (
    <ServiceCard
      id={0}
      slug={slug}
      name={name}
      price={numPrice}
      originalPrice={numOrig}
      image={image}
      description={description}
      rating={rating}
      reviewCount={reviewCount}
      formattedDuration={feature2Title}
      isFeatured={isFeatured}
      locale={isAr ? 'ar' : 'en'}
      onQuickBook={onAdd ? () => onAdd() : undefined}
      onToggleFavorite={onFavorite ? () => onFavorite() : undefined}
      className={className}
    />
  )
}