import 'package:didvan/routes/routes.dart';
import 'package:didvan/views/home/media/widgets/featured_video_card.dart';
import 'package:didvan/views/home/media/widgets/videocast_grid_card.dart';
import 'package:didvan/views/podcasts/podcasts_state.dart';
import 'package:didvan/views/widgets/overview/podcast.dart';
import 'package:didvan/views/widgets/state_handlers/empty_result.dart';
import 'package:didvan/views/widgets/state_handlers/state_handler.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class VideoCastTabPage extends StatefulWidget {
  const VideoCastTabPage({super.key});

  @override
  State<VideoCastTabPage> createState() => _VideoCastTabPageState();
}

class _VideoCastTabPageState extends State<VideoCastTabPage> {
  @override
  void initState() {
    super.initState();
    Future.microtask(() {
      context.read<PodcastsState>().init(false);
      context.read<PodcastsState>().getStudios(page: 1);
    });
  }

  @override
  Widget build(BuildContext context) {
    final state = context.watch<PodcastsState>();

    return StateHandler<PodcastsState>(
      state: state,
      emptyState: EmptyResult(
        onNewSearch: () {},
      ),
      enableEmptyState: state.studios.isEmpty,
      placeholder: PodcastOverview.placeholder,
      builder: (context, state) {
        if (state.studios.isEmpty) {
          return const SizedBox.shrink();
        }

        return SingleChildScrollView(
          child: Column(
            children: [
              FeaturedVideoCard(
                videocast: state.studios.first,
                onTap: () {
                  Navigator.pushNamed(
                    context,
                    Routes.studioDetails,
                    arguments: {
                      'id': state.studios.first.id,
                      'type': state.studios.first.type,
                    },
                  );
                },
              ),
              
              if (state.studios.length > 1)
                Padding(
                  padding: const EdgeInsets.all(16),
                  child: GridView.builder(
                    shrinkWrap: true,
                    physics: const NeverScrollableScrollPhysics(),
                    gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: 2,
                      crossAxisSpacing: 12,
                      mainAxisSpacing: 12,
                      childAspectRatio: 0.75,
                    ),
                    itemCount: state.studios.length - 1,
                    itemBuilder: (context, index) {
                      final videocast = state.studios[index + 1];
                      return VideocastGridCard(
                        videocast: videocast,
                        onTap: () {
                          Navigator.pushNamed(
                            context,
                            Routes.studioDetails,
                            arguments: {
                              'id': videocast.id,
                              'type': videocast.type,
                            },
                          );
                        },
                      );
                    },
                  ),
                ),
            ],
          ),
        );
      },
      onRetry: () => context.read<PodcastsState>().getStudios(page: 1),
    );
  }
}