Skip to content

fix: dark theme for MigrationStatusWindow and firmware upload overlay#504

Merged
tylerkron merged 3 commits intomainfrom
fix/dark-theme-migration-and-firmware-dialogs
Apr 26, 2026
Merged

fix: dark theme for MigrationStatusWindow and firmware upload overlay#504
tylerkron merged 3 commits intomainfrom
fix/dark-theme-migration-and-firmware-dialogs

Conversation

@tylerkron
Copy link
Copy Markdown
Contributor

Summary

Two remaining light-mode UI leaks are visibly out of place against the unified dark theme that landed across the design-philosophy sweep (#479, #484, #485, #486, #488, #492, #494, #495). Cleaning them up before the v3.2.0 release (#503) so first-launch upgraders and anyone uploading firmware see the dark surface they expect.

  • MigrationStatusWindow.xaml — was a fully white window with a #3498db progress bar. This shows on first launch after the 3.1.x → 3.2.0 EnsureCreated → EF Migrations upgrade flow (feat: switch from EnsureCreated() to EF Migrations for schema updates #469). Now uses Surface / BorderDim / TextSecondary / Accent from Resources/DesignTokens.xaml. Also flipped the Window.Background to Transparent so the existing rounded Border (CornerRadius="4", previously occluded by the opaque white window background) actually renders.
  • FirmwareDialog.xaml — the upload-in-progress scrim was #ccffffff (80% white), which washed out the dark dialog underneath while firmware was uploading. Replaced with a new Scrim token (#CC000000) and added Foreground="{StaticResource TextPrimary}" to the two Labels sitting on the scrim so they remain readable.

Tokens used / added

Used existing tokens from Resources/DesignTokens.xaml:

  • Surface, BorderDim, TextSecondary, TextPrimary, Accent

Added one new token (placed under a new "Overlays" section):

  • Scrim#CC000000, matches the #CC000000 overlay used in LoggedDataPanePrototype.xaml:1011 for the same blocking-overlay role. Existing scrims using inline #A0000000 were intentionally left alone — replacing them is broader than this hot-fix.

Test plan

  • Verify the migration status window shows on dark surface (run app with a pending EF migration; e.g., upgrade from 3.1.x DB).
  • Verify the rounded corners on MigrationStatusWindow actually render (Window.Background is now Transparent).
  • Verify firmware upload overlay shows a dark scrim with readable progress label and progress text.
  • Confirm MetroProgressBar inside the firmware overlay still reads correctly against the dark scrim (default MahApps Accent should be visible — please eyeball during a real upload).

Notes / unverified

I'm on macOS so I couldn't run the WPF app (net10.0-windows). Changes are XAML-only and follow the established pattern from ConnectionDialog.xaml (#488) — StaticResource lookup walks Window.Resources → Application.Resources, where DesignTokens.xaml is merged in App.xaml. Since Application.InitializeComponent runs before OnStartup (where MigrationStatusWindow is shown), the brushes should resolve. Worth a sanity check on Windows before merging.

Replace remaining light-mode hardcoded colors with the canonical design
tokens from Resources/DesignTokens.xaml:

- MigrationStatusWindow: surface, border, secondary text, and accent
  brushes now come from the shared dictionary. Switched the Window
  Background to Transparent so the rounded Border (already in place but
  previously hidden behind opaque white) actually shows.
- FirmwareDialog: replaced the semi-transparent white scrim shown during
  firmware upload (#ccffffff) with a new Scrim token (#CC000000) and gave
  the overlay labels TextPrimary so they read on the dark scrim.
- DesignTokens: added a Scrim brush (#CC000000) so future overlays can
  reference the token instead of inlining hex.
@tylerkron tylerkron requested a review from a team as a code owner April 26, 2026 03:20
@qodo-code-review
Copy link
Copy Markdown
Contributor

Review Summary by Qodo

Apply dark theme to MigrationStatusWindow and firmware upload overlay

🐞 Bug fix ✨ Enhancement

Grey Divider

Walkthroughs

Description
• Replace hardcoded light-mode colors with dark theme design tokens
• Add new Scrim overlay token for consistent dark overlays
• Fix MigrationStatusWindow rounded corners by making background transparent
• Improve firmware upload overlay readability with dark scrim and text styling
Diagram
flowchart LR
  A["Hardcoded Colors<br/>#ccffffff, #3498db, #555555"] -->|Replace with tokens| B["Design Tokens<br/>Surface, Accent, TextSecondary"]
  C["White Window Background"] -->|Change to Transparent| D["Visible Rounded Corners"]
  E["Light Scrim Overlay"] -->|New Scrim Token| F["Dark #CC000000 Overlay"]
  B --> G["Dark Theme UI"]
  D --> G
  F --> G
Loading

Grey Divider

File Changes

1. Daqifi.Desktop/Resources/DesignTokens.xaml ✨ Enhancement +3/-0

Add Scrim overlay design token

• Added new "Overlays" section with Scrim brush token (#CC000000)
• Provides centralized dark overlay color for consistent UI styling
• Matches existing overlay pattern from LoggedDataPanePrototype.xaml

Daqifi.Desktop/Resources/DesignTokens.xaml


2. Daqifi.Desktop/View/MigrationStatusWindow.xaml 🐞 Bug fix +8/-4

Apply dark theme tokens to migration status window

• Changed Window.Background from "White" to "Transparent" to reveal rounded Border
• Replaced hardcoded border color (#E0E0E0) with BorderDim token
• Replaced hardcoded text color (#555555) with TextSecondary token
• Replaced hardcoded progress bar color (#3498db) with Accent token
• Added Surface token to Border background for dark theme consistency

Daqifi.Desktop/View/MigrationStatusWindow.xaml


3. Daqifi.Desktop/View/FirmwareDialog.xaml 🐞 Bug fix +3/-3

Dark theme firmware upload overlay with readable text

• Replaced semi-transparent white scrim (#ccffffff) with Scrim token (#CC000000)
• Added TextPrimary foreground to both overlay labels for readability
• Maintains MetroProgressBar visibility against dark scrim background

Daqifi.Desktop/View/FirmwareDialog.xaml


Grey Divider

Qodo Logo

@qodo-code-review
Copy link
Copy Markdown
Contributor

qodo-code-review Bot commented Apr 26, 2026

Code Review by Qodo

🐞 Bugs (0) 📘 Rule violations (0) 📎 Requirement gaps (0)

Grey Divider


Action required

1. Long XAML Label lines📘 Rule violation ✧ Quality
Description
Two newly added Label elements are written on single lines that exceed the 120-character maximum.
This reduces readability and violates the repo’s line-length compliance requirement.
Code

Daqifi.Desktop/View/FirmwareDialog.xaml[R54-55]

+                <Label Grid.Row="2" Content="Loading Firmware... (this may take several minutes)." HorizontalAlignment="Center" Foreground="{StaticResource TextPrimary}" />
+                <Label Grid.Row="3" Content="{Binding UploadFirmwareProgressText}" HorizontalAlignment="Center" Foreground="{StaticResource TextPrimary}" />
Evidence
PR Compliance ID 244820 requires all added/modified lines to be <= 120 characters. The added Label
lines include multiple long attributes (Content, HorizontalAlignment, Foreground) on a single
line, pushing the line length beyond 120 characters.

Rule 244820: Enforce maximum line length of 120 characters
Daqifi.Desktop/View/FirmwareDialog.xaml[54-55]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
Two added XAML `Label` declarations exceed the 120-character line limit.

## Issue Context
The repo requires max 120 characters per added/modified line; these `Label` elements in the firmware upload overlay include multiple attributes on one line.

## Fix Focus Areas
- Daqifi.Desktop/View/FirmwareDialog.xaml[54-55]

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools



Advisory comments

2. Layered window perf risk🐞 Bug ➹ Performance
Description
MigrationStatusWindow enables per-pixel transparency (AllowsTransparency="True" + transparent
Window.Background), which makes the window a layered window and can reduce rendering performance vs.
an opaque window. This is likely fine for a small status window, but it’s a real tradeoff and should
be intentional (or replaced with WindowChrome if you want rounded corners without a layered window).
Code

Daqifi.Desktop/View/MigrationStatusWindow.xaml[R9-11]

+        Background="Transparent"
        Topmost="True"
        AllowsTransparency="True">
-    <Border BorderBrush="#E0E0E0" BorderThickness="1" CornerRadius="4" Padding="32,24">
Evidence
The PR changes the Window to be transparent and enables AllowsTransparency; the content is then
drawn on a Border with its own background, so only the window chrome/corners rely on per-pixel
transparency. In WPF, AllowsTransparency generally implies a layered window, which is a known
rendering/performance tradeoff compared to opaque windows.

Daqifi.Desktop/View/MigrationStatusWindow.xaml[1-16]
Best Practice: Microsoft WPF docs (Window.AllowsTransparency / layered windows)

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
`MigrationStatusWindow` uses `AllowsTransparency="True"` with `Background="Transparent"`, creating a layered window (per-pixel transparency). This can carry a rendering/performance tradeoff versus an opaque window.

### Issue Context
The rounded-corner Border is the actual visible surface; only the outer window area needs transparency.

### Fix Focus Areas
- Daqifi.Desktop/View/MigrationStatusWindow.xaml[1-16]

### What to change
- If acceptable visually: remove `AllowsTransparency="True"` and use an opaque `Window.Background` matching the Border.
- If rounded corners are required: consider using `WindowChrome` (rounded corners) while keeping an opaque window, avoiding layered-window transparency.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


Grey Divider

Qodo Logo

Comment thread Daqifi.Desktop/View/FirmwareDialog.xaml Outdated
- MigrationStatusWindow: revert Window.Background back to opaque Surface
  (from Transparent). Avoids the layered-window perf cost Qodo flagged
  while keeping the color-token fix. Original visual behavior preserved
  (rounded-corner reveal was scope creep).
- FirmwareDialog: split the two overlay Label declarations across
  multiple lines so they comply with the 120-char rule.
@tylerkron
Copy link
Copy Markdown
Contributor Author

Responses to Qodo's review summary

1. Long XAML Label lines (rule violation) — Fixed in commit cee221e (rebased to 1be4c7f). Replied inline on the discussion thread. Both Label declarations split onto multiple lines, each under 120 chars.

2. Layered window perf risk (advisory) — Agreed and reverted. Changed MigrationStatusWindow's Window.Background back to {StaticResource Surface} (opaque) instead of Transparent. The AllowsTransparency="True" attribute already existed before this PR and the layered-window cost was already being paid; my Transparent change was the only thing that exposed the rounded Border corners, which was scope creep beyond the color-leak fix. Reverting preserves the original visual behavior (no visible rounded corners — same as 3.1.x) while keeping the dark color tokens. If we want rounded corners later, doing it via WindowChrome (Qodo's second suggestion) would be the right path and belongs in its own PR.

@github-actions
Copy link
Copy Markdown

📊 Code Coverage Report

Summary

Summary
Generated on: 4/26/2026 - 3:37:55 AM
Coverage date: 4/26/2026 - 3:37:22 AM - 4/26/2026 - 3:37:51 AM
Parser: MultiReport (4x Cobertura)
Assemblies: 3
Classes: 119
Files: 148
Line coverage: 17.8% (1512 of 8494)
Covered lines: 1512
Uncovered lines: 6982
Coverable lines: 8494
Total lines: 26211
Branch coverage: 18.8% (521 of 2770)
Covered branches: 521
Total branches: 2770
Method coverage: Feature is only available for sponsors

Coverage

DAQiFi - 17.6%
Name Line Branch
DAQiFi 17.6% 18.8%
Daqifi.Desktop.App 5.4% 0%
Daqifi.Desktop.Channel.AbstractChannel 40.9% 27.7%
Daqifi.Desktop.Channel.AnalogChannel 58.7% 25%
Daqifi.Desktop.Channel.Channel 11.5% 0%
Daqifi.Desktop.Channel.ChannelColorManager 100% 100%
Daqifi.Desktop.Channel.DataSample 91.6%
Daqifi.Desktop.Channel.DigitalChannel 65.2% 25%
Daqifi.Desktop.Commands.CompositeCommand 0% 0%
Daqifi.Desktop.Commands.HostCommands 0%
Daqifi.Desktop.Commands.WeakEventHandlerManager 0% 0%
Daqifi.Desktop.Configuration.FirewallConfiguration 90.6% 66.6%
Daqifi.Desktop.Configuration.WindowsFirewallWrapper 64% 68.4%
Daqifi.Desktop.ConnectionManager 42.4% 39.2%
Daqifi.Desktop.Converters.BoolToActiveStatusConverter 0% 0%
Daqifi.Desktop.Converters.BoolToConnectionStatusConverter 0% 0%
Daqifi.Desktop.Converters.BoolToStatusColorConverter 0% 0%
Daqifi.Desktop.Converters.BrushColorMatchConverter 0% 0%
Daqifi.Desktop.Converters.ConnectionTypeToColorConverter 0% 0%
Daqifi.Desktop.Converters.ConnectionTypeToUsbConverter 0% 0%
Daqifi.Desktop.Converters.InvertedBoolToVisibilityConverter 0% 0%
Daqifi.Desktop.Converters.ListToStringConverter 0% 0%
Daqifi.Desktop.Converters.NotNullToVisibilityConverter 0% 0%
Daqifi.Desktop.Converters.OxyColorToBrushConverter 0% 0%
Daqifi.Desktop.Device.AbstractStreamingDevice 42.9% 38.6%
Daqifi.Desktop.Device.DeviceMessage 0%
Daqifi.Desktop.Device.Firmware.BootloaderSessionStreamingDeviceAdapter 0% 0%
Daqifi.Desktop.Device.Firmware.WifiPromptDelayProcessRunner 0% 0%
Daqifi.Desktop.Device.NativeMethods 100%
Daqifi.Desktop.Device.SerialDevice.SerialStreamingDevice 27.6% 30.8%
Daqifi.Desktop.Device.WiFiDevice.DaqifiStreamingDevice 40.9% 39.4%
Daqifi.Desktop.DialogService.DialogService 0% 0%
Daqifi.Desktop.DialogService.ServiceLocator 0% 0%
Daqifi.Desktop.DiskSpace.DiskSpaceCheckResult 100%
Daqifi.Desktop.DiskSpace.DiskSpaceEventArgs 100%
Daqifi.Desktop.DiskSpace.DiskSpaceMonitor 88.2% 86.6%
Daqifi.Desktop.DuplicateDeviceCheckResult 100%
Daqifi.Desktop.Exporter.OptimizedLoggingSessionExporter 66.5% 62.7%
Daqifi.Desktop.Exporter.SampleData 100%
Daqifi.Desktop.Helpers.BooleanConverter`1 0% 0%
Daqifi.Desktop.Helpers.BooleanToInverseBoolConverter 0% 0%
Daqifi.Desktop.Helpers.BooleanToVisibilityConverter 0%
Daqifi.Desktop.Helpers.EnumDescriptionConverter 100% 100%
Daqifi.Desktop.Helpers.IntToVisibilityConverter 0% 0%
Daqifi.Desktop.Helpers.MinMaxDownsampler 98.6% 97.9%
Daqifi.Desktop.Helpers.MyMultiValueConverter 0%
Daqifi.Desktop.Helpers.NaturalSortHelper 100% 100%
Daqifi.Desktop.Helpers.OxyPlotDarkTheme 0%
Daqifi.Desktop.Helpers.VersionHelper 98.2% 66.2%
Daqifi.Desktop.Logger.DatabaseLogger 0% 0%
Daqifi.Desktop.Logger.DatabaseMigrator 0% 0%
Daqifi.Desktop.Logger.DeviceLegendGroup 100% 100%
Daqifi.Desktop.Logger.LoggedSeriesLegendItem 0% 0%
Daqifi.Desktop.Logger.LoggingContext 100%
Daqifi.Desktop.Logger.LoggingContextDesignTimeFactory 0%
Daqifi.Desktop.Logger.LoggingManager 0% 0%
Daqifi.Desktop.Logger.LoggingSession 16% 5%
Daqifi.Desktop.Logger.PlotLogger 0% 0%
Daqifi.Desktop.Logger.SessionDeviceMetadata 80%
Daqifi.Desktop.Logger.SummaryLogger 0% 0%
Daqifi.Desktop.Logger.TimestampGapDetector 95% 83.3%
Daqifi.Desktop.Loggers.ImportOptions 0%
Daqifi.Desktop.Loggers.ImportProgress 0% 0%
Daqifi.Desktop.Loggers.SdCardSessionImporter 0% 0%
Daqifi.Desktop.MainWindow 0% 0%
Daqifi.Desktop.Migrations.AddSamplesSessionTimeIndex 0%
Daqifi.Desktop.Migrations.AddSessionDeviceMetadata 0%
Daqifi.Desktop.Migrations.AddSessionSampleCount 0%
Daqifi.Desktop.Migrations.InitialSQLiteMigration 0%
Daqifi.Desktop.Migrations.LoggingContextModelSnapshot 0%
Daqifi.Desktop.Models.AddProfileModel 0%
Daqifi.Desktop.Models.DaqifiSettings 80.5% 83.3%
Daqifi.Desktop.Models.DebugDataCollection 6.6% 0%
Daqifi.Desktop.Models.DebugDataModel 0% 0%
Daqifi.Desktop.Models.Notifications 0%
Daqifi.Desktop.Models.SdCardFile 0% 0%
Daqifi.Desktop.Services.WindowsPrincipalAdminChecker 0%
Daqifi.Desktop.Services.WpfMessageBoxService 0%
Daqifi.Desktop.UpdateVersion.VersionNotification 0% 0%
Daqifi.Desktop.View.ConnectionDialog 0% 0%
Daqifi.Desktop.View.DebugWindow 0% 0%
Daqifi.Desktop.View.DeviceLogsView 0% 0%
Daqifi.Desktop.View.DuplicateDeviceDialog 0% 0%
Daqifi.Desktop.View.ErrorDialog 0% 0%
Daqifi.Desktop.View.ExportDialog 0% 0%
Daqifi.Desktop.View.FirmwareDialog 0% 0%
Daqifi.Desktop.View.Flyouts.FirmwareFlyout 0% 0%
Daqifi.Desktop.View.Flyouts.LiveGraphFlyout 0% 0%
Daqifi.Desktop.View.Flyouts.NotificationsFlyout 0% 0%
Daqifi.Desktop.View.Flyouts.SummaryFlyout 0% 0%
Daqifi.Desktop.View.MigrationStatusWindow 0% 0%
Daqifi.Desktop.View.MinimapInteractionController 0% 0%
Daqifi.Desktop.View.ProfilesPane 0% 0%
Daqifi.Desktop.View.Prototype.ChannelsPanePrototype 0% 0%
Daqifi.Desktop.View.Prototype.DevicesPanePrototype 0% 0%
Daqifi.Desktop.View.Prototype.LiveGraphPane 0% 0%
Daqifi.Desktop.View.Prototype.LoggedDataPanePrototype 0% 0%
Daqifi.Desktop.View.SuccessDialog 0% 0%
Daqifi.Desktop.ViewModels.ChannelsPaneViewModel 0% 0%
Daqifi.Desktop.ViewModels.ChannelTileViewModel 0% 0%
Daqifi.Desktop.ViewModels.ConnectionDialogViewModel 37.3% 39.1%
Daqifi.Desktop.ViewModels.DaqifiViewModel 17.5% 10.9%
Daqifi.Desktop.ViewModels.DeviceLogsViewModel 0% 0%
Daqifi.Desktop.ViewModels.DevicesPaneViewModel 0% 0%
Daqifi.Desktop.ViewModels.DeviceTileViewModel 0% 0%
Daqifi.Desktop.ViewModels.DuplicateDeviceDialogViewModel 0%
Daqifi.Desktop.ViewModels.ErrorDialogViewModel 0%
Daqifi.Desktop.ViewModels.ExportDialogViewModel 0% 0%
Daqifi.Desktop.ViewModels.FirmwareDialogViewModel 0% 0%
Daqifi.Desktop.ViewModels.NewProfileChannelItem 0%
Daqifi.Desktop.ViewModels.NewProfileDeviceItem 0% 0%
Daqifi.Desktop.ViewModels.ProfilesPaneViewModel 0% 0%
Daqifi.Desktop.ViewModels.SettingsViewModel 0% 0%
Daqifi.Desktop.ViewModels.SuccessDialogViewModel 85.7%
Daqifi.Desktop.WindowViewModelMapping.IWindowViewModelMappingsContract 0%
Daqifi.Desktop.WindowViewModelMapping.WindowViewModelMappings 0%
Sentry.Generated.BuildPropertyInitializer 100%
Daqifi.Desktop.Common - 30.8%
Name Line Branch
Daqifi.Desktop.Common 30.8% 16.6%
Daqifi.Desktop.Common.Loggers.AppLogger 33.7% 16.6%
Daqifi.Desktop.Common.Loggers.NoOpLogger 0%
Daqifi.Desktop.IO - 100%
Name Line Branch
Daqifi.Desktop.IO 100% ****
Daqifi.Desktop.IO.Messages.MessageEventArgs`1 100%

Coverage report generated by ReportGeneratorView full report in build artifacts

@tylerkron tylerkron merged commit 66668bc into main Apr 26, 2026
4 checks passed
@tylerkron tylerkron deleted the fix/dark-theme-migration-and-firmware-dialogs branch April 26, 2026 03:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant