import 'package:auto_route/auto_route.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:gap/gap.dart';
import 'package:krow/core/data/enums/state_status.dart';
import 'package:krow/core/presentation/widgets/ui_kit/kw_app_bar.dart';
import 'package:krow/core/presentation/widgets/ui_kit/kw_loading_overlay.dart';
import 'package:krow/features/profile/live_photo/domain/bloc/live_photo_bloc.dart';
import 'package:krow/features/profile/live_photo/presentation/widgets/live_photo_display_card.dart';
import 'package:krow/features/profile/live_photo/presentation/widgets/photo_requirements_card.dart';

@RoutePage()
class LivePhotoScreen extends StatelessWidget implements AutoRouteWrapper {
  const LivePhotoScreen({super.key});

  @override
  Widget wrappedRoute(BuildContext context) {
    return BlocProvider<LivePhotoBloc>(
      create: (context) => LivePhotoBloc()..add(const InitLivePhotoBloc()),
      child: this,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: KwAppBar(
        titleText: 'live_photo'.tr(),
        showNotification: true,
      ),
      body: ListView(
        primary: false,
        padding: const EdgeInsets.all(16),
        children: [
          BlocBuilder<LivePhotoBloc, LivePhotoState>(
            buildWhen: (previous, current) => previous.status != current.status,
            builder: (context, state) {
              return KwLoadingOverlay(
                shouldShowLoading: state.status == StateStatus.loading,
                child: const PhotoRequirementsCard(),
              );
            },
          ),
          const Gap(24),
          BlocBuilder<LivePhotoBloc, LivePhotoState>(
            buildWhen: (previous, current) =>
                previous.photoData != current.photoData,
            builder: (context, state) {
              final photoData = state.photoData;
              return AnimatedSwitcher(
                duration: Durations.short4,
                child: photoData == null
                    ? const SizedBox(height: 56)
                    : LivePhotoDisplayCard(photoData: photoData),
              );
            },
          ),
          const Gap(90),
        ],
      ),
    );
  }
}
