import 'package:didvan/config/theme_data.dart';
import 'package:didvan/constants/app_icons.dart';
import 'package:didvan/models/overview_data.dart';
import 'package:didvan/models/requests/studio.dart';
import 'package:didvan/routes/routes.dart';
import 'package:didvan/utils/date_time.dart';
import 'package:didvan/views/home/widgets/bookmark_button.dart';
import 'package:didvan/views/home/widgets/duration_widget.dart';
import 'package:didvan/views/widgets/didvan/card.dart';
import 'package:didvan/views/widgets/didvan/divider.dart';
import 'package:didvan/views/widgets/didvan/text.dart';
import 'package:didvan/views/widgets/shimmer_placeholder.dart';
import 'package:didvan/views/widgets/skeleton_image.dart';
import 'package:flutter/material.dart';

class VideoOverview extends StatelessWidget {
  final OverviewData video;
  final void Function(int id, bool value) onMarkChanged;
  final bool hasUnmarkConfirmation;
  final StudioRequestArgs? studioRequestArgs;
  const VideoOverview({
    Key? key,
    required this.video,
    required this.onMarkChanged,
    required this.hasUnmarkConfirmation,
    this.studioRequestArgs,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return DidvanCard(
      onTap: () => Navigator.of(context).pushNamed(
        Routes.studioDetails,
        arguments: {
          'onMarkChanged': onMarkChanged,
          'id': video.id,
          'args': studioRequestArgs,
          'hasUnmarkConfirmation': hasUnmarkConfirmation,
          'isVideo': true,
        },
      ),
      child: Row(
        children: [
          Stack(
            children: [
              SkeletonImage(
                imageUrl: video.image,
                height: 108,
                width: 108,
              ),
              Positioned.fill(
                child: Center(
                  child: Container(
                    height: 28,
                    width: 28,
                    decoration: BoxDecoration(
                      shape: BoxShape.circle,
                      color: Theme.of(context)
                          .colorScheme
                          .secondary
                          .withOpacity(0.7),
                    ),
                    child: Icon(
                      DidvanIcons.play_solid,
                      color: Theme.of(context).colorScheme.white,
                    ),
                  ),
                ),
              ),
            ],
          ),
          const SizedBox(width: 8),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                DidvanText(
                  video.title,
                  style: Theme.of(context).textTheme.bodyText1,
                ),
                const SizedBox(height: 4),
                Row(
                  children: [
                    const Icon(
                      DidvanIcons.calendar_day_regular,
                      size: 16,
                    ),
                    const SizedBox(width: 4),
                    DidvanText(
                      DateTimeUtils.momentGenerator(video.createdAt),
                      style: Theme.of(context).textTheme.overline,
                      color: Theme.of(context).colorScheme.caption,
                    ),
                  ],
                ),
                const DidvanDivider(verticalPadding: 8),
                Row(
                  children: [
                    DurationWidget(duration: video.duration!),
                    const Spacer(),
                    // DidvanIconButton(
                    //   gestureSize: 28,
                    //   icon: DidvanIcons.download_regular,
                    //   onPressed: () =>
                    //       context.read<StudioState>().download(video.media!),
                    // ),
                    // const SizedBox(width: 16),
                    BookmarkButton(
                      gestureSize: 24,
                      value: video.marked,
                      onMarkChanged: (value) => onMarkChanged(video.id, value),
                      askForConfirmation: hasUnmarkConfirmation,
                    ),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  static Widget get placeHolder => DidvanCard(
        child: Row(
          children: [
            const ShimmerPlaceholder(height: 108, width: 108),
            const SizedBox(width: 8),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  const ShimmerPlaceholder(height: 20),
                  const SizedBox(height: 8),
                  const ShimmerPlaceholder(width: 100, height: 16),
                  const DidvanDivider(verticalPadding: 10),
                  Row(
                    children: [
                      ShimmerPlaceholder(
                        height: 36,
                        width: 92,
                        borderRadius: BorderRadius.circular(5),
                      ),
                      const Spacer(),
                      const ShimmerPlaceholder(width: 24, height: 24),
                      const SizedBox(width: 16),
                      const ShimmerPlaceholder(width: 24, height: 24),
                    ],
                  ),
                ],
              ),
            ),
          ],
        ),
      );
}