Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

make phone number field editable #804

Merged
merged 9 commits into from
Jan 8, 2025
Merged

make phone number field editable #804

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
f475751
WIP: make phone number field editable
AlaaElattar Dec 11, 2024
76c24ae
update dialog of adding phone number
AlaaElattar Dec 22, 2024
ae9e427
Merge branch 'development' of github.com:threefoldtech/threefold_conn…
AlaaElattar Dec 22, 2024
3206893
check if phone is duplicate && add edit icon
AlaaElattar Dec 25, 2024
ef2dcf1
update re-virifaction msg && increase space
AlaaElattar Dec 26, 2024
ac40563
Merge branch 'development' of github.com:threefoldtech/threefold_conn…
AlaaElattar Jan 5, 2025
4b3311a
handle validation msg && spaces
AlaaElattar Jan 5, 2025
1a48766
Merge branch 'development' of github.com:threefoldtech/threefold_conn…
AlaaElattar Jan 5, 2025
8ef82b2
Adjust the UI of phone widget dialog
AhmedHanafy725 Jan 8, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 26 additions & 10 deletions app/lib/screens/identity_verification_screen.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -922,8 +922,7 @@ class _IdentityVerificationScreenState
if (Globals().hidePhoneButton.value == true) {
return;
}

await addPhoneNumberDialog(context);
await addPhoneNumberDialog(context, newPhone: false);

var phoneMap = (await getPhone());
if (phoneMap.isEmpty || !phoneMap.containsKey('phone')) {
Expand Down Expand Up @@ -1072,14 +1071,25 @@ class _IdentityVerificationScreenState

Widget verifiedWidget(step, text, icon) {
return GestureDetector(
onTap: () async {
if (step == 1) {
return _changeEmailDialog(false);
}
// Only make this section clickable if it is Identity Verification + Current Phase
if (step != 3) {
return;
onTap: () async {
if (step == 1) {
return _changeEmailDialog(false);
}
if (step == 2) {
await addPhoneNumberDialog(context, newPhone: false);
var phoneMap = (await getPhone());
String? phoneNumber = phoneMap['phone'];
if (phone != phoneNumber) {
setState(() {
phone = phoneNumber!;
});
}
return;
}
// Only make this section clickable if it is Identity Verification + Current Phase
if (step != 3) {
return;
}

return showIdentityDetails();
},
Expand Down Expand Up @@ -1788,7 +1798,7 @@ class _IdentityVerificationScreenState
}

if (phone.isEmpty) {
await addPhoneNumberDialog(context);
await addPhoneNumberDialog(context, newPhone: true);

var phoneMap = (await getPhone());
if (phoneMap.isEmpty || !phoneMap.containsKey('phone')) {
Expand All @@ -1806,9 +1816,15 @@ class _IdentityVerificationScreenState
FlutterPkid client = await getPkidClient();
client.setPKidDoc('phone', json.encode({'phone': phone}));

startPhoneNumberCounter();
return;
} else {
PhoneAlertDialogState().sendPhoneVerification();
return;
}
}

void startPhoneNumberCounter() {
int currentTime = DateTime.now().millisecondsSinceEpoch;
if (globals.tooManySmsAttempts && globals.lockedSmsUntil > currentTime) {
globals.sendSmsAttempts = 0;
Expand Down
115 changes: 73 additions & 42 deletions app/lib/widgets/phone_widget.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,15 +14,15 @@ import 'package:threebotlogin/services/shared_preference_service.dart';

import 'custom_dialog.dart';

Future<void> addPhoneNumberDialog(context) async {
Future<void> addPhoneNumberDialog(context, {required bool newPhone}) async {
Response res = await getCountry();
var countryCode = res.body.replaceAll('\n', '');

await showDialog(
context: context,
barrierDismissible: false,
builder: (BuildContext context) =>
PhoneAlertDialog(defaultCountryCode: countryCode),
PhoneAlertDialog(defaultCountryCode: countryCode, newPhone: newPhone),
);
}

Expand All @@ -48,8 +48,10 @@ phoneSendDialog(context) {

class PhoneAlertDialog extends StatefulWidget {
final String defaultCountryCode;
final bool newPhone;

const PhoneAlertDialog({Key? key, required this.defaultCountryCode})
const PhoneAlertDialog(
{Key? key, required this.defaultCountryCode, required this.newPhone})
: super(key: key);

@override
Expand All @@ -76,50 +78,79 @@ class PhoneAlertDialogState extends State<PhoneAlertDialog> {
Widget build(BuildContext context) {
return CustomDialog(
image: Icons.phone,
title: 'Add phone number',
title: widget.newPhone
? 'Add phone number'
: 'Change phone number',
widgetDescription: SizedBox(
height: 100,
child: Row(
children: <Widget>[
Expanded(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: IntlPhoneField(
initialCountryCode: widget.defaultCountryCode,
decoration: const InputDecoration(
labelText: 'Phone Number',
border: OutlineInputBorder(
borderSide: BorderSide(),
height: widget.newPhone ? 100 : 180,
AlaaElattar marked this conversation as resolved.
Show resolved Hide resolved
child: Column(
children: [
if (!widget.newPhone)
Row(
children: <Widget>[
Expanded(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Text(
'Changing your phone will require you to go through the phone verification process again.',
Copy link
Contributor

@zaelgohary zaelgohary Dec 24, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
'Changing your phone will require you to go through the phone verification process again.',
'Changing your phone will require re-verification.',

Same with email msg.

Also, can we add more space between the msg & the input? and maybe increase space at the bottom of the cancel btn.

image

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

  • All applied except the space under Cancel button, It's a custom dialog used everywhere. They should be all consistent.

style: Theme.of(context)
.textTheme
.bodyLarge!
.copyWith(
color:
Theme.of(context).colorScheme.onSurface),
),
),
),
style: Theme.of(context).textTheme.bodyMedium!.copyWith(
color: Theme.of(context).colorScheme.onSurface),
dropdownTextStyle: Theme.of(context)
.textTheme
.bodyMedium!
.copyWith(
],
),
if (!widget.newPhone)
const SizedBox(
height: 20,
),
Row(
children: <Widget>[
Expanded(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: IntlPhoneField(
initialCountryCode: widget.defaultCountryCode,
decoration: const InputDecoration(
labelText: 'Phone Number',
border: OutlineInputBorder(
borderSide: BorderSide(),
),
),
style: Theme.of(context).textTheme.bodyMedium!.copyWith(
color: Theme.of(context).colorScheme.onSurface),
onChanged: (phone) {
PhoneNumber p = phone;
setState(() {
if (phone.number.length >= _country.minLength &&
phone.number.length <= _country.maxLength) {
valid = true;
verificationPhoneNumber = p.completeNumber;
} else {
valid = false;
}
});
},
onCountryChanged: (country) {
if (_country != country) {
valid = false;
}
_country = country;
setState(() {});
},
dropdownTextStyle: Theme.of(context)
.textTheme
.bodyMedium!
.copyWith(
color: Theme.of(context).colorScheme.onSurface),
onChanged: (phone) {
PhoneNumber p = phone;
setState(() {
if (phone.number.length >= _country.minLength &&
phone.number.length <= _country.maxLength) {
valid = true;
verificationPhoneNumber = p.completeNumber;
} else {
valid = false;
}
});
},
onCountryChanged: (country) {
if (_country != country) {
valid = false;
}
_country = country;
setState(() {});
},
),
),
),
),
],
),
],
),
Expand Down
Loading