import 'package:didvan/models/news_overview.dart';
import 'package:didvan/pages/home/news/news_state.dart';
import 'package:didvan/routes/routes.dart';
import 'package:didvan/widgets/bookmark_button.dart';
import 'package:didvan/widgets/didvan/card.dart';
import 'package:didvan/widgets/didvan/divider.dart';
import 'package:didvan/widgets/didvan/text.dart';
import 'package:didvan/widgets/skeleton_image.dart';
import 'package:flutter/material.dart';
import 'package:persian_number_utility/persian_number_utility.dart';
import 'package:provider/provider.dart';

class NewsItem extends StatelessWidget {
  final NewsOverview news;
  const NewsItem({Key? key, required this.news}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final state = context.read<NewsState>();
    return DidvanCard(
      onTap: () => Navigator.of(context).pushNamed(
        Routes.newsDetails,
        arguments: {
          'state': state,
          'id': news.id,
        },
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              SkeletonImage(
                imageUrl: news.image,
                width: 64,
                height: 64,
              ),
              const SizedBox(width: 8),
              Expanded(
                child: SizedBox(
                  height: 64,
                  child: DidvanText(
                    news.title,
                    style: Theme.of(context).textTheme.bodyText1,
                  ),
                ),
              ),
            ],
          ),
          const SizedBox(height: 8),
          DidvanText(
            news.description,
            maxLines: 3,
          ),
          const DidvanDivider(verticalPadding: 8),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              DidvanText(
                '${news.reference} | ${DateTime.parse(news.createdAt).toPersianDateStr()}',
                style: Theme.of(context).textTheme.overline,
              ),
              BookmarkButton(
                value: news.marked,
                onMark: () => state.markNews(news.id),
                onUnmark: () => state.unMarkNews(news.id),
              ),
            ],
          ),
        ],
      ),
    );
  }
}