moxxy/moxxy
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(ui): Replace the squircles with a simple list

Browse Source
This commit is contained in:
PapaTutuWawa 2022-12-22 00:16:14 +01:00
parent db4b69a24a
commit c0fb9beef7
5 changed files with 188 additions and 164 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
assets/i18n/strings.i18n.json
View File

@ -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?" "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": { "profile": {
"self": { "general": {
"devices": "Devices" "omemo": "Security"
}, },
"conversation": { "conversation": {
"muteChatTooltip": "Mute chat", "notifications": "Notifications",
"unmuteChatTooltip": "Unmute chat", "notificationsMuted": "Muted",
"muteChat": "Mute", "notificationsEnabled": "Enabled"
"unmuteChat": "Unmute",
"devices": "Devices"
}, },
"owndevices": { "owndevices": {
"title": "Own Devices", "title": "Own Devices",

12
assets/i18n/strings_de.i18n.json
View File

@ -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?" "confirmBody": "Einer oder mehr Chats sind unverschlüsselt. Das bedeutet, dass die Dateien dem Server unverschlüsselt vorliegen. Dateien trotzdem senden?"
}, },
"profile": { "profile": {
"self": { "general": {
"devices": "Geräte" "omemo": "Sicherheit"
}, },
"conversation": { "conversation": {
"muteChatTooltip": "Chat stummschalten", "notifications": "Benachrichtigungen",
"unmuteChatTooltip": "Chat lautstellen", "notificationsMuted": "Stumm",
"muteChat": "Stummschalten", "notificationsEnabled": "Eingeschaltet"
"unmuteChat": "Lautstellen",
"devices": "Geräte"
}, },
"owndevices": { "owndevices": {
"title": "Eigene Geräte", "title": "Eigene Geräte",

207
lib/ui/pages/profile/conversationheader.dart
View File

@ -1,15 +1,13 @@
import 'dart:io'; import 'dart:io';
import 'package:flutter/material.dart'; 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/i18n/strings.g.dart';
import 'package:moxxyv2/shared/models/conversation.dart'; import 'package:moxxyv2/shared/models/conversation.dart';
import 'package:moxxyv2/ui/bloc/devices_bloc.dart'; import 'package:moxxyv2/ui/bloc/devices_bloc.dart';
import 'package:moxxyv2/ui/bloc/profile_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/avatar.dart';
import 'package:moxxyv2/ui/widgets/chat/shared/base.dart';
import 'package:moxxyv2/ui/widgets/contact_helper.dart'; import 'package:moxxyv2/ui/widgets/contact_helper.dart';
import 'package:moxxyv2/ui/widgets/profile/options.dart';
//import 'package:phosphor_flutter/phosphor_flutter.dart'; //import 'package:phosphor_flutter/phosphor_flutter.dart';
class ConversationProfileHeader extends StatelessWidget { class ConversationProfileHeader extends StatelessWidget {
@ -81,124 +79,97 @@ 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,
),
color: getTileColor(context),
onTap: () {
GetIt.I.get<ProfileBloc>().add(
MuteStateSetEvent(
conversation.jid,
!conversation.muted,
),
);
},
),
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?
/*
Tooltip(
message: subscribed ?
'Unsubscribe' :
'Subscribe',
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
SharedMediaContainer(
ClipRRect(
borderRadius: BorderRadius.circular(10),
child: ColoredBox(
color: getTileColor(context),
child: Icon(
subscribed ?
PhosphorIcons.link :
PhosphorIcons.linkBreak,
size: 32,
),
),
),
onTap: () {
GetIt.I.get<ProfileBloc>().add(
SetSubscriptionStateEvent(
conversation.jid,
!subscribed,
),
);
},
),
Row(
mainAxisSize: MainAxisSize.min,
children: [
Text(
subscribed ?
'Unsubscribe' :
'Subscribe',
style: TextStyle(
fontSize: fontsizeAppbar,
),
),
Icon(Icons.info), Align(
], alignment: Alignment.centerLeft,
), child: Padding(
], padding: const EdgeInsets.only(
top: 16,
left: 64,
right: 64,
),
child: ProfileOptions(
options: [
ProfileOption(
icon: Icons.security_outlined,
title: t.pages.profile.general.omemo,
onTap: () {
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,
),
);
},
),
],
),
), ),
), ),
/*
// TODO(Unknown): How to integrate this into the UI?
Tooltip(
message: subscribed ?
'Unsubscribe' :
'Subscribe',
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
SharedMediaContainer(
ClipRRect(
borderRadius: BorderRadius.circular(10),
child: ColoredBox(
color: getTileColor(context),
child: Icon(
subscribed ?
PhosphorIcons.link :
PhosphorIcons.linkBreak,
size: 32,
),
),
),
onTap: () {
GetIt.I.get<ProfileBloc>().add(
SetSubscriptionStateEvent(
conversation.jid,
!subscribed,
),
);
},
),
Row(
mainAxisSize: MainAxisSize.min,
children: [
Text(
subscribed ?
'Unsubscribe' :
'Subscribe',
style: TextStyle(
fontSize: fontsizeAppbar,
),
),
Icon(Icons.info),
],
),
],
),
),*/
], ],
); );
} }

54
lib/ui/pages/profile/selfheader.dart
View File

@ -1,11 +1,10 @@
import 'package:flutter/material.dart'; 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/i18n/strings.g.dart';
import 'package:moxxyv2/ui/bloc/own_devices_bloc.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/helpers.dart';
import 'package:moxxyv2/ui/widgets/avatar.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 { class SelfProfileHeader extends StatelessWidget {
const SelfProfileHeader( const SelfProfileHeader(
@ -79,36 +78,27 @@ class SelfProfileHeader extends StatelessWidget {
], ],
), ),
), ),
Padding( Align(
padding: const EdgeInsets.only(top: 16), alignment: Alignment.centerLeft,
child: Row( child: Padding(
mainAxisAlignment: MainAxisAlignment.spaceEvenly, padding: const EdgeInsets.only(
children: [ top: 16,
Tooltip( left: 64,
message: t.pages.profile.self.devices, right: 64,
child: Column( ),
mainAxisAlignment: MainAxisAlignment.spaceEvenly, child: ProfileOptions(
children: [ options: [
SharedMediaContainer( ProfileOption(
const Icon( icon: Icons.security_outlined,
Icons.security_outlined, title: t.pages.profile.general.omemo,
size: 32, onTap: () {
), context.read<OwnDevicesBloc>().add(
color: getTileColor(context), OwnDevicesRequestedEvent(),
onTap: () { );
GetIt.I.get<OwnDevicesBloc>().add(OwnDevicesRequestedEvent()); },
},
),
Text(
t.pages.profile.self.devices,
style: const TextStyle(
fontSize: fontsizeAppbar,
),
),
],
), ),
), ],
], ),
), ),
), ),
], ],

67
lib/ui/widgets/profile/options.dart Normal file
View 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(),
);
}
}