import 'package:flutter/material.dart';
import 'package:niogu_app/core/constants/app_color.dart';
import 'package:niogu_app/core/constants/app_font_size.dart';
import 'package:sizer/sizer.dart';

class QuantityUsage extends StatelessWidget {
  final bool hasVariant;
  final String unitName;
  final TextEditingController controller;
  final String? Function(String?)? validator;
  final bool readOnly;
  const QuantityUsage({
    super.key,
    required this.hasVariant,
    required this.unitName,
    required this.controller,
    required this.validator,
    this.readOnly = false,
  });

  @override
  Widget build(BuildContext context) {
    final bool isTablet = 100.w >= 600;
    return Container(
      margin: EdgeInsets.only(top: 1.h),
      width: double.infinity,
      child: TextFormField(
        controller: controller,
        validator: validator,
        autovalidateMode: AutovalidateMode.onUserInteraction,
        keyboardType: TextInputType.number,
        style: TextStyle(
          fontSize: isTablet ? AppFontSize.medium.sp : AppFontSize.small.sp,
          fontWeight: FontWeight.w600,
        ),
        readOnly: readOnly,
        decoration: InputDecoration(
          hintText: "Opsional, misal 10 $unitName,(Disarankan)",
          hintStyle: TextStyle(
            color: Colors.grey[400],
            fontSize: isTablet
                ? AppFontSize.medium.sp - (hasVariant ? 0 : 2)
                : AppFontSize.small.sp - (hasVariant ? 0 : 2),
            fontWeight: FontWeight.normal,
          ),
          filled: readOnly,
          fillColor: readOnly ? Colors.grey.shade100 : Colors.white,
          contentPadding: EdgeInsets.symmetric(
            horizontal: 3.w,
            vertical: 1.2.h,
          ),
          errorStyle: TextStyle(
            color: Colors.red,
            fontSize: isTablet
                ? (AppFontSize.medium - (hasVariant ? 0.5 : 2.5)).sp
                : (AppFontSize.small - (hasVariant ? 0.5 : 2.5)).sp,
          ),
          errorBorder: OutlineInputBorder(
            borderRadius: BorderRadius.circular(2.5.w),
            borderSide: const BorderSide(color: Colors.redAccent),
          ),
          border: OutlineInputBorder(
            borderRadius: BorderRadius.circular(2.5.w),
            borderSide: BorderSide(color: Colors.grey.shade300),
          ),
          enabledBorder: OutlineInputBorder(
            borderRadius: BorderRadius.circular(2.5.w),
            borderSide: BorderSide(color: Colors.grey.shade300),
          ),
          focusedBorder: OutlineInputBorder(
            borderRadius: BorderRadius.circular(2.5.w),
            borderSide: BorderSide(
              color: readOnly ? Colors.grey.shade300 : AppColor.primaryColor,
            ),
          ),
          isDense: true,
          suffixText: unitName,
          suffixStyle: TextStyle(
            color: Colors.grey.shade600,
            fontWeight: FontWeight.w600,
            fontSize: isTablet ? AppFontSize.medium.sp : AppFontSize.small.sp,
          ),
        ),
      ),
    );
  }
}
