import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:onufitness/constants/color_constant.dart';
import 'package:onufitness/constants/text_constant.dart';
import 'package:onufitness/screens/goals/controllers/goal_controller.dart';
import 'package:onufitness/screens/goals/models/get_all_goals_response_model.dart';

Widget exploreGoalCard({
  required SingleGoalData goalDetails,
  required GoalController goalController,
  required VoidCallback onJoinPressed,
  required bool isJoinedScreen,
}) {
  return Container(
    margin: EdgeInsets.only(bottom: 16.h),
    decoration: BoxDecoration(
      color: Colors.white,
      borderRadius: BorderRadius.circular(12.r),
      boxShadow: [
        BoxShadow(
          color: lightGreyColor,
          spreadRadius: 1,
          blurRadius: 8,
          offset: Offset(0, 2),
        ),
      ],
    ),
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        // Goal Image
        Container(
          height: 160.h,
          width: double.infinity,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.vertical(top: Radius.circular(12.r)),
            color: Colors.grey[200],
          ),
          child:
              goalDetails.goalImageName != null &&
                      goalDetails.goalImageName!.isNotEmpty
                  ? ClipRRect(
                    borderRadius: BorderRadius.vertical(
                      top: Radius.circular(12.r),
                    ),
                    child: Image.network(
                      goalDetails.goalImageName!,
                      fit: BoxFit.cover,
                      loadingBuilder: (context, child, loadingProgress) {
                        if (loadingProgress == null) return child;
                        return Container(
                          color: Colors.grey[200],
                          child: Center(
                            child: CircularProgressIndicator(
                              value:
                                  loadingProgress.expectedTotalBytes != null
                                      ? loadingProgress.cumulativeBytesLoaded /
                                          loadingProgress.expectedTotalBytes!
                                      : null,
                              strokeWidth: 2,
                              color: Colors.grey[400],
                            ),
                          ),
                        );
                      },
                      errorBuilder: (context, error, stackTrace) {
                        return Container(
                          color: Colors.grey[200],
                          child: Icon(
                            Icons.fitness_center,
                            size: 48.w,
                            color: Colors.grey[400],
                          ),
                        );
                      },
                    ),
                  )
                  : Container(
                    color: Colors.grey[200],
                    child: Icon(
                      Icons.fitness_center,
                      size: 48.w,
                      color: Colors.grey[400],
                    ),
                  ),
        ),

        // Goal Info
        Padding(
          padding: EdgeInsets.all(16.w),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Expanded(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Text(
                          goalDetails.goalTitle!,
                          style: TextStyle(
                            fontSize: mediumSizeText,
                            fontWeight: FontWeight.w600,
                            color: Colors.black,
                          ),
                        ),
                        if (goalDetails.fitnessGoalTitle != null &&
                            goalDetails.fitnessGoalTitle!.isNotEmpty)
                          Padding(
                            padding: EdgeInsets.only(top: 4.h),
                            child: Text(
                              goalDetails.fitnessGoalTitle!,
                              style: TextStyle(
                                fontSize: smallSizeText,
                                color: Color(darkGreyColor),
                                fontWeight: FontWeight.w600,
                              ),
                              maxLines: 2,
                              overflow: TextOverflow.ellipsis,
                            ),
                          ),
                      ],
                    ),
                  ),
                  !isJoinedScreen
                      ? ElevatedButton(
                        onPressed: onJoinPressed,
                        style: ElevatedButton.styleFrom(
                          backgroundColor: Color(primaryColor),
                          foregroundColor: Colors.black,
                          elevation: 0,
                          padding: EdgeInsets.symmetric(
                            horizontal: 24.w,
                            vertical: 8.h,
                          ),
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(20.r),
                          ),
                        ),
                        child: Text(
                          'Add +',
                          style: TextStyle(
                            fontSize: smallSizeText,
                            fontWeight: FontWeight.w600,
                          ),
                        ),
                      )
                      : Container(),
                ],
              ),

              SizedBox(height: 8.h),

              Row(
                children: [
                  if (goalDetails.goalLevelName != null)
                    Text(
                      goalDetails.goalLevelName!,
                      style: TextStyle(
                        fontSize: regularSizeText,
                        color: primaryGreenShadeColor,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                  if (goalDetails.goalLevelName != null &&
                      goalDetails.totalParticipantCount != null)
                    Text(
                      ' • ',
                      style: TextStyle(
                        fontSize: regularSizeText,
                        color: primaryGreenShadeColor,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                  Text(
                    '${goalDetails.totalParticipantCount ?? 0} Participants',
                    style: TextStyle(
                      fontSize: regularSizeText,
                      color: primaryGreenShadeColor,
                      fontWeight: FontWeight.w600,
                    ),
                  ),
                ],
              ),

              SizedBox(height: 16.h),
            ],
          ),
        ),
      ],
    ),
  );
}