import 'package:app_hit_a_wod/src/models/array_response.model.dart';
import 'package:app_hit_a_wod/src/models/new.model.dart';
import 'package:app_hit_a_wod/src/models/subscription_selection.model.dart';
import 'package:app_hit_a_wod/src/providers/api.provider.dart';
import 'package:app_hit_a_wod/src/providers/user-subscriptions.provider.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_neumorphic/flutter_neumorphic.dart';
import 'package:intl/intl.dart';
import 'package:provider/provider.dart';

import '../../styles.dart';

class NewsPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final us_provider = Provider.of<UserSubscriptionsProvider>(context);
    final _api = Provider.of<ApiProvider>(context);

    return neuScaffoldDetail(
      context: context,
      title: Text("Todas las noticias del box", style: Theme.of(context).textTheme.subhead.copyWith(fontWeight: FontWeight.w500, fontSize: 18)),
      action: Container(),
      body: Container(
        padding: EdgeInsets.all(20),
        child: StreamBuilder(
          stream: us_provider.activeStream,
          builder: (context, AsyncSnapshot<SubscriptionSelection> snapshot) {
            if(snapshot.hasData) {
              final SubscriptionSelection ss = snapshot.data;
              return FutureBuilder(
                future: _api.getBoxNews(ss.box.id),
                builder: (context, AsyncSnapshot<ArrayResponse<New>> data) {
                  if(data.hasData) {
                    final List<New> news = data.data.data as List<New>;
                    return ListView.builder(
                      itemCount: news.length,
                      shrinkWrap: true,
                      itemBuilder: (context, index) {
                        New n = news[index];
                        return Column(children: <Widget>[
                          miniNew(context, n, ss),
                          SizedBox(height: 20)
                        ]);
                      }
                    );
                  }
                  else return _skeleton();
                }
              );
            }
            else return _skeleton();
          }
        )
      )
    );
  }

  _skeleton() {
    final double height = 100;
    return SingleChildScrollView(
      child: Column(children: <Widget>[
        neuSkeletonCard(height, double.infinity),
        SizedBox(height: 20),
        neuSkeletonCard(height, double.infinity),
        SizedBox(height: 20),
        neuSkeletonCard(height, double.infinity),
        SizedBox(height: 20),
        neuSkeletonCard(height, double.infinity),
        SizedBox(height: 20),
        neuSkeletonCard(height, double.infinity),
        SizedBox(height: 20),
        neuSkeletonCard(height, double.infinity)
      ]),
    );
  }

  Widget miniNew(BuildContext context, New n, SubscriptionSelection ss) => neuButton(NeumorphicButton(
    padding: EdgeInsets.all(20),
    style: neuButtonStyle(),
    boxShape: NeumorphicBoxShape.roundRect(BorderRadius.circular(8)),
    onClick: () { Navigator.pushNamed(context, 'news-detail', arguments: {"new": n, "ss": ss}); },
    child: Row(mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[
      Column(mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[
        ClipRRect(borderRadius: BorderRadius.circular(8), child: CachedNetworkImage(imageUrl: ss.company.logo_url, placeholder: (_, __) => neuSkeletonCard(55, 55), width: 55, height: 55, fit: BoxFit.cover,)),
        SizedBox(height: 10),
        Text(DateFormat('dd/MM/yy\nHH:mm').format(n.created_at), style: Theme.of(context).textTheme.body1.copyWith(fontStyle: FontStyle.italic, fontSize: 14), textAlign: TextAlign.center,)
      ]),
      SizedBox(width: 20),
      Expanded(child: Column(mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: <Widget>[
        Text(n.title, style: Theme.of(context).textTheme.body1.copyWith(fontWeight: FontWeight.w500), overflow: TextOverflow.clip,),
        SizedBox(height: 10),
        Text(n.description.length > 150 ? n.description.substring(0, 150) + '...' : n.description, style: Theme.of(context).textTheme.body1, overflow: TextOverflow.clip,),
      ]))
    ])
  ), borderRadius: BorderRadius.all(Radius.circular(8)), width: double.infinity);
}