import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:pmd/models/card_data.dart';
import 'package:pmd/details_page/details_page.dart';
import 'package:pmd/repositories/api_interface.dart';

import '../repositories/potter_repository.dart';

part 'card.dart';

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final TextEditingController _searchController = TextEditingController();
  final ApiInterface repository = PotterRepository();
  late Future<List<CardData>?> _data;

  @override
  void initState() {
    super.initState();
    _data = repository.loadData(null);
  }

  void _showSnackBar(BuildContext context, String text) {
    WidgetsBinding.instance.addPostFrameCallback((_) {
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(
        content: Text(text),
        duration: const Duration(seconds: 2),
        backgroundColor: Colors.black54,
      ));
    });
  }

  void _navigateToDetailsPage(BuildContext context, CardData data) {
    Navigator.push(
      context,
      CupertinoPageRoute(builder: (context) => DetailsPage(data: data)),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: ListView(
        children: [
          Column(
            children: [
              Padding(
                padding: const EdgeInsets.only(right: 30, left: 30, top: 20),
                child: CupertinoSearchTextField(
                    controller: _searchController,
                    onChanged: (search) {
                      setState(() {
                        _data = repository.loadData(search);
                      });
                    }),
              ),
              FutureBuilder<List<CardData>?>(
                future: _data,
                builder: (context, snapshot) => SingleChildScrollView(
                  padding: const EdgeInsets.symmetric(
                    horizontal: 30,
                    vertical: 15,
                  ),
                  child: snapshot.hasData
                      ? Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: snapshot.data?.map((cardData) {
                                return Column(
                                  children: [
                                    const SizedBox(height: 20),
                                    _Card.fromData(
                                      cardData,
                                      (String text) =>
                                          _showSnackBar(context, text),
                                      () => _navigateToDetailsPage(
                                          context, cardData),
                                    ),
                                    const SizedBox(height: 20)
                                  ],
                                );
                              }).toList() ??
                              [])
                      : const CircularProgressIndicator(),
                ),
              ),
            ],
          )
        ],
      ),
    );
  }
}