💄 Update the account settings to match the app settings style

This commit is contained in:
2025-12-21 23:06:12 +08:00
parent 9c1eb8e5bc
commit 2df31e4244

View File

@@ -135,8 +135,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
ref
.watch(accountConnectionsProvider)
.when(
data:
(connections) => Column(
data: (connections) => Column(
children: [
for (final connection in connections)
ListTile(
@@ -147,20 +146,17 @@ class AccountSettingsScreen extends HookConsumerWidget {
top: 2,
bottom: 4,
),
title:
Text(
title: Text(
getLocalizedProviderName(connection.provider),
).tr(),
subtitle:
connection.meta['email'] != null
subtitle: connection.meta['email'] != null
? Text(connection.meta['email'])
: Text(connection.providedIdentifier),
leading: CircleAvatar(
child: getProviderIcon(
connection.provider,
size: 16,
color:
Theme.of(
color: Theme.of(
context,
).colorScheme.onPrimaryContainer,
),
@@ -169,10 +165,8 @@ class AccountSettingsScreen extends HookConsumerWidget {
onTap: () {
showModalBottomSheet(
context: context,
builder:
(context) => AccountConnectionSheet(
connection: connection,
),
builder: (context) =>
AccountConnectionSheet(connection: connection),
).then((value) {
if (value == true) {
ref.invalidate(accountConnectionsProvider);
@@ -193,8 +187,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
onTap: () {
showModalBottomSheet(
context: context,
builder:
(context) =>
builder: (context) =>
const AccountConnectionNewSheet(),
).then((value) {
if (value == true) {
@@ -205,8 +198,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
),
],
),
error:
(err, _) => ResponseErrorWidget(
error: (err, _) => ResponseErrorWidget(
error: err,
onRetry: () => ref.invalidate(accountConnectionsProvider),
),
@@ -223,8 +215,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
tilePadding: const EdgeInsets.only(left: 24, right: 17),
children: [
authFactors.when(
data:
(factors) => Column(
data: (factors) => Column(
children: [
for (final factor in factors)
ListTile(
@@ -235,35 +226,22 @@ class AccountSettingsScreen extends HookConsumerWidget {
top: 2,
bottom: 4,
),
title:
Text(
title: Text(
kFactorTypes[factor.type]!.$1,
style:
factor.enabledAt == null
? TextStyle(
decoration: TextDecoration.lineThrough,
)
style: factor.enabledAt == null
? TextStyle(decoration: TextDecoration.lineThrough)
: null,
).tr(),
subtitle:
Text(
subtitle: Text(
kFactorTypes[factor.type]!.$2,
style:
factor.enabledAt == null
? TextStyle(
decoration: TextDecoration.lineThrough,
)
style: factor.enabledAt == null
? TextStyle(decoration: TextDecoration.lineThrough)
: null,
).tr(),
leading: CircleAvatar(
backgroundColor:
factor.enabledAt == null
? Theme.of(
context,
).colorScheme.secondaryContainer
: Theme.of(
context,
).colorScheme.primaryContainer,
backgroundColor: factor.enabledAt == null
? Theme.of(context).colorScheme.secondaryContainer
: Theme.of(context).colorScheme.primaryContainer,
child: Icon(kFactorTypes[factor.type]!.$3),
).padding(top: 4),
trailing: const Icon(Symbols.chevron_right),
@@ -275,8 +253,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
}
showModalBottomSheet(
context: context,
builder:
(context) => AuthFactorSheet(factor: factor),
builder: (context) => AuthFactorSheet(factor: factor),
).then((value) {
if (value == true) {
ref.invalidate(authFactorsProvider);
@@ -287,10 +264,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
if (factors.isNotEmpty) Divider(height: 1),
ListTile(
minLeadingWidth: 48,
contentPadding: const EdgeInsets.only(
left: 24,
right: 17,
),
contentPadding: const EdgeInsets.only(left: 24, right: 17),
title: Text('authFactorNew').tr(),
leading: const Icon(Symbols.add),
trailing: const Icon(Symbols.chevron_right),
@@ -307,8 +281,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
),
],
),
error:
(err, _) => ResponseErrorWidget(
error: (err, _) => ResponseErrorWidget(
error: err,
onRetry: () => ref.invalidate(authFactorsProvider),
),
@@ -327,8 +300,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
ref
.watch(contactMethodsProvider)
.when(
data:
(contacts) => Column(
data: (contacts) => Column(
children: [
for (final contact in contacts)
ListTile(
@@ -341,8 +313,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
),
title: Text(
contact.content,
style:
contact.verifiedAt == null
style: contact.verifiedAt == null
? TextStyle(
decoration: TextDecoration.lineThrough,
)
@@ -352,26 +323,18 @@ class AccountSettingsScreen extends HookConsumerWidget {
contact.type == 0
? 'contactMethodTypeEmail'.tr()
: 'contactMethodTypePhone'.tr(),
style:
contact.verifiedAt == null
style: contact.verifiedAt == null
? TextStyle(
decoration: TextDecoration.lineThrough,
)
: null,
),
leading: CircleAvatar(
backgroundColor:
contact.verifiedAt == null
? Theme.of(
context,
).colorScheme.secondaryContainer
: Theme.of(
context,
).colorScheme.primaryContainer,
backgroundColor: contact.verifiedAt == null
? Theme.of(context).colorScheme.secondaryContainer
: Theme.of(context).colorScheme.primaryContainer,
child: Icon(
contact.type == 0
? Symbols.mail
: Symbols.phone,
contact.type == 0 ? Symbols.mail : Symbols.phone,
),
).padding(top: 4),
trailing: const Icon(Symbols.chevron_right),
@@ -379,8 +342,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
onTap: () {
showModalBottomSheet(
context: context,
builder:
(context) =>
builder: (context) =>
ContactMethodSheet(contact: contact),
).then((value) {
if (value == true) {
@@ -402,8 +364,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
onTap: () {
showModalBottomSheet(
context: context,
builder:
(context) => const ContactMethodNewSheet(),
builder: (context) => const ContactMethodNewSheet(),
).then((value) {
if (value == true) {
ref.invalidate(contactMethodsProvider);
@@ -413,8 +374,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
),
],
),
error:
(err, _) => ResponseErrorWidget(
error: (err, _) => ResponseErrorWidget(
error: err,
onRetry: () => ref.invalidate(contactMethodsProvider),
),
@@ -439,6 +399,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
// Create a responsive layout based on screen width
Widget buildSettingsList() {
return Column(
spacing: 16,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_SettingsSection(
@@ -450,14 +411,13 @@ class AccountSettingsScreen extends HookConsumerWidget {
children: dangerZoneSettings,
),
],
);
).padding(horizontal: 16);
}
return AppScaffold(
appBar: AppBar(
title: Text('accountSettings').tr(),
actions:
isDesktop
actions: isDesktop
? [
IconButton(
icon: const Icon(Symbols.help_outline),
@@ -465,8 +425,7 @@ class AccountSettingsScreen extends HookConsumerWidget {
// Show help dialog
showDialog(
context: context,
builder:
(context) => AlertDialog(
builder: (context) => AlertDialog(
title: Text('accountSettingsHelp').tr(),
content: Text('accountSettingsHelpContent').tr(),
actions: [
@@ -513,7 +472,9 @@ class _SettingsSection extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Column(
return Card(
margin: EdgeInsets.zero,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
@@ -529,6 +490,7 @@ class _SettingsSection extends StatelessWidget {
...children,
const SizedBox(height: 16),
],
),
);
}
}