package com.craigvg.lichun_android.ui.screens.activities.components

import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Star
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.unit.dp
import com.craigvg.lichun_android.domain.models.Activity
import com.craigvg.lichun_android.ui.navigation.activityIconSharedKey
import com.craigvg.lichun_android.ui.navigation.sharedElementKey
import com.craigvg.lichun_android.ui.theme.AppColors
import com.craigvg.lichun_android.ui.theme.AppSpacing
import com.craigvg.lichun_android.ui.theme.AppTypography

/**
 * Activity action card with cost/reward display
 * Ported from iOS ActivityButton.swift
 */
@Composable
fun ActivityButton(
    activity: Activity,
    onClick: () -> Unit = {}
) {
    Card(
        modifier = Modifier
            .fillMaxWidth()
            .clickable(onClick = onClick),
        shape = RoundedCornerShape(AppSpacing.cornerRadius),
        colors = CardDefaults.cardColors(containerColor = AppColors.surfaceElevated)
    ) {
        Row(
            modifier = Modifier
                .fillMaxWidth()
                .padding(AppSpacing.md),
            verticalAlignment = Alignment.CenterVertically
        ) {
            Box(
                modifier = Modifier
                    .size(48.dp)
                    .sharedElementKey(activityIconSharedKey(activity.id))
                    .clip(RoundedCornerShape(AppSpacing.smallCornerRadius))
                    .background(AppColors.accent.copy(alpha = 0.2f)),
                contentAlignment = Alignment.Center
            ) {
                Icon(
                    imageVector = Icons.Default.Star,
                    contentDescription = null,
                    tint = AppColors.accent
                )
            }
            Spacer(modifier = Modifier.width(AppSpacing.sm))
            Column(modifier = Modifier.weight(1f)) {
                Text(
                    text = activity.title,
                    style = AppTypography.bodyBold,
                    color = AppColors.primaryText
                )
                Text(
                    text = activity.description,
                    style = AppTypography.caption,
                    color = AppColors.secondaryText
                )
            }
            Text(
                text = "Active",
                style = AppTypography.captionBold,
                color = AppColors.success
            )
        }
    }
}