feat(ui): Replace the squircles with a simple list
This commit is contained in:
		
							parent
							
								
									db4b69a24a
								
							
						
					
					
						commit
						c0fb9beef7
					
				| @ -154,15 +154,13 @@ | ||||
| 	    "confirmBody": "One or more chats are unencrypted. This means that the file will be leaked to the server. Do you still want to continue?" | ||||
| 	}, | ||||
| 	"profile": { | ||||
| 	    "self": { | ||||
| 		"devices": "Devices" | ||||
| 	    "general": { | ||||
| 		"omemo": "Security" | ||||
| 	    }, | ||||
| 	    "conversation": { | ||||
| 		"muteChatTooltip": "Mute chat", | ||||
| 		"unmuteChatTooltip": "Unmute chat", | ||||
| 		"muteChat": "Mute", | ||||
| 		"unmuteChat": "Unmute", | ||||
| 		"devices": "Devices" | ||||
| 		"notifications": "Notifications", | ||||
| 		"notificationsMuted": "Muted", | ||||
| 		"notificationsEnabled": "Enabled" | ||||
| 	    }, | ||||
| 	    "owndevices": { | ||||
| 		"title": "Own Devices", | ||||
|  | ||||
| @ -154,15 +154,13 @@ | ||||
| 	    "confirmBody": "Einer oder mehr Chats sind unverschlüsselt. Das bedeutet, dass die Dateien dem Server unverschlüsselt vorliegen. Dateien trotzdem senden?" | ||||
| 	}, | ||||
| 	"profile": { | ||||
| 	    "self": { | ||||
| 		"devices": "Geräte" | ||||
| 	    "general": { | ||||
| 		"omemo": "Sicherheit" | ||||
| 	    }, | ||||
| 	    "conversation": { | ||||
| 		"muteChatTooltip": "Chat stummschalten", | ||||
| 		"unmuteChatTooltip": "Chat lautstellen", | ||||
| 		"muteChat": "Stummschalten", | ||||
| 		"unmuteChat": "Lautstellen", | ||||
| 		"devices": "Geräte" | ||||
| 		"notifications": "Benachrichtigungen", | ||||
| 		"notificationsMuted": "Stumm", | ||||
| 		"notificationsEnabled": "Eingeschaltet" | ||||
| 	    }, | ||||
| 	    "owndevices": { | ||||
| 		"title": "Eigene Geräte", | ||||
|  | ||||
| @ -1,15 +1,13 @@ | ||||
| import 'dart:io'; | ||||
| import 'package:flutter/material.dart'; | ||||
| import 'package:get_it/get_it.dart'; | ||||
| import 'package:flutter_bloc/flutter_bloc.dart'; | ||||
| import 'package:moxxyv2/i18n/strings.g.dart'; | ||||
| import 'package:moxxyv2/shared/models/conversation.dart'; | ||||
| import 'package:moxxyv2/ui/bloc/devices_bloc.dart'; | ||||
| import 'package:moxxyv2/ui/bloc/profile_bloc.dart'; | ||||
| import 'package:moxxyv2/ui/constants.dart'; | ||||
| import 'package:moxxyv2/ui/helpers.dart'; | ||||
| import 'package:moxxyv2/ui/widgets/avatar.dart'; | ||||
| import 'package:moxxyv2/ui/widgets/chat/shared/base.dart'; | ||||
| import 'package:moxxyv2/ui/widgets/contact_helper.dart'; | ||||
| import 'package:moxxyv2/ui/widgets/profile/options.dart'; | ||||
| //import 'package:phosphor_flutter/phosphor_flutter.dart'; | ||||
| 
 | ||||
| class ConversationProfileHeader extends StatelessWidget { | ||||
| @ -81,29 +79,36 @@ class ConversationProfileHeader extends StatelessWidget { | ||||
|             ), | ||||
|           ), | ||||
|         ), | ||||
|         Padding( | ||||
|           padding: const EdgeInsets.only(top: 16), | ||||
|           child: Row( | ||||
|             //mainAxisSize: MainAxisSize.min, | ||||
|             mainAxisAlignment: MainAxisAlignment.spaceEvenly, | ||||
|             children: [ | ||||
|               Tooltip( | ||||
|                 message: conversation.muted ? | ||||
|                   t.pages.profile.conversation.unmuteChatTooltip : | ||||
|                   t.pages.profile.conversation.muteChatTooltip, | ||||
|                 child: Column( | ||||
|                   mainAxisSize: MainAxisSize.min, | ||||
|                   children: [ | ||||
|                     SharedMediaContainer( | ||||
|                       Icon( | ||||
|                         conversation.muted ? | ||||
|                           Icons.do_not_disturb_on : | ||||
|                           Icons.do_not_disturb_off, | ||||
|                         size: 32, | ||||
| 
 | ||||
|         Align( | ||||
|           alignment: Alignment.centerLeft, | ||||
|           child: Padding( | ||||
|             padding: const EdgeInsets.only( | ||||
|               top: 16, | ||||
|               left: 64, | ||||
|               right: 64, | ||||
|             ), | ||||
|                       color: getTileColor(context), | ||||
|             child: ProfileOptions( | ||||
|               options: [ | ||||
|                 ProfileOption( | ||||
|                   icon: Icons.security_outlined, | ||||
|                   title: t.pages.profile.general.omemo, | ||||
|                   onTap: () { | ||||
|                         GetIt.I.get<ProfileBloc>().add( | ||||
|                     context.read<DevicesBloc>().add( | ||||
|                       DevicesRequestedEvent(conversation.jid), | ||||
|                     ); | ||||
|                   }, | ||||
|                 ), | ||||
|                 ProfileOption( | ||||
|                   icon: conversation.muted ? | ||||
|                     Icons.notifications_off : | ||||
|                     Icons.notifications, | ||||
|                   title: t.pages.profile.conversation.notifications, | ||||
|                   description: conversation.muted ? | ||||
|                     t.pages.profile.conversation.notificationsMuted : | ||||
|                     t.pages.profile.conversation.notificationsEnabled, | ||||
|                   onTap: () { | ||||
|                     context.read<ProfileBloc>().add( | ||||
|                       MuteStateSetEvent( | ||||
|                         conversation.jid, | ||||
|                         !conversation.muted, | ||||
| @ -111,44 +116,13 @@ class ConversationProfileHeader extends StatelessWidget { | ||||
|                     ); | ||||
|                   }, | ||||
|                 ), | ||||
|                     Text( | ||||
|                       conversation.muted ? | ||||
|                         t.pages.profile.conversation.unmuteChat : | ||||
|                         t.pages.profile.conversation.muteChat, | ||||
|                       style: const TextStyle( | ||||
|                         fontSize: fontsizeAppbar, | ||||
|                       ), | ||||
|                     ), | ||||
|               ], | ||||
|             ), | ||||
|           ), | ||||
|               // TODO(PapaTutuWawa): Only show when the chat partner has OMEMO keys | ||||
|               Tooltip( | ||||
|                 message: t.pages.profile.conversation.devices, | ||||
|                 child: Column( | ||||
|                   mainAxisAlignment: MainAxisAlignment.spaceEvenly, | ||||
|                   children: [ | ||||
|                     SharedMediaContainer( | ||||
|                       const Icon( | ||||
|                         Icons.security_outlined, | ||||
|                         size: 32, | ||||
|         ), | ||||
|                       color: getTileColor(context), | ||||
|                       onTap: () { | ||||
|                         GetIt.I.get<DevicesBloc>().add(DevicesRequestedEvent(conversation.jid)); | ||||
|                       }, | ||||
|                     ), | ||||
|                     Text( | ||||
|                       t.pages.profile.conversation.devices, | ||||
|                       style: const TextStyle( | ||||
|                         fontSize: fontsizeAppbar, | ||||
|                       ), | ||||
|                     ), | ||||
|                   ], | ||||
|                 ), | ||||
|               ), | ||||
|               // TODO(Unknown): How to integrate this into the UI? | ||||
| 
 | ||||
|         /* | ||||
|         // TODO(Unknown): How to integrate this into the UI? | ||||
|         Tooltip( | ||||
|           message: subscribed ? | ||||
|             'Unsubscribe' : | ||||
| @ -197,9 +171,6 @@ class ConversationProfileHeader extends StatelessWidget { | ||||
|           ), | ||||
|         ),*/ | ||||
|       ], | ||||
|           ), | ||||
|         ), | ||||
|       ], | ||||
|     ); | ||||
|   } | ||||
| } | ||||
|  | ||||
| @ -1,11 +1,10 @@ | ||||
| import 'package:flutter/material.dart'; | ||||
| import 'package:get_it/get_it.dart'; | ||||
| import 'package:flutter_bloc/flutter_bloc.dart'; | ||||
| import 'package:moxxyv2/i18n/strings.g.dart'; | ||||
| import 'package:moxxyv2/ui/bloc/own_devices_bloc.dart'; | ||||
| import 'package:moxxyv2/ui/constants.dart'; | ||||
| import 'package:moxxyv2/ui/helpers.dart'; | ||||
| import 'package:moxxyv2/ui/widgets/avatar.dart'; | ||||
| import 'package:moxxyv2/ui/widgets/chat/shared/base.dart'; | ||||
| import 'package:moxxyv2/ui/widgets/profile/options.dart'; | ||||
| 
 | ||||
| class SelfProfileHeader extends StatelessWidget { | ||||
|   const SelfProfileHeader( | ||||
| @ -79,37 +78,28 @@ class SelfProfileHeader extends StatelessWidget { | ||||
|             ], | ||||
|           ), | ||||
|         ), | ||||
|         Padding( | ||||
|           padding: const EdgeInsets.only(top: 16), | ||||
|           child: Row( | ||||
|             mainAxisAlignment: MainAxisAlignment.spaceEvenly, | ||||
|             children: [ | ||||
|               Tooltip( | ||||
|                 message: t.pages.profile.self.devices, | ||||
|                 child: Column( | ||||
|                   mainAxisAlignment: MainAxisAlignment.spaceEvenly, | ||||
|                   children: [ | ||||
|                     SharedMediaContainer( | ||||
|                       const Icon( | ||||
|                         Icons.security_outlined, | ||||
|                         size: 32, | ||||
|         Align( | ||||
|           alignment: Alignment.centerLeft, | ||||
|           child: Padding( | ||||
|             padding: const EdgeInsets.only( | ||||
|               top: 16, | ||||
|               left: 64, | ||||
|               right: 64, | ||||
|             ), | ||||
|                       color: getTileColor(context), | ||||
|             child: ProfileOptions( | ||||
|               options: [ | ||||
|                 ProfileOption( | ||||
|                   icon: Icons.security_outlined, | ||||
|                   title: t.pages.profile.general.omemo, | ||||
|                   onTap: () { | ||||
|                         GetIt.I.get<OwnDevicesBloc>().add(OwnDevicesRequestedEvent()); | ||||
|                     context.read<OwnDevicesBloc>().add( | ||||
|                       OwnDevicesRequestedEvent(), | ||||
|                     ); | ||||
|                   }, | ||||
|                 ), | ||||
|                     Text( | ||||
|                       t.pages.profile.self.devices, | ||||
|                       style: const TextStyle( | ||||
|                         fontSize: fontsizeAppbar, | ||||
|                       ), | ||||
|                     ), | ||||
|               ], | ||||
|             ), | ||||
|           ), | ||||
|             ], | ||||
|           ), | ||||
|         ), | ||||
|       ], | ||||
|     ); | ||||
|  | ||||
							
								
								
									
										67
									
								
								lib/ui/widgets/profile/options.dart
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										67
									
								
								lib/ui/widgets/profile/options.dart
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,67 @@ | ||||
| import 'package:flutter/material.dart'; | ||||
| 
 | ||||
| class ProfileOption { | ||||
|   const ProfileOption({ | ||||
|     required this.icon, | ||||
|     required this.title, | ||||
|     required this.onTap, | ||||
|     this.description, | ||||
|   }); | ||||
|   final IconData icon; | ||||
|   final String title; | ||||
|   final String? description; | ||||
|   final void Function() onTap; | ||||
| } | ||||
| 
 | ||||
| class ProfileOptions extends StatelessWidget { | ||||
|   const ProfileOptions({ | ||||
|     required this.options, | ||||
|     super.key, | ||||
|   }); | ||||
|   final List<ProfileOption> options; | ||||
| 
 | ||||
|   @override | ||||
|   Widget build(BuildContext context) { | ||||
|     return Column( | ||||
|       crossAxisAlignment: CrossAxisAlignment.start, | ||||
|       children: options | ||||
|         .map((option) => InkWell( | ||||
|           onTap: option.onTap, | ||||
|           child: Padding( | ||||
|             padding: const EdgeInsets.symmetric( | ||||
|               vertical: 16, | ||||
|               horizontal: 8, | ||||
|             ), | ||||
|             child: Row( | ||||
|               children: [ | ||||
|                 Padding( | ||||
|                   padding: const EdgeInsets.only(right: 16), | ||||
|                   child: Icon( | ||||
|                     option.icon, | ||||
|                     size: 32, | ||||
|                   ), | ||||
|                 ), | ||||
| 
 | ||||
|                 Column( | ||||
|                   mainAxisSize: MainAxisSize.min, | ||||
|                   crossAxisAlignment: CrossAxisAlignment.start, | ||||
|                   children: [ | ||||
|                     Text( | ||||
|                       option.title, | ||||
|                       style: Theme.of(context).textTheme.headline6, | ||||
|                     ), | ||||
| 
 | ||||
|                     if (option.description != null) | ||||
|                       Text( | ||||
|                         option.description!, | ||||
|                         style: Theme.of(context).textTheme.bodyMedium, | ||||
|                       ), | ||||
|                   ], | ||||
|                 ), | ||||
|               ], | ||||
|             ), | ||||
|           ), | ||||
|         ),).toList(), | ||||
|     ); | ||||
|   } | ||||
| } | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user