Delete Account: Add feedback form

This commit is contained in:
Neeraj Gupta 2023-03-15 17:51:39 +05:30
parent 5cc4e07f26
commit d13241cd24
No known key found for this signature in database
GPG key ID: 3C5A1684DC1729E1

View file

@ -12,11 +12,29 @@ import 'package:photos/utils/crypto_util.dart';
import 'package:photos/utils/dialog_util.dart';
import 'package:photos/utils/email_util.dart';
class DeleteAccountPage extends StatelessWidget {
class DeleteAccountPage extends StatefulWidget {
const DeleteAccountPage({
Key? key,
}) : super(key: key);
@override
State<DeleteAccountPage> createState() => _DeleteAccountPageState();
}
class _DeleteAccountPageState extends State<DeleteAccountPage> {
bool _hasConfirmedDeletion = false;
final _feedbackTextCtrl = TextEditingController();
final _focusNode = FocusNode();
final String _defaultSelection = 'Select reason';
late String dropdownValue = _defaultSelection;
late List<String> deletionReason = [
_defaultSelection,
'Its missing a key feature that I need',
'I found another service that I like better',
'I use a different account',
'My reason isnt listed',
];
@override
Widget build(BuildContext context) {
final colorScheme = getEnteColorScheme(context);
@ -37,68 +55,151 @@ class DeleteAccountPage extends StatelessWidget {
child: Center(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
children: [
Image.asset(
'assets/broken_heart.png',
width: 200,
Text(
"What is the main reason you are deleting your account?",
style: getEnteTextTheme(context).body,
),
const SizedBox(
height: 24,
),
Center(
child: Text(
"We'll be sorry to see you go. Are you facing some issue?",
style: Theme.of(context)
.textTheme
.subtitle1!
.copyWith(color: colorScheme.textMuted),
const SizedBox(height: 4),
Container(
width: double.infinity,
height: 48,
padding: const EdgeInsets.only(left: 16, right: 6),
decoration: BoxDecoration(
color: colorScheme.fillFaint,
borderRadius: BorderRadius.circular(8),
),
child: DropdownButton<String>(
alignment: AlignmentDirectional.topStart,
value: dropdownValue,
icon: Icon(
Icons.expand_more_outlined,
color: colorScheme.strokeMuted,
),
onChanged: (String? newValue) {
setState(() {
dropdownValue = newValue!;
});
},
underline: const SizedBox(),
items: deletionReason
.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
enabled: value != _defaultSelection,
alignment: Alignment.centerLeft,
child: Text(
value,
style: value != _defaultSelection
? getEnteTextTheme(context).small
: getEnteTextTheme(context).smallMuted,
),
);
}).toList(),
),
),
const SizedBox(
height: 12,
const SizedBox(height: 24),
Text(
"We are sorry to see you go. Please explain why you are "
"leaving to help us improve.",
style: getEnteTextTheme(context).body,
),
RichText(
// textAlign: TextAlign.center,
text: TextSpan(
children: const [
TextSpan(text: "Please write to us at "),
TextSpan(
text: "feedback@ente.io",
style: TextStyle(color: Color.fromRGBO(29, 185, 84, 1)),
),
TextSpan(
text: ", maybe there is a way we can help.",
),
],
style: Theme.of(context)
.textTheme
.subtitle1!
.copyWith(color: colorScheme.textMuted),
const SizedBox(height: 4),
TextFormField(
decoration: InputDecoration(
enabledBorder: OutlineInputBorder(
borderSide:
BorderSide(color: colorScheme.strokeFaint, width: 1),
borderRadius: BorderRadius.circular(8),
),
focusedBorder: OutlineInputBorder(
borderSide:
BorderSide(color: colorScheme.strokeFaint, width: 1),
borderRadius: BorderRadius.circular(8),
),
filled: true,
fillColor: Colors.transparent,
hintText: "Feedback",
contentPadding: const EdgeInsets.all(12),
),
),
const SizedBox(
height: 24,
),
ButtonWidget(
buttonType: ButtonType.primary,
labelText: "Yes, send feedback",
icon: Icons.check_outlined,
onTap: () async {
await sendEmail(
context,
to: 'feedback@ente.io',
subject: '[Feedback]',
);
controller: _feedbackTextCtrl,
autofocus: false,
autocorrect: false,
focusNode: _focusNode,
keyboardType: TextInputType.multiline,
minLines: 3,
maxLines: null,
onChanged: (_) {
setState(() {});
},
),
const SizedBox(height: 8),
ButtonWidget(
buttonType: ButtonType.tertiaryCritical,
labelText: "No, delete account",
icon: Icons.no_accounts_outlined,
onTap: () async => {await _initiateDelete(context)},
shouldSurfaceExecutionStates: false,
)
(_focusNode.hasFocus || _hasConfirmedDeletion) &&
_feedbackTextCtrl.text.trim().length < 10
? SizedBox(
height: 42,
child: Padding(
padding: const EdgeInsets.only(top: 4.0),
child: Text(
"This field requires a minimum of 10 "
"characters",
style: getEnteTextTheme(context)
.smallBold
.copyWith(color: colorScheme.warning700),
),
),
)
: const SizedBox(height: 42),
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Checkbox(
value: _hasConfirmedDeletion,
side: CheckboxTheme.of(context).side,
onChanged: (value) {
setState(() {
_hasConfirmedDeletion = value!;
});
},
),
Expanded(
child: Text(
"Yes, I want to permanently delete this account and "
"all its data.",
style: getEnteTextTheme(context).bodyMuted,
),
)
],
),
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
ButtonWidget(
buttonType: ButtonType.critical,
labelText: "Delete my account",
isDisabled: !_hasConfirmedDeletion ||
_defaultSelection == dropdownValue ||
_feedbackTextCtrl.text.trim().length < 10,
onTap: () async => {await _initiateDelete(context)},
shouldSurfaceExecutionStates: false,
),
const SizedBox(height: 8),
ButtonWidget(
buttonType: ButtonType.secondary,
labelText: "Cancel",
onTap: () async {
Navigator.of(context).pop();
},
),
const SafeArea(
child: SizedBox(
height: 12,
),
),
],
),
),
],
),
),