refactor: chats drawer ui/ux tweaks

This commit is contained in:
cogwheel0
2025-09-07 18:51:52 +05:30
parent 9f3f02a27e
commit 57ed851753

View File

@@ -79,6 +79,7 @@ class _ChatsDrawerState extends ConsumerState<ChatsDrawer> {
if (Platform.isIOS) { if (Platform.isIOS) {
// Use Cupertino-style pull-to-refresh on iOS // Use Cupertino-style pull-to-refresh on iOS
final scroll = CustomScrollView( final scroll = CustomScrollView(
key: const PageStorageKey<String>('chats_drawer_scroll'),
controller: _listController, controller: _listController,
physics: const AlwaysScrollableScrollPhysics(), physics: const AlwaysScrollableScrollPhysics(),
slivers: [ slivers: [
@@ -100,6 +101,7 @@ class _ChatsDrawerState extends ConsumerState<ChatsDrawer> {
child: Scrollbar( child: Scrollbar(
controller: _listController, controller: _listController,
child: ListView( child: ListView(
key: const PageStorageKey<String>('chats_drawer_scroll'),
controller: _listController, controller: _listController,
physics: const AlwaysScrollableScrollPhysics(), physics: const AlwaysScrollableScrollPhysics(),
padding: padding, padding: padding,
@@ -1604,69 +1606,99 @@ class _ConversationTile extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = context.conduitTheme; final theme = context.conduitTheme;
return Material( final Color selectedBackground =
color: Colors.transparent, theme.buttonPrimary.withValues(alpha: 0.10); // subtle highlight
shape: RoundedRectangleBorder( final Color selectedBorder = theme.buttonPrimary.withValues(alpha: 0.60);
borderRadius: BorderRadius.circular(AppBorderRadius.md),
side: BorderSide( return Semantics(
color: selected selected: selected,
? theme.buttonPrimary.withValues(alpha: 0.5) button: true,
: theme.dividerColor, child: Material(
width: BorderWidth.regular, color: selected ? selectedBackground : Colors.transparent,
), shape: RoundedRectangleBorder(
), borderRadius: BorderRadius.circular(AppBorderRadius.md),
child: InkWell( side: BorderSide(
borderRadius: BorderRadius.circular(AppBorderRadius.md), color: selected ? selectedBorder : theme.dividerColor,
onTap: isLoading ? null : onTap, width: BorderWidth.regular,
onLongPress: onLongPress,
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: Spacing.md,
vertical: Spacing.sm,
), ),
child: Row( ),
child: InkWell(
borderRadius: BorderRadius.circular(AppBorderRadius.md),
onTap: isLoading ? null : onTap,
onLongPress: onLongPress,
child: Stack(
children: [ children: [
Expanded( // Left accent bar for active conversation
child: Text( AnimatedPositioned(
title, duration: const Duration(milliseconds: 160),
maxLines: 1, curve: Curves.easeOut,
overflow: TextOverflow.ellipsis, left: 0,
style: AppTypography.standard.copyWith( top: 0,
color: theme.textPrimary, bottom: 0,
fontWeight: selected ? FontWeight.w600 : FontWeight.w500, child: AnimatedContainer(
duration: const Duration(milliseconds: 160),
width: selected ? 3.0 : 0.0,
decoration: BoxDecoration(
color: theme.buttonPrimary,
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(AppBorderRadius.md),
bottomLeft: Radius.circular(AppBorderRadius.md),
),
), ),
), ),
), ),
const SizedBox(width: Spacing.xs), Padding(
if (isLoading) padding: const EdgeInsets.symmetric(
SizedBox( horizontal: Spacing.md,
width: IconSize.sm, vertical: Spacing.sm,
height: IconSize.sm,
child: CircularProgressIndicator(
strokeWidth: BorderWidth.medium,
valueColor: AlwaysStoppedAnimation<Color>(
theme.loadingIndicator,
),
),
)
else if (onMorePressed != null)
IconButton(
visualDensity: VisualDensity.compact,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(
minWidth: TouchTarget.listItem,
minHeight: TouchTarget.listItem,
),
icon: Icon(
Platform.isIOS
? CupertinoIcons.ellipsis
: Icons.more_vert_rounded,
color: theme.iconSecondary,
size: IconSize.listItem,
),
onPressed: onMorePressed,
tooltip: AppLocalizations.of(context)!.more,
), ),
child: Row(
children: [
Expanded(
child: Text(
title,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: AppTypography.standard.copyWith(
color: theme.textPrimary,
fontWeight:
selected ? FontWeight.w700 : FontWeight.w500,
),
),
),
const SizedBox(width: Spacing.xs),
if (isLoading)
SizedBox(
width: IconSize.sm,
height: IconSize.sm,
child: CircularProgressIndicator(
strokeWidth: BorderWidth.medium,
valueColor: AlwaysStoppedAnimation<Color>(
theme.loadingIndicator,
),
),
)
else if (onMorePressed != null)
IconButton(
visualDensity: VisualDensity.compact,
padding: EdgeInsets.zero,
constraints: const BoxConstraints(
minWidth: TouchTarget.listItem,
minHeight: TouchTarget.listItem,
),
icon: Icon(
Platform.isIOS
? CupertinoIcons.ellipsis
: Icons.more_vert_rounded,
color: theme.iconSecondary,
size: IconSize.listItem,
),
onPressed: onMorePressed,
tooltip: AppLocalizations.of(context)!.more,
),
],
),
),
], ],
), ),
), ),