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: artist card to use shadcn card

Browse Source
This commit is contained in:
Kingkor Roy Tirtho 2024-12-21 21:12:49 +06:00
parent 2925dd6748
commit 418a0d29bd
1 changed files with 44 additions and 93 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

137
lib/modules/artist/artist_card.dart
View File

@ -1,14 +1,13 @@
import 'package:auto_size_text/auto_size_text.dart'; import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:skeletonizer/skeletonizer.dart'; import 'package:shadcn_flutter/shadcn_flutter.dart';
import 'package:spotify/spotify.dart'; import 'package:spotify/spotify.dart';
import 'package:spotube/components/image/universal_image.dart'; import 'package:spotube/components/image/universal_image.dart';
import 'package:spotube/extensions/context.dart'; import 'package:spotube/extensions/context.dart';
import 'package:spotube/extensions/image.dart'; import 'package:spotube/extensions/image.dart';
import 'package:spotube/hooks/utils/use_breakpoint_value.dart';
import 'package:spotube/hooks/utils/use_brightness_value.dart';
import 'package:spotube/pages/artist/artist.dart'; import 'package:spotube/pages/artist/artist.dart';
import 'package:spotube/provider/blacklist_provider.dart'; import 'package:spotube/provider/blacklist_provider.dart';
import 'package:spotube/utils/service_utils.dart'; import 'package:spotube/utils/service_utils.dart';
@ -33,98 +32,50 @@ class ArtistCard extends HookConsumerWidget {
), ),
); );
final radius = BorderRadius.circular(15); return SizedBox(
width: 180,
final double size = useBreakpointValue<double>( child: Button.card(
xs: 130, onPressed: () {
sm: 130, ServiceUtils.pushNamed(
md: 150, context,
others: 170, ArtistPage.name,
); pathParameters: {
"id": artist.id!,
return Container(
width: size,
margin: const EdgeInsets.symmetric(vertical: 5),
child: Material(
shadowColor: theme.colorScheme.surface,
color: Color.lerp(
theme.colorScheme.surfaceContainerHighest,
theme.colorScheme.surface,
useBrightnessValue(.9, .7),
),
elevation: 3,
shape: RoundedRectangleBorder(
borderRadius: radius,
side: isBlackListed == true
? const BorderSide(
color: Colors.red,
width: 2,
)
: BorderSide.none,
),
child: InkWell(
onTap: () {
ServiceUtils.pushNamed(
context,
ArtistPage.name,
pathParameters: {
"id": artist.id!,
},
);
}, },
borderRadius: radius, );
child: Padding( },
padding: const EdgeInsets.all(12), child: Column(
child: Column( children: [
children: [ Avatar(
Stack( initials: artist.name!.trim()[0].toUpperCase(),
children: [ provider: backgroundImage,
ConstrainedBox( size: 130,
constraints: BoxConstraints( ),
maxHeight: size, const Gap(10),
), AutoSizeText(
child: CircleAvatar( artist.name!,
backgroundImage: backgroundImage, maxLines: 2,
radius: size / 2, textAlign: TextAlign.center,
), overflow: TextOverflow.ellipsis,
), style: theme.typography.bold,
Positioned( ),
right: 0, const Spacer(),
child: Container( Row(
padding: const EdgeInsets.symmetric( mainAxisAlignment: MainAxisAlignment.end,
horizontal: 10, children: [
vertical: 5, if (isBlackListed == true) ...[
), DestructiveBadge(
decoration: BoxDecoration( child: Text(context.l10n.blacklisted.toUpperCase()),
color: Colors.blue,
borderRadius: BorderRadius.circular(50)),
child: Skeleton.ignore(
child: Text(
context.l10n.artist,
style: const TextStyle(
color: Colors.white,
fontSize: 12,
fontWeight: FontWeight.bold,
),
),
),
),
),
],
),
const SizedBox(height: 10),
AutoSizeText(
artist.name!,
maxLines: 1,
textAlign: TextAlign.center,
overflow: TextOverflow.ellipsis,
style: theme.textTheme.bodyMedium?.copyWith(
fontWeight: FontWeight.bold,
),
), ),
const Gap(5),
], ],
), SecondaryBadge(
)), child: Text(context.l10n.artist.toUpperCase()),
)
],
)
],
),
), ),
); );
} }