kitty/spotube
1
0
Fork 0
mirror of https://github.com/KRTirtho/spotube.git synced 2025-09-13 07:55:18 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor: profile page to use shadcn design

Browse Source
This commit is contained in:
Kingkor Roy Tirtho 2024-12-28 19:51:04 +06:00
parent d53782da23
commit 2ee0ca44c7
5 changed files with 24 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
lib/pages/profile/profile.dart
View File

@ -1,7 +1,6 @@
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:gap/gap.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shadcn_flutter/shadcn_flutter.dart';
import 'package:skeletonizer/skeletonizer.dart'; import 'package:skeletonizer/skeletonizer.dart';
import 'package:sliver_tools/sliver_tools.dart'; import 'package:sliver_tools/sliver_tools.dart';
import 'package:spotube/collections/fake.dart'; import 'package:spotube/collections/fake.dart';
@ -21,8 +20,6 @@ class ProfilePage extends HookConsumerWidget {
@override @override
Widget build(BuildContext context, ref) { Widget build(BuildContext context, ref) {
final ThemeData(:textTheme) = Theme.of(context);
final me = ref.watch(meProvider); final me = ref.watch(meProvider);
final meData = me.asData?.value ?? FakeData.user; final meData = me.asData?.value ?? FakeData.user;
@ -42,11 +39,13 @@ class ProfilePage extends HookConsumerWidget {
return SafeArea( return SafeArea(
child: Scaffold( child: Scaffold(
appBar: TitleBar( headers: [
title: Text(context.l10n.profile), TitleBar(
automaticallyImplyLeading: true, title: Text(context.l10n.profile),
), automaticallyImplyLeading: true,
body: Skeletonizer( )
],
child: Skeletonizer(
enabled: me.isLoading, enabled: me.isLoading,
child: CustomScrollView( child: CustomScrollView(
slivers: [ slivers: [
@ -73,9 +72,8 @@ class ProfilePage extends HookConsumerWidget {
SliverToBoxAdapter( SliverToBoxAdapter(
child: Text( child: Text(
meData.displayName ?? context.l10n.no_name, meData.displayName ?? context.l10n.no_name,
style: textTheme.titleLarge,
textAlign: TextAlign.center, textAlign: TextAlign.center,
), ).h4(),
), ),
const SliverGap(20), const SliverGap(20),
SliverCrossAxisConstrained( SliverCrossAxisConstrained(
@ -84,15 +82,15 @@ class ProfilePage extends HookConsumerWidget {
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.end, mainAxisAlignment: MainAxisAlignment.end,
children: [ children: [
TextButton.icon( Button.text(
label: Text(context.l10n.edit), leading: const Icon(SpotubeIcons.edit),
icon: const Icon(SpotubeIcons.edit),
onPressed: () { onPressed: () {
launchUrlString( launchUrlString(
"https://www.spotify.com/account/profile/", "https://www.spotify.com/account/profile/",
mode: LaunchMode.externalApplication, mode: LaunchMode.externalApplication,
); );
}, },
child: Text(context.l10n.edit),
), ),
], ],
), ),
@ -102,25 +100,22 @@ class ProfilePage extends HookConsumerWidget {
maxCrossAxisExtent: 500, maxCrossAxisExtent: 500,
child: SliverToBoxAdapter( child: SliverToBoxAdapter(
child: Card( child: Card(
margin: const EdgeInsets.all(10),
child: Padding( child: Padding(
padding: const EdgeInsets.all(8.0), padding: const EdgeInsets.all(8.0),
child: Table( child: Table(
columnWidths: const { columnWidths: const {
0: FixedColumnWidth(110), 0: FixedTableSize(120),
}, },
children: [ defaultRowHeight: const FixedTableSize(40),
rows: [
for (final MapEntry(:key, :value) for (final MapEntry(:key, :value)
in userProperties.entries) in userProperties.entries)
TableRow( TableRow(
children: [ cells: [
TableCell( TableCell(
child: Padding( child: Padding(
padding: const EdgeInsets.all(6), padding: const EdgeInsets.all(6),
child: Text( child: Text(key).large(),
key,
style: textTheme.titleSmall,
),
), ),
), ),
TableCell( TableCell(
@ -137,6 +132,7 @@ class ProfilePage extends HookConsumerWidget {
), ),
), ),
), ),
const SliverGap(200),
], ],
), ),
), ),

2
lib/pages/search/sections/albums.dart
View File

@ -1,6 +1,6 @@
import 'package:flutter/material.dart' hide Page;
import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shadcn_flutter/shadcn_flutter.dart';
import 'package:spotify/spotify.dart'; import 'package:spotify/spotify.dart';
import 'package:spotube/components/horizontal_playbutton_card_view/horizontal_playbutton_card_view.dart'; import 'package:spotube/components/horizontal_playbutton_card_view/horizontal_playbutton_card_view.dart';

2
lib/pages/search/sections/artists.dart
View File

@ -1,5 +1,5 @@
import 'package:flutter/material.dart' hide Page;
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shadcn_flutter/shadcn_flutter.dart';
import 'package:spotify/spotify.dart'; import 'package:spotify/spotify.dart';
import 'package:spotube/components/horizontal_playbutton_card_view/horizontal_playbutton_card_view.dart'; import 'package:spotube/components/horizontal_playbutton_card_view/horizontal_playbutton_card_view.dart';

2
lib/pages/search/sections/playlists.dart
View File

@ -1,5 +1,5 @@
import 'package:flutter/material.dart' hide Page;
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shadcn_flutter/shadcn_flutter.dart';
import 'package:spotify/spotify.dart'; import 'package:spotify/spotify.dart';
import 'package:spotube/components/horizontal_playbutton_card_view/horizontal_playbutton_card_view.dart'; import 'package:spotube/components/horizontal_playbutton_card_view/horizontal_playbutton_card_view.dart';
import 'package:spotube/extensions/context.dart'; import 'package:spotube/extensions/context.dart';

5
lib/pages/search/sections/tracks.dart
View File

@ -1,6 +1,7 @@
import 'package:collection/collection.dart'; import 'package:collection/collection.dart';
import 'package:flutter/material.dart' hide Page;
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shadcn_flutter/shadcn_flutter.dart';
import 'package:spotify/spotify.dart'; import 'package:spotify/spotify.dart';
import 'package:spotube/components/dialogs/prompt_dialog.dart'; import 'package:spotube/components/dialogs/prompt_dialog.dart';
import 'package:spotube/components/dialogs/select_device_dialog.dart'; import 'package:spotube/components/dialogs/select_device_dialog.dart';
@ -37,7 +38,7 @@ class SearchTracksSection extends HookConsumerWidget {
padding: const EdgeInsets.symmetric(horizontal: 8), padding: const EdgeInsets.symmetric(horizontal: 8),
child: Text( child: Text(
context.l10n.songs, context.l10n.songs,
style: theme.textTheme.titleLarge!, style: theme.typography.h4,
), ),
), ),
if (searchTrack.isLoading) if (searchTrack.isLoading)