chore: make space nav bar narrower on mobile and ensure space nav bar matches user's theme

pull/1907/head
ggurdin 5 months ago
parent 87c2639625
commit fef96359c9
No known key found for this signature in database
GPG Key ID: A01CB41737CBB478

@ -44,7 +44,11 @@ class NaviRailItem extends StatelessWidget {
bottom: 8, bottom: 8,
left: 0, left: 0,
child: AnimatedContainer( child: AnimatedContainer(
width: isSelected ? 8 : 0, width: isSelected
? FluffyThemes.isColumnMode(context)
? 8
: 4
: 0,
duration: FluffyThemes.animationDuration, duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve, curve: FluffyThemes.animationCurve,
decoration: BoxDecoration( decoration: BoxDecoration(

@ -34,8 +34,7 @@ class SettingsView extends StatelessWidget {
?.tryGet<String>('account'); ?.tryGet<String>('account');
return Row( return Row(
children: [ children: [
if (FluffyThemes.isColumnMode(context) || if (FluffyThemes.isColumnMode(context)) ...[
AppConfig.displayNavigationRail) ...[
SpacesNavigationRail( SpacesNavigationRail(
activeSpaceId: null, activeSpaceId: null,
onGoToChats: () => context.go('/rooms'), onGoToChats: () => context.go('/rooms'),

@ -33,105 +33,112 @@ class SpacesNavigationRail extends StatelessWidget {
.uri .uri
.path .path
.startsWith('/rooms/settings'); .startsWith('/rooms/settings');
return StreamBuilder( return Material(
key: ValueKey( child: SafeArea(
client.userID.toString(), child: StreamBuilder(
), key: ValueKey(
stream: client.onSync.stream client.userID.toString(),
.where((s) => s.hasRoomUpdate) ),
.rateLimit(const Duration(seconds: 1)), stream: client.onSync.stream
builder: (context, _) { .where((s) => s.hasRoomUpdate)
final allSpaces = client.rooms.where((room) => room.isSpace); .rateLimit(const Duration(seconds: 1)),
final rootSpaces = allSpaces builder: (context, _) {
.where( final allSpaces = client.rooms.where((room) => room.isSpace);
(space) => !allSpaces.any( final rootSpaces = allSpaces
(parentSpace) => parentSpace.spaceChildren .where(
.any((child) => child.roomId == space.id), (space) => !allSpaces.any(
), (parentSpace) => parentSpace.spaceChildren
) .any((child) => child.roomId == space.id),
.toList(); ),
)
.toList();
return SizedBox( return SizedBox(
width: FluffyThemes.navRailWidth, width: FluffyThemes.isColumnMode(context)
child: Column( ? FluffyThemes.navRailWidth
children: [ : FluffyThemes.navRailWidth * 0.75,
Expanded( child: Column(
child: ListView.builder( children: [
scrollDirection: Axis.vertical, Expanded(
itemCount: rootSpaces.length + 2, child: ListView.builder(
itemBuilder: (context, i) { scrollDirection: Axis.vertical,
if (i == 0) { itemCount: rootSpaces.length + 2,
return NaviRailItem( itemBuilder: (context, i) {
isSelected: activeSpaceId == null && !isSettings, if (i == 0) {
onTap: onGoToChats, return NaviRailItem(
icon: const Padding( isSelected: activeSpaceId == null && !isSettings,
padding: EdgeInsets.all(10.0), onTap: onGoToChats,
child: Icon(Icons.forum_outlined), icon: const Padding(
), padding: EdgeInsets.all(10.0),
selectedIcon: const Padding( child: Icon(Icons.forum_outlined),
padding: EdgeInsets.all(10.0), ),
child: Icon(Icons.forum), selectedIcon: const Padding(
), padding: EdgeInsets.all(10.0),
toolTip: L10n.of(context).chats, child: Icon(Icons.forum),
unreadBadgeFilter: (room) => true, ),
); toolTip: L10n.of(context).chats,
} unreadBadgeFilter: (room) => true,
i--; );
if (i == rootSpaces.length) { }
return NaviRailItem( i--;
isSelected: false, if (i == rootSpaces.length) {
onTap: () => context.go('/rooms/newspace'), return NaviRailItem(
icon: const Padding( isSelected: false,
padding: EdgeInsets.all(8.0), onTap: () => context.go('/rooms/newspace'),
child: Icon(Icons.add), icon: const Padding(
), padding: EdgeInsets.all(8.0),
toolTip: L10n.of(context).createNewSpace, child: Icon(Icons.add),
); ),
} toolTip: L10n.of(context).createNewSpace,
final space = rootSpaces[i]; );
final displayname = rootSpaces[i].getLocalizedDisplayname( }
MatrixLocals(L10n.of(context)), final space = rootSpaces[i];
); final displayname =
final spaceChildrenIds = rootSpaces[i].getLocalizedDisplayname(
space.spaceChildren.map((c) => c.roomId).toSet(); MatrixLocals(L10n.of(context)),
return NaviRailItem( );
toolTip: displayname, final spaceChildrenIds =
isSelected: activeSpaceId == space.id, space.spaceChildren.map((c) => c.roomId).toSet();
onTap: () => onGoToSpaceId(rootSpaces[i].id), return NaviRailItem(
unreadBadgeFilter: (room) => toolTip: displayname,
spaceChildrenIds.contains(room.id), isSelected: activeSpaceId == space.id,
icon: Avatar( onTap: () => onGoToSpaceId(rootSpaces[i].id),
mxContent: rootSpaces[i].avatar, unreadBadgeFilter: (room) =>
name: displayname, spaceChildrenIds.contains(room.id),
border: BorderSide( icon: Avatar(
width: 1, mxContent: rootSpaces[i].avatar,
color: Theme.of(context).dividerColor, name: displayname,
), border: BorderSide(
borderRadius: BorderRadius.circular( width: 1,
AppConfig.borderRadius / 2, color: Theme.of(context).dividerColor,
), ),
), borderRadius: BorderRadius.circular(
); AppConfig.borderRadius / 2,
}, ),
), ),
);
},
),
),
NaviRailItem(
isSelected: isSettings,
onTap: () => context.go('/rooms/settings'),
icon: const Padding(
padding: EdgeInsets.all(10.0),
child: Icon(Icons.settings_outlined),
),
selectedIcon: const Padding(
padding: EdgeInsets.all(10.0),
child: Icon(Icons.settings),
),
toolTip: L10n.of(context).settings,
),
],
), ),
NaviRailItem( );
isSelected: isSettings, },
onTap: () => context.go('/rooms/settings'), ),
icon: const Padding( ),
padding: EdgeInsets.all(10.0),
child: Icon(Icons.settings_outlined),
),
selectedIcon: const Padding(
padding: EdgeInsets.all(10.0),
child: Icon(Icons.settings),
),
toolTip: L10n.of(context).settings,
),
],
),
);
},
); );
} }
} }

Loading…
Cancel
Save