Skip to content

Commit 1c6ffa9

Browse files
committed
fix(ui): clean up flow logic and state issues
1 parent 8ed3d33 commit 1c6ffa9

1 file changed

Lines changed: 136 additions & 160 deletions

File tree

lib/pages/shopinbit/shopinbit_settings_view.dart

Lines changed: 136 additions & 160 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,13 @@ import '../../utilities/assets.dart';
1313
import '../../utilities/text_styles.dart';
1414
import '../../utilities/util.dart';
1515
import '../../widgets/background.dart';
16+
import '../../widgets/conditional_parent.dart';
1617
import '../../widgets/custom_buttons/app_bar_icon_button.dart';
1718
import '../../widgets/desktop/desktop_dialog.dart';
1819
import '../../widgets/desktop/desktop_dialog_close_button.dart';
1920
import '../../widgets/desktop/primary_button.dart';
2021
import '../../widgets/desktop/secondary_button.dart';
22+
import '../../widgets/dialogs/s_dialog.dart';
2123
import '../../widgets/rounded_container.dart';
2224
import '../../widgets/rounded_white_container.dart';
2325
import '../../widgets/stack_dialog.dart';
@@ -35,7 +37,6 @@ class ShopInBitSettingsView extends ConsumerStatefulWidget {
3537

3638
class _ShopInBitSettingsViewState extends ConsumerState<ShopInBitSettingsView> {
3739
final _manualKeyController = TextEditingController();
38-
final _verifyKeyController = TextEditingController();
3940
final _displayNameController = TextEditingController();
4041

4142
String? _currentKey;
@@ -66,7 +67,6 @@ class _ShopInBitSettingsViewState extends ConsumerState<ShopInBitSettingsView> {
6667
@override
6768
void dispose() {
6869
_manualKeyController.dispose();
69-
_verifyKeyController.dispose();
7070
_displayNameController.dispose();
7171
super.dispose();
7272
}
@@ -173,7 +173,7 @@ class _ShopInBitSettingsViewState extends ConsumerState<ShopInBitSettingsView> {
173173
}
174174

175175
Future<bool?> _showChangeWarning() async {
176-
final result = await showDialog<bool>(
176+
final confirmSaved = await showDialog<bool>(
177177
context: context,
178178
builder: (context) {
179179
// TODO: this conditional can probably be merged when we have time
@@ -237,7 +237,7 @@ class _ShopInBitSettingsViewState extends ConsumerState<ShopInBitSettingsView> {
237237
onPressed: () => Navigator.of(
238238
context,
239239
rootNavigator: true,
240-
).pop(false),
240+
).pop(),
241241
),
242242
),
243243
const SizedBox(width: 16),
@@ -248,7 +248,7 @@ class _ShopInBitSettingsViewState extends ConsumerState<ShopInBitSettingsView> {
248248
onPressed: () => Navigator.of(
249249
context,
250250
rootNavigator: true,
251-
).pop(null),
251+
).pop(true),
252252
),
253253
),
254254
],
@@ -303,7 +303,7 @@ class _ShopInBitSettingsViewState extends ConsumerState<ShopInBitSettingsView> {
303303
style: Theme.of(context)
304304
.extension<StackColors>()!
305305
.getSecondaryEnabledButtonStyle(context),
306-
onPressed: () => Navigator.of(context).pop(false),
306+
onPressed: () => Navigator.of(context).pop(),
307307
child: Text(
308308
"Cancel",
309309
style: STextStyles.button(context).copyWith(
@@ -320,7 +320,7 @@ class _ShopInBitSettingsViewState extends ConsumerState<ShopInBitSettingsView> {
320320
style: Theme.of(context)
321321
.extension<StackColors>()!
322322
.getPrimaryEnabledButtonStyle(context),
323-
onPressed: () => Navigator.of(context).pop(null),
323+
onPressed: () => Navigator.of(context).pop(true),
324324
child: Text(
325325
"I saved my key",
326326
style: STextStyles.button(context),
@@ -336,163 +336,12 @@ class _ShopInBitSettingsViewState extends ConsumerState<ShopInBitSettingsView> {
336336
},
337337
);
338338

339-
if (result == false || !mounted) return false;
340-
341-
return _showVerifyDialog();
342-
}
339+
if (confirmSaved != true || !mounted) return false;
343340

344-
Future<bool?> _showVerifyDialog() async {
345-
_verifyKeyController.clear();
346341
return showDialog<bool>(
347342
context: context,
348343
barrierDismissible: true,
349-
builder: (context) {
350-
return StatefulBuilder(
351-
builder: (ctx, setDialogState) {
352-
final matches = _verifyKeyController.text.trim() == _currentKey;
353-
354-
// TODO: this conditional can probably be merged when we have time
355-
if (Util.isDesktop) {
356-
return DesktopDialog(
357-
maxWidth: 550,
358-
maxHeight: double.infinity,
359-
child: Column(
360-
children: [
361-
Row(
362-
mainAxisAlignment: MainAxisAlignment.spaceBetween,
363-
children: [
364-
Padding(
365-
padding: const EdgeInsets.all(32),
366-
child: Text(
367-
"Verify your key",
368-
style: STextStyles.desktopH3(ctx),
369-
),
370-
),
371-
const DesktopDialogCloseButton(),
372-
],
373-
),
374-
Padding(
375-
padding: const EdgeInsets.only(
376-
left: 32,
377-
right: 32,
378-
bottom: 32,
379-
),
380-
child: Column(
381-
crossAxisAlignment: CrossAxisAlignment.start,
382-
children: [
383-
Text(
384-
"Enter your current customer key to "
385-
"confirm you have saved it.",
386-
style: STextStyles.desktopTextExtraExtraSmall(ctx),
387-
),
388-
const SizedBox(height: 16),
389-
AdaptiveTextField(
390-
labelText: "Enter current key",
391-
controller: _verifyKeyController,
392-
onChangedComprehensive: (_) =>
393-
setDialogState(() {}),
394-
),
395-
const SizedBox(height: 32),
396-
Row(
397-
children: [
398-
Expanded(
399-
child: SecondaryButton(
400-
label: "Cancel",
401-
buttonHeight: ButtonHeight.l,
402-
onPressed: () => Navigator.of(
403-
ctx,
404-
rootNavigator: true,
405-
).pop(false),
406-
),
407-
),
408-
const SizedBox(width: 16),
409-
Expanded(
410-
child: PrimaryButton(
411-
label: "Confirm",
412-
buttonHeight: ButtonHeight.l,
413-
enabled: matches,
414-
onPressed: () => Navigator.of(
415-
ctx,
416-
rootNavigator: true,
417-
).pop(true),
418-
),
419-
),
420-
],
421-
),
422-
],
423-
),
424-
),
425-
],
426-
),
427-
);
428-
} else {
429-
return StackDialogBase(
430-
child: Column(
431-
crossAxisAlignment: CrossAxisAlignment.start,
432-
children: [
433-
Text(
434-
"Verify your key",
435-
style: STextStyles.pageTitleH2(ctx),
436-
),
437-
const SizedBox(height: 8),
438-
Text(
439-
"Enter your current customer key to "
440-
"confirm you have saved it.",
441-
style: STextStyles.smallMed14(ctx),
442-
),
443-
const SizedBox(height: 16),
444-
AdaptiveTextField(
445-
labelText: "Enter current key",
446-
controller: _verifyKeyController,
447-
onChangedComprehensive: (_) => setDialogState(() {}),
448-
),
449-
const SizedBox(height: 20),
450-
Row(
451-
children: [
452-
Expanded(
453-
child: TextButton(
454-
style: Theme.of(ctx)
455-
.extension<StackColors>()!
456-
.getSecondaryEnabledButtonStyle(ctx),
457-
onPressed: () => Navigator.of(ctx).pop(false),
458-
child: Text(
459-
"Cancel",
460-
style: STextStyles.button(ctx).copyWith(
461-
color: Theme.of(
462-
ctx,
463-
).extension<StackColors>()!.accentColorDark,
464-
),
465-
),
466-
),
467-
),
468-
const SizedBox(width: 8),
469-
Expanded(
470-
child: TextButton(
471-
style: matches
472-
? Theme.of(ctx)
473-
.extension<StackColors>()!
474-
.getPrimaryEnabledButtonStyle(ctx)
475-
: Theme.of(ctx)
476-
.extension<StackColors>()!
477-
.getPrimaryDisabledButtonStyle(ctx),
478-
onPressed: matches
479-
? () => Navigator.of(ctx).pop(true)
480-
: null,
481-
child: Text(
482-
"Confirm",
483-
style: STextStyles.button(ctx),
484-
),
485-
),
486-
),
487-
],
488-
),
489-
],
490-
),
491-
);
492-
}
493-
},
494-
);
495-
},
344+
builder: (_) => _VerifyKeyDialog(currentKey: _currentKey!),
496345
);
497346
}
498347

@@ -883,3 +732,130 @@ class _ShopInBitSettingsViewState extends ConsumerState<ShopInBitSettingsView> {
883732
}
884733
}
885734
}
735+
736+
class _VerifyKeyDialog extends StatefulWidget {
737+
const _VerifyKeyDialog({super.key, required this.currentKey});
738+
739+
final String currentKey;
740+
741+
@override
742+
State<_VerifyKeyDialog> createState() => _VerifyKeyDialogState();
743+
}
744+
745+
class _VerifyKeyDialogState extends State<_VerifyKeyDialog> {
746+
final _verifyKeyController = TextEditingController();
747+
748+
bool _confirmEnabled = false;
749+
750+
@override
751+
void dispose() {
752+
_verifyKeyController.dispose();
753+
super.dispose();
754+
}
755+
756+
@override
757+
Widget build(BuildContext context) {
758+
return ConditionalParent(
759+
condition: Util.isDesktop,
760+
builder: (child) => SDialog(
761+
child: SizedBox(
762+
width: 580,
763+
child: Column(
764+
mainAxisSize: .min,
765+
crossAxisAlignment: .start,
766+
children: [
767+
Row(
768+
mainAxisAlignment: MainAxisAlignment.spaceBetween,
769+
children: [
770+
Padding(
771+
padding: const EdgeInsets.all(32),
772+
child: Text(
773+
"Verify your key",
774+
style: STextStyles.desktopH3(context),
775+
),
776+
),
777+
const DesktopDialogCloseButton(),
778+
],
779+
),
780+
Padding(
781+
padding: const EdgeInsets.only(left: 32, right: 32, bottom: 32),
782+
child: child,
783+
),
784+
],
785+
),
786+
),
787+
),
788+
child: ConditionalParent(
789+
condition: !Util.isDesktop,
790+
builder: (child) => StackDialogBase(
791+
child: Column(
792+
mainAxisSize: .min,
793+
children: [
794+
Text("Verify your key", style: STextStyles.pageTitleH2(context)),
795+
const SizedBox(height: 24),
796+
child,
797+
],
798+
),
799+
),
800+
child: Column(
801+
mainAxisSize: .min,
802+
crossAxisAlignment: .start,
803+
children: [
804+
Text(
805+
"Enter your current customer key to "
806+
"confirm you have saved it.",
807+
style: Util.isDesktop
808+
? STextStyles.desktopTextExtraExtraSmall(context)
809+
: STextStyles.smallMed14(context),
810+
),
811+
Util.isDesktop
812+
? const SizedBox(height: 32)
813+
: const SizedBox(height: 16),
814+
AdaptiveTextField(
815+
labelText: "Enter current key",
816+
controller: _verifyKeyController,
817+
onChangedComprehensive: (_) {
818+
if (_verifyKeyController.text == widget.currentKey) {
819+
if (!_confirmEnabled) setState(() => _confirmEnabled = true);
820+
} else {
821+
if (_confirmEnabled) setState(() => _confirmEnabled = false);
822+
}
823+
},
824+
),
825+
Util.isDesktop
826+
? const SizedBox(height: 32)
827+
: const SizedBox(height: 24),
828+
Row(
829+
children: [
830+
Expanded(
831+
child: SecondaryButton(
832+
label: "Cancel",
833+
buttonHeight: ButtonHeight.l,
834+
onPressed: () => Navigator.of(
835+
context,
836+
rootNavigator: Util.isDesktop,
837+
).pop(false),
838+
),
839+
),
840+
const SizedBox(width: 16),
841+
Expanded(
842+
child: PrimaryButton(
843+
label: "Confirm",
844+
buttonHeight: ButtonHeight.l,
845+
enabled: _confirmEnabled,
846+
onPressed: _confirmEnabled
847+
? () => Navigator.of(
848+
context,
849+
rootNavigator: Util.isDesktop,
850+
).pop(true)
851+
: null,
852+
),
853+
),
854+
],
855+
),
856+
],
857+
),
858+
),
859+
);
860+
}
861+
}

0 commit comments

Comments
 (0)