Skip to content

[Mobile]:Add share card entry points to mobile forecast details#3668

Merged
Baalmart merged 2 commits into
stagingfrom
mobile-share-air-quality
Jun 19, 2026
Merged

[Mobile]:Add share card entry points to mobile forecast details#3668
Baalmart merged 2 commits into
stagingfrom
mobile-share-air-quality

Conversation

@Hassan-KreateStudio

@Hassan-KreateStudio Hassan-KreateStudio commented Jun 19, 2026

Copy link
Copy Markdown
Contributor

Replaces the close button in the mobile forecast details view with the AirQo share action, routes sharing through a reusable share-card bottom sheet, and removes the plain-text share option so users share the visual air quality card only.

Summary by CodeRabbit

Release Notes

  • New Features

    • Added the ability to share air quality forecasts and measurements directly from the dashboard as a shareable image.
    • When a measurement is available, the dashboard header now includes a share action to start the image-sharing flow.
  • Improvements

    • Unified air-quality sharing across the app into a single, consistent flow with progress feedback during sharing.
    • Improved robustness with clear messages if image creation or sharing fails.

@coderabbitai

coderabbitai Bot commented Jun 19, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 007643b2-3c76-41c6-aa55-87dcd84ed9da

📥 Commits

Reviewing files that changed from the base of the PR and between 2e948a7 and d2e8c54.

📒 Files selected for processing (3)
  • src/mobile/lib/src/app/dashboard/pages/forecast_overview_page.dart
  • src/mobile/lib/src/app/dashboard/widgets/air_quality_share_sheet.dart
  • src/mobile/lib/src/app/dashboard/widgets/analytics_specifics.dart
🚧 Files skipped from review as they are similar to previous changes (3)
  • src/mobile/lib/src/app/dashboard/widgets/air_quality_share_sheet.dart
  • src/mobile/lib/src/app/dashboard/pages/forecast_overview_page.dart
  • src/mobile/lib/src/app/dashboard/widgets/analytics_specifics.dart

📝 Walkthrough

Walkthrough

A new AirQualityShareSheet widget and showAirQualityShareSheet function centralize air-quality measurement sharing: the widget captures a RepaintBoundary-rendered share card as PNG bytes and delegates to AirQualityShareService. AnalyticsSpecifics drops its inline modal and capture logic in favor of this shared entry point, and ForecastOverviewPage gains a conditional share icon that triggers the same sheet.

Changes

Centralized Air Quality Share Sheet

Layer / File(s) Summary
AirQualityShareSheet widget and share flow
src/mobile/lib/src/app/dashboard/widgets/air_quality_share_sheet.dart
Introduces showAirQualityShareSheet function and AirQualityShareSheet StatefulWidget. Implements _captureCard (renders AirQualityShareCard via RepaintBoundary to clamped-DPR PNG bytes) and _shareCard (re-entrancy guard, snackbar on null bytes, AirQualityShareService.shareMeasurementCard call, finally state reset). Builds the bottom-sheet UI with card preview and a loading-state share button.
AnalyticsSpecifics migration
src/mobile/lib/src/app/dashboard/widgets/analytics_specifics.dart
Removes inline share option branching and modal implementation; replaces with single showAirQualityShareSheet call passing sharePositionOrigin; updates share button to call _shareAirQuality unconditionally using an SVG icon; cleans up now-unused imports; adjusts argument formatting.
ForecastOverviewPage share entry point
src/mobile/lib/src/app/dashboard/pages/forecast_overview_page.dart
Adds import, _shareButtonKey GlobalKey, and _openShareSheet helper that computes the button's RenderBox rect and calls showAirQualityShareSheet. Header icon conditionally renders share or close based on widget.measurement. Minor refactoring of hourly variable init and error icon ternary.

Sequence Diagram(s)

sequenceDiagram
  actor User
  participant ForecastOverviewPage
  participant AnalyticsSpecifics
  participant showAirQualityShareSheet
  participant AirQualityShareSheet
  participant AirQualityShareService

  rect rgba(100, 149, 237, 0.5)
    Note over ForecastOverviewPage: Via share icon in header
    User->>ForecastOverviewPage: taps share icon
    ForecastOverviewPage->>ForecastOverviewPage: _openShareSheet() computes RenderBox rect
    ForecastOverviewPage->>showAirQualityShareSheet: call with measurement + sharePositionOrigin
  end

  rect rgba(144, 238, 144, 0.5)
    Note over AnalyticsSpecifics: Via share button in analytics
    User->>AnalyticsSpecifics: taps share button
    AnalyticsSpecifics->>AnalyticsSpecifics: _shareAirQuality() computes RenderBox rect
    AnalyticsSpecifics->>showAirQualityShareSheet: call with measurement + sharePositionOrigin
  end

  showAirQualityShareSheet->>AirQualityShareSheet: present modal bottom sheet
  User->>AirQualityShareSheet: taps share card button
  AirQualityShareSheet->>AirQualityShareSheet: _captureCard() → RepaintBoundary → PNG bytes
  AirQualityShareSheet->>AirQualityShareService: shareMeasurementCard(bytes, measurement, location, origin)
  AirQualityShareService-->>AirQualityShareSheet: complete
  AirQualityShareSheet->>AirQualityShareSheet: finally reset _isSharingCard
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

  • airqo-platform/AirQo-frontend#3657: Introduces AirQualityShareCard and AirQualityShareService.shareMeasurementCard, which are the exact dependencies consumed by the new AirQualityShareSheet widget in this PR.
  • airqo-platform/AirQo-frontend#3664: Modifies ForecastOverviewPage to refactor forecast-details sheet UI; this PR layers the share-button and hourly-selection updates on top of that refactor.

