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/services/media/media.dart';
import 'package:didvan/utils/date_time.dart';
import 'package:didvan/views/home/studio/studio_details/studio_details_state.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/icon_button.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';
import 'package:provider/provider.dart';

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

  @override
  Widget build(BuildContext context) {
    return DidvanCard(
      onTap: () {
        context
            .read<StudioDetailsState>()
            .getStudioDetails(podcast.id, args: studioRequestArgs);
      },
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              SkeletonImage(
                imageUrl: podcast.image,
                width: 64,
                height: 64,
              ),
              const SizedBox(width: 8),
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    DidvanText(
                      podcast.title,
                      style: Theme.of(context).textTheme.bodyText1,
                    ),
                    const SizedBox(height: 4),
                    DidvanText(
                      DateTimeUtils.momentGenerator(podcast.createdAt),
                      style: Theme.of(context).textTheme.overline,
                      color: Theme.of(context).colorScheme.caption,
                    ),
                  ],
                ),
              ),
            ],
          ),
          const SizedBox(height: 8),
          DidvanText(
            podcast.description,
            maxLines: 2,
            overflow: TextOverflow.ellipsis,
          ),
          const DidvanDivider(verticalPadding: 8),
          Row(
            children: [
              DurationWidget(duration: podcast.duration!),
              const Spacer(),
              DidvanIconButton(
                gestureSize: 28,
                icon: DidvanIcons.download_regular,
                onPressed: () {},
              ),
              const SizedBox(width: 16),
              BookmarkButton(
                gestureSize: 24,
                value: podcast.marked,
                onMarkChanged: (value) => onMarkChanged(podcast.id, value),
              ),
            ],
          ),
        ],
      ),
    );
  }

  static Widget get placeholder => DidvanCard(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                const ShimmerPlaceholder(height: 64, width: 64),
                const SizedBox(width: 8),
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: const [
                    ShimmerPlaceholder(height: 18, width: 200),
                    SizedBox(height: 8),
                    ShimmerPlaceholder(height: 18, width: 100),
                  ],
                ),
              ],
            ),
            const SizedBox(height: 16),
            const ShimmerPlaceholder(
              height: 16,
              width: double.infinity,
            ),
            const SizedBox(height: 8),
            const ShimmerPlaceholder(
              height: 16,
              width: 200,
            ),
            const SizedBox(height: 4),
            const DidvanDivider(verticalPadding: 8),
            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),
              ],
            ),
          ],
        ),
      );
}