Display unknown values as a dash and centralise repeated literals

Backend: notifications now show a plain "-" for an absent name, vendor, or
device type (was empty string / "(unknown)" / "Unknown"), via a single
UNKNOWN_PLACEHOLDER constant.

Frontend:
- Empty/unknown values render as an em dash everywhere, centralised in a new
  Placeholders.emptyValue constant (replaces inline '—' and '(unknown)').
- Route paths moved to a new Routes class, used by the router and every
  navigation call site.
- Device event type modelled as a DeviceEventType enum mirroring the backend
  (NewDevice/DeviceSeen) instead of bare string comparisons.
- Hardcoded EdgeInsets/SizedBox spacing replaced with existing Insets tokens.

Tests and formatting updated; all backend and frontend tests pass.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

frontend/lib/devices/device_actions.dart

@@ -4,6 +4,7 @@ import '../model/device.dart';
 import '../model/device_type.dart';
 import '../utils/oott_api.dart';
 import '../utils/ui_snackbars.dart';
+import '../theme/dimens.dart';
 
 Future<void> confirmForgetDevice(
   BuildContext context,
@@ -88,7 +89,7 @@ Future<void> showEditDeviceDialog(
                       : null,
                   onSaved: (value) => owner = value?.trim() ?? '',
                 ),
-                const SizedBox(height: 16),
+                const SizedBox(height: Insets.lg),
                 TextFormField(
                   initialValue: name,
                   decoration: const InputDecoration(
@@ -97,7 +98,7 @@ Future<void> showEditDeviceDialog(
                   onFieldSubmitted: (_) => save(),
                   onSaved: (value) => name = value?.trim() ?? '',
                 ),
-                const SizedBox(height: 16),
+                const SizedBox(height: Insets.lg),
                 TextFormField(
                   initialValue: vendor,
                   decoration: const InputDecoration(
@@ -106,7 +107,7 @@ Future<void> showEditDeviceDialog(
                   onFieldSubmitted: (_) => save(),
                   onSaved: (value) => vendor = value?.trim() ?? '',
                 ),
-                const SizedBox(height: 16),
+                const SizedBox(height: Insets.lg),
                 DropdownButtonFormField<DeviceType>(
                   initialValue: deviceType,
                   decoration: const InputDecoration(labelText: 'Device Type'),
@@ -117,7 +118,7 @@ Future<void> showEditDeviceDialog(
                           child: Row(
                             children: [
                               Icon(t.icon, size: 16),
-                              const SizedBox(width: 4),
+                              const SizedBox(width: Insets.xs),
                               Text(t.label),
                             ],
                           ),
@@ -135,10 +136,7 @@ Future<void> showEditDeviceDialog(
               onPressed: () => Navigator.of(context).pop(false),
               child: const Text('Cancel'),
             ),
-            TextButton(
-              onPressed: save,
-              child: const Text('Save'),
-            ),
+            TextButton(onPressed: save, child: const Text('Save')),
           ],
         );
       },
@@ -204,7 +202,7 @@ Future<void> showRegisterDeviceDialog(
                       : null,
                   onSaved: (value) => owner = value?.trim() ?? '',
                 ),
-                const SizedBox(height: 16),
+                const SizedBox(height: Insets.lg),
                 TextFormField(
                   initialValue: name,
                   decoration: const InputDecoration(
@@ -213,7 +211,7 @@ Future<void> showRegisterDeviceDialog(
                   onFieldSubmitted: (_) => save(),
                   onSaved: (value) => name = value?.trim() ?? '',
                 ),
-                const SizedBox(height: 16),
+                const SizedBox(height: Insets.lg),
                 DropdownButtonFormField<DeviceType>(
                   initialValue: deviceType,
                   decoration: const InputDecoration(labelText: 'Device Type'),
@@ -224,7 +222,7 @@ Future<void> showRegisterDeviceDialog(
                           child: Row(
                             children: [
                               Icon(t.icon, size: 16),
-                              const SizedBox(width: 4),
+                              const SizedBox(width: Insets.xs),
                               Text(t.label),
                             ],
                           ),
@@ -242,10 +240,7 @@ Future<void> showRegisterDeviceDialog(
               onPressed: () => Navigator.of(context).pop(false),
               child: const Text('Cancel'),
             ),
-            TextButton(
-              onPressed: save,
-              child: const Text('Save'),
-            ),
+            TextButton(onPressed: save, child: const Text('Save')),
           ],
         );
       },

frontend/lib/devices/device_detail.dart

@@ -3,11 +3,14 @@ import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
 
 import '../model/device.dart';
+import '../model/device_type.dart';
 import '../utils/friendly_date_formatter.dart';
 import '../utils/oott_api.dart';
 import '../widgets/status_badge.dart';
 import 'device_actions.dart';
 import 'device_event_history.dart';
+import '../theme/dimens.dart';
+import '../utils/placeholders.dart';
 
 class DeviceDetail extends StatefulWidget {
   final String macAddress;
@@ -78,7 +81,7 @@ class _DeviceDetailState extends State<DeviceDetail> {
                     mainAxisSize: MainAxisSize.min,
                     children: [
                       Text('Error: $_error'),
-                      const SizedBox(height: 16),
+                      const SizedBox(height: Insets.lg),
                       FilledButton(
                         onPressed: _loadDevice,
                         child: const Text('Retry'),
@@ -89,18 +92,18 @@ class _DeviceDetailState extends State<DeviceDetail> {
               : device == null
               ? const Center(child: Text('Device not found'))
               : SingleChildScrollView(
-                  padding: const EdgeInsets.all(16),
+                  padding: const EdgeInsets.all(Insets.lg),
                   child: Column(
                     crossAxisAlignment: CrossAxisAlignment.start,
                     children: [
                       _DeviceHeader(device: device),
-                      const SizedBox(height: 24),
+                      const SizedBox(height: Insets.xxl),
                       _DeviceInfoCard(device: device),
-                      const SizedBox(height: 24),
+                      const SizedBox(height: Insets.xxl),
                       _DeviceActions(device: device, onAction: _loadDevice),
-                      const SizedBox(height: 24),
+                      const SizedBox(height: Insets.xxl),
                       _SectionHeader(title: 'Event History'),
-                      const SizedBox(height: 12),
+                      const SizedBox(height: Insets.md),
                       DeviceEventHistory(device: device),
                     ],
                   ),
@@ -137,7 +140,7 @@ class _DeviceHeader extends StatelessWidget {
           size: 48,
           color: theme.colorScheme.onSurface,
         ),
-        const SizedBox(width: 16),
+        const SizedBox(width: Insets.lg),
         Expanded(
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
@@ -146,7 +149,7 @@ class _DeviceHeader extends StatelessWidget {
                 device.ipv4Address,
                 style: theme.textTheme.headlineSmall,
               ),
-              const SizedBox(height: 4),
+              const SizedBox(height: Insets.xs),
               if (device.isRegistered)
                 StatusBadge(label: 'Registered', color: BadgeColor.success)
               else
@@ -173,14 +176,24 @@ class _DeviceInfoCard extends StatelessWidget {
     final rows = <(String, String)>[
       (
         'Name',
-        device.name == null || device.name!.isEmpty ? '—' : device.name!,
+        device.name == null || device.name!.isEmpty
+            ? Placeholders.emptyValue
+            : device.name!,
       ),
       ('MAC Address', device.macAddress),
       ('IP Address', device.ipv4Address),
-      ('Vendor', device.vendor.isEmpty ? '—' : device.vendor),
+      (
+        'Vendor',
+        device.vendor.isEmpty ? Placeholders.emptyValue : device.vendor,
+      ),
       ('Last Seen', formatter.format(device.lastSeen)),
-      ('Device Type', device.deviceType.label),
-      ('Owner', device.owner.isEmpty ? '—' : device.owner),
+      (
+        'Device Type',
+        device.deviceType == DeviceType.unknown
+            ? Placeholders.emptyValue
+            : device.deviceType.label,
+      ),
+      ('Owner', device.owner.isEmpty ? Placeholders.emptyValue : device.owner),
     ];
 
     return Card(
@@ -246,7 +259,10 @@ class _InfoRow extends StatelessWidget {
   Widget build(BuildContext context) {
     final theme = Theme.of(context);
     return Padding(
-      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
+      padding: const EdgeInsets.symmetric(
+        horizontal: Insets.lg,
+        vertical: Insets.md,
+      ),
       child: Row(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [

frontend/lib/devices/device_event_history.dart

@@ -5,8 +5,11 @@ import 'package:intl/intl.dart';
 
 import '../model/device.dart';
 import '../model/device_event.dart';
+import '../model/device_event_type.dart';
 import '../utils/oott_api.dart';
 import '../widgets/filter_selector.dart';
+import '../theme/dimens.dart';
+import '../utils/placeholders.dart';
 
 enum _TimeRange {
   today('Today'),
@@ -112,14 +115,14 @@ class _DeviceEventHistoryState extends State<DeviceEventHistory> {
   Widget build(BuildContext context) {
     if (_isLoading) {
       return const Padding(
-        padding: EdgeInsets.all(32),
+        padding: EdgeInsets.all(Insets.xxxl),
         child: Center(child: CircularProgressIndicator()),
       );
     }
 
     if (_error != null) {
       return Padding(
-        padding: const EdgeInsets.symmetric(vertical: 16),
+        padding: const EdgeInsets.symmetric(vertical: Insets.lg),
         child: Center(child: Text('Failed to load event history: $_error')),
       );
     }
@@ -138,10 +141,10 @@ class _DeviceEventHistoryState extends State<DeviceEventHistory> {
             _loadEvents();
           },
         ),
-        const SizedBox(height: 16),
+        const SizedBox(height: Insets.lg),
         if (events.isEmpty)
           const Padding(
-            padding: EdgeInsets.symmetric(vertical: 24),
+            padding: EdgeInsets.symmetric(vertical: Insets.xxl),
             child: Center(child: Text('No events in this time range')),
           )
         else
@@ -184,7 +187,7 @@ class _EventChart extends StatelessWidget {
     final maxX = (nowMs / intervalMs).ceil() * intervalMs;
 
     final spots = events.map((e) {
-      final isNew = e.eventType == 'NewDevice';
+      final isNew = e.eventType == DeviceEventType.newDevice;
       return ScatterSpot(
         e.createdOn.millisecondsSinceEpoch.toDouble(),
         1.0,
@@ -254,7 +257,7 @@ class _EventChart extends StatelessWidget {
               final event = events[idx];
               final dt = event.createdOn.toLocal();
               final dateStr = DateFormat('MMM d, yyyy HH:mm').format(dt);
-              final baseLabel = event.eventType == 'NewDevice'
+              final baseLabel = event.eventType == DeviceEventType.newDevice
                   ? 'First seen'
                   : 'Device seen';
               final typeLabel = '$baseLabel (${event.scannerLabel})';
@@ -274,10 +277,10 @@ class _EventChart extends StatelessWidget {
               }
               if (event.vendor != device.vendor) {
                 final eventVendor = event.vendor.isEmpty
-                    ? '(unknown)'
+                    ? Placeholders.emptyValue
                     : event.vendor;
                 final currentVendor = device.vendor.isEmpty
-                    ? '(unknown)'
+                    ? Placeholders.emptyValue
                     : device.vendor;
                 diffs.add(
                   TextSpan(

frontend/lib/devices/device_list.dart

@@ -17,6 +17,7 @@ import '../widgets/skeleton.dart';
 import 'device_list_filter.dart';
 import 'device_list_rows.dart';
 import 'device_list_sort.dart';
+import '../routes.dart';
 
 class DeviceList extends StatefulWidget {
   const DeviceList({super.key});
@@ -273,7 +274,7 @@ class _DeviceListState extends State<DeviceList>
         icon: Icons.devices_other_outlined,
         message: _emptyMessage(),
         actionLabel: 'Check scanner status',
-        onAction: () => context.go('/status'),
+        onAction: () => context.go(Routes.status),
       );
     }
 

frontend/lib/devices/device_list_filter.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 
 import '../model/device_type.dart';
+import '../theme/dimens.dart';
 
 enum DeviceFilter {
   newDevices('Not registered'),
@@ -42,7 +43,7 @@ class DeviceFilterSheet extends StatelessWidget {
         crossAxisAlignment: CrossAxisAlignment.stretch,
         children: [
           Text('Filters', style: Theme.of(context).textTheme.titleMedium),
-          const SizedBox(height: 16),
+          const SizedBox(height: Insets.lg),
           TextField(
             controller: ownerController,
             decoration: const InputDecoration(
@@ -51,7 +52,7 @@ class DeviceFilterSheet extends StatelessWidget {
               border: OutlineInputBorder(),
             ),
           ),
-          const SizedBox(height: 16),
+          const SizedBox(height: Insets.lg),
           DropdownButtonFormField<DeviceType?>(
             initialValue: typeFilter,
             decoration: const InputDecoration(
@@ -66,7 +67,7 @@ class DeviceFilterSheet extends StatelessWidget {
                   child: Row(
                     children: [
                       Icon(t.icon, size: 16),
-                      const SizedBox(width: 4),
+                      const SizedBox(width: Insets.xs),
                       Text(t.label),
                     ],
                   ),
@@ -75,7 +76,7 @@ class DeviceFilterSheet extends StatelessWidget {
             ],
             onChanged: onTypeChanged,
           ),
-          const SizedBox(height: 16),
+          const SizedBox(height: Insets.lg),
           if (hasActiveFilters)
             OutlinedButton(
               onPressed: () {

frontend/lib/devices/device_list_rows.dart

@@ -8,6 +8,9 @@ import '../utils/friendly_date_formatter.dart';
 import '../widgets/status_badge.dart';
 import 'device_actions.dart';
 import 'device_list_sort.dart';
+import '../theme/dimens.dart';
+import '../utils/placeholders.dart';
+import '../routes.dart';
 
 // Column layout shared between the header and data rows so cells line up.
 const double _iconWidth = 40;
@@ -37,7 +40,7 @@ String _displayName(Device device) {
         : device.deviceType.label;
     return "${device.owner}'s $type";
   }
-  return '—';
+  return Placeholders.emptyValue;
 }
 
 class DeviceListHeaderDelegate extends SliverPersistentHeaderDelegate {
@@ -130,7 +133,10 @@ class _HeaderCell extends StatelessWidget {
       child: InkWell(
         onTap: () => onTap(column),
         child: Padding(
-          padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 12),
+          padding: const EdgeInsets.symmetric(
+            horizontal: Insets.sm,
+            vertical: Insets.md,
+          ),
           child: Row(
             children: [
               Flexible(
@@ -141,7 +147,7 @@ class _HeaderCell extends StatelessWidget {
                 ),
               ),
               if (isActive) ...[
-                const SizedBox(width: 4),
+                const SizedBox(width: Insets.xs),
                 Icon(
                   ascending ? Icons.arrow_upward : Icons.arrow_downward,
                   size: 16,
@@ -183,7 +189,7 @@ class _IconHeaderCell extends StatelessWidget {
         child: Tooltip(
           message: 'Sort by device type',
           child: Padding(
-            padding: const EdgeInsets.symmetric(vertical: 12),
+            padding: const EdgeInsets.symmetric(vertical: Insets.md),
             child: Row(
               mainAxisAlignment: MainAxisAlignment.center,
               children: [
@@ -221,7 +227,7 @@ class DeviceRowWide extends StatelessWidget {
     return Material(
       color: device.isRegistered ? null : theme.colorScheme.secondaryContainer,
       child: InkWell(
-        onTap: () => context.push('/devices/${device.macAddress}'),
+        onTap: () => context.push(Routes.deviceDetail(device.macAddress)),
         child: Padding(
           padding: const EdgeInsets.symmetric(horizontal: 8),
           child: Row(
@@ -248,10 +254,7 @@ class DeviceRowWide extends StatelessWidget {
                 ),
               SizedBox(
                 width: _trailingWidth,
-                child: _DeviceActionsMenu(
-                  device: device,
-                  onRefresh: onRefresh,
-                ),
+                child: _DeviceActionsMenu(device: device, onRefresh: onRefresh),
               ),
             ],
           ),
@@ -287,7 +290,7 @@ Widget _cellContent(
         );
       }
       return _OverflowTooltipText(
-        text: device.owner.isEmpty ? '—' : device.owner,
+        text: device.owner.isEmpty ? Placeholders.emptyValue : device.owner,
         style: theme.textTheme.bodyMedium,
       );
     case DeviceSortColumn.macAddress:
@@ -315,7 +318,7 @@ Widget _cellContent(
       );
     case DeviceSortColumn.vendor:
       return _OverflowTooltipText(
-        text: device.vendor.isEmpty ? '—' : device.vendor,
+        text: device.vendor.isEmpty ? Placeholders.emptyValue : device.vendor,
         style: theme.textTheme.bodyMedium,
       );
   }
@@ -338,11 +341,7 @@ class _OverflowTooltipText extends StatelessWidget {
           textDirection: Directionality.of(context),
           textScaler: MediaQuery.textScalerOf(context),
         )..layout(maxWidth: constraints.maxWidth);
-        final child = Text(
-          text,
-          overflow: TextOverflow.ellipsis,
-          style: style,
-        );
+        final child = Text(text, overflow: TextOverflow.ellipsis, style: style);
         return painter.didExceedMaxLines
             ? Tooltip(message: text, child: child)
             : child;
@@ -369,7 +368,7 @@ class DeviceRowCompact extends StatelessWidget {
     return Card(
       color: device.isRegistered ? null : theme.colorScheme.secondaryContainer,
       child: ListTile(
-        onTap: () => context.push('/devices/${device.macAddress}'),
+        onTap: () => context.push(Routes.deviceDetail(device.macAddress)),
         leading: Tooltip(
           message: device.deviceType == DeviceType.unknown
               ? 'Device type unknown'
@@ -378,10 +377,8 @@ class DeviceRowCompact extends StatelessWidget {
         ),
         title: Row(
           children: [
-            Flexible(
-              child: _OverflowTooltipText(text: _displayName(device)),
-            ),
-            const SizedBox(width: 8),
+            Flexible(child: _OverflowTooltipText(text: _displayName(device))),
+            const SizedBox(width: Insets.sm),
             if (device.isRegistered)
               const StatusBadge(label: 'Registered', color: BadgeColor.success)
             else
@@ -400,7 +397,7 @@ class DeviceRowCompact extends StatelessWidget {
             children: [
               _OverflowTooltipText(
                 text:
-                    '${device.isRegistered ? (device.owner.isEmpty ? '—' : device.owner) : device.ipv4Address} · ${device.macAddress}',
+                    '${device.isRegistered ? (device.owner.isEmpty ? Placeholders.emptyValue : device.owner) : device.ipv4Address} · ${device.macAddress}',
               ),
               if (!device.isRegistered && device.vendor.isNotEmpty)
                 _OverflowTooltipText(text: device.vendor),
@@ -460,7 +457,7 @@ class _DeviceActionsMenu extends StatelessWidget {
       icon: const Icon(Icons.more_vert),
       onSelected: (value) async {
         if (value == 'details') {
-          context.push('/devices/${device.macAddress}');
+          context.push(Routes.deviceDetail(device.macAddress));
         } else if (value == 'edit') {
           await showEditDeviceDialog(context, device, onRefresh);
         } else if (value == 'forget') {

frontend/lib/devices/device_list_sort.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import '../theme/dimens.dart';
 
 enum DeviceSortColumn {
   deviceType('Device Type', 'device_type'),
@@ -41,7 +42,7 @@ class DeviceSortSheet extends StatelessWidget {
         crossAxisAlignment: CrossAxisAlignment.stretch,
         children: [
           Text('Sort by', style: Theme.of(context).textTheme.titleMedium),
-          const SizedBox(height: 8),
+          const SizedBox(height: Insets.sm),
           RadioGroup<DeviceSortColumn>(
             groupValue: currentColumn,
             onChanged: (value) {
@@ -61,7 +62,7 @@ class DeviceSortSheet extends StatelessWidget {
               ],
             ),
           ),
-          const SizedBox(height: 8),
+          const SizedBox(height: Insets.sm),
           Center(
             child: SegmentedButton<bool>(
               segments: const [