chore(examples): update RNOneSignalTS demo to match Android design + functionality by sherwinski · Pull Request #1911 · OneSignal/react-native-onesignal

sherwinski · 2026-02-13T23:02:43Z

Description

One Line Summary

Updates the RNOneSignalTS Demo to match the https://github.com/OneSignal/OneSignal-Android-SDK/tree/main/Examples/OneSignalDemoV2 demo both in design and functionality.

Details

Motivation

A more consistent demo app experience that can be tested in the same way across all SDK platforms.

Scope

Scope only includes everything under examples/

Testing

Manual testing

Test by building the app and running on your emulator/device of choice. Utilize the log view to inspect API calls made as you interact with the app.

Affected code checklist

Checklist

Overview

I have filled out all REQUIRED sections above
PR does one thing
- If it is hard to explain how any codes changes are related to each other then it most likely needs to be more than one PR
Any Public API changes are explained in the PR details and conform to existing APIs

Testing

I have included test coverage for these changes, or explained why they are not needed
All automated tests pass, or I explained why that is not possible
I have personally tested this on my device, or explained why that is not possible

Final pass

Code is as readable as possible.
- Simplify with less code, followed by splitting up code into well named functions and variables, followed by adding comments to the code.
I have reviewed this PR myself, ensuring it meets each checklist item
- WIP (Work In Progress) is ok, but explain what is still in progress and what you would like feedback on. Start the PR title with "WIP" to indicate this.

This change is

fadi-george · 2026-02-14T00:45:48Z

Lets rename example to demo and app name (when it installs) to OneSignal Demo

fadi-george · 2026-02-14T00:54:25Z

For status, it should be a green "Logged In" text

fadi-george · 2026-02-14T00:55:28Z

Next Activity doesnt work, see android project for what to do
Dont need bottom 2 tabs

fadi-george · 2026-02-14T00:55:47Z

Dont need the "Home" bar at the top

- `components/dialogs/LoginUserDialog.tsx`: New modal dialog for user login with: - Title: "External User Id" - Text input prepopulated with "test" - "Login" and "Cancel" buttons - Calls `OneSignal.login()` on confirm - Change title on buttons to better match native Android example app

- Fixed the backdrop - Now uses a single Pressable that properly fills the entire screen with the semi-transparent overlay - Wider dialog - Increased width from 80% to 85% - Better structure - The backdrop handles dismiss-on-outside-tap, while the dialog container uses stopPropagation() to prevent accidental closes - Adjusted styling - Slightly reduced border radius (4 instead of 8) and adjusted padding to better match Material Design dialogs

- Red background buttons - Changed from gray (Colors.background) to red (Colors.primary) - White text - Changed title color from dark to white - Updated section titles - "Send Push Notification" and "Send In-App Message" to match native - Larger buttons - Increased minHeight from 80 to 100 - Larger icons - Increased icon font size from 32 to 36 - Bolder text - Changed font weight to bold and size to 14 - Removed Card wrapper - Using a simpler container with margins, similar to the native app layout - Improved spacing - Better gap between buttons using marginBottom and justifyContent: 'space-between'

- Add new state fields: externalUserId, isLoading, permissionGranted - Add bulk actions: SET_ALL_*, CLEAR_ALL_* for aliases, tags, triggers, emails, sms - Add UserData interface for REST API responses - Create OneSignalService.ts for fetching user data from REST API

- AppInfoSection: Add guidance banner, consent toggle, logged-in display - PushSubscriptionSection: Conditional PROMPT PUSH button, auto-request permission - NotificationDemoSection: Simplify to 3 buttons (Simple, With Image, Custom) - IamDemoSection: Full-width red buttons with icons - AliasesSection: Add Remove All button - EmailSection/SmsSection: Add collapsible behavior for >5 items - TagsSection: Remove Get Tags button - OutcomeSection: Add dropdown with 3 outcome types (Normal, Unique, With Value) - Create TrackEventSection and TrackEventDialog - Update ToggleRow to support description prop - Update ActionButton to support disabled prop

