Refresh DNS screen design

pull/111/head
Inex Code 2022-09-08 10:53:25 +03:00
parent 580da306e1
commit 3eda30d924
1 changed files with 112 additions and 125 deletions

View File

@ -22,46 +22,59 @@ class _DnsDetailsPageState extends State<DnsDetailsPage> {
String description = ''; String description = '';
String subtitle = ''; String subtitle = '';
Icon icon = const Icon( Icon icon = const Icon(
Icons.check, Icons.check_circle_outline,
color: Colors.green, size: 24.0,
); );
bool isError = false;
switch (dnsState) { switch (dnsState) {
case DnsRecordsStatus.uninitialized: case DnsRecordsStatus.uninitialized:
description = 'providers.domain.states.uninitialized'.tr(); description = 'providers.domain.states.uninitialized'.tr();
icon = const Icon( icon = const Icon(
Icons.refresh, Icons.refresh,
size: 24.0,
); );
isError = false;
break; break;
case DnsRecordsStatus.refreshing: case DnsRecordsStatus.refreshing:
description = 'providers.domain.states.refreshing'.tr(); description = 'providers.domain.states.refreshing'.tr();
icon = const Icon( icon = const Icon(
Icons.refresh, Icons.refresh,
size: 24.0,
); );
isError = false;
break; break;
case DnsRecordsStatus.good: case DnsRecordsStatus.good:
description = 'providers.domain.states.ok'.tr(); description = 'providers.domain.states.ok'.tr();
icon = const Icon( icon = const Icon(
Icons.check, Icons.check_circle_outline,
color: Colors.green, size: 24.0,
); );
isError = false;
break; break;
case DnsRecordsStatus.error: case DnsRecordsStatus.error:
description = 'providers.domain.states.error'.tr(); description = 'providers.domain.states.error'.tr();
subtitle = 'providers.domain.states.error_subtitle'.tr(); subtitle = 'providers.domain.states.error_subtitle'.tr();
icon = const Icon( icon = const Icon(
Icons.error, Icons.error_outline,
color: Colors.red, size: 24.0,
); );
isError = true;
break; break;
} }
return ListTile( return BrandCards.filled(
child: ListTile(
onTap: dnsState == DnsRecordsStatus.error ? () => fixCallback() : null, onTap: dnsState == DnsRecordsStatus.error ? () => fixCallback() : null,
title: Text(
description,
style: Theme.of(context).textTheme.headline6,
),
subtitle: subtitle != '' ? Text(subtitle) : null,
leading: icon, leading: icon,
title: Text(description),
subtitle: subtitle != '' ? Text(subtitle) : null,
textColor: isError
? Theme.of(context).colorScheme.error
: Theme.of(context).colorScheme.onSurfaceVariant,
iconColor: isError
? Theme.of(context).colorScheme.error
: Theme.of(context).colorScheme.onSurfaceVariant,
),
error: isError,
); );
} }
@ -94,36 +107,30 @@ class _DnsDetailsPageState extends State<DnsDetailsPage> {
); );
} }
final Color goodColor = Theme.of(context).colorScheme.onBackground;
final Color errorColor = Theme.of(context).colorScheme.error;
final Color neutralColor = Theme.of(context).colorScheme.onBackground;
return BrandHeroScreen( return BrandHeroScreen(
hasBackButton: true, hasBackButton: true,
heroSubtitle: domain, heroSubtitle: domain,
heroIcon: BrandIcons.globe, heroIcon: BrandIcons.globe,
heroTitle: 'providers.domain.screen_title'.tr(), heroTitle: 'providers.domain.screen_title'.tr(),
children: <Widget>[ children: <Widget>[
BrandCards.outlined(
child: Column(
children: [
_getStateCard(dnsCubit.dnsState, () { _getStateCard(dnsCubit.dnsState, () {
context.read<DnsRecordsCubit>().fix(); context.read<DnsRecordsCubit>().fix();
}), }),
],
),
),
const SizedBox(height: 16.0), const SizedBox(height: 16.0),
// Outlined card with a list of A records and their
// status.
BrandCards.outlined(
child: Column(
children: <Widget>[
ListTile( ListTile(
title: Text( title: Text(
'providers.domain.cards.services.title'.tr(), 'providers.domain.cards.services.title'.tr(),
style: Theme.of(context).textTheme.headline6, style: Theme.of(context).textTheme.headlineSmall!.copyWith(
color: Theme.of(context).colorScheme.secondary,
),
), ),
subtitle: Text( subtitle: Text(
'providers.domain.cards.services.subtitle'.tr(), 'providers.domain.cards.services.subtitle'.tr(),
style: Theme.of(context).textTheme.caption, style: Theme.of(context).textTheme.labelMedium,
), ),
), ),
...dnsCubit.dnsRecords ...dnsCubit.dnsRecords
@ -134,52 +141,41 @@ class _DnsDetailsPageState extends State<DnsDetailsPage> {
.map( .map(
(final dnsRecord) => Column( (final dnsRecord) => Column(
children: [ children: [
const Divider(
height: 1.0,
),
ListTile( ListTile(
leading: Icon( leading: Icon(
dnsRecord.isSatisfied dnsRecord.isSatisfied
? Icons.check ? Icons.check_circle_outline
: dnsCubit.dnsState == : dnsCubit.dnsState == DnsRecordsStatus.refreshing
DnsRecordsStatus.refreshing
? Icons.refresh ? Icons.refresh
: Icons.error, : Icons.error_outline,
color: dnsRecord.isSatisfied color: dnsRecord.isSatisfied
? Colors.green ? goodColor
: dnsCubit.dnsState == : dnsCubit.dnsState == DnsRecordsStatus.refreshing
DnsRecordsStatus.refreshing ? neutralColor
? Colors.grey : errorColor,
: Colors.red,
), ),
title: Text( title: Text(
dnsRecord.description.tr(), dnsRecord.description.tr(),
style: Theme.of(context).textTheme.labelLarge,
), ),
subtitle: Text( subtitle: Text(
dnsRecord.name, dnsRecord.name,
style: Theme.of(context).textTheme.caption,
), ),
), ),
], ],
), ),
) )
.toList(), .toList(),
],
),
),
const SizedBox(height: 16.0), const SizedBox(height: 16.0),
BrandCards.outlined(
child: Column(
children: <Widget>[
ListTile( ListTile(
title: Text( title: Text(
'providers.domain.cards.email.title'.tr(), 'providers.domain.cards.email.title'.tr(),
style: Theme.of(context).textTheme.headline6, style: Theme.of(context).textTheme.headlineSmall!.copyWith(
color: Theme.of(context).colorScheme.secondary,
),
), ),
subtitle: Text( subtitle: Text(
'providers.domain.cards.email.subtitle'.tr(), 'providers.domain.cards.email.subtitle'.tr(),
style: Theme.of(context).textTheme.caption, style: Theme.of(context).textTheme.labelMedium,
), ),
), ),
...dnsCubit.dnsRecords ...dnsCubit.dnsRecords
@ -190,27 +186,21 @@ class _DnsDetailsPageState extends State<DnsDetailsPage> {
.map( .map(
(final dnsRecord) => Column( (final dnsRecord) => Column(
children: [ children: [
const Divider(
height: 1.0,
),
ListTile( ListTile(
leading: Icon( leading: Icon(
dnsRecord.isSatisfied dnsRecord.isSatisfied
? Icons.check ? Icons.check_circle_outline
: dnsCubit.dnsState == : dnsCubit.dnsState == DnsRecordsStatus.refreshing
DnsRecordsStatus.refreshing
? Icons.refresh ? Icons.refresh
: Icons.error, : Icons.error_outline,
color: dnsRecord.isSatisfied color: dnsRecord.isSatisfied
? Colors.green ? goodColor
: dnsCubit.dnsState == : dnsCubit.dnsState == DnsRecordsStatus.refreshing
DnsRecordsStatus.refreshing ? neutralColor
? Colors.grey : errorColor,
: Colors.red,
), ),
title: Text( title: Text(
dnsRecord.description.tr(), dnsRecord.description.tr(),
style: Theme.of(context).textTheme.labelLarge,
), ),
), ),
], ],
@ -218,9 +208,6 @@ class _DnsDetailsPageState extends State<DnsDetailsPage> {
) )
.toList(), .toList(),
], ],
),
),
],
); );
} }
} }