Suggested labels

mobile-app

Suggested reviewers

  • Baalmart
  • Mozart299

Poem

📤 The share sheet rises, sleek and new,
One function to rule the modal view.
Old inline widgets swept away,
RepaintBoundary saves the day.
PNG bytes float up through the air —
now every forecast is ready to share. 🌤️

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately describes the main change: adding share card functionality to mobile forecast details pages as entry points for users.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch mobile-share-air-quality

Warning

Review ran into problems

🔥 Problems

Errors were encountered while retrieving linked issues.

Errors (1)
  • JIRA integration encountered authorization issues. Please disconnect and reconnect the integration in the CodeRabbit UI.

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

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

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (1)
src/mobile/lib/src/app/dashboard/pages/forecast_overview_page.dart (1)

165-169: ⚡ Quick win

Pass fallbackLocationName to keep share text/card location consistent.

When measurement.siteDetails naming fields are absent, the share payload falls back to generic text. Forward widget.siteName here to preserve location quality.

Proposed fix
     await showAirQualityShareSheet(
       context,
       measurement: measurement,
+      fallbackLocationName: widget.siteName,
       sharePositionOrigin: shareOrigin,
     );
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/mobile/lib/src/app/dashboard/pages/forecast_overview_page.dart` around
lines 165 - 169, The showAirQualityShareSheet function call is missing the
fallbackLocationName parameter, which causes the share payload to fall back to
generic text when measurement.siteDetails naming fields are absent. Add the
fallbackLocationName parameter with the value widget.siteName to the
showAirQualityShareSheet call to preserve location quality in the share text and
card.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/mobile/lib/src/app/dashboard/widgets/air_quality_share_sheet.dart`:
- Around line 58-77: The try/finally block starting with _captureCard() and
AirQualityShareService.shareMeasurementCard() lacks exception handling, so if
either method throws an error, the user receives no feedback. Add a catch block
between the try block and the finally keyword that captures any exception,
checks if the widget is still mounted using the same pattern as the existing
null check, and displays a SnackBar with an appropriate error message to inform
the user that sharing failed.

---

Nitpick comments:
In `@src/mobile/lib/src/app/dashboard/pages/forecast_overview_page.dart`:
- Around line 165-169: The showAirQualityShareSheet function call is missing the
fallbackLocationName parameter, which causes the share payload to fall back to
generic text when measurement.siteDetails naming fields are absent. Add the
fallbackLocationName parameter with the value widget.siteName to the
showAirQualityShareSheet call to preserve location quality in the share text and
card.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: c37e6894-9031-4c85-8a83-1e9a29aa52dd

📥 Commits

Reviewing files that changed from the base of the PR and between fa905d7 and 2e948a7.

📒 Files selected for processing (3)
  • src/mobile/lib/src/app/dashboard/pages/forecast_overview_page.dart
  • src/mobile/lib/src/app/dashboard/widgets/air_quality_share_sheet.dart
  • src/mobile/lib/src/app/dashboard/widgets/analytics_specifics.dart

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR updates the mobile forecast details experience to route sharing through a reusable “share card” bottom sheet, so users share the visual air quality card (image) rather than plain text.

Changes:

  • Replaces the analytics share flow with a reusable showAirQualityShareSheet(...) entry point.
  • Adds a new AirQualityShareSheet bottom sheet that previews and shares the air quality card as an image.
  • Replaces the forecast details close button with a share action when a measurement is available.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 2 comments.

File Description
src/mobile/lib/src/app/dashboard/widgets/analytics_specifics.dart Switches share action to the new reusable share-sheet entry point and updates the share icon.
src/mobile/lib/src/app/dashboard/widgets/air_quality_share_sheet.dart Introduces the reusable bottom sheet that renders, captures, and shares the air quality share card image.
src/mobile/lib/src/app/dashboard/pages/forecast_overview_page.dart Adds a share entry point in forecast details (using the reusable share sheet) when a measurement is present.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/mobile/lib/src/app/dashboard/widgets/analytics_specifics.dart
Comment thread src/mobile/lib/src/app/dashboard/pages/forecast_overview_page.dart
@Baalmart
Baalmart merged commit beddcc9 into staging Jun 19, 2026
25 of 27 checks passed
@Baalmart
Baalmart deleted the mobile-share-air-quality branch June 19, 2026 07:05
@Baalmart Baalmart mentioned this pull request Jun 19, 2026
13 tasks
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.

4 participants