Widgets in screen with tinted mode

[pantelisss]

Why?

The widget UI is broken in tinted mode

How?

Clear colors in tinted mode

Testing

Run the app and add widgets in all sizes. Then customize the Home Screen to tinted (screenshot) and ensure the UI seems better

Screenshots (if applicable)

Additional context

fixes fe-2057

Summary by CodeRabbit

• New Features
  • Weather overview displays now support configurable background colors, allowing different background treatments across widget sizes.
  • Widgets adapt their visuals to the system rendering/tinting context, switching to a neutral appearance when tinted and applying layered backgrounds otherwise.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Walkthrough

WeatherOverviewView gains two configurable background properties (dataViewBackground, secondaryFieldsViewBackground). StationWidgetView reads widgetRenderingMode and passes these properties (.noColor when accented/tinted, otherwise .top/.layer1) into WeatherOverviewView for small, medium, and large layouts.

Changes

Cohort / File(s)	Summary
WeatherOverviewView background configurability PresentationLayer/UIComponents/BaseComponents/WeatherOverview/WeatherOverviewView.swift	Added stored properties dataViewBackground (default .top) and secondaryFieldsViewBackground (default .layer1). Replaced hardcoded card background colors in main data and secondary fields views with these properties.
StationWidgetView dynamic background handling station-widget/Views/StationWidgetView.swift	Introduced @Environment(\.widgetRenderingMode) and isTinted logic. Updated all WeatherOverviewView initializations (small, medium, large) to pass dataViewBackground (.noColor when tinted, .top otherwise). Large layout now also passes secondaryFieldsViewBackground (.noColor when tinted, .layer1 otherwise). Updated widget URL binding and preview scenario.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

• Areas to review closely:
  • Default values and enum cases for Background used by WeatherOverviewView.
  • Consistency of .noColor vs .top/.layer1 across small/medium/large initializations.
  • Any visual/regression impacts in widget rendering modes (accented vs default).
  • Widget URL binding change in StationWidgetView.

Suggested reviewers

• PavlosTze

Poem

🐰 I bounce through lines of code so bright,
I dot the backgrounds, tweak the light.
Tinted or true, the widgets gleam—
A rabbit's hop, a dev's small dream. 🌤️✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'Widgets in screen with tinted mode' directly relates to the main change: fixing widget UI in tinted mode by clearing colors. It captures the core objective.
Description check	✅ Passed	The description includes all required template sections: Why (broken UI in tinted mode), How (clear colors), Testing (steps to verify), Screenshots (provided), and Additional context (issue reference).

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feature/fe-2057-widget-in-screen-with-tinted-mode

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 69459f7 and cf5dcfc.

📒 Files selected for processing (1)

• station-widget/Views/StationWidgetView.swift (5 hunks)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

• GitHub Check: WeatherXM | Unit tests | wxm-ios - iOS

🔇 Additional comments (6)

station-widget/Views/StationWidgetView.swift (6)

127-130: LGTM!

The conditional background logic correctly applies .noColor in tinted mode and .top otherwise, which aligns with the PR objective to fix the widget UI in tinted mode.

---

146-149: LGTM!

Consistent with the small view, the medium view correctly applies .noColor background in tinted mode.

---

165-170: LGTM!

The large view correctly handles both dataViewBackground and secondaryFieldsViewBackground, applying .noColor for tinted mode and .top/.layer1 otherwise. This properly fixes the tinted mode UI for the large widget.

---

317-317: Preview change aids testing.

Changing the preview to .systemLarge allows better testing of the most complex widget size, which has both dataViewBackground and secondaryFieldsViewBackground changes.

---

20-45: <!-- [scratchpad_start]
[task review_comment_verification_1/1]
Verify the review comment about StationWidgetView.swift lines 20-45

[observations]

• widgetUrl is fully implemented at lines 56-77
• All 5 enum cases are handled in the switch statement:
  1. .station: returns URL with device.id
  2. .loggedOut: returns URL with WidgetUrlType.loggedOut
  3. .empty: returns URL with WidgetUrlType.empty
  4. .error: returns URL with WidgetUrlType.error
  5. .selectStation: returns URL with WidgetUrlType.selectStation
• All cases return URL(string:) with properly formatted scheme
• URL construction uses WidgetUrlType enum for consistency
• scheme is constructed as "(widgetScheme)://"
• .station case handles optional device.id with nil coalescing to empty string
• No case returns nil explicitly - all use URL(string:) which can return nil if string is invalid
• Exhaustive switch statement (no default needed)

[analysis]

• .modify extension: Legitimate custom extension using @ViewBuilder pattern
• widgetUrl property: Properly implemented with all cases handled
• All cases safely construct URL strings with WidgetUrlType enum values
• The only potential issue is device.id being optional - could create invalid URL with empty id
• But this is defensive: returns nil safely if URL(string:) fails on invalid input
• Code is sound and safe

[done]
No issues found. The review comment's concerns are unfounded:

1. .modify extension exists and is properly implemented
2. widgetUrl property returns safe values for all timeline cases

• All cases are exhaustively handled
• URL construction is safe
• Returns URL? (optional) so invalid strings become nil
  </scratchpad_end] -->

No issues identified. Both .modify extension and widgetUrl implementation are correct and safe.

The .modify extension (in PresentationLayer/UIComponents/Modifiers/ConditionalModifier.swift:39) is a standard @ViewBuilder pattern that properly applies conditional transformations. The widgetUrl property (in station-widget/StationTimelineEntry.swift:56-77) exhaustively handles all five timeline cases (station, loggedOut, empty, error, selectStation), safely constructing URL strings with the WidgetUrlType enum and returning URL? to handle any invalid constructions. No fixes are required.

---

15-18: Based on my verification, I found that the original review comment contains an incorrect iOS version requirement. The @Environment(\.widgetRenderingMode) API is available starting in iOS 16, not iOS 17 as stated in the review comment.

However, the underlying concern about availability guards remains valid. Since I cannot access the full codebase to verify whether proper @available guards are in place throughout the file, I'll provide the corrected review comment:

---

Verify iOS deployment target compatibility and add availability guards if needed.

@Environment(\.widgetRenderingMode) requires iOS 16+ (use @available(iOSApplicationExtension 16.0, *) for widget extensions). If the app or widget extension targets earlier iOS versions, this will cause a crash. Ensure proper availability guards are applied to the struct and any code paths that use this environment value.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[weatherxmdev]

Code Coverage Summary

Framework	Source Files	Coverage
DataLayer.framework	49	66.82%
DomainLayer.framework	67	83.70%
Toolkit.framework	30	53.38%
WeatherXM.app	406	14.18%
station-intent.appex	2	83.33%
station-widgetExtension.appex	45	33.84%