import 'dart:convert';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:rasadyar_auth/presentation/widget/clear_button.dart';
import 'package:rasadyar_core/core.dart';

import 'logic.dart';

class CaptchaWidget extends GetView<CaptchaWidgetLogic> {
  const CaptchaWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Container(
          width: 135,
          height: 50,
          clipBehavior: Clip.antiAliasWithSaveLayer,
          decoration: BoxDecoration(
            color: AppColor.whiteNormalHover,
            border: Border.all(color: Colors.grey.shade300),
            borderRadius: BorderRadius.circular(8),
          ),
          child: controller.obx(
            (state) => Image.memory(
              base64Decode(state?.captchaImage ?? ''),
              fit: BoxFit.cover,
            ),
            onLoading: const Center(
              child: CupertinoActivityIndicator(color: AppColor.blueNormal),
            ),
            onError: (error) {
              return const Center(
                child: Text(
                  'خطا در بارگذاری کد امنیتی',
                  style: AppFonts.yekan13,
                ),
              );
            },
          ),
        ),
        GestureDetector(
          onTap: controller.getCaptcha,
          child: Padding(
            padding: const EdgeInsets.symmetric(horizontal: 3),
            child: Icon(CupertinoIcons.refresh, size: 20),
          ),
        ),
        const SizedBox(width: 8),
        Expanded(
          child: Form(
            key: controller.formKey,
            autovalidateMode: AutovalidateMode.disabled,
            child: ObxValue((data) {
              return RTextField(
                label: 'کد امنیتی',
                controller: data.value,
                keyboardType: TextInputType.numberWithOptions(
                  decimal: false,
                  signed: false,
                ),
                maxLines: 1,
                maxLength: 6,
                suffixIcon:
                    (data.value.text.trim().isNotEmpty ?? false)
                        ? clearButton(
                          () => controller.textController.value.clear(),
                        )
                        : null,

                onSubmitted: (data) {},
                validator: (value) {
                  if (value == null || value.isEmpty) {
                    return 'کد امنیتی را وارد کنید';
                  }
                  return null;
                },
                style: AppFonts.yekan13,
              );
            }, controller.textController),
          ),
        ),
      ],
    );
  }
}