feat: loading indicator for genre and personalized pages

This commit is contained in:
Kingkor Roy Tirtho 2023-09-16 13:08:32 +06:00
parent 5c5dbf69ec
commit ffe8d9ca6d
3 changed files with 34 additions and 31 deletions

View File

@ -1,7 +1,6 @@
import 'package:catcher/catcher.dart'; import 'package:catcher/catcher.dart';
import 'package:device_preview/device_preview.dart'; import 'package:device_preview/device_preview.dart';
import 'package:fl_query/fl_query.dart'; import 'package:fl_query/fl_query.dart';
import 'package:fl_query_devtools/fl_query_devtools.dart';
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter/services.dart'; import 'package:flutter/services.dart';

View File

@ -73,6 +73,9 @@ class GenrePage extends HookConsumerWidget {
searchController: searchController, searchController: searchController,
searchFocus: searchFocus, searchFocus: searchFocus,
), ),
if (!categoriesQuery.hasPageData)
const ShimmerCategories()
else
Expanded( Expanded(
child: ListView.builder( child: ListView.builder(
controller: scrollController, controller: scrollController,

View File

@ -6,6 +6,7 @@ import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:spotify/spotify.dart'; import 'package:spotify/spotify.dart';
import 'package:spotube/components/album/album_card.dart'; import 'package:spotube/components/album/album_card.dart';
import 'package:spotube/components/playlist/playlist_card.dart'; import 'package:spotube/components/playlist/playlist_card.dart';
import 'package:spotube/components/shared/shimmers/shimmer_categories.dart';
import 'package:spotube/components/shared/shimmers/shimmer_playbutton_card.dart'; import 'package:spotube/components/shared/shimmers/shimmer_playbutton_card.dart';
import 'package:spotube/components/shared/waypoint.dart'; import 'package:spotube/components/shared/waypoint.dart';
import 'package:spotube/extensions/context.dart'; import 'package:spotube/extensions/context.dart';
@ -107,12 +108,9 @@ class PersonalizedPage extends HookConsumerWidget {
final madeForUser = useQueries.views.get(ref, "made-for-x-hub"); final madeForUser = useQueries.views.get(ref, "made-for-x-hub");
final newReleases = useQueries.album.newReleases(ref); final newReleases = useQueries.album.newReleases(ref);
final userArtists = useQueries.artist final userArtistsQuery = useQueries.artist.followedByMeAll(ref);
.followedByMeAll(ref) final userArtists =
.data userArtistsQuery.data?.map((s) => s.id!).toList() ?? const [];
?.map((s) => s.id!)
.toList() ??
const [];
final albums = useMemoized( final albums = useMemoized(
() => newReleases.pages () => newReleases.pages
@ -128,13 +126,16 @@ class PersonalizedPage extends HookConsumerWidget {
return ListView( return ListView(
children: [ children: [
if (!featuredPlaylistsQuery.hasPageData)
const ShimmerCategories()
else
PersonalizedItemCard( PersonalizedItemCard(
playlists: playlists, playlists: playlists,
title: context.l10n.featured, title: context.l10n.featured,
hasNextPage: featuredPlaylistsQuery.hasNextPage, hasNextPage: featuredPlaylistsQuery.hasNextPage,
onFetchMore: featuredPlaylistsQuery.fetchNext, onFetchMore: featuredPlaylistsQuery.fetchNext,
), ),
if (auth != null) if (auth != null && newReleases.hasPageData && userArtistsQuery.hasData)
PersonalizedItemCard( PersonalizedItemCard(
albums: albums, albums: albums,
title: context.l10n.new_releases, title: context.l10n.new_releases,