refactor: place search in mobile navbar and settings in home appbar

This commit is contained in:
Kingkor Roy Tirtho 2024-05-09 22:18:25 +06:00
parent dcb4c0a018
commit 4d5beb19fe
14 changed files with 56 additions and 51 deletions

View File

@ -5,7 +5,6 @@ import 'package:spotube/pages/home/home.dart';
import 'package:spotube/pages/library/library.dart';
import 'package:spotube/pages/lyrics/lyrics.dart';
import 'package:spotube/pages/search/search.dart';
import 'package:spotube/pages/settings/settings.dart';
import 'package:spotube/pages/stats/stats.dart';
class SideBarTiles {
@ -62,6 +61,12 @@ List<SideBarTiles> getNavbarTileList(AppLocalizations l10n) => [
icon: SpotubeIcons.home,
title: l10n.browse,
),
SideBarTiles(
id: "search",
name: SearchPage.name,
icon: SpotubeIcons.search,
title: l10n.search,
),
SideBarTiles(
id: "library",
name: LibraryPage.name,
@ -74,10 +79,4 @@ List<SideBarTiles> getNavbarTileList(AppLocalizations l10n) => [
icon: SpotubeIcons.chart,
title: l10n.stats,
),
SideBarTiles(
id: "settings",
name: SettingsPage.name,
icon: SpotubeIcons.settings,
title: l10n.settings,
)
];

View File

@ -303,7 +303,7 @@ class SidebarFooter extends HookConsumerWidget {
IconButton(
icon: const Icon(SpotubeIcons.settings),
onPressed: () {
ServiceUtils.navigateNamed(context, SettingsPage.name);
ServiceUtils.pushNamed(context, SettingsPage.name);
},
),
],

View File

@ -37,14 +37,20 @@ class SpotubeNavigationBar extends HookConsumerWidget {
theme.colorScheme.primary.withOpacity(0.2),
);
final navbarTileList =
useMemoized(() => getNavbarTileList(context.l10n), [context.l10n]);
final navbarTileList = useMemoized(
() => getNavbarTileList(context.l10n),
[context.l10n],
);
final panelHeight = ref.watch(navigationPanelHeight);
final selectedIndex = navbarTileList.indexWhere(
(e) => routerState.namedLocation(e.name) == routerState.matchedLocation,
);
final selectedIndex = useMemoized(() {
final index = navbarTileList.indexWhere(
(e) => routerState.namedLocation(e.name) == routerState.matchedLocation,
);
return index == -1 ? 0 : index;
}, [navbarTileList, routerState.matchedLocation]);
if (layoutMode == LayoutMode.extended ||
(mediaQuery.mdAndUp && layoutMode == LayoutMode.adaptive) ||

View File

@ -44,7 +44,7 @@ class StatsPageSummarySection extends HookConsumerWidget {
SummaryCard.unformatted(
title: usdFormatter.format(summary.fees.toDouble()),
unit: "",
description: 'Worth of streams',
description: 'Owed to artists\nthis month',
color: Colors.green,
),
SummaryCard(

View File

@ -30,6 +30,8 @@ class SummaryCard extends StatelessWidget {
Widget build(BuildContext context) {
final ThemeData(:textTheme, :brightness) = Theme.of(context);
final descriptionNewLines = description.split("").where((s) => s == "\n");
return Card(
color: brightness == Brightness.dark ? color.shade100 : color.shade50,
child: Padding(
@ -61,7 +63,9 @@ class SummaryCard extends StatelessWidget {
const Gap(5),
AutoSizeText(
description,
maxLines: 1,
maxLines: description.contains("\n")
? descriptionNewLines.length + 1
: 1,
minFontSize: 9,
style: textTheme.labelMedium!.copyWith(
color: color.shade900,

View File

@ -12,14 +12,9 @@ import 'package:spotube/components/home/sections/genres.dart';
import 'package:spotube/components/home/sections/made_for_user.dart';
import 'package:spotube/components/home/sections/new_releases.dart';
import 'package:spotube/components/home/sections/recent.dart';
import 'package:spotube/components/shared/image/universal_image.dart';
import 'package:spotube/components/shared/page_window_title_bar.dart';
import 'package:spotube/extensions/constrains.dart';
import 'package:spotube/extensions/image.dart';
import 'package:spotube/pages/profile/profile.dart';
import 'package:spotube/pages/search/search.dart';
import 'package:spotube/provider/authentication_provider.dart';
import 'package:spotube/provider/spotify/spotify.dart';
import 'package:spotube/pages/settings/settings.dart';
import 'package:spotube/utils/platform.dart';
import 'package:spotube/utils/service_utils.dart';
@ -39,43 +34,17 @@ class HomePage extends HookConsumerWidget {
body: CustomScrollView(
controller: controller,
slivers: [
if (mediaQuery.mdAndDown)
if (mediaQuery.smAndDown)
SliverAppBar(
floating: true,
title: Assets.spotubeLogoPng.image(height: 45),
actions: [
const ConnectDeviceButton(),
const Gap(10),
Consumer(builder: (context, ref, _) {
final auth = ref.watch(authenticationProvider);
final me = ref.watch(meProvider);
final meData = me.asData?.value;
if (auth == null) {
return const SizedBox();
}
return IconButton(
icon: CircleAvatar(
backgroundImage: UniversalImage.imageProvider(
(meData?.images).asUrlString(
placeholder: ImagePlaceholder.artist,
),
),
),
style: IconButton.styleFrom(
padding: EdgeInsets.zero,
),
onPressed: () {
ServiceUtils.pushNamed(context, ProfilePage.name);
},
);
}),
const Gap(10),
IconButton(
icon: const Icon(SpotubeIcons.search),
icon: const Icon(SpotubeIcons.settings, size: 20),
onPressed: () {
ServiceUtils.pushNamed(context, SearchPage.name);
ServiceUtils.pushNamed(context, SettingsPage.name);
},
),
const Gap(10),

View File

@ -4,10 +4,15 @@ import 'package:go_router/go_router.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:spotube/collections/spotube_icons.dart';
import 'package:spotube/components/settings/section_card_with_heading.dart';
import 'package:spotube/components/shared/image/universal_image.dart';
import 'package:spotube/extensions/constrains.dart';
import 'package:spotube/extensions/context.dart';
import 'package:spotube/extensions/image.dart';
import 'package:spotube/pages/profile/profile.dart';
import 'package:spotube/provider/authentication_provider.dart';
import 'package:spotube/provider/scrobbler_provider.dart';
import 'package:spotube/provider/spotify/spotify.dart';
import 'package:spotube/utils/service_utils.dart';
class SettingsAccountSection extends HookConsumerWidget {
const SettingsAccountSection({super.key});
@ -15,9 +20,12 @@ class SettingsAccountSection extends HookConsumerWidget {
@override
Widget build(context, ref) {
final theme = Theme.of(context);
final router = GoRouter.of(context);
final auth = ref.watch(authenticationProvider);
final scrobbler = ref.watch(scrobblerProvider);
final router = GoRouter.of(context);
final me = ref.watch(meProvider);
final meData = me.asData?.value;
final logoutBtnStyle = FilledButton.styleFrom(
backgroundColor: Colors.red,
@ -27,6 +35,24 @@ class SettingsAccountSection extends HookConsumerWidget {
return SectionCardWithHeading(
heading: context.l10n.account,
children: [
if (auth != null)
ListTile(
leading: const Icon(SpotubeIcons.user),
title: const Text("User Profile"),
trailing: Padding(
padding: const EdgeInsets.all(8.0),
child: CircleAvatar(
backgroundImage: UniversalImage.imageProvider(
(meData?.images).asUrlString(
placeholder: ImagePlaceholder.artist,
),
),
),
),
onTap: () {
ServiceUtils.pushNamed(context, ProfilePage.name);
},
),
if (auth == null)
LayoutBuilder(builder: (context, constrains) {
return ListTile(

View File

@ -31,6 +31,7 @@ class SettingsPage extends HookConsumerWidget {
appBar: PageWindowTitleBar(
title: Text(context.l10n.settings),
centerTitle: true,
automaticallyImplyLeading: true,
),
body: Scrollbar(
controller: controller,

View File

View File

View File

View File

View File

View File