Switch to material 3

lib/app.dart

@@ -26,7 +26,6 @@ class RoverControlDashboard extends ReusableReactiveWidget<SettingsModel> {
     debugShowCheckedModeBanner: false,
     themeMode: models.isReady ? model.dashboard.themeMode : ThemeMode.system,
     theme: ThemeData(
-      useMaterial3: false,
       colorScheme: const ColorScheme.light(
         primary: binghamtonGreen,
         secondary: binghamtonGreen,

lib/src/pages/view.dart

@@ -16,11 +16,8 @@ class DashboardView {
   /// The name of the view.
   final String name;
 
-  /// The icon used to represent the view.
-  Widget get icon => iconFunc();
-
   /// A function to dynamically compute the icon for the view.
-  Widget Function() iconFunc;
+  Widget Function(BuildContext context) iconFunc;
 
   /// A unique key to use while selecting this view.
   final CameraName? key;
@@ -55,15 +52,15 @@ class DashboardView {
         DashboardView(
           name: name.humanName,
           key: name,
-          iconFunc: () => getCameraStatus(name),
+          iconFunc: (context) => getCameraStatus(context, name),
           builder: (context, index) => VideoFeed(name: name, index: index),
         ),
   ];
 
-    /// An icon to indicate the status of the given camera.
-  static Widget getCameraStatus(CameraName name) {
+  /// An icon to indicate the status of the given camera.
+  static Widget getCameraStatus(BuildContext context, CameraName name) {
     if (!models.sockets.video.isConnected) {
-      return Icon(Icons.signal_wifi_off, color: Colors.black.withOpacity(0.5));
+      return Icon(Icons.signal_wifi_off, color: context.colorScheme.onSurface.withOpacity(0.5));
     }
     final status = models.video.feeds[name]!.details.status;
     const size = 12.0;
@@ -92,40 +89,40 @@ class DashboardView {
   static final List<DashboardView> uiViews = [
     DashboardView(
       name: Routes.science,
-      iconFunc: () => Icon(Icons.science, color: Colors.black.withOpacity(0.5)),
+      iconFunc: (context) => Icon(Icons.science, color: context.colorScheme.onSurface.withOpacity(0.5)),
       builder: (context, index) => SciencePage(index: index),
     ),
     DashboardView(
       name: Routes.autonomy,
-      iconFunc: () => Icon(Icons.map, color: Colors.black.withOpacity(0.5)),
+      iconFunc: (context) => Icon(Icons.map, color: context.colorScheme.onSurface.withOpacity(0.5)),
       builder: (context, index) => MapPage(index: index),
     ),
     DashboardView(
       name: Routes.electrical,
-      iconFunc: () => Icon(Icons.bolt, color: Colors.black.withOpacity(0.5)),
+      iconFunc: (context) => Icon(Icons.bolt, color: context.colorScheme.onSurface.withOpacity(0.5)),
       builder: (context, index) => ElectricalPage(index: index),
     ),
     DashboardView(
       name: Routes.arm,
-      iconFunc: () => Icon(Icons.precision_manufacturing_outlined, color: Colors.black.withOpacity(0.5)),
+      iconFunc: (context) => Icon(Icons.precision_manufacturing_outlined, color: context.colorScheme.onSurface.withOpacity(0.5)),
       builder: (context, index) => ArmPage(index: index),
     ),
     DashboardView(
       name: Routes.drive,
-      iconFunc: () => Icon(Icons.drive_eta, color: Colors.black.withOpacity(0.5)),
+      iconFunc: (context) => Icon(Icons.drive_eta, color: context.colorScheme.onSurface.withOpacity(0.5)),
       builder: (context, index) => DrivePage(index: index),
     ),
     DashboardView(
       name: Routes.rocks,
-      iconFunc: () => Icon(Icons.landslide, color: Colors.black.withOpacity(0.5)),
+      iconFunc: (context) => Icon(Icons.landslide, color: context.colorScheme.onSurface.withOpacity(0.5)),
       builder: (context, index) => RocksPage(index: index),
     ),
   ];
 
   /// A blank view.
   static final blank = DashboardView(
     name: Routes.blank,
-    iconFunc: () => const Icon(Icons.delete),
+    iconFunc: (context) => const Icon(Icons.delete),
     builder: (context, index) => ColoredBox(
       color: context.colorScheme.brightness == Brightness.light
         ? Colors.blueGrey

lib/src/widgets/navigation/views_list.dart

@@ -34,7 +34,7 @@ class ViewsList extends ReactiveWidget<ViewsSidebarModel> {
   /// A const constructor
   const ViewsList();
 
-  Widget _buildDraggable(DashboardView view, {Widget? dragIcon}) => Draggable<DashboardView>(
+  Widget _buildDraggable(BuildContext context, DashboardView view, {Widget? dragIcon}) => Draggable<DashboardView>(
     data: view,
     affinity: Axis.horizontal,
     dragAnchorStrategy: (draggable, context, position) =>
@@ -44,13 +44,13 @@ class ViewsList extends ReactiveWidget<ViewsSidebarModel> {
       height: draggingIconSize,
       child: FittedBox(
         fit: BoxFit.fill,
-        child: dragIcon ?? view.icon,
+        child: dragIcon ?? view.iconFunc(context),
       ),
     ),
     child: ListTile(
       mouseCursor: SystemMouseCursors.move,
       title: Text(view.name),
-      leading: view.icon,
+      leading: view.iconFunc(context),
     ),
   );
 
@@ -89,16 +89,16 @@ class ViewsList extends ReactiveWidget<ViewsSidebarModel> {
         title: const Text("Cameras"),
         children: [
           for (final view in DashboardView.cameraViews)
-            _buildDraggable(view, dragIcon: const Icon(Icons.camera_alt)),
+            _buildDraggable(context, view, dragIcon: const Icon(Icons.camera_alt)),
         ],
       ),
       ExpansionTile(
         title: const Text("Controls"),
         children: [
-          for (final view in DashboardView.uiViews) _buildDraggable(view),
+          for (final view in DashboardView.uiViews) _buildDraggable(context, view),
         ],
       ),
-      _buildDraggable(DashboardView.blank),
+      _buildDraggable(context, DashboardView.blank),
     ],
   );
 
@@ -144,18 +144,18 @@ class ViewsSelector extends StatelessWidget {
         onSelected: (view) => models.views.replaceView(index, view),
         itemBuilder: (_) => [
           const PopupMenuItem(enabled: false, child: Text("Cameras")),
-          for (final view in DashboardView.cameraViews) _buildItem(view),
+          for (final view in DashboardView.cameraViews) _buildItem(context, view),
           const PopupMenuDivider(),
           const PopupMenuItem(enabled: false, child: Text("Controls")),
-          for (final view in DashboardView.uiViews) _buildItem(view),
+          for (final view in DashboardView.uiViews) _buildItem(context, view),
         ],
       );
 
-  PopupMenuItem<DashboardView> _buildItem(DashboardView view) => PopupMenuItem(
+  PopupMenuItem<DashboardView> _buildItem(BuildContext context, DashboardView view) => PopupMenuItem(
         value: view,
         child: Row(
           children: [
-            view.icon,
+            view.iconFunc(context),
             const SizedBox(width: 8),
             Text(view.name),
           ],