Add graphics to pages.

lib/app/views/graphics.dart

@@ -0,0 +1,7 @@
+import 'package:flutter/material.dart';
+
+final Image noAccounts = _graphic('no-accounts');
+final Image noDiscoverable = _graphic('no-discoverable');
+final Image noFingerprints = _graphic('no-fingerprints');
+
+Image _graphic(String name) => Image.asset('assets/graphics/$name.png');

lib/app/views/message_page.dart

@@ -4,15 +4,17 @@ import 'app_page.dart';
 
 class MessagePage extends StatelessWidget {
   final Widget? title;
+  final Widget? graphics;
   final String header;
-  final String message;
+  final String? message;
   final Widget? floatingActionButton;
 
   const MessagePage({
     super.key,
     this.title,
+    this.graphics,
     required this.header,
-    required this.message,
+    this.message,
     this.floatingActionButton,
   });
 
@@ -23,9 +25,12 @@ class MessagePage extends StatelessWidget {
         floatingActionButton: floatingActionButton,
         child: Column(
           children: [
+            if (graphics != null) graphics!,
             Text(header, style: Theme.of(context).textTheme.titleMedium),
             const SizedBox(height: 12.0),
-            Text(message, textAlign: TextAlign.center),
+            if (message != null) ...[
+              Text(message!, textAlign: TextAlign.center),
+            ],
           ],
         ),
       );

lib/fido/views/locked_page.dart

@@ -4,6 +4,7 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
 import '../../app/message.dart';
 import '../../app/models.dart';
 import '../../app/views/app_page.dart';
+import '../../app/views/graphics.dart';
 import '../../app/views/message_page.dart';
 import '../models.dart';
 import '../state.dart';
@@ -22,6 +23,7 @@ class FidoLockedPage extends ConsumerWidget {
       if (state.bioEnroll != null) {
         return MessagePage(
           title: const Text('WebAuthn'),
+          graphics: noFingerprints,
           header: 'No fingerprints',
           message: 'Set a PIN to register fingerprints',
           floatingActionButton: _buildFab(context),
@@ -29,6 +31,7 @@ class FidoLockedPage extends ConsumerWidget {
       } else {
         return MessagePage(
           title: const Text('WebAuthn'),
+          graphics: noDiscoverable,
           header: 'No discoverable accounts',
           message:
               'Optionally set a PIN to protect access to your YubiKey\nRegister as a Security Key on websites',

lib/fido/views/unlocked_page.dart

@@ -4,6 +4,7 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
 import '../../app/message.dart';
 import '../../app/models.dart';
 import '../../app/views/app_page.dart';
+import '../../app/views/graphics.dart';
 import '../../app/views/message_page.dart';
 import '../models.dart';
 import '../state.dart';
@@ -107,6 +108,7 @@ class FidoUnlockedPage extends ConsumerWidget {
     if (state.bioEnroll == false) {
       return MessagePage(
         title: const Text('WebAuthn'),
+        graphics: noFingerprints,
         header: 'No fingerprints',
         message: 'Add one or more (up to five) fingerprints',
         floatingActionButton: _buildFab(context),
@@ -115,6 +117,7 @@ class FidoUnlockedPage extends ConsumerWidget {
 
     return MessagePage(
       title: const Text('WebAuthn'),
+      graphics: noDiscoverable,
       header: 'No discoverable accounts',
       message: 'Register as a Security Key on websites',
       floatingActionButton: _buildFab(context),

lib/oath/views/oath_screen.dart

@@ -9,6 +9,7 @@ import '../../app/models.dart';
 import '../../app/views/app_failure_screen.dart';
 import '../../app/views/app_loading_screen.dart';
 import '../../app/views/app_page.dart';
+import '../../app/views/graphics.dart';
 import '../../app/views/message_page.dart';
 import '../models.dart';
 import '../state.dart';
@@ -76,6 +77,7 @@ class _UnlockedView extends ConsumerWidget {
     if (isEmpty) {
       return MessagePage(
         title: const Text('Authenticator'),
+        graphics: noAccounts,
         header: 'No accounts',
         message: 'Follow the instructions on a website to add an account',
         floatingActionButton: _buildFab(context),