Refresh DNS screen design
parent
580da306e1
commit
3eda30d924
|
|
@ -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(
|
||||||
onTap: dnsState == DnsRecordsStatus.error ? () => fixCallback() : null,
|
child: ListTile(
|
||||||
title: Text(
|
onTap: dnsState == DnsRecordsStatus.error ? () => fixCallback() : null,
|
||||||
description,
|
leading: icon,
|
||||||
style: Theme.of(context).textTheme.headline6,
|
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,
|
||||||
),
|
),
|
||||||
subtitle: subtitle != '' ? Text(subtitle) : null,
|
error: isError,
|
||||||
leading: icon,
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -94,132 +107,106 @@ 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(
|
_getStateCard(dnsCubit.dnsState, () {
|
||||||
child: Column(
|
context.read<DnsRecordsCubit>().fix();
|
||||||
children: [
|
}),
|
||||||
_getStateCard(dnsCubit.dnsState, () {
|
|
||||||
context.read<DnsRecordsCubit>().fix();
|
|
||||||
}),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
|
|
||||||
const SizedBox(height: 16.0),
|
const SizedBox(height: 16.0),
|
||||||
// Outlined card with a list of A records and their
|
ListTile(
|
||||||
// status.
|
title: Text(
|
||||||
BrandCards.outlined(
|
'providers.domain.cards.services.title'.tr(),
|
||||||
child: Column(
|
style: Theme.of(context).textTheme.headlineSmall!.copyWith(
|
||||||
children: <Widget>[
|
color: Theme.of(context).colorScheme.secondary,
|
||||||
ListTile(
|
|
||||||
title: Text(
|
|
||||||
'providers.domain.cards.services.title'.tr(),
|
|
||||||
style: Theme.of(context).textTheme.headline6,
|
|
||||||
),
|
),
|
||||||
subtitle: Text(
|
),
|
||||||
'providers.domain.cards.services.subtitle'.tr(),
|
subtitle: Text(
|
||||||
style: Theme.of(context).textTheme.caption,
|
'providers.domain.cards.services.subtitle'.tr(),
|
||||||
),
|
style: Theme.of(context).textTheme.labelMedium,
|
||||||
),
|
|
||||||
...dnsCubit.dnsRecords
|
|
||||||
.where(
|
|
||||||
(final dnsRecord) =>
|
|
||||||
dnsRecord.category == DnsRecordsCategory.services,
|
|
||||||
)
|
|
||||||
.map(
|
|
||||||
(final dnsRecord) => Column(
|
|
||||||
children: [
|
|
||||||
const Divider(
|
|
||||||
height: 1.0,
|
|
||||||
),
|
|
||||||
ListTile(
|
|
||||||
leading: Icon(
|
|
||||||
dnsRecord.isSatisfied
|
|
||||||
? Icons.check
|
|
||||||
: dnsCubit.dnsState ==
|
|
||||||
DnsRecordsStatus.refreshing
|
|
||||||
? Icons.refresh
|
|
||||||
: Icons.error,
|
|
||||||
color: dnsRecord.isSatisfied
|
|
||||||
? Colors.green
|
|
||||||
: dnsCubit.dnsState ==
|
|
||||||
DnsRecordsStatus.refreshing
|
|
||||||
? Colors.grey
|
|
||||||
: Colors.red,
|
|
||||||
),
|
|
||||||
title: Text(
|
|
||||||
dnsRecord.description.tr(),
|
|
||||||
style: Theme.of(context).textTheme.labelLarge,
|
|
||||||
),
|
|
||||||
subtitle: Text(
|
|
||||||
dnsRecord.name,
|
|
||||||
style: Theme.of(context).textTheme.caption,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
)
|
|
||||||
.toList(),
|
|
||||||
],
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
...dnsCubit.dnsRecords
|
||||||
|
.where(
|
||||||
|
(final dnsRecord) =>
|
||||||
|
dnsRecord.category == DnsRecordsCategory.services,
|
||||||
|
)
|
||||||
|
.map(
|
||||||
|
(final dnsRecord) => Column(
|
||||||
|
children: [
|
||||||
|
ListTile(
|
||||||
|
leading: Icon(
|
||||||
|
dnsRecord.isSatisfied
|
||||||
|
? Icons.check_circle_outline
|
||||||
|
: dnsCubit.dnsState == DnsRecordsStatus.refreshing
|
||||||
|
? Icons.refresh
|
||||||
|
: Icons.error_outline,
|
||||||
|
color: dnsRecord.isSatisfied
|
||||||
|
? goodColor
|
||||||
|
: dnsCubit.dnsState == DnsRecordsStatus.refreshing
|
||||||
|
? neutralColor
|
||||||
|
: errorColor,
|
||||||
|
),
|
||||||
|
title: Text(
|
||||||
|
dnsRecord.description.tr(),
|
||||||
|
),
|
||||||
|
subtitle: Text(
|
||||||
|
dnsRecord.name,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
)
|
||||||
|
.toList(),
|
||||||
const SizedBox(height: 16.0),
|
const SizedBox(height: 16.0),
|
||||||
BrandCards.outlined(
|
ListTile(
|
||||||
child: Column(
|
title: Text(
|
||||||
children: <Widget>[
|
'providers.domain.cards.email.title'.tr(),
|
||||||
ListTile(
|
style: Theme.of(context).textTheme.headlineSmall!.copyWith(
|
||||||
title: Text(
|
color: Theme.of(context).colorScheme.secondary,
|
||||||
'providers.domain.cards.email.title'.tr(),
|
|
||||||
style: Theme.of(context).textTheme.headline6,
|
|
||||||
),
|
),
|
||||||
subtitle: Text(
|
),
|
||||||
'providers.domain.cards.email.subtitle'.tr(),
|
subtitle: Text(
|
||||||
style: Theme.of(context).textTheme.caption,
|
'providers.domain.cards.email.subtitle'.tr(),
|
||||||
),
|
style: Theme.of(context).textTheme.labelMedium,
|
||||||
),
|
|
||||||
...dnsCubit.dnsRecords
|
|
||||||
.where(
|
|
||||||
(final dnsRecord) =>
|
|
||||||
dnsRecord.category == DnsRecordsCategory.email,
|
|
||||||
)
|
|
||||||
.map(
|
|
||||||
(final dnsRecord) => Column(
|
|
||||||
children: [
|
|
||||||
const Divider(
|
|
||||||
height: 1.0,
|
|
||||||
),
|
|
||||||
ListTile(
|
|
||||||
leading: Icon(
|
|
||||||
dnsRecord.isSatisfied
|
|
||||||
? Icons.check
|
|
||||||
: dnsCubit.dnsState ==
|
|
||||||
DnsRecordsStatus.refreshing
|
|
||||||
? Icons.refresh
|
|
||||||
: Icons.error,
|
|
||||||
color: dnsRecord.isSatisfied
|
|
||||||
? Colors.green
|
|
||||||
: dnsCubit.dnsState ==
|
|
||||||
DnsRecordsStatus.refreshing
|
|
||||||
? Colors.grey
|
|
||||||
: Colors.red,
|
|
||||||
),
|
|
||||||
title: Text(
|
|
||||||
dnsRecord.description.tr(),
|
|
||||||
style: Theme.of(context).textTheme.labelLarge,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
)
|
|
||||||
.toList(),
|
|
||||||
],
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
...dnsCubit.dnsRecords
|
||||||
|
.where(
|
||||||
|
(final dnsRecord) =>
|
||||||
|
dnsRecord.category == DnsRecordsCategory.email,
|
||||||
|
)
|
||||||
|
.map(
|
||||||
|
(final dnsRecord) => Column(
|
||||||
|
children: [
|
||||||
|
ListTile(
|
||||||
|
leading: Icon(
|
||||||
|
dnsRecord.isSatisfied
|
||||||
|
? Icons.check_circle_outline
|
||||||
|
: dnsCubit.dnsState == DnsRecordsStatus.refreshing
|
||||||
|
? Icons.refresh
|
||||||
|
: Icons.error_outline,
|
||||||
|
color: dnsRecord.isSatisfied
|
||||||
|
? goodColor
|
||||||
|
: dnsCubit.dnsState == DnsRecordsStatus.refreshing
|
||||||
|
? neutralColor
|
||||||
|
: errorColor,
|
||||||
|
),
|
||||||
|
title: Text(
|
||||||
|
dnsRecord.description.tr(),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
)
|
||||||
|
.toList(),
|
||||||
],
|
],
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue