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

105
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,37 +32,10 @@ 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,
md: 150,
others: 170,
);
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( ServiceUtils.pushNamed(
context, context,
ArtistPage.name, ArtistPage.name,
@ -72,59 +44,38 @@ class ArtistCard extends HookConsumerWidget {
}, },
); );
}, },
borderRadius: radius,
child: Padding(
padding: const EdgeInsets.all(12),
child: Column( child: Column(
children: [ children: [
Stack( Avatar(
children: [ initials: artist.name!.trim()[0].toUpperCase(),
ConstrainedBox( provider: backgroundImage,
constraints: BoxConstraints( size: 130,
maxHeight: size,
), ),
child: CircleAvatar( const Gap(10),
backgroundImage: backgroundImage,
radius: size / 2,
),
),
Positioned(
right: 0,
child: Container(
padding: const EdgeInsets.symmetric(
horizontal: 10,
vertical: 5,
),
decoration: BoxDecoration(
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( AutoSizeText(
artist.name!, artist.name!,
maxLines: 1, maxLines: 2,
textAlign: TextAlign.center, textAlign: TextAlign.center,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
style: theme.textTheme.bodyMedium?.copyWith( style: theme.typography.bold,
fontWeight: FontWeight.bold,
), ),
const Spacer(),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
if (isBlackListed == true) ...[
DestructiveBadge(
child: Text(context.l10n.blacklisted.toUpperCase()),
), ),
const Gap(5),
],
SecondaryBadge(
child: Text(context.l10n.artist.toUpperCase()),
)
],
)
], ],
), ),
)),
), ),
); );
} }