- Create TooltipContent.ts with all tooltip data - Create TooltipHelper.ts for showing tooltip dialogs - Create TooltipButton component - Update SectionHeader to support tooltipKey prop - Add tooltips to all sections

…rdering - Add loading overlay with semi-transparent background - Implement user data fetching from REST API on user change - Fetch user data on cold start if OneSignal ID exists - Reorder sections to match Android V2 specification: 1. App (with Privacy Consent) 2. Push 3. Send Push Notification 4. In-App Messaging 5. Send In-App Message 6. Aliases 7. Emails 8. SMSs 9. Tags 10. Outcome Events 11. Triggers 12. Track Event 13. Location 14. Live Activities (iOS) 15. Navigation - Remove standalone PrivacyConsentSection (now integrated in AppInfoSection)

UI/Styling Changes: - Add red branded header bar (#E9444E) with OneSignal logo text - Update buttons to 56dp height, 19sp font, 6dp border radius - Add uppercase text transform to all button labels - Convert side-by-side buttons to full-width stacked layout Label Updates: - Notification buttons: "Simple Notification", "Notification With Image", "Custom Notification" - Location button: "Prompt Location" (was "Request Permission") - Aliases button: "Remove All Aliases" (was "Remove All") - Remove "Clear All" button from Triggers section Toggle Descriptions: - Location: "Location Shared:" with "Location will be shared from device" - IAM: "Pause In-App Messages:" with "Toggle in-app messages" Other Changes: - Remove redundant NavigationSection (bottom tabs provide navigation) - Add retry mechanism with exponential backoff for OneSignal ID fetch on startup

Design Changes: - Update button styling to match Android (44dp height, 10dp radius, 13sp semibold text with letter spacing) - Update card styling to bordered outline (no shadow, 12dp radius) - Update section headers to uppercase with secondary text color - Update header bar to "OneSignal Sample App" matching Android branding - Replace OSConsole with collapsible LOGS panel (dark background, count display, clear/collapse controls) - Update color palette to match Android (primary #E54B4D, updated background, text, and divider colors) Structural Changes: - Add separate User section with Status/External ID display matching Android - Split consent into two toggles: "Consent Required" (always visible) and "Privacy Consent" (shown conditionally) matching Android - Remove Card wrapper from sections that Android shows without cards (Send Push, Send IAM, Outcome Events, Track Event) - Add outline button variant for destructive/secondary actions - Add NEXT ACTIVITY button at bottom of scroll view Feature Additions: - Add MultiPairInputDialog for batch adding aliases, tags, and triggers - Add MultiSelectRemoveDialog for selectively removing tags and triggers - Add "Add Multiple" buttons to Aliases, Tags, and Triggers sections - Add "Remove Selected" buttons to Tags and Triggers sections - Add "Clear All" button to Triggers section - Update TrackEventDialog with JSON properties field and validation - Make Aliases list read-only (no delete icons) matching Android Label Updates: - Shorten notification buttons: "Simple", "With Image", "Custom" - Shorten section buttons: "Add" / "Add Multiple" (not "Add Alias") - Update toggle labels/descriptions to match Android exactly - Replace emoji icons with Unicode arrows in IAM demo buttons - Update "Push Subscription ID" to "Push ID" State Management: - Add consentRequired state to AppState and reducer Co-authored-by: Cursor <cursoragent@cursor.com>

sherwinski changed the title ~~Phase 1: Core infrastructure updates~~ chore(examples): update RNOneSignalTS demo to match Android design + functionality Feb 13, 2026

sherwinski marked this pull request as ready for review February 14, 2026 00:25

sherwinski requested a review from a team as a code owner February 14, 2026 00:25

sherwinski and others added 18 commits February 17, 2026 13:51

chore(example): match UI with native android example

322ed20

chore(example): implement notification demo function

19bebcd

chore(example): derive OS API Key from .env

8b2ea3c

style: run prettier

26e50d4

chore(exampl): remove REST API key from example and .env

161b7c7

style: run prettier

19ca82f

chore(examples): add info tooltips to all sections

e5043c7

- Create TooltipContent.ts with all tooltip data - Create TooltipHelper.ts for showing tooltip dialogs - Create TooltipButton component - Update SectionHeader to support tooltipKey prop - Add tooltips to all sections

chore(examples): fix tooltip alignment

c1c24a7

chore(examples): fix fetcing user data on login

bc38856

chore(examples): add build_app_prompt.md file

89ad0c2

fadi-george force-pushed the example/android-updates branch from 9120909 to 0f9e5ea Compare February 17, 2026 21:54

rename example demo

ffbfe7d

fadi-george force-pushed the example/android-updates branch from 0f9e5ea to ffbfe7d Compare February 17, 2026 22:07

fadi-george added 2 commits February 17, 2026 14:07

update prompts

30d1b05

rename to demo-sherwin

9f7366d

fadi-george added 3 commits February 17, 2026 21:12

disable if enable toggle if no notif. permission exists

c2fc898

add permission change listener

8e7bd4c

change to X for delete

e64b934

fadi-george force-pushed the example/android-updates branch from a1fc3ca to 8caa634 Compare February 18, 2026 05:42

ui tweaks

1b1ce8b

fadi-george force-pushed the example/android-updates branch from 8caa634 to 1b1ce8b Compare February 18, 2026 06:50

fix tag logic

cd948ed

fadi-george force-pushed the example/android-updates branch from 217df1e to cd948ed Compare February 18, 2026 07:21

fix triggers layout

a6d5bd2

fadi-george force-pushed the example/android-updates branch from df89c7b to a6d5bd2 Compare February 18, 2026 07:48

fadi-george added 3 commits February 17, 2026 23:48

delete sherwin demo

9f42366

fix prompt

69f1217

iam should add to triggers list

ee09c3c

fadi-george force-pushed the example/android-updates branch from 45d057d to d60ecd8 Compare February 18, 2026 08:25

tweak ios build prompt

d65734a

fadi-george force-pushed the example/android-updates branch 3 times, most recently from f8d465d to 86a29db Compare February 18, 2026 08:57

ios tweaks

bfc97ac

fadi-george force-pushed the example/android-updates branch from a588e13 to bfc97ac Compare February 18, 2026 09:03

adjust splash screen

828c9d1

fadi-george changed the base branch from example/app-refresh to main February 18, 2026 09:08

fadi-george approved these changes Feb 18, 2026

View reviewed changes

fix enable sync

3de55a0

fadi-george force-pushed the example/android-updates branch from a4e54c6 to 3de55a0 Compare February 18, 2026 09:19

sherwinski added 2 commits February 18, 2026 09:22

style: sync with prettier

1556c1b

test: exclude example app tests run vitest

72d372f

sherwinski merged commit 225772a into main Feb 18, 2026
7 checks passed

sherwinski deleted the example/android-updates branch February 18, 2026 17:31

claude bot added the claude-code-assisted label Feb 19, 2026

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

chore(examples): update RNOneSignalTS demo to match Android design + functionality#1911

chore(examples): update RNOneSignalTS demo to match Android design + functionality#1911
sherwinski merged 46 commits intomainfrom
example/android-updates

sherwinski commented Feb 13, 2026 •

edited

Loading

Uh oh!

fadi-george commented Feb 14, 2026

Uh oh!

fadi-george commented Feb 14, 2026

Uh oh!

fadi-george commented Feb 14, 2026

Uh oh!

fadi-george commented Feb 14, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

sherwinski commented Feb 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

One Line Summary

Details

Motivation

Scope

Testing

Manual testing

Affected code checklist

Checklist

Overview

Testing

Final pass

Uh oh!

fadi-george commented Feb 14, 2026

Uh oh!

fadi-george commented Feb 14, 2026

Uh oh!

fadi-george commented Feb 14, 2026

Uh oh!

fadi-george commented Feb 14, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

sherwinski commented Feb 13, 2026 •

edited

Loading