didvan-app/lib/views/home/widgets/overview/podcast.dart

import 'package:didvan/config/theme_data.dart';
import 'package:didvan/constants/app_icons.dart';
import 'package:didvan/models/enums.dart';
import 'package:didvan/models/overview_data.dart';
import 'package:didvan/models/requests/studio.dart';
import 'package:didvan/providers/media.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/foundation.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;
  final bool hasUnmarkConfirmation;
  const PodcastOverview({
    Key? key,
    required this.podcast,
    required this.onMarkChanged,
    required this.studioRequestArgs,
    this.hasUnmarkConfirmation = false,
  }) : 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),
          Consumer<MediaProvider>(
            builder: (context, state, child) => Row(
              children: [
                DurationWidget(duration: podcast.duration!),
                const Spacer(),
                if (!kIsWeb) ...[
                  if (state.appState == AppState.idle ||
                      !state.downloadQueue.contains(podcast.media))
                    DidvanIconButton(
                      gestureSize: 28,
                      color: _isDownloaded
                          ? Theme.of(context).colorScheme.primary
                          : null,
                      icon: _isDownloaded
                          ? DidvanIcons.download_solid
                          : DidvanIcons.download_regular,
                      onPressed: _isDownloaded
                          ? () {}
                          : () => state.download(
                                fileName: 'podcast-${podcast.id}.mp3',
                                isVideo: false,
                                url: podcast.media!,
                              ),
                    ),
                  if (state.appState == AppState.busy &&
                      state.downloadQueue.contains(podcast.media))
                    const SizedBox(
                      width: 18,
                      height: 18,
                      child: CircularProgressIndicator(
                        strokeWidth: 2,
                      ),
                    ),
                  const SizedBox(width: 16),
                ],
                BookmarkButton(
                  askForConfirmation: hasUnmarkConfirmation,
                  gestureSize: 32,
                  value: podcast.marked,
                  onMarkChanged: (value) => onMarkChanged(podcast.id, value),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  bool get _isDownloaded {
    return MediaProvider.downloadedItemIds.contains(podcast.id);
  }

  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),
              ],
            ),
          ],
        ),
      );
}