Skip to content

Add DaxAppTPBanner composable to the design system - #9762

Open
Kyriakos-Georgiopoulos wants to merge 1 commit into
developfrom
feature/kyriakos/dax-apptp-banner
Open

Add DaxAppTPBanner composable to the design system#9762
Kyriakos-Georgiopoulos wants to merge 1 commit into
developfrom
feature/kyriakos/dax-apptp-banner

Conversation

@Kyriakos-Georgiopoulos

@Kyriakos-Georgiopoulos Kyriakos-Georgiopoulos commented Sep 9, 2026

Copy link
Copy Markdown
Contributor

Task/Issue URL: https://app.asana.com/1/137249556945/project/1215496415658080/task/1211670072973969?focus=true
Tech Design URL (if applicable): N/A
API Proposals URL(s) (if applicable): N/A

Description

Adds the Compose DaxAppTPBanner to the ADS. It renders a DaxCard whose whole surface is a single tap target, with the message on the left and a state pictogram on the right:

  • DaxAppTPBanner(text: String, …): plain message.
  • DaxAppTPBanner(text: AnnotatedString, …): for the bolded lead-in the App Tracking Protection states use.

DaxAppTPBannerState selects the pictogram: Protected or Warning.

The two pictograms move from vpn-impl into the design system so the component can own them, and the existing AppTP screens now reference them from there.

No lint rule: there is no raw Material equivalent to guard against.

Steps to test this PR

ADS catalog

  • Install an internal debug build
  • Open Settings -> "Android Design System Preview" -> Messaging tab
  • Scroll to the bottom, past Remote Messaging Framework, Info Panel and Snackbar
  • Verify four banners render: Enabled, Trackers Blocked, Disabled, Revoked
  • Tap a banner and verify a snackbar appears, and that the ripple is clipped to the rounded corners
  • Confirm the above in both light and dark themes (Others tab -> Enable Dark Theme)
  • Compare the Compose component against Figma (do not compare against XML as it's not based on Figma)

App Tracking Protection screens (the pictograms moved modules)

  • Enable App Tracking Protection
  • On the New Tab page, verify the AppTP card still shows its pictogram in the enabled, disabled and revoked states
  • Open the Device Shield screen and verify the same
  • Open the "Restore defaults" dialog in AppTP settings and verify its image still renders

Maestro

  • Run maestro test .maestro/ads_preview_flows/1-_design-system-components.yaml with the app installed

UI

Light Dark
DaxAppTPBanner_Light DaxAppTPBanner_Dark

Note

Low Risk
Mostly new Compose UI and drawable relocation with reference updates; no VPN or auth logic changes.

Overview
Introduces DaxAppTPBanner in the Android Design System: a full-width, tappable DaxCard with message text (plain or AnnotatedString) and a Protected / Warning pictogram via DaxAppTPBannerState.

AppTP banner assets (ic_apptp_banner_default, ic_apptp_banner_warning) are centralized in the design system; vpn-impl New Tab, Device Shield, and restore-defaults UI now reference those shared drawables instead of module-local icons.

The ADS Messaging catalog gains an App Tracking Protection Banner section (four sample states) plus Maestro scroll/assert steps for the Enabled and Revoked showcase headers.

Reviewed by Cursor Bugbot for commit 5efc562. Bugbot is set up for automated code reviews on this repo. Configure here.

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