Skip to content

Commit

Permalink
feat: compact genre view in home page
Browse files Browse the repository at this point in the history
  • Loading branch information
KRTirtho committed Dec 8, 2023
1 parent c592cff commit 82ed5e9
Show file tree
Hide file tree
Showing 15 changed files with 840 additions and 337 deletions.
6 changes: 6 additions & 0 deletions lib/collections/fake.dart
Original file line number Diff line number Diff line change
Expand Up @@ -158,4 +158,10 @@ abstract class FakeData {
..type = "type"
..description = "A very good playlist description"
..uri = "uri";

static final Category category = Category()
..href = "text"
..icons = [image]
..id = "1"
..name = "category";
}
232 changes: 232 additions & 0 deletions lib/collections/gradients.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,232 @@
import 'package:flutter/material.dart';

const gradients = [
LinearGradient(colors: [
Color.fromRGBO(123, 102, 255, 1),
Color.fromRGBO(95, 189, 255, 1),
Color.fromRGBO(150, 239, 255, 1),
Color.fromRGBO(197, 255, 248, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(245, 204, 160, 1),
Color.fromRGBO(228, 143, 69, 1),
Color.fromRGBO(153, 77, 28, 1),
Color.fromRGBO(107, 36, 12, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(243, 243, 243, 1),
Color.fromRGBO(197, 232, 152, 1),
Color.fromRGBO(41, 173, 178, 1),
Color.fromRGBO(7, 102, 173, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(240, 89, 65, 1),
Color.fromRGBO(190, 49, 68, 1),
Color.fromRGBO(135, 35, 65, 1),
Color.fromRGBO(34, 9, 44, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(119, 107, 93, 1),
Color.fromRGBO(176, 166, 149, 1),
Color.fromRGBO(235, 227, 213, 1),
Color.fromRGBO(243, 238, 234, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(208, 162, 247, 1),
Color.fromRGBO(220, 191, 255, 1),
Color.fromRGBO(229, 212, 255, 1),
Color.fromRGBO(241, 234, 255, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(221, 242, 253, 1),
Color.fromRGBO(155, 190, 200, 1),
Color.fromRGBO(66, 125, 157, 1),
Color.fromRGBO(22, 72, 99, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(119, 67, 219, 1),
Color.fromRGBO(195, 172, 208, 1),
Color.fromRGBO(247, 239, 229, 1),
Color.fromRGBO(255, 251, 245, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(194, 217, 255, 1),
Color.fromRGBO(142, 143, 250, 1),
Color.fromRGBO(119, 82, 254, 1),
Color.fromRGBO(25, 4, 130, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(104, 126, 255, 1),
Color.fromRGBO(128, 179, 255, 1),
Color.fromRGBO(152, 228, 255, 1),
Color.fromRGBO(182, 255, 250, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(176, 87, 141, 1),
Color.fromRGBO(217, 136, 185, 1),
Color.fromRGBO(250, 203, 234, 1),
Color.fromRGBO(255, 228, 214, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(190, 255, 247, 1),
Color.fromRGBO(166, 246, 255, 1),
Color.fromRGBO(158, 221, 255, 1),
Color.fromRGBO(100, 153, 233, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(245, 252, 205, 1),
Color.fromRGBO(120, 214, 198, 1),
Color.fromRGBO(65, 145, 151, 1),
Color.fromRGBO(18, 72, 107, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(229, 207, 247, 1),
Color.fromRGBO(157, 118, 193, 1),
Color.fromRGBO(113, 58, 190, 1),
Color.fromRGBO(91, 8, 136, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(249, 222, 201, 1),
Color.fromRGBO(247, 140, 162, 1),
Color.fromRGBO(216, 0, 50, 1),
Color.fromRGBO(61, 12, 17, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(242, 247, 161, 1),
Color.fromRGBO(53, 162, 159, 1),
Color.fromRGBO(8, 131, 149, 1),
Color.fromRGBO(7, 25, 82, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(243, 159, 90, 1),
Color.fromRGBO(174, 68, 90, 1),
Color.fromRGBO(102, 37, 73, 1),
Color.fromRGBO(69, 25, 82, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(255, 200, 200, 1),
Color.fromRGBO(255, 155, 130, 1),
Color.fromRGBO(255, 63, 164, 1),
Color.fromRGBO(87, 55, 93, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(238, 238, 238, 1),
Color.fromRGBO(100, 204, 197, 1),
Color.fromRGBO(23, 107, 135, 1),
Color.fromRGBO(5, 59, 80, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(198, 61, 47, 1),
Color.fromRGBO(226, 94, 62, 1),
Color.fromRGBO(255, 155, 80, 1),
Color.fromRGBO(255, 187, 92, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(236, 83, 176, 1),
Color.fromRGBO(157, 68, 192, 1),
Color.fromRGBO(77, 45, 183, 1),
Color.fromRGBO(14, 33, 160, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(242, 236, 190, 1),
Color.fromRGBO(226, 199, 153, 1),
Color.fromRGBO(192, 130, 97, 1),
Color.fromRGBO(154, 59, 59, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(255, 253, 140, 1),
Color.fromRGBO(151, 255, 244, 1),
Color.fromRGBO(112, 145, 245, 1),
Color.fromRGBO(121, 63, 223, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(67, 83, 52, 1),
Color.fromRGBO(158, 179, 132, 1),
Color.fromRGBO(206, 222, 189, 1),
Color.fromRGBO(250, 241, 228, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(250, 240, 230, 1),
Color.fromRGBO(185, 180, 199, 1),
Color.fromRGBO(92, 84, 112, 1),
Color.fromRGBO(53, 47, 68, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(255, 186, 134, 1),
Color.fromRGBO(246, 99, 92, 1),
Color.fromRGBO(194, 51, 115, 1),
Color.fromRGBO(121, 21, 91, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(213, 255, 208, 1),
Color.fromRGBO(64, 248, 255, 1),
Color.fromRGBO(39, 158, 255, 1),
Color.fromRGBO(12, 53, 106, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(131, 96, 150, 1),
Color.fromRGBO(237, 123, 123, 1),
Color.fromRGBO(240, 184, 110, 1),
Color.fromRGBO(235, 231, 108, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(63, 29, 56, 1),
Color.fromRGBO(77, 60, 119, 1),
Color.fromRGBO(162, 103, 138, 1),
Color.fromRGBO(225, 152, 152, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(254, 123, 229, 1),
Color.fromRGBO(151, 78, 195, 1),
Color.fromRGBO(80, 64, 153, 1),
Color.fromRGBO(49, 56, 102, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(248, 222, 34, 1),
Color.fromRGBO(249, 76, 16, 1),
Color.fromRGBO(199, 0, 57, 1),
Color.fromRGBO(144, 12, 63, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(101, 69, 31, 1),
Color.fromRGBO(118, 88, 39, 1),
Color.fromRGBO(200, 174, 125, 1),
Color.fromRGBO(234, 198, 150, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(255, 246, 224, 1),
Color.fromRGBO(216, 217, 218, 1),
Color.fromRGBO(97, 103, 122, 1),
Color.fromRGBO(39, 40, 41, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(145, 109, 179, 1),
Color.fromRGBO(228, 133, 134, 1),
Color.fromRGBO(252, 186, 173, 1),
Color.fromRGBO(253, 229, 236, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(124, 115, 192, 1),
Color.fromRGBO(148, 173, 215, 1),
Color.fromRGBO(172, 250, 223, 1),
Color.fromRGBO(232, 255, 206, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(174, 216, 204, 1),
Color.fromRGBO(205, 102, 136, 1),
Color.fromRGBO(122, 49, 111, 1),
Color.fromRGBO(70, 25, 89, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(237, 228, 255, 1),
Color.fromRGBO(215, 187, 245, 1),
Color.fromRGBO(160, 118, 249, 1),
Color.fromRGBO(101, 40, 247, 1)
]),
LinearGradient(colors: [
Color.fromRGBO(255, 236, 175, 1),
Color.fromRGBO(255, 176, 127, 1),
Color.fromRGBO(255, 82, 162, 1),
Color.fromRGBO(243, 21, 89, 1)
]),
];
19 changes: 18 additions & 1 deletion lib/collections/routes.dart
Original file line number Diff line number Diff line change
@@ -1,9 +1,11 @@
import 'package:catcher_2/catcher_2.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/foundation.dart' hide Category;
import 'package:flutter/widgets.dart';
import 'package:go_router/go_router.dart';
import 'package:spotify/spotify.dart' hide Search;
import 'package:spotube/pages/album/album.dart';
import 'package:spotube/pages/home/genres/genre_playlists.dart';
import 'package:spotube/pages/home/genres/genres.dart';
import 'package:spotube/pages/home/home.dart';
import 'package:spotube/pages/lastfm_login/lastfm_login.dart';
import 'package:spotube/pages/library/playlist_generate/playlist_generate.dart';
Expand Down Expand Up @@ -38,6 +40,21 @@ final router = GoRouter(
GoRoute(
path: "/",
pageBuilder: (context, state) => const SpotubePage(child: HomePage()),
routes: [
GoRoute(
path: "genres",
pageBuilder: (context, state) =>
const SpotubePage(child: GenrePage()),
),
GoRoute(
path: "genre/:categoryId",
pageBuilder: (context, state) => SpotubePage(
child: GenrePlaylistsPage(
category: state.extra as Category,
),
),
),
],
),
GoRoute(
path: "/search",
Expand Down
51 changes: 0 additions & 51 deletions lib/components/genre/category_card.dart

This file was deleted.

36 changes: 36 additions & 0 deletions lib/components/home/sections/featured.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import 'package:flutter/material.dart' hide Page;
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:skeletonizer/skeletonizer.dart';
import 'package:spotify/spotify.dart';
import 'package:spotube/components/shared/horizontal_playbutton_card_view/horizontal_playbutton_card_view.dart';
import 'package:spotube/extensions/context.dart';
import 'package:spotube/services/queries/queries.dart';

class HomeFeaturedSection extends HookConsumerWidget {
const HomeFeaturedSection({Key? key}) : super(key: key);

@override
Widget build(BuildContext context, ref) {
final featuredPlaylistsQuery = useQueries.playlist.featured(ref);
final playlists = useMemoized(
() => featuredPlaylistsQuery.pages
.whereType<Page<PlaylistSimple>>()
.expand((page) => page.items ?? const <PlaylistSimple>[]),
[featuredPlaylistsQuery.pages],
);
final isLoadingFeaturedPlaylists = !featuredPlaylistsQuery.hasPageData &&
!featuredPlaylistsQuery.isLoadingNextPage;

return Skeletonizer(
enabled: isLoadingFeaturedPlaylists,
child: HorizontalPlaybuttonCardView<PlaylistSimple>(
items: playlists.toList(),
title: Text(context.l10n.featured),
isLoadingNextPage: featuredPlaylistsQuery.isLoadingNextPage,
hasNextPage: featuredPlaylistsQuery.hasNextPage,
onFetchMore: featuredPlaylistsQuery.fetchNext,
),
);
}
}
Loading

0 comments on commit 82ed5e9

Please sign in to comment.