Delete Account: Add feedback form
This commit is contained in:
parent
5cc4e07f26
commit
d13241cd24
|
@ -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,
|
||||
'It’s missing a key feature that I need',
|
||||
'I found another service that I like better',
|
||||
'I use a different account',
|
||||
'My reason isn’t 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,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
|
Loading…
Reference in a new issue