profile edit happens without requiring save button

This commit is contained in:
Christien Rioux 2024-08-01 14:30:06 -05:00
parent b6a812af87
commit 030f9d9651
19 changed files with 499 additions and 266 deletions

View File

@ -25,7 +25,7 @@
"empty_free_message": "Status when availability is 'Free'",
"form_away_message": "Away Message",
"empty_away_message": "Status when availability is 'Away'",
"form_busy_message": "Free Message",
"form_busy_message": "Busy Message",
"empty_busy_message": "Status when availability is 'Busy'",
"form_availability": "Availability",
"form_avatar": "Avatar",
@ -42,6 +42,7 @@
"create": "Create",
"instructions": "This information will be shared with the people you invite to connect with you on VeilidChat.",
"error": "Account creation error",
"network_is_offline": "Network is offline, try again when you're connected",
"name": "Name",
"pronouns": "Pronouns"
},
@ -149,9 +150,10 @@
},
"add_contact_sheet": {
"new_contact": "New Contact",
"create_invite": "Create Invitation",
"scan_invite": "Scan Invitation",
"paste_invite": "Paste Invitation"
"create_invite": "Create\nInvitation",
"receive_invite": "Receive\nInvitation",
"scan_invite": "Scan\nInvitation",
"paste_invite": "Paste\nInvitation"
},
"add_chat_sheet": {
"new_chat": "New Chat"

BIN
assets/images/handshake.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

BIN
assets/images/toilet.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

View File

@ -1,5 +1,6 @@
import 'dart:async';
import 'package:async_tools/async_tools.dart';
import 'package:protobuf/protobuf.dart';
import 'package:veilid_support/veilid_support.dart';
@ -7,6 +8,10 @@ import '../../proto/proto.dart' as proto;
import '../account_manager.dart';
typedef AccountRecordState = proto.Account;
typedef _sspUpdateState = (
AccountSpec accountSpec,
Future<void> Function() onSuccess
);
/// The saved state of a VeilidChat Account on the DHT
/// Used to synchronize status, profile, and options for a specific account
@ -34,16 +39,25 @@ class AccountRecordCubit extends DefaultDHTRecordCubit<AccountRecordState> {
@override
Future<void> close() async {
await _sspUpdate.close();
await super.close();
}
////////////////////////////////////////////////////////////////////////////
// Public Interface
Future<void> updateAccount(
AccountSpec accountSpec,
) async {
void updateAccount(
AccountSpec accountSpec, Future<void> Function() onSuccess) {
_sspUpdate.updateState((accountSpec, onSuccess), (state) async {
await _updateAccountAsync(state.$1, state.$2);
});
}
Future<void> _updateAccountAsync(
AccountSpec accountSpec, Future<void> Function() onSuccess) async {
var changed = false;
await record.eventualUpdateProtobuf(proto.Account.fromBuffer, (old) async {
changed = false;
if (old == null) {
return null;
}
@ -63,7 +77,6 @@ class AccountRecordCubit extends DefaultDHTRecordCubit<AccountRecordState> {
..awayMessage = accountSpec.awayMessage
..busyMessage = accountSpec.busyMessage;
var changed = false;
if (newAccount.profile != old.profile ||
newAccount.invisible != old.invisible ||
newAccount.autodetectAway != old.autodetectAway ||
@ -78,5 +91,10 @@ class AccountRecordCubit extends DefaultDHTRecordCubit<AccountRecordState> {
}
return null;
});
if (changed) {
await onSuccess();
}
}
final _sspUpdate = SingleStateProcessor<_sspUpdateState>();
}

View File

@ -50,13 +50,13 @@ class _EditAccountPageState extends WindowSetupState<EditAccountPage> {
orientationCapability: OrientationCapability.portraitOnly);
Widget _editAccountForm(BuildContext context,
{required Future<void> Function(AccountSpec) onSubmit}) =>
{required Future<void> Function(AccountSpec) onUpdate}) =>
EditProfileForm(
header: translate('edit_account_page.header'),
instructions: translate('edit_account_page.instructions'),
submitText: translate('edit_account_page.update'),
submitDisabledText: translate('button.waiting_for_network'),
onSubmit: onSubmit,
onUpdate: onUpdate,
initialValueCallback: (key) => switch (key) {
EditProfileForm.formFieldName => widget.existingAccount.profile.name,
EditProfileForm.formFieldPronouns =>
@ -76,7 +76,7 @@ class _EditAccountPageState extends WindowSetupState<EditAccountPage> {
EditProfileForm.formFieldAutoAway =>
widget.existingAccount.autodetectAway,
EditProfileForm.formFieldAutoAwayTimeout =>
widget.existingAccount.autoAwayTimeoutMin,
widget.existingAccount.autoAwayTimeoutMin.toString(),
String() => throw UnimplementedError(),
},
);
@ -214,51 +214,24 @@ class _EditAccountPageState extends WindowSetupState<EditAccountPage> {
}
}
Future<void> _onSubmit(AccountSpec accountSpec) async {
// dismiss the keyboard by unfocusing the textfield
FocusScope.of(context).unfocus();
try {
setState(() {
_isInAsyncCall = true;
});
try {
// Look up account cubit for this specific account
final perAccountCollectionBlocMapCubit =
context.read<PerAccountCollectionBlocMapCubit>();
final accountRecordCubit = await perAccountCollectionBlocMapCubit
.operate(widget.superIdentityRecordKey,
closure: (c) async => c.accountRecordCubit);
if (accountRecordCubit == null) {
return;
}
// Update account profile DHT record
// This triggers ConversationCubits to update
await accountRecordCubit.updateAccount(accountSpec);
// Update local account profile
await AccountRepository.instance
.updateLocalAccount(widget.superIdentityRecordKey, accountSpec);
if (mounted) {
Navigator.canPop(context)
? GoRouterHelper(context).pop()
: GoRouterHelper(context).go('/');
}
} finally {
if (mounted) {
setState(() {
_isInAsyncCall = false;
});
}
}
} on Exception catch (e) {
if (mounted) {
await showErrorModal(
context, translate('edit_account_page.error'), 'Exception: $e');
}
Future<void> _onUpdate(AccountSpec accountSpec) async {
// Look up account cubit for this specific account
final perAccountCollectionBlocMapCubit =
context.read<PerAccountCollectionBlocMapCubit>();
final accountRecordCubit = await perAccountCollectionBlocMapCubit.operate(
widget.superIdentityRecordKey,
closure: (c) async => c.accountRecordCubit);
if (accountRecordCubit == null) {
return;
}
// Update account profile DHT record
// This triggers ConversationCubits to update
accountRecordCubit.updateAccount(accountSpec, () async {
// Update local account profile
await AccountRepository.instance
.updateLocalAccount(widget.superIdentityRecordKey, accountSpec);
});
}
@override
@ -290,7 +263,7 @@ class _EditAccountPageState extends WindowSetupState<EditAccountPage> {
child: Column(children: [
_editAccountForm(
context,
onSubmit: _onSubmit,
onUpdate: _onUpdate,
).paddingLTRB(0, 0, 0, 32),
OptionBox(
instructions:

View File

@ -1,3 +1,4 @@
import 'package:async_tools/async_tools.dart';
import 'package:awesome_extensions/awesome_extensions.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
@ -10,15 +11,18 @@ import '../../proto/proto.dart' as proto;
import '../../theme/theme.dart';
import '../models/models.dart';
const _kDoUpdateSubmit = 'doUpdateSubmit';
class EditProfileForm extends StatefulWidget {
const EditProfileForm({
required this.header,
required this.instructions,
required this.submitText,
required this.submitDisabledText,
super.key,
required this.initialValueCallback,
this.onUpdate,
this.onSubmit,
this.initialValueCallback,
super.key,
});
@override
@ -26,10 +30,11 @@ class EditProfileForm extends StatefulWidget {
final String header;
final String instructions;
final Future<void> Function(AccountSpec)? onUpdate;
final Future<void> Function(AccountSpec)? onSubmit;
final String submitText;
final String submitDisabledText;
final Object? Function(String key)? initialValueCallback;
final Object Function(String key) initialValueCallback;
@override
void debugFillProperties(DiagnosticPropertiesBuilder properties) {
@ -38,11 +43,13 @@ class EditProfileForm extends StatefulWidget {
..add(StringProperty('header', header))
..add(StringProperty('instructions', instructions))
..add(ObjectFlagProperty<Future<void> Function(AccountSpec)?>.has(
'onSubmit', onSubmit))
'onUpdate', onUpdate))
..add(StringProperty('submitText', submitText))
..add(StringProperty('submitDisabledText', submitDisabledText))
..add(ObjectFlagProperty<Object? Function(String key)?>.has(
'initialValueCallback', initialValueCallback));
..add(ObjectFlagProperty<Object Function(String key)?>.has(
'initialValueCallback', initialValueCallback))
..add(ObjectFlagProperty<Future<void> Function(AccountSpec)?>.has(
'onSubmit', onSubmit));
}
static const String formFieldName = 'name';
@ -62,15 +69,17 @@ class _EditProfileFormState extends State<EditProfileForm> {
@override
void initState() {
_autoAwayEnabled =
widget.initialValueCallback(EditProfileForm.formFieldAutoAway) as bool;
super.initState();
}
FormBuilderDropdown<proto.Availability> _availabilityDropDown(
BuildContext context) {
final initialValueX =
widget.initialValueCallback?.call(EditProfileForm.formFieldAvailability)
as proto.Availability? ??
proto.Availability.AVAILABILITY_FREE;
widget.initialValueCallback(EditProfileForm.formFieldAvailability)
as proto.Availability;
final initialValue =
initialValueX == proto.Availability.AVAILABILITY_UNSPECIFIED
? proto.Availability.AVAILABILITY_FREE
@ -86,14 +95,19 @@ class _EditProfileFormState extends State<EditProfileForm> {
return FormBuilderDropdown<proto.Availability>(
name: EditProfileForm.formFieldAvailability,
initialValue: initialValue,
decoration: InputDecoration(
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_availability'),
hintText: translate('account.empty_busy_message')),
items: availabilities
.map((x) => DropdownMenuItem<proto.Availability>(
value: x,
child: Row(mainAxisSize: MainAxisSize.min, children: [
Icon(AvailabilityWidget.availabilityIcon(x)),
AvailabilityWidget.availabilityIcon(x),
Text(x == proto.Availability.AVAILABILITY_OFFLINE
? translate('availability.always_show_offline')
: AvailabilityWidget.availabilityName(x)),
? translate('availability.always_show_offline')
: AvailabilityWidget.availabilityName(x))
.paddingLTRB(8, 0, 0, 0),
])))
.toList(),
);
@ -103,34 +117,26 @@ class _EditProfileFormState extends State<EditProfileForm> {
final name = _formKey
.currentState!.fields[EditProfileForm.formFieldName]!.value as String;
final pronouns = _formKey.currentState!
.fields[EditProfileForm.formFieldPronouns]!.value as String? ??
'';
final about = _formKey.currentState!.fields[EditProfileForm.formFieldAbout]!
.value as String? ??
'';
.fields[EditProfileForm.formFieldPronouns]!.value as String;
final about = _formKey
.currentState!.fields[EditProfileForm.formFieldAbout]!.value as String;
final availability = _formKey
.currentState!
.fields[EditProfileForm.formFieldAvailability]!
.value as proto.Availability? ??
proto.Availability.AVAILABILITY_FREE;
.currentState!
.fields[EditProfileForm.formFieldAvailability]!
.value as proto.Availability;
final invisible = availability == proto.Availability.AVAILABILITY_OFFLINE;
final freeMessage = _formKey.currentState!
.fields[EditProfileForm.formFieldFreeMessage]!.value as String? ??
'';
.fields[EditProfileForm.formFieldFreeMessage]!.value as String;
final awayMessage = _formKey.currentState!
.fields[EditProfileForm.formFieldAwayMessage]!.value as String? ??
'';
.fields[EditProfileForm.formFieldAwayMessage]!.value as String;
final busyMessage = _formKey.currentState!
.fields[EditProfileForm.formFieldBusyMessage]!.value as String? ??
'';
final autoAway = _formKey.currentState!
.fields[EditProfileForm.formFieldAutoAway]!.value as bool? ??
false;
final autoAwayTimeout = _formKey.currentState!
.fields[EditProfileForm.formFieldAutoAwayTimeout]!.value as int? ??
30;
.fields[EditProfileForm.formFieldBusyMessage]!.value as String;
final autoAway = _formKey
.currentState!.fields[EditProfileForm.formFieldAutoAway]!.value as bool;
final autoAwayTimeoutString = _formKey.currentState!
.fields[EditProfileForm.formFieldAutoAwayTimeout]!.value as String;
final autoAwayTimeout = int.parse(autoAwayTimeoutString);
return AccountSpec(
name: name,
@ -163,6 +169,7 @@ class _EditProfileFormState extends State<EditProfileForm> {
return FormBuilder(
key: _formKey,
autovalidateMode: AutovalidateMode.onUserInteraction,
child: Column(
children: [
AvatarWidget(
@ -179,9 +186,10 @@ class _EditProfileFormState extends State<EditProfileForm> {
FormBuilderTextField(
autofocus: true,
name: EditProfileForm.formFieldName,
initialValue: widget.initialValueCallback
?.call(EditProfileForm.formFieldName) as String?,
initialValue: widget
.initialValueCallback(EditProfileForm.formFieldName) as String,
decoration: InputDecoration(
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_name'),
hintText: translate('account.empty_name')),
maxLength: 64,
@ -190,113 +198,149 @@ class _EditProfileFormState extends State<EditProfileForm> {
FormBuilderValidators.required(),
]),
textInputAction: TextInputAction.next,
),
).onFocusChange(_onFocusChange),
FormBuilderTextField(
name: EditProfileForm.formFieldPronouns,
initialValue: widget.initialValueCallback
?.call(EditProfileForm.formFieldPronouns) as String?,
initialValue:
widget.initialValueCallback(EditProfileForm.formFieldPronouns)
as String,
maxLength: 64,
decoration: InputDecoration(
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_pronouns'),
hintText: translate('account.empty_pronouns')),
textInputAction: TextInputAction.next,
),
).onFocusChange(_onFocusChange),
FormBuilderTextField(
name: EditProfileForm.formFieldAbout,
initialValue: widget.initialValueCallback
?.call(EditProfileForm.formFieldAbout) as String?,
initialValue: widget
.initialValueCallback(EditProfileForm.formFieldAbout) as String,
maxLength: 1024,
maxLines: 8,
minLines: 1,
decoration: InputDecoration(
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_about'),
hintText: translate('account.empty_about')),
textInputAction: TextInputAction.newline,
),
_availabilityDropDown(context),
).onFocusChange(_onFocusChange),
_availabilityDropDown(context)
.paddingLTRB(0, 0, 0, 16)
.onFocusChange(_onFocusChange),
FormBuilderTextField(
name: EditProfileForm.formFieldFreeMessage,
initialValue: widget.initialValueCallback
?.call(EditProfileForm.formFieldFreeMessage) as String?,
initialValue: widget.initialValueCallback(
EditProfileForm.formFieldFreeMessage) as String,
maxLength: 128,
decoration: InputDecoration(
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_free_message'),
hintText: translate('account.empty_free_message')),
textInputAction: TextInputAction.next,
),
).onFocusChange(_onFocusChange),
FormBuilderTextField(
name: EditProfileForm.formFieldAwayMessage,
initialValue: widget.initialValueCallback
?.call(EditProfileForm.formFieldAwayMessage) as String?,
initialValue: widget.initialValueCallback(
EditProfileForm.formFieldAwayMessage) as String,
maxLength: 128,
decoration: InputDecoration(
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_away_message'),
hintText: translate('account.empty_away_message')),
textInputAction: TextInputAction.next,
),
).onFocusChange(_onFocusChange),
FormBuilderTextField(
name: EditProfileForm.formFieldBusyMessage,
initialValue: widget.initialValueCallback
?.call(EditProfileForm.formFieldBusyMessage) as String?,
initialValue: widget.initialValueCallback(
EditProfileForm.formFieldBusyMessage) as String,
maxLength: 128,
decoration: InputDecoration(
floatingLabelBehavior: FloatingLabelBehavior.always,
labelText: translate('account.form_busy_message'),
hintText: translate('account.empty_busy_message')),
textInputAction: TextInputAction.next,
),
).onFocusChange(_onFocusChange),
FormBuilderCheckbox(
name: EditProfileForm.formFieldAutoAway,
initialValue: widget.initialValueCallback
?.call(EditProfileForm.formFieldAutoAway) as bool? ??
false,
initialValue:
widget.initialValueCallback(EditProfileForm.formFieldAutoAway)
as bool,
side: BorderSide(color: scale.primaryScale.border, width: 2),
title: Text(translate('account.form_auto_away'),
style: textTheme.labelMedium),
),
onChanged: (v) {
setState(() {
_autoAwayEnabled = v ?? false;
});
},
).onFocusChange(_onFocusChange),
FormBuilderTextField(
name: EditProfileForm.formFieldAutoAwayTimeout,
enabled: _formKey.currentState
?.value[EditProfileForm.formFieldAutoAway] as bool? ??
false,
initialValue: widget.initialValueCallback
?.call(EditProfileForm.formFieldAutoAwayTimeout)
as String? ??
'15',
enabled: _autoAwayEnabled,
initialValue: widget.initialValueCallback(
EditProfileForm.formFieldAutoAwayTimeout) as String,
decoration: InputDecoration(
labelText: translate('account.form_auto_away_timeout'),
),
validator: FormBuilderValidators.positiveNumber(),
textInputAction: TextInputAction.next,
),
).onFocusChange(_onFocusChange),
Row(children: [
const Spacer(),
Text(widget.instructions).toCenter().flexible(flex: 6),
const Spacer(),
]).paddingSymmetric(vertical: 4),
ElevatedButton(
onPressed: widget.onSubmit == null
? null
: () async {
if (_formKey.currentState?.saveAndValidate() ?? false) {
final aus = _makeAccountSpec();
await widget.onSubmit!(aus);
}
},
child: Row(mainAxisSize: MainAxisSize.min, children: [
const Icon(Icons.check, size: 16).paddingLTRB(0, 0, 4, 0),
Text((widget.onSubmit == null)
? widget.submitDisabledText
: widget.submitText)
.paddingLTRB(0, 0, 4, 0)
]),
).paddingSymmetric(vertical: 4).alignAtCenterRight(),
if (widget.onSubmit != null)
ElevatedButton(
onPressed: widget.onSubmit == null ? null : _doSubmit,
child: Row(mainAxisSize: MainAxisSize.min, children: [
const Icon(Icons.check, size: 16).paddingLTRB(0, 0, 4, 0),
Text((widget.onSubmit == null)
? widget.submitDisabledText
: widget.submitText)
.paddingLTRB(0, 0, 4, 0)
]),
)
],
),
);
}
void _onFocusChange(bool focused) {
if (!focused) {
_doUpdate();
}
}
void _doUpdate() {
final onUpdate = widget.onUpdate;
if (onUpdate != null) {
singleFuture((this, _kDoUpdateSubmit), () async {
if (_formKey.currentState?.saveAndValidate() ?? false) {
final aus = _makeAccountSpec();
await onUpdate(aus);
}
});
}
}
void _doSubmit() {
final onSubmit = widget.onSubmit;
if (onSubmit != null) {
singleFuture((this, _kDoUpdateSubmit), () async {
if (_formKey.currentState?.saveAndValidate() ?? false) {
final aus = _makeAccountSpec();
await onSubmit(aus);
}
});
}
}
@override
Widget build(BuildContext context) => _editProfileForm(
context,
);
///////////////////////////////////////////////////////////////////////////
late bool _autoAwayEnabled;
}

View File

@ -7,6 +7,8 @@ import 'package:flutter_translate/flutter_translate.dart';
import 'package:go_router/go_router.dart';
import '../../layout/default_app_bar.dart';
import '../../notifications/cubits/notifications_cubit.dart';
import '../../proto/proto.dart' as proto;
import '../../theme/theme.dart';
import '../../tools/tools.dart';
import '../../veilid_processor/veilid_processor.dart';
@ -26,25 +28,44 @@ class _NewAccountPageState extends WindowSetupState<NewAccountPage> {
titleBarStyle: TitleBarStyle.normal,
orientationCapability: OrientationCapability.portraitOnly);
Widget _newAccountForm(BuildContext context,
{required Future<void> Function(AccountSpec) onSubmit}) {
final networkReady = context
.watch<ConnectionStateCubit>()
.state
.asData
?.value
.isPublicInternetReady ??
false;
final canSubmit = networkReady;
return EditProfileForm(
header: translate('new_account_page.header'),
instructions: translate('new_account_page.instructions'),
submitText: translate('new_account_page.create'),
submitDisabledText: translate('button.waiting_for_network'),
onSubmit: !canSubmit ? null : onSubmit);
Object _defaultAccountValues(String key) {
switch (key) {
case EditProfileForm.formFieldName:
return '';
case EditProfileForm.formFieldPronouns:
return '';
case EditProfileForm.formFieldAbout:
return '';
case EditProfileForm.formFieldAvailability:
return proto.Availability.AVAILABILITY_FREE;
case EditProfileForm.formFieldFreeMessage:
return '';
case EditProfileForm.formFieldAwayMessage:
return '';
case EditProfileForm.formFieldBusyMessage:
return '';
// case EditProfileForm.formFieldAvatar:
// return null;
case EditProfileForm.formFieldAutoAway:
return false;
case EditProfileForm.formFieldAutoAwayTimeout:
return '15';
default:
throw StateError('missing form element');
}
}
Widget _newAccountForm(
BuildContext context,
) =>
EditProfileForm(
header: translate('new_account_page.header'),
instructions: translate('new_account_page.instructions'),
submitText: translate('new_account_page.create'),
submitDisabledText: translate('button.waiting_for_network'),
initialValueCallback: _defaultAccountValues,
onSubmit: _onSubmit);
Future<void> _onSubmit(AccountSpec accountSpec) async {
// dismiss the keyboard by unfocusing the textfield
FocusScope.of(context).unfocus();
@ -54,6 +75,22 @@ class _NewAccountPageState extends WindowSetupState<NewAccountPage> {
_isInAsyncCall = true;
});
try {
final networkReady = context
.read<ConnectionStateCubit>()
.state
.asData
?.value
.isPublicInternetReady ??
false;
final canSubmit = networkReady;
if (!canSubmit) {
context.read<NotificationsCubit>().error(
text: translate('new_account_page.network_is_offline'),
title: translate('new_account_page.error'));
return;
}
final writableSuperIdentity = await AccountRepository.instance
.createWithNewSuperIdentity(accountSpec);
GoRouterHelper(context).pushReplacement('/new_account/recovery_key',
@ -100,7 +137,6 @@ class _NewAccountPageState extends WindowSetupState<NewAccountPage> {
body: SingleChildScrollView(
child: _newAccountForm(
context,
onSubmit: _onSubmit,
)).paddingSymmetric(horizontal: 24, vertical: 8),
).withModalHUD(context, displayModalHUD);
}

View File

@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_translate/flutter_translate.dart';
import '../../chat/cubits/active_chat_cubit.dart';
import '../../contacts/contacts.dart';
import '../../proto/proto.dart' as proto;
import '../../theme/theme.dart';
import '../chat_list.dart';
@ -23,28 +24,33 @@ class ChatSingleContactItemWidget extends StatelessWidget {
Widget build(
BuildContext context,
) {
final theme = Theme.of(context);
final scale = theme.extension<ScaleScheme>()!;
final scaleConfig = theme.extension<ScaleConfig>()!;
final activeChatCubit = context.watch<ActiveChatCubit>();
final localConversationRecordKey =
_contact.localConversationRecordKey.toVeilid();
final selected = activeChatCubit.state == localConversationRecordKey;
late final String title;
late final String subtitle;
if (_contact.nickname.isNotEmpty) {
title = _contact.nickname;
if (_contact.profile.pronouns.isNotEmpty) {
subtitle = '${_contact.profile.name} (${_contact.profile.pronouns})';
} else {
subtitle = _contact.profile.name;
}
} else {
title = _contact.profile.name;
if (_contact.profile.pronouns.isNotEmpty) {
subtitle = '(${_contact.profile.pronouns})';
} else {
subtitle = '';
}
}
final name = _contact.nameOrNickname;
final title = _contact.displayName;
final subtitle = _contact.profile.status;
final avatar = AvatarWidget(
name: name,
size: 34,
borderColor: _disabled
? scale.grayScale.primaryText
: scale.secondaryScale.primaryText,
foregroundColor: _disabled
? scale.grayScale.primaryText
: scale.secondaryScale.primaryText,
backgroundColor:
_disabled ? scale.grayScale.primary : scale.secondaryScale.primary,
scaleConfig: scaleConfig,
textStyle: theme.textTheme.titleLarge!,
);
return SliderTile(
key: ObjectKey(_contact),
@ -53,7 +59,8 @@ class ChatSingleContactItemWidget extends StatelessWidget {
tileScale: ScaleKind.secondary,
title: title,
subtitle: subtitle,
icon: Icons.chat,
leading: avatar,
trailing: AvailabilityWidget(availability: _contact.profile.availability),
onTap: () {
singleFuture(activeChatCubit, () async {
activeChatCubit.setActiveChat(localConversationRecordKey);

View File

@ -45,7 +45,7 @@ class ContactInvitationItemWidget extends StatelessWidget {
title: contactInvitationRecord.message.isEmpty
? translate('contact_list.invitation')
: contactInvitationRecord.message,
icon: Icons.person_add,
leading: const Icon(Icons.person_add),
onTap: () async {
if (!context.mounted) {
return;

View File

@ -203,34 +203,37 @@ class CreateInvitationDialogState extends State<CreateInvitationDialog> {
Text(translate('create_invitation_dialog.protect_this_invitation'),
style: textTheme.labelLarge)
.paddingAll(8),
Wrap(spacing: 5, children: [
ChoiceChip(
label: Text(translate('create_invitation_dialog.unlocked')),
selected: _encryptionKeyType == EncryptionKeyType.none,
onSelected: _onNoneEncryptionSelected,
),
ChoiceChip(
label: Text(translate('create_invitation_dialog.pin')),
selected: _encryptionKeyType == EncryptionKeyType.pin,
onSelected: _onPinEncryptionSelected,
),
ChoiceChip(
label: Text(translate('create_invitation_dialog.password')),
selected: _encryptionKeyType == EncryptionKeyType.password,
onSelected: _onPasswordEncryptionSelected,
)
]).paddingAll(8),
Wrap(
alignment: WrapAlignment.center,
runAlignment: WrapAlignment.center,
runSpacing: 8,
spacing: 8,
children: [
ChoiceChip(
label: Text(translate('create_invitation_dialog.unlocked')),
selected: _encryptionKeyType == EncryptionKeyType.none,
onSelected: _onNoneEncryptionSelected,
),
ChoiceChip(
label: Text(translate('create_invitation_dialog.pin')),
selected: _encryptionKeyType == EncryptionKeyType.pin,
onSelected: _onPinEncryptionSelected,
),
ChoiceChip(
label: Text(translate('create_invitation_dialog.password')),
selected: _encryptionKeyType == EncryptionKeyType.password,
onSelected: _onPasswordEncryptionSelected,
)
]).paddingAll(8).toCenter(),
Container(
width: double.infinity,
height: 60,
padding: const EdgeInsets.all(8),
child: ElevatedButton(
onPressed: _onGenerateButtonPressed,
child: Text(
translate('create_invitation_dialog.generate'),
),
).paddingAll(16),
),
),
).toCenter(),
Text(translate('create_invitation_dialog.note')).paddingAll(8),
Text(
translate('create_invitation_dialog.note_text'),

View File

@ -1,3 +1,4 @@
import 'package:awesome_extensions/awesome_extensions.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_translate/flutter_translate.dart';
@ -5,21 +6,27 @@ import 'package:flutter_translate/flutter_translate.dart';
import '../../proto/proto.dart' as proto;
class AvailabilityWidget extends StatelessWidget {
const AvailabilityWidget({required this.availability, super.key});
const AvailabilityWidget(
{required this.availability,
this.vertical = true,
this.iconSize = 32,
super.key});
static IconData availabilityIcon(proto.Availability availability) {
late final IconData iconData;
static Widget availabilityIcon(proto.Availability availability,
{double size = 32}) {
late final Widget iconData;
switch (availability) {
case proto.Availability.AVAILABILITY_AWAY:
iconData = Icons.hot_tub;
iconData =
ImageIcon(const AssetImage('assets/images/toilet.png'), size: size);
case proto.Availability.AVAILABILITY_BUSY:
iconData = Icons.event_busy;
iconData = Icon(Icons.event_busy, size: size);
case proto.Availability.AVAILABILITY_FREE:
iconData = Icons.event_available;
iconData = Icon(Icons.event_available, size: size);
case proto.Availability.AVAILABILITY_OFFLINE:
iconData = Icons.cloud_off;
iconData = Icon(Icons.cloud_off, size: size);
case proto.Availability.AVAILABILITY_UNSPECIFIED:
iconData = Icons.question_mark;
iconData = Icon(Icons.question_mark, size: size);
}
return iconData;
}
@ -49,20 +56,35 @@ class AvailabilityWidget extends StatelessWidget {
// final scaleConfig = theme.extension<ScaleConfig>()!;
final name = availabilityName(availability);
final iconData = availabilityIcon(availability);
final icon = availabilityIcon(availability, size: iconSize);
return Row(mainAxisSize: MainAxisSize.min, children: [
Icon(iconData, size: 32),
Text(name, style: textTheme.labelSmall)
]);
return vertical
? Column(
mainAxisSize: MainAxisSize.min,
//mainAxisAlignment: MainAxisAlignment.center,
children: [
icon,
Text(name, style: textTheme.labelSmall).paddingLTRB(0, 0, 0, 0)
])
: Row(mainAxisSize: MainAxisSize.min, children: [
icon,
Text(name, style: textTheme.labelSmall).paddingLTRB(8, 0, 0, 0)
]);
}
////////////////////////////////////////////////////////////////////////////
final proto.Availability availability;
final bool vertical;
final double iconSize;
@override
void debugFillProperties(DiagnosticPropertiesBuilder properties) {
super.debugFillProperties(properties);
properties.add(
DiagnosticsProperty<proto.Availability>('availability', availability));
properties
..add(
DiagnosticsProperty<proto.Availability>('availability', availability))
..add(DiagnosticsProperty<bool>('vertical', vertical))
..add(DoubleProperty('iconSize', iconSize));
}
}

View File

@ -28,24 +28,28 @@ class ContactItemWidget extends StatelessWidget {
Widget build(
BuildContext context,
) {
late final String title;
late final String subtitle;
final theme = Theme.of(context);
final scale = theme.extension<ScaleScheme>()!;
final scaleConfig = theme.extension<ScaleConfig>()!;
if (_contact.nickname.isNotEmpty) {
title = _contact.nickname;
if (_contact.profile.pronouns.isNotEmpty) {
subtitle = '${_contact.profile.name} (${_contact.profile.pronouns})';
} else {
subtitle = _contact.profile.name;
}
} else {
title = _contact.profile.name;
if (_contact.profile.pronouns.isNotEmpty) {
subtitle = '(${_contact.profile.pronouns})';
} else {
subtitle = '';
}
}
final name = _contact.nameOrNickname;
final title = _contact.displayName;
final subtitle = _contact.profile.status;
final avatar = AvatarWidget(
name: name,
size: 34,
borderColor: _disabled
? scale.grayScale.primaryText
: scale.primaryScale.primaryText,
foregroundColor: _disabled
? scale.grayScale.primaryText
: scale.primaryScale.primaryText,
backgroundColor:
_disabled ? scale.grayScale.primary : scale.primaryScale.primary,
scaleConfig: scaleConfig,
textStyle: theme.textTheme.titleLarge!,
);
return SliderTile(
key: ObjectKey(_contact),
@ -54,7 +58,7 @@ class ContactItemWidget extends StatelessWidget {
tileScale: ScaleKind.primary,
title: title,
subtitle: subtitle,
icon: Icons.person,
leading: avatar,
onDoubleTap: _onDoubleTap == null
? null
: () => singleFuture<void>((this, _kOnTap), () async {

View File

@ -5,6 +5,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_translate/flutter_translate.dart';
import 'package:searchable_listview/searchable_listview.dart';
import 'package:star_menu/star_menu.dart';
import 'package:veilid_support/veilid_support.dart';
import '../../chat_list/chat_list.dart';
@ -71,6 +72,75 @@ class _ContactsBrowserState extends State<ContactsBrowser>
final scale = theme.extension<ScaleScheme>()!;
final scaleConfig = theme.extension<ScaleConfig>()!;
final menuIconColor = scaleConfig.preferBorders
? scale.primaryScale.hoverBorder
: scale.primaryScale.borderText;
final menuBackgroundColor = scaleConfig.preferBorders
? scale.primaryScale.elementBackground
: scale.primaryScale.border;
// final menuHoverColor = scaleConfig.preferBorders
// ? scale.primaryScale.hoverElementBackground
// : scale.primaryScale.hoverBorder;
final menuBorderColor = scale.primaryScale.hoverBorder;
final menuParams = StarMenuParameters(
shape: MenuShape.grid,
checkItemsScreenBoundaries: true,
centerOffset: const Offset(0, 64),
backgroundParams:
BackgroundParams(backgroundColor: theme.shadowColor.withAlpha(128)),
boundaryBackground: BoundaryBackground(
color: menuBackgroundColor,
decoration: ShapeDecoration(
color: menuBackgroundColor,
shape: RoundedRectangleBorder(
side: scaleConfig.useVisualIndicators
? BorderSide(
width: 2, color: menuBorderColor, strokeAlign: 0)
: BorderSide.none,
borderRadius: BorderRadius.circular(
8 * scaleConfig.borderRadiusScale)))));
final receiveInviteMenuItems = [
Column(mainAxisSize: MainAxisSize.min, children: [
IconButton(
onPressed: () async {
_receiveInviteMenuController.closeMenu!();
await ScanInvitationDialog.show(context);
},
iconSize: 32,
icon: Icon(
Icons.qr_code_scanner,
size: 32,
color: menuIconColor,
),
),
Text(translate('add_contact_sheet.scan_invite'),
maxLines: 2,
textAlign: TextAlign.center,
style: textTheme.labelSmall!.copyWith(color: menuIconColor))
]).paddingAll(4),
Column(mainAxisSize: MainAxisSize.min, children: [
IconButton(
onPressed: () async {
_receiveInviteMenuController.closeMenu!();
await PasteInvitationDialog.show(context);
},
iconSize: 32,
icon: Icon(
Icons.paste,
size: 32,
color: menuIconColor,
),
),
Text(translate('add_contact_sheet.paste_invite'),
maxLines: 2,
textAlign: TextAlign.center,
style: textTheme.labelSmall!.copyWith(color: menuIconColor))
]).paddingAll(4)
];
return Row(mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [
Column(mainAxisSize: MainAxisSize.min, children: [
IconButton(
@ -80,30 +150,36 @@ class _ContactsBrowserState extends State<ContactsBrowser>
iconSize: 32,
icon: const Icon(Icons.contact_page),
color: scale.primaryScale.hoverBorder,
tooltip: translate('add_contact_sheet.create_invite'),
)
]),
Column(mainAxisSize: MainAxisSize.min, children: [
IconButton(
onPressed: () async {
await ScanInvitationDialog.show(context);
},
iconSize: 32,
icon: const Icon(Icons.qr_code_scanner),
color: scale.primaryScale.hoverBorder,
tooltip: translate('add_contact_sheet.scan_invite')),
]),
Column(mainAxisSize: MainAxisSize.min, children: [
IconButton(
onPressed: () async {
await PasteInvitationDialog.show(context);
},
iconSize: 32,
icon: const Icon(Icons.paste),
color: scale.primaryScale.hoverBorder,
tooltip: translate('add_contact_sheet.paste_invite'),
),
])
Text(translate('add_contact_sheet.create_invite'),
maxLines: 2,
textAlign: TextAlign.center,
style: textTheme.labelSmall!
.copyWith(color: scale.primaryScale.hoverBorder))
]),
StarMenu(
items: receiveInviteMenuItems,
onItemTapped: (_index, controller) {
controller.closeMenu!();
},
controller: _receiveInviteMenuController,
params: menuParams,
child: Column(mainAxisSize: MainAxisSize.min, children: [
IconButton(
onPressed: () {},
iconSize: 32,
icon: ImageIcon(
const AssetImage('assets/images/handshake.png'),
size: 32,
color: scale.primaryScale.hoverBorder,
)),
Text(translate('add_contact_sheet.receive_invite'),
maxLines: 2,
textAlign: TextAlign.center,
style: textTheme.labelSmall!
.copyWith(color: scale.primaryScale.hoverBorder))
]),
),
]).paddingAll(16);
}
@ -112,7 +188,7 @@ class _ContactsBrowserState extends State<ContactsBrowser>
final theme = Theme.of(context);
final textTheme = theme.textTheme;
final scale = theme.extension<ScaleScheme>()!;
final scaleConfig = theme.extension<ScaleConfig>()!;
//final scaleConfig = theme.extension<ScaleConfig>()!;
final cilState = context.watch<ContactInvitationListCubit>().state;
final cilBusy = cilState.busy;
@ -244,4 +320,7 @@ class _ContactsBrowserState extends State<ContactsBrowser>
await chatListCubit.deleteChat(
localConversationRecordKey: localConversationRecordKey);
}
////////////////////////////////////////////////////////////////////////////
final _receiveInviteMenuController = StarMenuController();
}

View File

@ -1,18 +1,14 @@
import 'package:awesome_extensions/awesome_extensions.dart';
import 'package:fast_immutable_collections/fast_immutable_collections.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_translate/flutter_translate.dart';
import 'package:go_router/go_router.dart';
import 'package:provider/provider.dart';
import '../../chat/chat.dart';
import '../../chat_list/chat_list.dart';
import '../../proto/proto.dart' as proto;
import '../../contact_invitation/contact_invitation.dart';
import '../../layout/layout.dart';
import '../../proto/proto.dart' as proto;
import '../../theme/theme.dart';
import '../../veilid_processor/veilid_processor.dart';
import '../contacts.dart';
class ContactsDialog extends StatefulWidget {
@ -48,9 +44,9 @@ class _ContactsDialogState extends State<ContactsDialog> {
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
final textTheme = theme.textTheme;
// final textTheme = theme.textTheme;
final scale = theme.extension<ScaleScheme>()!;
final scaleConfig = theme.extension<ScaleConfig>()!;
// final scaleConfig = theme.extension<ScaleConfig>()!;
final enableSplit = !isMobileWidth(context);
final enableLeft = enableSplit || _selectedContact == null;
@ -105,7 +101,7 @@ class _ContactsDialogState extends State<ContactsDialog> {
.toVeilid(),
onContactSelected: onContactSelected,
onChatStarted: onChatStarted,
).paddingAll(8)))),
).paddingLTRB(8, 0, 8, 8)))),
if (enableRight)
if (_selectedContact == null)
const NoContactWidget().expanded()

View File

@ -31,6 +31,7 @@ extension MessageExt on proto.Message {
}
extension ContactExt on proto.Contact {
String get nameOrNickname => nickname.isNotEmpty ? nickname : profile.name;
String get displayName =>
nickname.isNotEmpty ? '$nickname (${profile.name})' : profile.name;
}

View File

@ -31,7 +31,8 @@ class SliderTile extends StatelessWidget {
this.startActions = const [],
this.onTap,
this.onDoubleTap,
this.icon,
this.leading,
this.trailing,
super.key});
final bool disabled;
@ -41,7 +42,8 @@ class SliderTile extends StatelessWidget {
final List<SliderTileAction> startActions;
final GestureTapCallback? onTap;
final GestureTapCallback? onDoubleTap;
final IconData? icon;
final Widget? leading;
final Widget? trailing;
final String title;
final String subtitle;
@ -55,11 +57,12 @@ class SliderTile extends StatelessWidget {
..add(IterableProperty<SliderTileAction>('endActions', endActions))
..add(IterableProperty<SliderTileAction>('startActions', startActions))
..add(ObjectFlagProperty<GestureTapCallback?>.has('onTap', onTap))
..add(DiagnosticsProperty<IconData?>('icon', icon))
..add(DiagnosticsProperty<Widget?>('leading', leading))
..add(StringProperty('title', title))
..add(StringProperty('subtitle', subtitle))
..add(ObjectFlagProperty<GestureTapCallback?>.has(
'onDoubleTap', onDoubleTap));
'onDoubleTap', onDoubleTap))
..add(DiagnosticsProperty<Widget?>('trailing', trailing));
}
@override
@ -156,6 +159,7 @@ class SliderTile extends StatelessWidget {
subtitle: subtitle.isNotEmpty ? Text(subtitle) : null,
iconColor: textColor,
textColor: textColor,
leading: icon == null ? null : Icon(icon))))));
leading: FittedBox(child: leading),
trailing: FittedBox(child: trailing))))));
}
}

View File

@ -8,6 +8,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_spinkit/flutter_spinkit.dart';
import 'package:flutter_sticky_header/flutter_sticky_header.dart';
import 'package:meta/meta.dart';
import 'package:quickalert/quickalert.dart';
import 'package:sliver_expandable/sliver_expandable.dart';
@ -27,6 +28,38 @@ extension SizeToFixExt on Widget {
);
}
extension FocusExt<T> on Widget {
Focus focus(
{Key? key,
FocusNode? focusNode,
FocusNode? parentNode,
bool autofocus = false,
ValueChanged<bool>? onFocusChange,
FocusOnKeyEventCallback? onKeyEvent,
bool? canRequestFocus,
bool? skipTraversal,
bool? descendantsAreFocusable,
bool? descendantsAreTraversable,
bool includeSemantics = true,
String? debugLabel}) =>
Focus(
key: key,
focusNode: focusNode,
parentNode: parentNode,
autofocus: autofocus,
onFocusChange: onFocusChange,
onKeyEvent: onKeyEvent,
canRequestFocus: canRequestFocus,
skipTraversal: skipTraversal,
descendantsAreFocusable: descendantsAreFocusable,
descendantsAreTraversable: descendantsAreTraversable,
includeSemantics: includeSemantics,
debugLabel: debugLabel,
child: this);
Focus onFocusChange(void Function(bool) onFocusChange) =>
Focus(onFocusChange: onFocusChange, child: this);
}
extension ModalProgressExt on Widget {
BlurryModalProgressHUD withModalHUD(BuildContext context, bool isLoading) {
final theme = Theme.of(context);

View File

@ -1468,6 +1468,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "1.11.1"
star_menu:
dependency: "direct main"
description:
name: star_menu
sha256: f29c7d255677c49ec2412ec2d17220d967f54b72b9e6afc5688fe122ea4d1d78
url: "https://pub.dev"
source: hosted
version: "4.0.1"
stream_channel:
dependency: transitive
description:

View File

@ -97,6 +97,7 @@ dependencies:
ref: main
split_view: ^3.2.1
stack_trace: ^1.11.1
star_menu: ^4.0.1
stream_transform: ^2.1.0
transitioned_indexed_stack: ^1.0.2
url_launcher: ^6.3.0
@ -163,6 +164,8 @@ flutter:
- assets/images/title.svg
- assets/images/vlogo.svg
- assets/images/ellet.png
- assets/images/toilet.png
- assets/images/handshake.png
# Printing
- assets/js/pdf/3.2.146/pdf.min.js
# Sounds