import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:gap/gap.dart';
import 'package:krow/core/application/routing/routes.gr.dart';
import 'package:krow/core/data/enums/state_status.dart';
import 'package:krow/core/presentation/styles/theme.dart';
import 'package:krow/features/profile/wages_forms/domain/bloc/wages_form_bloc.dart';
import 'package:krow/features/profile/wages_forms/presentation/widgets/sign_notice_widget.dart';

class FormSignHolderWidget extends StatelessWidget {
  const FormSignHolderWidget({super.key, required this.signingPageTitle});

  final String signingPageTitle;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () => context.router.push(FormSignRoute(title: signingPageTitle)),
      child: BlocBuilder<WagesFormBloc, WagesFormState>(
        buildWhen: (previous, current) =>
            previous.signImageData != current.signImageData ||
            current.status == StateStatus.error,
        builder: (context, state) {
          final signImage = state.signImageData;
          final shouldShowError =
              state.status == StateStatus.error && signImage == null;

          return Container(
            decoration: BoxDecoration(
              color: AppColors.grayPrimaryFrame,
              borderRadius: BorderRadius.circular(12),
              border: shouldShowError
                  ? Border.all(color: AppColors.statusError)
                  : null,
            ),
            height: 106,
            padding: const EdgeInsets.all(12),
            child: signImage == null
                ? const SignNoticeWidget()
                : Column(
                    children: [
                      Expanded(
                        child: Align(
                          alignment: AlignmentDirectional.centerStart,
                          child: Image.memory(signImage),
                        ),
                      ),
                      const Gap(6),
                      const Divider(
                        height: 1,
                        color: AppColors.grayTintStroke,
                      ),
                    ],
                  ),
          );
        },
      ),
    );
  }
}
