refactor: replace null device with NoneDevice

packages/widgetbook/CHANGELOG.md

@@ -1,5 +1,6 @@
 ## Unreleased
 
+ - **BREAKING**: `DeviceFrameAddon.devices` is no longer nullable, in favor of the new `NoneDevice`. ([#854](https://github.com/widgetbook/widgetbook/pull/854))
  - **REFACTOR**: Support Flutter 3.13.0. ([#847](https://github.com/widgetbook/widgetbook/pull/847))
  - **REFACTOR**: Update `DropdownMenu` theme. ([#844](https://github.com/widgetbook/widgetbook/pull/844))
  - **REFACTOR**: Make `appBuilder` optional. ([#843](https://github.com/widgetbook/widgetbook/pull/843))

packages/widgetbook/lib/src/addons/device_frame_addon/addon.dart

@@ -2,3 +2,4 @@ export 'package:device_frame/device_frame.dart';
 
 export 'device_frame_addon.dart';
 export 'device_frame_setting.dart';
+export 'none_device.dart';

packages/widgetbook/lib/src/addons/device_frame_addon/device_frame_addon.dart

@@ -4,12 +4,13 @@ import 'package:flutter/material.dart';
 import '../../fields/fields.dart';
 import '../common/common.dart';
 import 'device_frame_setting.dart';
+import 'none_device.dart';
 
 /// A [WidgetbookAddon] for changing the active device/frame. It's based on
 /// the [`device_frame`](https://pub.dev/packages/device_frame) package.
 class DeviceFrameAddon extends WidgetbookAddon<DeviceFrameSetting> {
   DeviceFrameAddon({
-    required List<DeviceInfo?> devices,
+    required List<DeviceInfo> devices,
     DeviceInfo? initialDevice,
   })  : assert(
           devices.isNotEmpty,
@@ -19,24 +20,24 @@ class DeviceFrameAddon extends WidgetbookAddon<DeviceFrameSetting> {
           initialDevice == null || devices.contains(initialDevice),
           'initialDevice must be in devices',
         ),
-        this.devices = [null, ...devices], // [null] represents a "none" device
+        this.devices = [NoneDevice.instance, ...devices],
         super(
           name: 'Device',
           initialSetting: DeviceFrameSetting(
-            device: initialDevice,
+            device: initialDevice ?? NoneDevice.instance,
           ),
         );
 
-  final List<DeviceInfo?> devices;
+  final List<DeviceInfo> devices;
 
   @override
   List<Field> get fields {
     return [
-      ListField<DeviceInfo?>(
+      ListField<DeviceInfo>(
         name: 'name',
         values: devices,
         initialValue: initialSetting.device,
-        labelBuilder: (device) => device?.name ?? 'None',
+        labelBuilder: (device) => device.name,
       ),
       ListField<Orientation>(
         name: 'orientation',
@@ -58,7 +59,7 @@ class DeviceFrameAddon extends WidgetbookAddon<DeviceFrameSetting> {
   @override
   DeviceFrameSetting valueFromQueryGroup(Map<String, String> group) {
     return DeviceFrameSetting(
-      device: valueOf<DeviceInfo?>('name', group),
+      device: valueOf('name', group)!,
       orientation: valueOf('orientation', group)!,
       hasFrame: valueOf('frame', group)!,
     );
@@ -70,15 +71,15 @@ class DeviceFrameAddon extends WidgetbookAddon<DeviceFrameSetting> {
     Widget child,
     DeviceFrameSetting setting,
   ) {
-    if (setting.device == null) {
+    if (setting.device is NoneDevice) {
       return child;
     }
 
     return Padding(
       padding: const EdgeInsets.all(32),
       child: DeviceFrame(
         orientation: setting.orientation,
-        device: setting.device!,
+        device: setting.device,
         isFrameVisible: setting.hasFrame,
         screen: setting.hasFrame
             ? child

packages/widgetbook/lib/src/addons/device_frame_addon/device_frame_setting.dart

@@ -8,7 +8,7 @@ class DeviceFrameSetting {
     this.hasFrame = true,
   });
 
-  final DeviceInfo? device;
+  final DeviceInfo device;
   final Orientation orientation;
   final bool hasFrame;
 }

packages/widgetbook/lib/src/addons/device_frame_addon/none_device.dart

@@ -0,0 +1,38 @@
+import 'package:device_frame/device_frame.dart';
+import 'package:flutter/widgets.dart';
+
+class NoneDevice implements DeviceInfo {
+  const NoneDevice._();
+
+  static const NoneDevice instance = NoneDevice._();
+
+  @override
+  String get name => 'None';
+
+  @override
+  DeviceIdentifier get identifier => throw UnimplementedError();
+
+  @override
+  Size get frameSize => throw UnimplementedError();
+
+  @override
+  Size get screenSize => throw UnimplementedError();
+
+  @override
+  double get pixelRatio => throw UnimplementedError();
+
+  @override
+  EdgeInsets? get rotatedSafeAreas => throw UnimplementedError();
+
+  @override
+  EdgeInsets get safeAreas => throw UnimplementedError();
+
+  @override
+  Path get screenPath => throw UnimplementedError();
+
+  @override
+  $DeviceInfoCopyWith<DeviceInfo> get copyWith => throw UnimplementedError();
+
+  @override
+  CustomPainter get framePainter => throw UnimplementedError();
+}

packages/widgetbook/test/src/addons/device_frame_addon_test.dart

@@ -37,12 +37,12 @@ void main() {
 
       test(
         'given a device frame setting, '
-        'when device is null, '
+        'when device is $NoneDevice, '
         'then [buildUseCase] returns child as-is',
         () {
           const child = Text('child');
           final setting = DeviceFrameSetting(
-            device: null,
+            device: NoneDevice.instance,
           );
 
           final result = addon.buildUseCase(