From 0980cdcb5b6e5cfb683a3cb02496bb8018cdd5ab Mon Sep 17 00:00:00 2001 From: Arthur Levoyer Date: Sat, 31 May 2025 19:46:50 +0200 Subject: [PATCH 01/21] =?UTF-8?q?Enhance=20README.md=20with=20detailed=20e?= =?UTF-8?q?xplanations=20of=20Screen=20Time=20APIs,=20ins=E2=80=A6=20(#58)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Enhance README.md with detailed explanations of Screen Time APIs, installation instructions, and examples for using the FamilyControl, ShieldConfiguration, and ActivityMonitor APIs. * Update README.md to enhance structure with a comprehensive table of contents, clarify API usage, and improve installation instructions for Expo and bare React Native projects. * Update README.md Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * Update README.md Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * Update README.md Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * Update README.md Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * Update README.md Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * Refine README.md for clarity and consistency, including capitalization adjustments, improved phrasing, and additional import statements for better code examples. * Update README.md to include a direct link to Apple's Screen Time APIs video and add a blank line for improved readability. * Update README.md Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * Update README.md Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * Fix formatting issues in README.md by correcting code block syntax and adding blank lines for improved readability. --------- Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> --- README.md | 458 ++++++++++++++++++++++++++++++++++++++++++++---------- 1 file changed, 373 insertions(+), 85 deletions(-) diff --git a/README.md b/README.md index d2b3077..d1fc27d 100644 --- a/README.md +++ b/README.md @@ -1,38 +1,204 @@ +# react-native-device-activity + [](https://github.com/Kingstinct/react-native-device-activity/actions/workflows/test.yml) [](https://www.npmjs.com/package/react-native-device-activity) [](https://www.npmjs.com/package/react-native-device-activity) [](https://discord.gg/hrgnETpsJA) -# react-native-device-activity +React Native wrapper for Apple's Screen Time, Device Activity, and Family Controls APIs. -Provides direct access to Apples Screen Time, Device Activity and Shielding APIs. +⚠️ **Important**: These APIs require [special approval and entitlements from Apple](https://github.com/Kingstinct/react-native-device-activity#family-controls-distribution-entitlement-requires-approval-from-apple). Request this approval as early as possible in your development process. -⚠️ Before planning and starting using these APIs it is highly recommended to familiarize yourself with the [special approval and entitlements required](https://github.com/Kingstinct/react-native-device-activity#family-controls-distribution-entitlement-requires-approval-from-apple). +## Table of Contents -Please note that it only supports iOS (and requires iOS 15 or higher) and requires a Custom Dev Client to work with Expo. For Android I'd probably look into [UsageStats](https://developer.android.com/reference/android/app/usage/UsageStats), which seems provide more granularity. +- [Apple's Screen Time APIs Explained](https://developer.apple.com/videos/play/wwdc2021/10123/) + - [FamilyControl API](#familycontrol-api) + - [ShieldConfiguration API](#shieldconfiguration-api) + - [ShieldAction API](#shieldaction-api) + - [ActivityMonitor API](#activitymonitor-api) +- [Installation in managed Expo projects](#installation-in-managed-expo-projects) + - [Some Notes](#some-notes) + - [Data model](#data-model) +- [Installation in bare React Native projects](#installation-in-bare-react-native-projects) +- [Family Controls (distribution) entitlement requires approval from Apple](#family-controls-distribution-entitlement-requires-approval-from-apple) +- [Basic Example: Event Tracking Approach](#basic-example-event-tracking-approach) +- [Select Apps to track](#select-apps-to-track) +- [Time tracking](#time-tracking) +- [Block the shield](#block-the-shield) +- [Alternative Example: Blocking Apps for a Time Slot](#alternative-example-blocking-apps-for-a-time-slot) + - [Key Concepts Explained](#key-concepts-explained) +- [API Reference](#api-reference-the-list-is-not-exhaustive-yet-please-refer-to-the-typescript-types-for-the-full-list) + - [Components](#components) + - [Hooks](#hooks) + - [Functions](#functions) +- [Contributing](#contributing) +- [Weird behaviors ⚠️](#weird-behaviors-) +- [Troubleshooting 📱](#troubleshooting-) -# Examples & Use Cases +## Apple's Screen Time APIs Explained -## Handle permissions +_(See [WWDC21](https://www.youtube.com/watch?v=DKH0cw9LhtM) for official details.)_ -To block apps, you need to request Screen Time permissions. Note that some features (for example, events) may still trigger without permissions; however, this behavior is not guaranteed. +Note: Depending on your use case, you might not need all the APIs hence not all the new bundle identifier and capabilities are required. Below is a quick overview of the APIs available. -```TypeScript -import React, { useEffect } from 'react'; -import * as ReactNativeDeviceActivity from "react-native-device-activity"; -import React, { useEffect } from 'react'; +### FamilyControl API -useEffect(() => { - ReactNativeDeviceActivity.requestAuthorization(); -}, []) +The FamilyControl API allows your app to access Screen Time data and manage restrictions on apps and websites. -You can also revoke permissions: +**What it does**: Provides access to selection and monitoring of app/website usage +**Example**: Selecting which apps (e.g., Instagram, TikTok) to monitor or block -```TypeScript +### ShieldConfiguration API + +Defines the visual appearance and text shown when users attempt to access blocked content. + +**What it does**: Customizes the blocking screen UI +**Example**: + +```typescript +const shieldConfig = { + title: "Time for a Break!", + subtitle: "These apps are unavailable until midnight.", + primaryButtonLabel: "OK", + iconSystemName: "moon.stars.fill", +}; +``` + +### ShieldAction API + +Defines what happens when users interact with shield buttons. + +**What it does**: Controls behavior when users tap buttons on the shield +**Example**: + +```typescript +const shieldActions = { + primary: { + behavior: "close", // Just close the shield when OK is tapped + }, +}; +``` + +### ActivityMonitor API + +Schedules and manages when restrictions should be applied or removed. This is what will activate the shield when your app is killed. + +**What it does**: Monitors device activity against schedules and thresholds +**Example**: + +```typescript +// Block social media from 7PM to midnight daily +ReactNativeDeviceActivity.startMonitoring( + "evening_block", + { + intervalStart: { hour: 19, minute: 0 }, + intervalEnd: { hour: 23, minute: 59 }, + repeats: true, + }, + [], +); +``` + +## Installation in managed Expo projects + +1. Install the package: + + ```bash + npm install react-native-device-activity + # or + yarn add react-native-device-activity + ``` + +2. Configure the Expo plugin in your `app.json` or `app.config.js`: + + ```json + "plugins": [ + [ + "expo-build-properties", + { + "ios": { + "deploymentTarget": "15.1" + }, + }, + ], + [ + "react-native-device-activity", + { + "appleTeamId": "", + "appGroup": "group." + } + ] + ], + ``` + +3. Generate the native projects: + + ```bash + npx expo prebuild --platform ios + ``` + +4. Verify Xcode Targets: After running prebuild, open the `ios` directory in Xcode (`open ios/YourProject.xcworkspace`). Check that you have the following targets in addition to your main app target: + +- `ActivityMonitorExtension` +- `ShieldAction` +- `ShieldConfiguration` + +### Some Notes + +- It's not possible to 100% know which familyActivitySelection an event being handled is triggered for in the context of the Shield UI/actions. We try to make a best guess here - prioritizing apps/websites in an activitySelection over categories, and smaller activitySelections over larger ones (i.e. "Instagram" over "Instagram + Facebook" over "Social Media Apps"). This means that if you display a shield specific for the Instagram selection that will take precedence over the less specific shields. +- When determining which familyActivitySelectionId that should be used, it will only look for familyActivitySelectionIds that are contained in any of the currently monitored activity names (i.e. if familyActivitySelectionId is "social-media-apps" it will only trigger if there is an activity name that contains "social-media-apps"). This might be a limitation for some implementations, it would probably be nice to make this configurable. + +### Data model + +Almost all the functionality is built around persisting configuration as well as event history to UserDefaults. + +- familyActivitySelectionId mapping. This makes it possible for us to tie a familyActivitySelection token to an id that we can reuse and refer to at a later stage. +- Triggers. This includes configuring shield UI/actions as well as sending web requests or notifications from the Swift background side, in the context of the device activity monitor process. Prefixed like actions*for*${goalId} in userDefaults. This is how we do blocking of apps, updates to shield UI/actions etc. +- Event history. Contains information of which events have been triggered and when. Prefixed like events\_${goalId} in userDefaults. This can be useful for tracking time spent. +- ShieldIds. To reduce the storage strain on userDefaults shields are referenced with shieldIds. + +## Installation in bare React Native projects + +For bare React Native projects, you must ensure that you have [installed and configured the `expo` package](https://docs.expo.dev/bare/installing-expo-modules/) before continuing. + +### Add the package to your npm dependencies + +```bash +npm install react-native-device-activity +``` + +### Configure for iOS + +Run `npx pod-install` after installing the npm package. + +## Family Controls (distribution) entitlement requires approval from Apple + +As early as possible you want to [request approval from Apple](https://developer.apple.com/contact/request/family-controls-distribution), since it can take time to get approved. + +Note that until you have approval for all bundleIdentifiers you want to use, you are stuck with local development builds in XCode. i.e., you can't even build an Expo Dev Client. + +For every base bundleIdentifier you need approval for 4 bundleIdentifiers (when leveraging all native extensions that is, you can potentially just use the Shield-related ones if you have no need to listen to the events, or similarly just use the ActivityMonitor if you do not need control over the Shield UI): + +- `com.your-bundleIdentifier` +- `com.your-bundleIdentifier.ActivityMonitor` +- `com.your-bundleIdentifier.ShieldAction` +- `com.your-bundleIdentifier.ShieldConfiguration` + +Once you've gotten approval you need to manually add the "Family Controls (Distribution)" under Additional Capabilities for each of the bundleIdentifiers on [developer.apple.com](https://developer.apple.com/account/resources/identifiers/list) mentioned above. If you use Expo/EAS this has to be done only once, and after that provisioning will be handled automatically. + +⚠️ If you don't do all the above, you will run into a lot of strange provisioning errors. + +## Basic Example: Event Tracking Approach + +Here's another example that focuses on tracking app usage with time thresholds: + +````typescript import * as ReactNativeDeviceActivity from "react-native-device-activity"; ReactNativeDeviceActivity.revokeAuthorization(); +``` + ## Select Apps to track For most use cases you need to get an activitySelection from the user, which is a token representing the apps the user wants to track, block or whitelist. This can be done by presenting the native view: @@ -66,7 +232,7 @@ const DeviceActivityPicker = () => { Some things worth noting here: - This is a SwiftUI view, which is prone to crashing, especially when browsing larger categories of apps or searching for apps. It's recommended to provide a fallback view (positioned behind the SwiftUI view) that allows the user to know what's happening and reload the view and tailor that to your app's design and UX. -The activitySelection tokens can be particularly large (especially if you use includeEntireCategory flag), so you probably want to reference them through a familyActivitySelectionId instead of always passing the string token around. Most functions in this library accept a familyActivitySelectionId as well as the familyActivitySelection token directly. +- The activitySelection tokens can be particularly large (especially if you use includeEntireCategory flag), so you probably want to reference them through a familyActivitySelectionId instead of always passing the string token around. Most functions in this library accept a familyActivitySelectionId as well as the familyActivitySelection token directly. ## Time tracking @@ -116,7 +282,7 @@ const events = ReactNativeDeviceActivityModule.getEvents(); Some things worth noting here: -Depending on your use case (if you need different schedules for different days, for example) you might need multiple monitors. There's a hard limit on 20 monitors at the same time. Study the [DateComponents](https://developer.apple.com/documentation/foundation/datecomponents) object to model this to your use case. +Depending on your use case (if you need different schedules for different days, for example) you might need multiple monitors. There's a hard limit on 20 monitors at the same time. Study the [DateComponents](https://developer.apple.com/documentation/foundation/datecomponents) object to model this to your use case. ## Block the shield @@ -210,90 +376,207 @@ ReactNativeDeviceActivity.updateShield( ) ``` -# Installation in managed Expo projects - -For [managed](https://docs.expo.dev/archive/managed-vs-bare/) Expo projects, please follow the installation instructions in the [API documentation for the latest stable release](#api-documentation). If you follow the link and there is no documentation available then this library is not yet usable within managed projects — it is likely to be included in an upcoming Expo SDK release. - -The package requires native code, which includes a custom app target. Currently it requires targeting iOS 15 or higher, so populate app.json/app.config.json as follows: - -``` -"plugins": [ - [ - "expo-build-properties", - { - "ios": { - "deploymentTarget": "15.1" - }, - }, - ], - [ - "react-native-device-activity", - { - "appleTeamId": "", - "appGroup": "group.", - } - ] - ], -``` - -The Swift files for the iOS target will be copied to your local `/targets` directory. You might want to add it to your .gitignore (or if you have other targets in there, you might want to specifically add the three targets added by this library). - -For Expo to be able to automatically handle provisioning you need to specify extra.eas.build.experimental.ios.appExtensions in your app.json/app.config.ts [as seen here](https://github.com/Intentional-Digital/react-native-device-activity/blob/main/example/app.json#L57). - -## Customize native code - -You can potentially modify the targets manually, although you risk the library and your app code diverging. If you want to disable the automatic copying of the targets, you can set `copyToTargetFolder` to `false` in the plugin configuration [as seen here](https://github.com/Intentional-Digital/react-native-device-activity/blob/main/example/app.json#L53). - -## Some notes +## Alternative Example: Blocking Apps for a Time Slot -- It's not possible to 100% know which familyActivitySelection an event being handled is triggered for in the context of the Shield UI/actions. We try to make the best guess here, prioritizing apps/websites in an activitySelection over categories, and smaller activitySelections over larger ones (i.e. "Instagram" over "Instagram + Facebook" over "Social Media Apps"). This means that if you display a shield specific for the Instagram selection that will take precedence over the less specific shields. -- When determining which familyActivitySelectionId that should be used it will only look for familyActivitySelectionIds that are contained in any of the currently monitored activity names (i.e. if familyActivitySelectionId is "social-media-apps" it will only trigger if there is an activity name that contains "social-media-apps"). This might be a limitation for some implementations, it would probably be nice to make this configurable. +This example shows how to implement a complete app blocking system on a given interval. The main principle is that you're configuring these apps to be blocked with FamilyControl API and then schedule when the shield should be shown with ActivityMonitor API. You're customizing the shield UI and actions with ShieldConfiguration and ShieldAction APIs. -## Data model +```typescript +import { useEffect, useState } from 'react'; +import { Alert, View, Button } from 'react-native'; +import * as ReactNativeDeviceActivity from 'react-native-device-activity'; -Almost all the functionality is built around persisting configuration as well as event history to UserDefaults. - -- familyActivitySelectionId mapping. This makes it possible for us to tie a familyActivitySelection token to an id that we can reuse and refer to at a later stage. -- Triggers. This includes configuring shield UI/actions as well as sending web requests or notifications from the Swift background side, in the context of the device activity monitor process. Prefixed like actions*for*${goalId} in userDefaults. This is how we do blocking of apps, updates to shield UI/actions etc. -- Event history. Contains information of which events have been triggered and when. Prefixed like events\_${goalId} in userDefaults. This can be useful for tracking time spent. -- ShieldIds. To reduce the storage strain on userDefaults shields are referenced with shieldIds. - -# Installation in bare React Native projects +// Constants for identifying your selections, shields and scheduled activities +const SELECTION_ID = "evening_block_selection"; +const SHIELD_CONFIG_ID = "evening_shield_config"; +const ACTIVITY_NAME = "evening_block"; -For bare React Native projects, you must ensure that you have [installed and configured the `expo` package](https://docs.expo.dev/bare/installing-expo-modules/) before continuing. - -### Add the package to your npm dependencies +const AppBlocker = () => { + // Step 1: Request authorization when component mounts + useEffect(() => { + ReactNativeDeviceActivity.requestAuthorization().then((status) => { + console.info("Authorization status:", status); + // You need to handle various status outcomes: + // "authorized", "denied", "notDetermined", etc. + }); + }, []); + + // Step 2: Manage the selection state of apps/websites to block + const [currentFamilyActivitySelection, setCurrentFamilyActivitySelection] = + useState(null); + + // Step 3: Handle selection changes from the native selection UI + const handleSelectionChange = (event) => { + // The selection is a serialized string containing the user's app selections + setCurrentFamilyActivitySelection(event.nativeEvent.familyActivitySelection); + }; + + // Step 4: Save the selection for use by the extension + const saveSelection = () => { + if (!currentFamilyActivitySelection) { + Alert.alert("Error", "Please select at least one app to block"); + return; + } + + // Store the selection with a consistent ID so the extension can access it + ReactNativeDeviceActivity.setFamilyActivitySelectionId({ + id: SELECTION_ID, + familyActivitySelection: currentFamilyActivitySelection + }); + + // Now configure the blocking schedule + configureBlocking(); + }; + + // Step 5: Configure the shield (blocking screen UI) + const configureBlocking = () => { + // Define how the blocking screen looks + const shieldConfig = { + title: "App Blocked", + subtitle: "This app is currently unavailable", + primaryButtonLabel: "OK", + iconSystemName: "moon.stars.fill" // SF Symbols icon name + }; + + // Define what happens when users interact with the shield + const shieldActions = { + primary: { + behavior: "close" // Just close the shield when OK is tapped + } + }; + + // Apply the shield configuration + ReactNativeDeviceActivity.updateShield(shieldConfig, shieldActions); + + // Configure what happens when the scheduled interval begins + ReactNativeDeviceActivity.configureActions({ + activityName: ACTIVITY_NAME, + callbackName: "intervalDidStart", // Called when the scheduled time begins + actions: [{ + type: "blockSelection", + familyActivitySelectionId: SELECTION_ID, // The stored selection ID + shieldId: SHIELD_CONFIG_ID // The shield to show when blocked + }] + }); + + // Configure what happens when the scheduled interval ends + ReactNativeDeviceActivity.configureActions({ + activityName: ACTIVITY_NAME, + callbackName: "intervalDidEnd", // Called when the scheduled time ends + actions: [{ + type: "unblockSelection", + familyActivitySelectionId: SELECTION_ID // Unblock the same selection + }] + }); + + // Start the monitoring schedule + startScheduledBlocking(); + }; + + // Step 6: Define and start the blocking schedule + const startScheduledBlocking = async () => { + try { + // Define when blocking should occur (7 PM to midnight daily) + const schedule = { + intervalStart: { hour: 19, minute: 0 }, // 7:00 PM + intervalEnd: { hour: 23, minute: 59 }, // 11:59 PM + repeats: true // Repeat this schedule daily + // Optional: warningTime: { minutes: 5 } // Warn user 5 minutes before blocking starts + }; + + // For testing, you might want a shorter interval that starts soon: + const testSchedule = { + intervalStart: { + hour: new Date().getHours(), + minute: new Date().getMinutes(), + second: (new Date().getSeconds() + 10) % 60, // +10 seconds from now + }, + intervalEnd: { + hour: new Date().getHours() + Math.floor((new Date().getMinutes() + 5) / 60), + minute: (new Date().getMinutes() + 5) % 60, // +5 minutes from start + }, + repeats: false, // One-time test + }; + + // Start monitoring with the schedule + // The empty array is for event monitors (optional) + await ReactNativeDeviceActivity.startMonitoring( + ACTIVITY_NAME, + schedule, // Use testSchedule for testing + [] + ); + + Alert.alert("Success", "Blocking schedule has been set up!"); + } catch (error) { + console.error("Failed to start scheduled blocking:", error); + Alert.alert("Error", "Failed to set up blocking schedule"); + } + }; -``` -npm install react-native-device-activity + return ( + + {/* Native selection view for choosing apps to block */} + + + {/* Save button */} + + + ); +}; ``` -### Configure for iOS +### Key Concepts Explained -Run `npx pod-install` after installing the npm package. +1. **Authorization**: The app must request permission to use Screen Time APIs. +2. **Selection**: Users choose which apps/websites to block via the native `DeviceActivitySelectionView`. +3. **Shield Configuration**: Defines how the blocking screen appears when users try to access blocked content. +4. **Action Configuration**: Defines what happens when the scheduled interval starts/ends. +5. **Scheduling**: Sets up when blocking should occur (e.g., evenings from 7 PM to midnight). -## Family Controls (distribution) entitlement requires approval from Apple +For a complete implementation, see the [example app](https://github.com/Kingstinct/react-native-device-activity/tree/main/example). -As early as possible you want to [request approval from Apple](https://developer.apple.com/contact/request/family-controls-distribution), since it can take time to get approved. +## API Reference (the list is not exhaustive yet please refer to the TypeScript types for the full list) -Note that until you have approval for all bundleIdentifiers you want to use, you are stuck with local development builds in XCode. I.e. you can't even build an Expo Dev Client. +### Components -For every base bundleIdentifier you need approval for 4 bundleIdentifiers (if you want to use all the native extensions that is, you can potentially just use the Shield-related ones if you have no need to listen to the events, or similarly just use the ActivityMonitor if you do not need control over the Shield UI): +| Component | Props | Description | +| ----------------------------- | ------------------------------------------------------------------------------------------------------- | -------------------------------------------------- | +| `DeviceActivitySelectionView` | `familyActivitySelection`: string \| null
`onSelectionChange`: (event) => void
`style`: ViewStyle | Native component that renders the app selection UI | -- com.your-bundleIdentifier -- com.your-bundleIdentifier.ActivityMonitor -- com.your-bundleIdentifier.ShieldAction -- com.your-bundleIdentifier.ShieldConfiguration +### Hooks -Once you've gotten approval you need to manually add the "Family Controls (Distribution)" under Additional Capabilities for each of the bundleIdentifiers on [developer.apple.com](https://developer.apple.com/account/resources/identifiers/list) mentioned above. If you use Expo/EAS this has to be done only once, and after that provisioning will be handled automatically. +| Hook | Returns | Description | +| ------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------ | +| `useDeviceActivityPicker` | `currentFamilyActivitySelection`: string \| null
`isActivityPickerLoading`: boolean
`onSave`: () => void
`onCancel`: () => void
`handleSelectionChange`: (event) => void | Hook for managing the selection of apps to block | -⚠️ If you don't do all the above you will run in to a lot of strange provisioning errors. +### Functions -# Contributing +| Function | Parameters | Returns | Description | +| ------------------------------ | ----------------------------------------------------------------------------------------------- | --------------------- | ----------------------------------------------- | +| `requestAuthorization` | None | Promise\ | Request Screen Time authorization | +| `startMonitoring` | `activityName`: string
`schedule`: DeviceActivitySchedule
`events`: DeviceActivityEvent[] | Promise\ | Start monitoring with given schedule | +| `stopMonitoring` | `activityName`: string | Promise\ | Stop monitoring for given activity | +| `setFamilyActivitySelectionId` | `{ id: string, familyActivitySelection: string }` | void | Store a family activity selection with given ID | +| `updateShield` | `config`: ShieldConfiguration
`actions`: ShieldActions | void | Update the shield UI and actions | +| `configureActions` | `{ activityName: string, callbackName: string, actions: Action[] }` | void | Configure actions for monitor events | +| `getEvents` | None | DeviceActivityEvent[] | Get history of triggered events | +| `userDefaultsSet` | `key`: string
`value`: any | void | Store value in shared UserDefaults | +| `userDefaultsGet` | `key`: string | any | Retrieve value from shared UserDefaults | + +## Contributing Contributions are very welcome! Please refer to guidelines described in the [contributing guide](https://github.com/expo/expo#contributing). -# Weird behaviors ⚠️ +## Weird behaviors ⚠️ - Authorization changes outside app not captured When we've asked whether the user has authorized us to use screen time, and the state is changed outside the app, the native API doesn't update until the app restarts, i.e. this flow: @@ -309,7 +592,7 @@ Contributions are very welcome! Please refer to guidelines described in the [con - The DeviceActivitySelectionView is prone to crashes, which is outside of our control. The best we can do is provide fallback views that allows the user to know what's happening and reload the view. -# Troubleshooting 📱 +## Troubleshooting 📱 The Screen Time APIs are known to be very finnicky. Here are some things you can try to troubleshoot events not being reported: @@ -319,5 +602,10 @@ The Screen Time APIs are known to be very finnicky. Here are some things you can - Restart device - Make sure device is not low on storage (mentioned by Apple Community Specialist [here](https://discussions.apple.com/thread/254808070)) 💾 - Upgrade iOS version -- Content & Privacy Restrictions: If any restrictions are enabled under Screen Time’s Content & Privacy Restrictions, ensure none are blocking your app. +- Content & Privacy Restrictions: If any restrictions are enabled under Screen Time's Content & Privacy Restrictions, ensure none are blocking your app. - Reset all device settings + +``` + +``` +```` From 1820f2c84f5b7baa718704afd0ac3503c2b38c20 Mon Sep 17 00:00:00 2001 From: Will Jackson Date: Thu, 12 Jun 2025 00:36:54 -0700 Subject: [PATCH 02/21] Fixing some of the markdown in the README so the code examples are more readable (#62) Co-authored-by: Will Jackson --- README.md | 13 ++++--------- 1 file changed, 4 insertions(+), 9 deletions(-) diff --git a/README.md b/README.md index d1fc27d..c3fe88e 100644 --- a/README.md +++ b/README.md @@ -192,14 +192,14 @@ Once you've gotten approval you need to manually add the "Family Controls (Distr Here's another example that focuses on tracking app usage with time thresholds: -````typescript +```typescript import * as ReactNativeDeviceActivity from "react-native-device-activity"; ReactNativeDeviceActivity.revokeAuthorization(); ``` -## Select Apps to track +### Select Apps to track For most use cases you need to get an activitySelection from the user, which is a token representing the apps the user wants to track, block or whitelist. This can be done by presenting the native view: @@ -234,7 +234,7 @@ Some things worth noting here: - This is a SwiftUI view, which is prone to crashing, especially when browsing larger categories of apps or searching for apps. It's recommended to provide a fallback view (positioned behind the SwiftUI view) that allows the user to know what's happening and reload the view and tailor that to your app's design and UX. - The activitySelection tokens can be particularly large (especially if you use includeEntireCategory flag), so you probably want to reference them through a familyActivitySelectionId instead of always passing the string token around. Most functions in this library accept a familyActivitySelectionId as well as the familyActivitySelection token directly. -## Time tracking +### Time tracking It's worth noting that the Screen Time API is not designed for time tracking out-of-the-box. So you have to set up events with names you can parse as time after they've triggered. @@ -284,7 +284,7 @@ Some things worth noting here: Depending on your use case (if you need different schedules for different days, for example) you might need multiple monitors. There's a hard limit on 20 monitors at the same time. Study the [DateComponents](https://developer.apple.com/documentation/foundation/datecomponents) object to model this to your use case. -## Block the shield +### Block the shield To block apps, you can do it directly from your code. @@ -604,8 +604,3 @@ The Screen Time APIs are known to be very finnicky. Here are some things you can - Upgrade iOS version - Content & Privacy Restrictions: If any restrictions are enabled under Screen Time's Content & Privacy Restrictions, ensure none are blocking your app. - Reset all device settings - -``` - -``` -```` From 6e39f6c087dd0a91a506dd2a3cc11e8f6f12d3be Mon Sep 17 00:00:00 2001 From: Robert Herber Date: Thu, 19 Jun 2025 11:14:24 +0200 Subject: [PATCH 03/21] feat: add sneekpeak functionality --- apps/example/screens/AllTheThings.tsx | 77 +++++++++++ .../ios/Shared.swift | 130 ++++++++++++++++++ .../src/ReactNativeDeviceActivity.types.ts | 18 +++ 3 files changed, 225 insertions(+) diff --git a/apps/example/screens/AllTheThings.tsx b/apps/example/screens/AllTheThings.tsx index 08e9c7f..ab6fd20 100644 --- a/apps/example/screens/AllTheThings.tsx +++ b/apps/example/screens/AllTheThings.tsx @@ -285,6 +285,83 @@ export function AllTheThings() { }} /> + { + /*ReactNativeDeviceActivity.configureActions({ + activityName: "sneek-peak", + callbackName: "intervalDidEnd", + actions: [ + { + type: "sendNotification", + payload: { + title: "sneek-peak ended!!!", + body: "You have reached the end of the sneek-peak!", + }, + }, + { + type: "enableBlockAllMode", + }, + { + type: "clearWhitelistAndUpdateBlock", + }, + ], + });*/ + + ReactNativeDeviceActivity.configureActions({ + activityName: "sneekpeak", + callbackName: "intervalDidStart", + actions: [ + { + type: "sendNotification", + payload: { + title: "sneek-peak ended!!!", + body: "You have reached the end of the sneek-peak!", + }, + }, + { + type: "enableBlockAllMode", + }, + { + type: "clearWhitelistAndUpdateBlock", + }, + { + type: "stopMonitoring", + activityNames: ["sneekpeak"], + } + ], + }); + ReactNativeDeviceActivity.updateShield( + { + title: "take a sneekpeak!", + primaryButtonLabel: "do it now!", + }, + { + primary: { + behavior: "defer", + actions: [ + { + type: "disableBlockAllMode", + }, + { + type: "clearWhitelistAndUpdateBlock", + }, + { + type: "startMonitoring", + activityName: "sneekpeak", + intervalStartDelayMs: 10000, + intervalEndDelayMs: 60 * 15 * 1000 + 10000, + deviceActivityEvents: [], + }, + ], + }, + }, + ); + console.log("done!"); + console.log(ReactNativeDeviceActivity.getEvents()) + }} + /> + setShieldTitle(text)} diff --git a/packages/react-native-device-activity/ios/Shared.swift b/packages/react-native-device-activity/ios/Shared.swift index 91a50fc..189704b 100644 --- a/packages/react-native-device-activity/ios/Shared.swift +++ b/packages/react-native-device-activity/ios/Shared.swift @@ -238,6 +238,25 @@ func executeGenericAction( // required for it to have time to trigger before process/callback ends sleep(ms: 1000) } + } else if type == "startMonitoring" { + if let activityName = action["activityName"] as? String, + let deviceActivityEvents = action["deviceActivityEvents"] as? [[String: Any]] { + + startMonitoringAction( + activityName: activityName, + deviceActivityEvents: deviceActivityEvents, + intervalStartDelayMs: action["intervalStartDelayMs"] as? Int, + intervalEndDelayMs: action["intervalEndDelayMs"] as? Int, + triggeredBy: triggeredBy + ) + } + } else if type == "stopMonitoring" { + let activityNames = action["activityNames"] as? [String] + + stopMonitoringAction( + activityNames: activityNames, + triggeredBy: triggeredBy + ) } if let sleepAfter = action["sleepAfter"] as? Int { @@ -1423,3 +1442,114 @@ func getAppGroupDirectory() -> URL? { } return nil } + +@available(iOS 15.0, *) +func startMonitoringAction( + activityName: String, + deviceActivityEvents: [[String: Any]], + intervalStartDelayMs: Int?, + intervalEndDelayMs: Int?, + triggeredBy: String +) { + // Create date components for schedule + let now = Date() + let calendar = Calendar.current + + var intervalStart = DateComponents() + var intervalEnd = DateComponents() + + if let startDelayMs = intervalStartDelayMs { + let startDate = now.addingTimeInterval(TimeInterval(startDelayMs) / 1000.0) + intervalStart = calendar.dateComponents([.hour, .minute, .second], from: startDate) + } + + if let endDelayMs = intervalEndDelayMs { + let endDate = now.addingTimeInterval(TimeInterval(endDelayMs) / 1000.0) + intervalEnd = calendar.dateComponents([.hour, .minute, .second], from: endDate) + } else { + // Default to 24 hours from start if not specified + let defaultEndMs = (intervalStartDelayMs ?? 0) + (24 * 60 * 60 * 1000) + let endDate = now.addingTimeInterval(TimeInterval(defaultEndMs) / 1000.0) + intervalEnd = calendar.dateComponents([.hour, .minute, .second], from: endDate) + } + + let schedule = DeviceActivitySchedule( + intervalStart: intervalStart, + intervalEnd: intervalEnd, + repeats: false + ) + + // Create DeviceActivityEvent dictionary + var eventDict: [DeviceActivityEvent.Name: DeviceActivityEvent] = [:] + + for eventData in deviceActivityEvents { + guard let eventName = eventData["eventName"] as? String, + let threshold = eventData["threshold"] as? [String: Any], + let familyActivitySelection = eventData["familyActivitySelection"] as? String + else { + continue + } + + let selection = deserializeFamilyActivitySelection( + familyActivitySelectionStr: familyActivitySelection) + + // Convert threshold to DateComponents + var thresholdComponents = DateComponents() + if let hour = threshold["hour"] as? Int { thresholdComponents.hour = hour } + if let minute = threshold["minute"] as? Int { thresholdComponents.minute = minute } + if let second = threshold["second"] as? Int { thresholdComponents.second = second } + + let includesPastActivity = eventData["includesPastActivity"] as? Bool ?? false + + var event: DeviceActivityEvent + if #available(iOS 17.4, *) { + event = DeviceActivityEvent( + applications: selection.applicationTokens, + categories: selection.categoryTokens, + webDomains: selection.webDomainTokens, + threshold: thresholdComponents, + includesPastActivity: includesPastActivity + ) + } else { + event = DeviceActivityEvent( + applications: selection.applicationTokens, + categories: selection.categoryTokens, + webDomains: selection.webDomainTokens, + threshold: thresholdComponents + ) + } + + eventDict[DeviceActivityEvent.Name(eventName)] = event + } + + let activityName = DeviceActivityName(activityName) + + do { + try center.startMonitoring(activityName, during: schedule, events: eventDict) + logger.log( + "✅ Successfully started monitoring activity: \(activityName.rawValue) from \(triggeredBy)") + } catch { + logger.log( + "❌ Failed to start monitoring activity: \(activityName.rawValue, privacy: .public) - \(error.localizedDescription, privacy: .public)" + ) + } +} + +@available(iOS 15.0, *) +func stopMonitoringAction( + activityNames: [String]?, + triggeredBy: String +) { + if let activityNames = activityNames { + // Stop specific activities + let deviceActivityNames = activityNames.map { DeviceActivityName($0) } + center.stopMonitoring(deviceActivityNames) + logger.log( + "✅ Successfully stopped monitoring activities: \(activityNames.joined(separator: ", ")) from \(triggeredBy)" + ) + } else { + // Stop all monitoring + center.stopMonitoring() + logger.log("✅ Successfully stopped all monitoring from \(triggeredBy)") + } +} diff --git a/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts b/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts index 229db07..1fae790 100644 --- a/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts +++ b/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts @@ -287,6 +287,24 @@ export type Action = } & CommonTypeParams) | ({ type: "removeAllDeliveredNotifications"; + } & CommonTypeParams) + | ({ + type: "startMonitoring"; + activityName: string; + deviceActivityEvents: DeviceActivityEvent[]; + /** + * Optional delay in milliseconds from now for intervalStart. + * If provided, will override deviceActivitySchedule.intervalStart. + */ + intervalStartDelayMs?: number; + intervalEndDelayMs?: number; + } & CommonTypeParams) + | ({ + type: "stopMonitoring"; + /** + * Optional array of activity names to stop. If not provided, stops all monitoring. + */ + activityNames?: string[]; } & CommonTypeParams); export type DeviceActivityEventRaw = Omit< From 4b2e742f94d24a17df3208df14dd62bd56e6c650 Mon Sep 17 00:00:00 2001 From: Robert Herber Date: Thu, 19 Jun 2025 11:22:16 +0200 Subject: [PATCH 04/21] add privacy: public to all logs --- .../ios/ReactNativeDeviceActivityModule.swift | 6 +++-- .../ios/Shared.swift | 27 ++++++++++--------- 2 files changed, 19 insertions(+), 14 deletions(-) diff --git a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift index 2572738..655ce1b 100644 --- a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift +++ b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift @@ -500,7 +500,8 @@ public class ReactNativeDeviceActivityModule: Module { during: schedule, events: dictionary ) - logger.log("✅ Succeeded with Starting Monitor Activity: \(activityName.rawValue)") + logger.log( + "✅ Succeeded with Starting Monitor Activity: \(activityName.rawValue, privacy: .public)") } @@ -779,7 +780,8 @@ public class ReactNativeDeviceActivityModule: Module { case .success: continuation.resume() case .failure(let error): - logger.log("❌ Failed to revoke authorization: \(error.localizedDescription)") + logger.log( + "❌ Failed to revoke authorization: \(error.localizedDescription, privacy: .public)") continuation.resume(throwing: error) } } diff --git a/packages/react-native-device-activity/ios/Shared.swift b/packages/react-native-device-activity/ios/Shared.swift index 189704b..44f48b6 100644 --- a/packages/react-native-device-activity/ios/Shared.swift +++ b/packages/react-native-device-activity/ios/Shared.swift @@ -146,7 +146,9 @@ func executeGenericAction( triggeredBy: triggeredBy ) } else { - logger.log("No familyActivitySelection found with ID: \(familyActivitySelectionId)") + logger.log( + "No familyActivitySelection found with ID: \(familyActivitySelectionId, privacy: .public)" + ) } } } else if type == "unblockSelection" { @@ -735,7 +737,7 @@ func deserializeFamilyActivitySelection(familyActivitySelectionStr: String) do { activitySelection = try decoder.decode(FamilyActivitySelection.self, from: data!) } catch { - logger.log("decode error \(error.localizedDescription)") + logger.log("decode error \(error.localizedDescription, privacy: .public)") } return activitySelection @@ -1303,7 +1305,7 @@ func shouldExecuteAction( ) { if lastTriggeredAt > skipIfAlreadyTriggeredAfter { logger.log( - "skipping executing actions for \(callbackName)\(eventName ?? "") because the last triggered time is after \(skipIfAlreadyTriggeredAfter)" + "skipping executing actions for \(callbackName, privacy: .public)\(eventName ?? "", privacy: .public) because the last triggered time is after \(skipIfAlreadyTriggeredAfter, privacy: .public)" ) return false } @@ -1324,7 +1326,7 @@ func shouldExecuteAction( if lastTriggeredAt >= skipIfAlreadyTriggeredBetweenFromDate && lastTriggeredAt <= skipIfAlreadyTriggeredBetweenToDate { logger.log( - "skipping executing actions for \(callbackName)\(eventName ?? "") because the last triggered time is between \(skipIfAlreadyTriggeredBetweenFromDate) and \(skipIfAlreadyTriggeredBetweenToDate)" + "skipping executing actions for \(callbackName, privacy: .public)\(eventName ?? "", privacy: .public) because the last triggered time is between \(skipIfAlreadyTriggeredBetweenFromDate, privacy: .public) and \(skipIfAlreadyTriggeredBetweenToDate, privacy: .public)" ) return false } @@ -1339,7 +1341,7 @@ func shouldExecuteAction( ) { if lastTriggeredAt < skipIfAlreadyTriggeredBefore { logger.log( - "skipping executing actions for \(callbackName)\(eventName ?? "") because the last triggered time is after \(skipIfAlreadyTriggeredBefore)" + "skipping executing actions for \(callbackName, privacy: .public)\(eventName ?? "", privacy: .public) because the last triggered time is after \(skipIfAlreadyTriggeredBefore, privacy: .public)" ) return false } @@ -1354,7 +1356,7 @@ func shouldExecuteAction( afterDate: skipIfLargerEventRecordedAfter ) { logger.log( - "skipping executing actions for \(eventName) because a larger event triggered after \(skipIfLargerEventRecordedAfter)" + "skipping executing actions for \(eventName, privacy: .public) because a larger event triggered after \(skipIfLargerEventRecordedAfter, privacy: .public)" ) return false } @@ -1370,7 +1372,7 @@ func shouldExecuteAction( Date().timeIntervalSince1970 * 1000 - skipIfAlreadyTriggeredWithinMS if lastTriggeredAt > skipIfAlreadyTriggeredAfter { logger.log( - "skipping executing actions for \(callbackName)\(eventName ?? "") because the last triggered time is after \(skipIfAlreadyTriggeredAfter)" + "skipping executing actions for \(callbackName, privacy: .public)\(eventName ?? "", privacy: .public) because the last triggered time is after \(skipIfAlreadyTriggeredAfter, privacy: .public)" ) return false } @@ -1388,7 +1390,7 @@ func shouldExecuteAction( afterDate: skipIfLargerEventRecordedAfter ) { logger.log( - "skipping executing actions for \(eventName) because a larger event triggered after \(skipIfLargerEventRecordedAfter)" + "skipping executing actions for \(eventName, privacy: .public) because a larger event triggered after \(skipIfLargerEventRecordedAfter, privacy: .public)" ) return false } @@ -1408,7 +1410,7 @@ func shouldExecuteAction( afterDate: skipIfLargerEventRecordedAfter ) { logger.log( - "skipping executing actions for \(eventName) because a larger event triggered after \(skipIfLargerEventRecordedAfter)" + "skipping executing actions for \(eventName, privacy: .public) because a larger event triggered after \(skipIfLargerEventRecordedAfter, privacy: .public)" ) return false } @@ -1527,7 +1529,8 @@ func startMonitoringAction( do { try center.startMonitoring(activityName, during: schedule, events: eventDict) logger.log( - "✅ Successfully started monitoring activity: \(activityName.rawValue) from \(triggeredBy)") + "✅ Successfully started monitoring activity: \(activityName.rawValue, privacy: .public) from \(triggeredBy, privacy: .public)" + ) } catch { logger.log( "❌ Failed to start monitoring activity: \(activityName.rawValue, privacy: .public) - \(error.localizedDescription, privacy: .public)" @@ -1545,11 +1548,11 @@ func stopMonitoringAction( let deviceActivityNames = activityNames.map { DeviceActivityName($0) } center.stopMonitoring(deviceActivityNames) logger.log( - "✅ Successfully stopped monitoring activities: \(activityNames.joined(separator: ", ")) from \(triggeredBy)" + "✅ Successfully stopped monitoring activities: \(activityNames.joined(separator: ", "), privacy: .public) from \(triggeredBy, privacy: .public)" ) } else { // Stop all monitoring center.stopMonitoring() - logger.log("✅ Successfully stopped all monitoring from \(triggeredBy)") + logger.log("✅ Successfully stopped all monitoring from \(triggeredBy, privacy: .public)") } } From 61ffc1bef7473e7d9c2246b93af759963ca285f6 Mon Sep 17 00:00:00 2001 From: Robert Herber Date: Thu, 19 Jun 2025 09:26:23 +0000 Subject: [PATCH 05/21] chore: update version --- packages/react-native-device-activity/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-device-activity/package.json b/packages/react-native-device-activity/package.json index 3468acd..fea1c2f 100644 --- a/packages/react-native-device-activity/package.json +++ b/packages/react-native-device-activity/package.json @@ -1,6 +1,6 @@ { "name": "react-native-device-activity", - "version": "0.4.31", + "version": "0.5.0", "description": "Provides access to Apples DeviceActivity API", "main": "build/index.js", "types": "build/index.d.ts", From 30e57ad7d1fdfc580fd78aa42606fcea311811bb Mon Sep 17 00:00:00 2001 From: Robert Herber Date: Mon, 7 Jul 2025 12:06:46 +0200 Subject: [PATCH 06/21] one more public log (#63) --- .../targets/ShieldAction/ShieldActionExtension.swift | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-device-activity/targets/ShieldAction/ShieldActionExtension.swift b/packages/react-native-device-activity/targets/ShieldAction/ShieldActionExtension.swift index 80193fd..da5121e 100644 --- a/packages/react-native-device-activity/targets/ShieldAction/ShieldActionExtension.swift +++ b/packages/react-native-device-activity/targets/ShieldAction/ShieldActionExtension.swift @@ -31,7 +31,7 @@ func handleShieldAction( } if let type = configForSelectedAction["type"] as? String { - logger.log("type: \(type)") + logger.log("type: \(type, privacy: .public)") if type == "disableBlockAllMode" { disableBlockAllMode(triggeredBy: "shieldAction") } From 13ed57e0ea72a11586810e74539f3d308d03c18e Mon Sep 17 00:00:00 2001 From: Damith Amarasinghe Date: Fri, 24 Oct 2025 03:26:24 +0530 Subject: [PATCH 07/21] fix: improve error handling in requestAuthorization (#75) - Re-throw errors from requestAuthorization instead of silently catching them - Throw proper error for iOS < 16.0 instead of just logging - Remove console.error to allow proper error handling by callers This allows applications to properly handle authorization failures and provide appropriate user feedback. --- .../ios/ReactNativeDeviceActivityModule.swift | 8 +++++++- packages/react-native-device-activity/src/index.ts | 4 ++-- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift index 655ce1b..24d3eca 100644 --- a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift +++ b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift @@ -547,7 +547,13 @@ public class ReactNativeDeviceActivityModule: Module { try await ac.requestAuthorization( for: forIndividualOrChild == "child" ? .child : .individual) } else { - logger.log("⚠️ iOS 16.0 or later is required to request authorization.") + let errorMessage = "iOS 16.0 or later is required to request authorization." + logger.log("⚠️ \(errorMessage)") + throw NSError( + domain: "FamilyControls", + code: 9999, + userInfo: [NSLocalizedDescriptionKey: errorMessage] + ) } } diff --git a/packages/react-native-device-activity/src/index.ts b/packages/react-native-device-activity/src/index.ts index 47f4ed4..938f02d 100644 --- a/packages/react-native-device-activity/src/index.ts +++ b/packages/react-native-device-activity/src/index.ts @@ -39,8 +39,8 @@ export async function requestAuthorization( forIndividualOrChild, ); } catch (error) { - // seems like we get a promise rejection if the user denies the authorization, but we can still request again - console.error(error); + // Re-throw the error so it can be properly handled by the caller + throw error; } } From 917e955b2f00d384a65bbcc5d0b3511567713585 Mon Sep 17 00:00:00 2001 From: Robert Herber Date: Mon, 29 Dec 2025 17:50:19 +0100 Subject: [PATCH 08/21] Fix dev client crash (#80) * fix: dev client crash * bump iphone sim to use for tests * use xcode 16.4 --- .github/workflows/test.yml | 30 ++++++++----------- .../ios/ReactNativeDeviceActivityModule.swift | 17 ++++++----- 2 files changed, 23 insertions(+), 24 deletions(-) diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index abaed15..15d9e40 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -19,9 +19,9 @@ jobs: bun-version: latest - run: bun install - + - run: bun lint - + typecheck: name: Typecheck runs-on: ubuntu-latest @@ -34,7 +34,7 @@ jobs: bun-version: latest - run: bun install - + - run: bun typecheck typecheck-example: @@ -43,7 +43,7 @@ jobs: timeout-minutes: 10 steps: - uses: actions/checkout@v4 - + - uses: oven-sh/setup-bun@v2 with: bun-version: latest @@ -59,7 +59,7 @@ jobs: timeout-minutes: 10 steps: - uses: actions/checkout@v4 - + - uses: oven-sh/setup-bun@v2 with: bun-version: latest @@ -75,7 +75,7 @@ jobs: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - + - uses: oven-sh/setup-bun@v2 with: bun-version: latest @@ -91,7 +91,7 @@ jobs: timeout-minutes: 10 steps: - uses: actions/checkout@v4 - + - uses: oven-sh/setup-bun@v2 with: bun-version: latest @@ -107,7 +107,7 @@ jobs: timeout-minutes: 10 steps: - uses: actions/checkout@v4 - + - uses: oven-sh/setup-bun@v2 with: bun-version: latest @@ -123,7 +123,7 @@ jobs: - run: pod install working-directory: apps/example/ios - + - run: apps/example/ios/Pods/SwiftLint/swiftlint lint swift-test: @@ -166,19 +166,15 @@ jobs: restore-keys: xcode-cache-deriveddata-${{ github.workflow }}- - name: Set up Xcode version - run: sudo xcode-select -s /Applications/Xcode_16.2.app/Contents/Developer + run: sudo xcode-select -s /Applications/Xcode_16.4.app - name: Check Swift version run: swift --version - + - run: pod install working-directory: apps/example/ios - run: cp .swiftlint.yml apps/example/ios - - - run: xcodebuild test -workspace reactnativedeviceactivityexample.xcworkspace -scheme Tests -allowProvisioningUpdates -destination "platform=iOS Simulator,OS=latest,name=iPhone 16" - working-directory: apps/example/ios - - - \ No newline at end of file + - run: xcodebuild test -workspace reactnativedeviceactivityexample.xcworkspace -scheme Tests -allowProvisioningUpdates -destination "platform=iOS Simulator,OS=latest,name=iPhone 17" + working-directory: apps/example/ios diff --git a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift index 24d3eca..abce029 100644 --- a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift +++ b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift @@ -232,6 +232,10 @@ class NativeEventObserver { registerListener(name: "intervalWillEndWarning") registerListener(name: "eventWillReachThresholdWarning") } + + func unregister() { + CFNotificationCenterRemoveEveryObserver(notificationCenter, observer) + } } @available(iOS 15.0, *) @@ -277,8 +281,6 @@ public class ReactNativeDeviceActivityModule: Module { ]) let fileManager = FileManager.default - let observer = NativeEventObserver(module: self) - var watchActivitiesHandle: Cancellable? var onDeviceActivityDetectedHandle: Cancellable? @@ -321,7 +323,10 @@ public class ReactNativeDeviceActivityModule: Module { return to.absoluteString } + var observer: NativeEventObserver? + OnStartObserving { + observer = NativeEventObserver(module: self) onDeviceActivityDetectedHandle = AuthorizationCenter.shared.$authorizationStatus.sink { status in self.sendEvent( @@ -341,6 +346,8 @@ public class ReactNativeDeviceActivityModule: Module { } OnStopObserving { + observer?.unregister() + observer = nil watchActivitiesHandle?.cancel() onDeviceActivityDetectedHandle?.cancel() } @@ -694,7 +701,7 @@ public class ReactNativeDeviceActivityModule: Module { let activitySelection = parseActivitySelectionInput(input: familyActivitySelection) - try blockSelectedApps( + blockSelectedApps( blockSelection: activitySelection, triggeredBy: triggeredBy ) @@ -816,15 +823,11 @@ public class ReactNativeDeviceActivityModule: Module { } Prop("footerText") { (view: ReactNativeDeviceActivityView, prop: String?) in - view.model.footerText = prop - } Prop("headerText") { (view: ReactNativeDeviceActivityView, prop: String?) in - view.model.headerText = prop - } } } From a4de62980e21031f8fbc252011e281e63ff57985 Mon Sep 17 00:00:00 2001 From: Robert Herber Date: Mon, 29 Dec 2025 16:51:17 +0000 Subject: [PATCH 09/21] chore: update version --- packages/react-native-device-activity/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-device-activity/package.json b/packages/react-native-device-activity/package.json index fea1c2f..b213bff 100644 --- a/packages/react-native-device-activity/package.json +++ b/packages/react-native-device-activity/package.json @@ -1,6 +1,6 @@ { "name": "react-native-device-activity", - "version": "0.5.0", + "version": "0.5.1", "description": "Provides access to Apples DeviceActivity API", "main": "build/index.js", "types": "build/index.d.ts", From e20fa615ab93907a824ece39284777360579eaa9 Mon Sep 17 00:00:00 2001 From: joe2708 Date: Mon, 2 Feb 2026 17:44:42 +0530 Subject: [PATCH 10/21] Fix intermittent NativeEventObserver crash on iOS (#83) --- .../ios/ReactNativeDeviceActivityModule.swift | 25 +++++++++++++++---- 1 file changed, 20 insertions(+), 5 deletions(-) diff --git a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift index abce029..3fe03eb 100644 --- a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift +++ b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift @@ -193,10 +193,14 @@ func convertToSwiftDateComponents(from dateComponentsFromJS: DateComponentsFromJ class NativeEventObserver { let notificationCenter = CFNotificationCenterGetDarwinNotifyCenter() - let observer: UnsafeRawPointer + private weak var module: BaseModule? + private var observer: UnsafeRawPointer? func registerListener(name: String) { let notificationName = name as CFString + guard let observer else { + return + } CFNotificationCenterAddObserver( notificationCenter, observer, @@ -209,9 +213,11 @@ class NativeEventObserver { _: CFDictionary? ) in if let observer = observer, let name = name { - let mySelf = Unmanaged.fromOpaque(observer).takeUnretainedValue() - - mySelf.sendEvent( + let nativeObserver = Unmanaged.fromOpaque(observer).takeUnretainedValue() + guard let module = nativeObserver.module else { + return + } + module.sendEvent( "onDeviceActivityMonitorEvent" as String, [ "callbackName": name.rawValue @@ -224,7 +230,8 @@ class NativeEventObserver { } init(module: BaseModule) { - observer = UnsafeRawPointer(Unmanaged.passUnretained(module).toOpaque()) + self.module = module + observer = UnsafeRawPointer(Unmanaged.passUnretained(self).toOpaque()) registerListener(name: "intervalDidStart") registerListener(name: "intervalDidEnd") registerListener(name: "eventDidReachThreshold") @@ -234,7 +241,15 @@ class NativeEventObserver { } func unregister() { + guard let observer else { + return + } CFNotificationCenterRemoveEveryObserver(notificationCenter, observer) + self.observer = nil + } + + deinit { + unregister() } } From d42358599558d762aa79728d9f3c53c723f257fb Mon Sep 17 00:00:00 2001 From: joe2708 Date: Mon, 2 Feb 2026 12:15:37 +0000 Subject: [PATCH 11/21] chore: update version --- packages/react-native-device-activity/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-device-activity/package.json b/packages/react-native-device-activity/package.json index b213bff..a053ba2 100644 --- a/packages/react-native-device-activity/package.json +++ b/packages/react-native-device-activity/package.json @@ -1,6 +1,6 @@ { "name": "react-native-device-activity", - "version": "0.5.1", + "version": "0.5.2", "description": "Provides access to Apples DeviceActivity API", "main": "build/index.js", "types": "build/index.d.ts", From 07aaef80a870eb7ac1379c19ffdcd53a2fe3d0a7 Mon Sep 17 00:00:00 2001 From: Desmond Brand Date: Mon, 2 Feb 2026 06:07:51 -0800 Subject: [PATCH 12/21] No longer depend on relative location of node_modules (#71) This import fails in my pnpm monorepo because pnpm puts `node_modules` in a different place (with more nesting and symlinks etc). This small changes resolves it though. --- packages/react-native-device-activity/app.plugin.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-device-activity/app.plugin.js b/packages/react-native-device-activity/app.plugin.js index be71b0e..2abfa4c 100644 --- a/packages/react-native-device-activity/app.plugin.js +++ b/packages/react-native-device-activity/app.plugin.js @@ -6,7 +6,7 @@ const withCopyTargetFolder = require("./config-plugin/withCopyTargetFolder"); const withEntitlementsPlugin = require("./config-plugin/withEntitlements"); const withInfoPlistAppGroup = require("./config-plugin/withInfoPlistAppGroup"); const withXcodeSettings = require("./config-plugin/withXCodeSettings"); -const pkg = require("../../package.json"); +const pkg = require(process.cwd() + "/package.json"); /** @type {import('@expo/config-plugins').ConfigPlugin<{ appleTeamId?: string; match?: string; appGroup: string; copyToTargetFolder?: boolean }>} */ const withActivityMonitorExtensionPlugin = (config, props) => { From be0442104d92930c33cf09c4a4232511d51fb1f9 Mon Sep 17 00:00:00 2001 From: Desmond Brand Date: Mon, 2 Feb 2026 14:09:00 +0000 Subject: [PATCH 13/21] chore: update version --- packages/react-native-device-activity/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-device-activity/package.json b/packages/react-native-device-activity/package.json index a053ba2..48b4090 100644 --- a/packages/react-native-device-activity/package.json +++ b/packages/react-native-device-activity/package.json @@ -1,6 +1,6 @@ { "name": "react-native-device-activity", - "version": "0.5.2", + "version": "0.5.3", "description": "Provides access to Apples DeviceActivity API", "main": "build/index.js", "types": "build/index.d.ts", From 5dee761e00da667409b4927022b91e03d9511b16 Mon Sep 17 00:00:00 2001 From: Luca <100935601+thisislvca@users.noreply.github.com> Date: Mon, 9 Feb 2026 23:46:06 +0100 Subject: [PATCH 14/21] fix: switch activity picker to native iOS sheet behavior (#84) * fix: use native iOS picker sheet with proper cancel and done behavior * fix: manually switch bottom of native sheet from systemBackground to systemGroupedBackground * docs: document persisted selection picker native-sheet props * feat: split native picker sheet into dedicated components * docs: clarify picker variant choices and persisted selection usage * fix(example): restore Create Activity picker interaction Fix a pre-existing bug in the example app where tapping "Select apps" inside the Create Activity modal did not open the picker flow. * fix(example): rename picker view labels for clearer behavior Align example UI wording with the split component model (Sheet View vs Selection View) to avoid implying the custom path is deprecated. * fix(ios): keep picker host views non-interactive for fallback overlays --- README.md | 59 +++++++- apps/example/components/ActivityPicker.tsx | 123 +++++++++------- apps/example/components/CreateActivity.tsx | 47 +++--- apps/example/screens/SimpleTab.tsx | 52 +++++++ .../ios/ReactNativeDeviceActivityModule.swift | 27 +++- .../ios/ReactNativeDeviceActivityView.swift | 34 +++++ ...actNativeDeviceActivityViewPersisted.swift | 31 ++++ .../ios/ScreenTimeActivityPicker.swift | 136 +++++++++++++++++- .../DeviceActivitySelectionSheetView.ios.tsx | 21 +++ .../src/DeviceActivitySelectionSheetView.tsx | 11 ++ ...ctivitySelectionSheetViewPersisted.ios.tsx | 22 +++ ...iceActivitySelectionSheetViewPersisted.tsx | 11 ++ .../src/ReactNativeDeviceActivity.types.ts | 15 ++ .../src/index.test.ts | 8 ++ .../react-native-device-activity/src/index.ts | 13 +- 15 files changed, 527 insertions(+), 83 deletions(-) create mode 100644 packages/react-native-device-activity/src/DeviceActivitySelectionSheetView.ios.tsx create mode 100644 packages/react-native-device-activity/src/DeviceActivitySelectionSheetView.tsx create mode 100644 packages/react-native-device-activity/src/DeviceActivitySelectionSheetViewPersisted.ios.tsx create mode 100644 packages/react-native-device-activity/src/DeviceActivitySelectionSheetViewPersisted.tsx diff --git a/README.md b/README.md index c3fe88e..b67d4c3 100644 --- a/README.md +++ b/README.md @@ -201,7 +201,59 @@ ReactNativeDeviceActivity.revokeAuthorization(); ### Select Apps to track -For most use cases you need to get an activitySelection from the user, which is a token representing the apps the user wants to track, block or whitelist. This can be done by presenting the native view: +For most use cases you need to get an activitySelection from the user, which is a token representing the apps the user wants to track, block or whitelist. This can be done by presenting the native `DeviceActivitySelectionView`. + +#### Presentation options + +The picker now has dedicated components for each presentation style: + +`*SelectionView` components take a raw `familyActivitySelection` token. +`*SelectionViewPersisted` components take a `familyActivitySelectionId` and persist/read the token on the native side by ID. + +**Native sheet** -- `DeviceActivitySelectionSheetView` (and persisted variant) uses Apple's `.familyActivityPicker(isPresented:selection:)` flow with native Cancel/Done controls. + +```TypeScript +// The sheet view acts as an invisible anchor. +// The native side presents the iOS sheet and fires onDismissRequest on Cancel/Done. +{pickerVisible && ( + setPickerVisible(false)} + onSelectionChange={handleSelectionChange} + familyActivitySelection={familyActivitySelection} + /> +)} +``` + +**Custom presentation (fallback/customizable)** -- `DeviceActivitySelectionView` (and persisted variant) renders inline. You can embed it directly in your layout or wrap it in a React Native `` for a custom sheet. + +```TypeScript +import { Modal, View } from "react-native"; + + + + + + +``` + +#### Which one should I use? + +- Use `DeviceActivitySelectionSheetView` for a native iOS sheet UX (system Cancel/Done). +- Use `DeviceActivitySelectionView` when you need full control over presentation and a custom crash fallback UI. +- Use the persisted variants when you want to store/reuse selections across screens/sessions or avoid passing very large selection tokens through JS. + +#### Full example ```TypeScript import * as ReactNativeDeviceActivity from "react-native-device-activity"; @@ -550,7 +602,10 @@ For a complete implementation, see the [example app](https://github.com/Kingstin | Component | Props | Description | | ----------------------------- | ------------------------------------------------------------------------------------------------------- | -------------------------------------------------- | -| `DeviceActivitySelectionView` | `familyActivitySelection`: string \| null
`onSelectionChange`: (event) => void
`style`: ViewStyle | Native component that renders the app selection UI | +| `DeviceActivitySelectionView` | `familyActivitySelection`: string \| null
`onSelectionChange`: (event) => void
`headerText?`: string
`footerText?`: string
`style`: ViewStyle | Inline/customizable native picker view. Useful when you want to control modal/presentation yourself and provide a fallback UI. | +| `DeviceActivitySelectionViewPersisted` | `familyActivitySelectionId`: string
`onSelectionChange`: (event) => void
`includeEntireCategory?`: boolean
`headerText?`: string
`footerText?`: string
`style`: ViewStyle | Persisted inline/customizable picker keyed by `familyActivitySelectionId`. | +| `DeviceActivitySelectionSheetView` | `familyActivitySelection`: string \| null
`onSelectionChange`: (event) => void
`headerText?`: string
`footerText?`: string
`onDismissRequest?`: (event) => void
`style`: ViewStyle | Dedicated native iOS sheet picker with Cancel/Done controls. | +| `DeviceActivitySelectionSheetViewPersisted` | `familyActivitySelectionId`: string
`onSelectionChange`: (event) => void
`includeEntireCategory?`: boolean
`headerText?`: string
`footerText?`: string
`onDismissRequest?`: (event) => void
`style`: ViewStyle | Persisted dedicated native iOS sheet picker keyed by `familyActivitySelectionId`. | ### Hooks diff --git a/apps/example/components/ActivityPicker.tsx b/apps/example/components/ActivityPicker.tsx index 15bbf25..c479354 100644 --- a/apps/example/components/ActivityPicker.tsx +++ b/apps/example/components/ActivityPicker.tsx @@ -1,6 +1,9 @@ -import { Pressable, Text, View, NativeSyntheticEvent } from "react-native"; +import React from "react"; +import { NativeSyntheticEvent, Pressable, StyleSheet, Text, View } from "react-native"; import { ActivitySelectionMetadata, + DeviceActivitySelectionSheetView, + DeviceActivitySelectionSheetViewPersisted, ActivitySelectionWithMetadata, DeviceActivitySelectionView, DeviceActivitySelectionViewPersisted, @@ -10,15 +13,7 @@ import { Modal, Portal } from "react-native-paper"; const CrashView = ({ onReload }: { onReload: () => void }) => { return ( Swift view crash - tap to reload @@ -32,6 +27,7 @@ export const ActivityPicker = ({ onSelectionChange, familyActivitySelection, onReload, + showNavigationBar = true, }: { visible: boolean; onDismiss: () => void; @@ -40,35 +36,36 @@ export const ActivityPicker = ({ ) => void; familyActivitySelection: string | undefined; onReload: () => void; + showNavigationBar?: boolean; }) => { + if (showNavigationBar) { + // Native presentation: the native side uses the + // .familyActivityPicker(isPresented:) modifier which presents its own + // sheet. We just mount a tiny anchor view — no RN Modal needed. + if (!visible) return null; + return ( + + ); + } + + // Custom modal: react-native-paper Portal + Modal with fixed height. return ( - + - {visible && ( @@ -86,6 +83,7 @@ export const ActivityPickerPersisted = ({ familyActivitySelectionId, onReload, includeEntireCategory, + showNavigationBar = true, }: { visible: boolean; onDismiss: () => void; @@ -96,35 +94,33 @@ export const ActivityPickerPersisted = ({ familyActivitySelectionId: string; onReload: () => void; includeEntireCategory?: boolean; + showNavigationBar?: boolean; }) => { + if (showNavigationBar) { + if (!visible) return null; + return ( + + ); + } + return ( - + - {visible && ( ); }; + +const styles = StyleSheet.create({ + // Invisible anchor for the native .familyActivityPicker() modifier. + nativeAnchor: { + width: 1, + height: 1, + position: "absolute", + }, + modalContainer: { + height: 600, + }, + modalContent: { + flex: 1, + height: 600, + }, + crashView: { + flex: 1, + position: "absolute", + height: 600, + width: "100%", + alignItems: "center", + justifyContent: "center", + backgroundColor: "white", + }, + picker: { + flex: 1, + height: 600, + width: "100%", + backgroundColor: "transparent", + }, +}); diff --git a/apps/example/components/CreateActivity.tsx b/apps/example/components/CreateActivity.tsx index a91e70e..8488c3b 100644 --- a/apps/example/components/CreateActivity.tsx +++ b/apps/example/components/CreateActivity.tsx @@ -1,6 +1,6 @@ import { requestPermissionsAsync } from "expo-notifications"; import { useCallback, useState } from "react"; -import { NativeSyntheticEvent, View } from "react-native"; +import { NativeSyntheticEvent, Pressable, View } from "react-native"; import * as ReactNativeDeviceActivity from "react-native-device-activity"; import { DeviceActivityEvent, @@ -8,6 +8,8 @@ import { } from "react-native-device-activity/src/ReactNativeDeviceActivity.types"; import { Button, Text, TextInput, Title, useTheme } from "react-native-paper"; +import { ActivityPicker } from "./ActivityPicker"; + const trackEveryXMinutes = 10; const potentialMaxEvents = Math.floor((60 * 24) / trackEveryXMinutes); @@ -175,6 +177,7 @@ export const CreateActivity = ({ onDismiss }: { onDismiss: () => void }) => { ); const [activityName, setActivityName] = useState(""); + const [showSelectionView, setShowSelectionView] = useState(false); return ( @@ -187,33 +190,19 @@ export const CreateActivity = ({ onDismiss }: { onDismiss: () => void }) => { marginVertical: 10, }} > - setShowSelectionView(true)} > - - Select apps - - + Select apps + {familyActivitySelectionResult && familyActivitySelectionResult?.categoryCount < 13 @@ -223,6 +212,20 @@ export const CreateActivity = ({ onDismiss }: { onDismiss: () => void }) => { : "Nothing selected"} + setShowSelectionView(false)} + onSelectionChange={onSelectionChange} + familyActivitySelection={ + familyActivitySelectionResult?.familyActivitySelection ?? undefined + } + onReload={() => { + setShowSelectionView(false); + setTimeout(() => { + setShowSelectionView(true); + }, 100); + }} + /> setActivityName(text)} diff --git a/apps/example/screens/SimpleTab.tsx b/apps/example/screens/SimpleTab.tsx index 278a68f..82a5616 100644 --- a/apps/example/screens/SimpleTab.tsx +++ b/apps/example/screens/SimpleTab.tsx @@ -1,5 +1,6 @@ import React, { useCallback, useEffect, useState } from "react"; import { + NativeSyntheticEvent, ScrollView, StyleSheet, Linking, @@ -18,9 +19,11 @@ import { useAuthorizationStatus, AuthorizationStatusType, requestAuthorization, + ActivitySelectionMetadata, } from "react-native-device-activity"; import { Button, Modal, Text, Title } from "react-native-paper"; +import { ActivityPickerPersisted } from "../components/ActivityPicker"; import { CreateActivity } from "../components/CreateActivity"; const authorizationStatusMap: Record = { @@ -59,6 +62,9 @@ export function SimpleTab() { const [showCreateActivityPopup, setShowCreateActivityPopup] = useState(false); + const [pickerNative, setPickerNative] = useState(false); + const [pickerCustomModal, setPickerCustomModal] = useState(false); + const [refreshing, setRefreshing] = useState(false); useEffect(() => { @@ -140,6 +146,22 @@ export function SimpleTab() { > Create Activity + + + setPickerNative(true)} + style={{ marginVertical: 4 }} + > + Sheet View (native iOS) + + setPickerCustomModal(true)} + style={{ marginVertical: 4 }} + > + Selection View (custom wrapper) + + setPickerNative(false)} + showNavigationBar + onSelectionChange={( + event: NativeSyntheticEvent, + ) => { + console.log("sheet view selection changed", event.nativeEvent); + }} + familyActivitySelectionId="picker-native" + onReload={() => { + setPickerNative(false); + setTimeout(() => setPickerNative(true), 100); + }} + /> + setPickerCustomModal(false)} + showNavigationBar={false} + onSelectionChange={( + event: NativeSyntheticEvent, + ) => { + console.log("selection view changed", event.nativeEvent); + }} + familyActivitySelectionId="picker-custom-modal" + onReload={() => { + setPickerCustomModal(false); + setTimeout(() => setPickerCustomModal(true), 100); + }} + /> ); } diff --git a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift index 3fe03eb..c1ccf0f 100644 --- a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift +++ b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift @@ -213,7 +213,8 @@ class NativeEventObserver { _: CFDictionary? ) in if let observer = observer, let name = name { - let nativeObserver = Unmanaged.fromOpaque(observer).takeUnretainedValue() + let nativeObserver = Unmanaged.fromOpaque(observer) + .takeUnretainedValue() guard let module = nativeObserver.module else { return } @@ -828,7 +829,8 @@ public class ReactNativeDeviceActivityModule: Module { // view definition: Prop, Events. View(ReactNativeDeviceActivityView.self) { Events( - "onSelectionChange" + "onSelectionChange", + "onDismissRequest" ) // Defines a setter for the `name` prop. Prop("familyActivitySelection") { (view: ReactNativeDeviceActivityView, prop: String) in @@ -844,7 +846,18 @@ public class ReactNativeDeviceActivityModule: Module { Prop("headerText") { (view: ReactNativeDeviceActivityView, prop: String?) in view.model.headerText = prop } + + Prop("showNavigationBar") { (view: ReactNativeDeviceActivityView, prop: Bool?) in + let enabled = prop ?? false + view.model.showNavigationBar = enabled + // When using the native .familyActivityPicker() modifier, set the + // hosting controller background so the presented sheet inherits it + // instead of falling through to the window's white default. + view.contentView.view.backgroundColor = enabled ? .systemGroupedBackground : .clear + view.backgroundColor = enabled ? .systemGroupedBackground : .clear + } } + } } @@ -854,7 +867,8 @@ public class ReactNativeDeviceActivityViewPersistedModule: Module { Name("ReactNativeDeviceActivityViewPersistedModule") View(ReactNativeDeviceActivityViewPersisted.self) { Events( - "onSelectionChange" + "onSelectionChange", + "onDismissRequest" ) // Defines a setter for the `name` prop. Prop("familyActivitySelectionId") { @@ -894,6 +908,13 @@ public class ReactNativeDeviceActivityViewPersistedModule: Module { Prop("headerText") { (view: ReactNativeDeviceActivityViewPersisted, prop: String?) in view.model.headerText = prop } + + Prop("showNavigationBar") { (view: ReactNativeDeviceActivityViewPersisted, prop: Bool?) in + let enabled = prop ?? false + view.model.showNavigationBar = enabled + view.contentView.view.backgroundColor = enabled ? .systemGroupedBackground : .clear + view.backgroundColor = enabled ? .systemGroupedBackground : .clear + } } } } diff --git a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityView.swift b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityView.swift index 675dfcf..897a322 100644 --- a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityView.swift +++ b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityView.swift @@ -31,6 +31,10 @@ class ReactNativeDeviceActivityView: ExpoView { self.addSubview(contentView.view) + model.onDismissRequest = { [weak self] in + self?.onDismissRequest([:]) + } + model.$activitySelection.debounce(for: .seconds(0.1), scheduler: RunLoop.main).sink { selection in if selection != self.previousSelection { @@ -45,7 +49,37 @@ class ReactNativeDeviceActivityView: ExpoView { contentView.view.frame = bounds } + override func didMoveToWindow() { + super.didMoveToWindow() + if window != nil { + // Establish a proper UIKit parent–child VC relationship so that + // SwiftUI presentation modifiers (like .familyActivityPicker) can + // walk the VC hierarchy and present sheets. + if contentView.parent == nil, let parentVC = parentViewController { + parentVC.addChild(contentView) + contentView.didMove(toParent: parentVC) + } + } else { + if contentView.parent != nil { + contentView.willMove(toParent: nil) + contentView.removeFromParent() + } + } + } + + private var parentViewController: UIViewController? { + var responder: UIResponder? = self + while let next = responder?.next { + if let vc = next as? UIViewController { + return vc + } + responder = next + } + return nil + } + let onSelectionChange = EventDispatcher() + let onDismissRequest = EventDispatcher() var previousSelection: FamilyActivitySelection? diff --git a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityViewPersisted.swift b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityViewPersisted.swift index ea3cde0..f37a2ce 100644 --- a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityViewPersisted.swift +++ b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityViewPersisted.swift @@ -31,6 +31,10 @@ class ReactNativeDeviceActivityViewPersisted: ExpoView { self.addSubview(contentView.view) + model.onDismissRequest = { [weak self] in + self?.onDismissRequest([:]) + } + model.$activitySelection.debounce(for: .seconds(0.1), scheduler: RunLoop.main).sink { selection in if selection != self.previousSelection { @@ -45,7 +49,34 @@ class ReactNativeDeviceActivityViewPersisted: ExpoView { contentView.view.frame = bounds } + override func didMoveToWindow() { + super.didMoveToWindow() + if window != nil { + if contentView.parent == nil, let parentVC = parentViewController { + parentVC.addChild(contentView) + contentView.didMove(toParent: parentVC) + } + } else { + if contentView.parent != nil { + contentView.willMove(toParent: nil) + contentView.removeFromParent() + } + } + } + + private var parentViewController: UIViewController? { + var responder: UIResponder? = self + while let next = responder?.next { + if let vc = next as? UIViewController { + return vc + } + responder = next + } + return nil + } + let onSelectionChange = EventDispatcher() + let onDismissRequest = EventDispatcher() var previousSelection: FamilyActivitySelection? diff --git a/packages/react-native-device-activity/ios/ScreenTimeActivityPicker.swift b/packages/react-native-device-activity/ios/ScreenTimeActivityPicker.swift index b175a1b..7a82d7e 100644 --- a/packages/react-native-device-activity/ios/ScreenTimeActivityPicker.swift +++ b/packages/react-native-device-activity/ios/ScreenTimeActivityPicker.swift @@ -23,6 +23,10 @@ class ScreenTimeSelectAppsModel: ObservableObject { @Published public var includeEntireCategory: Bool? + @Published public var showNavigationBar: Bool = false + + var onDismissRequest: (() -> Void)? + init() {} } @@ -30,21 +34,139 @@ class ScreenTimeSelectAppsModel: ObservableObject { struct ActivityPicker: View { @ObservedObject var model: ScreenTimeSelectAppsModel + /// Local state used by the `.familyActivityPicker` modifier to drive + /// its native sheet presentation. + @State private var isPickerPresented = false + + private var resolvedHeaderText: String? { + let trimmed = model.headerText?.trimmingCharacters(in: .whitespacesAndNewlines) + return (trimmed?.isEmpty == false) ? trimmed : nil + } + + private var resolvedFooterText: String? { + let trimmed = model.footerText?.trimmingCharacters(in: .whitespacesAndNewlines) + return (trimmed?.isEmpty == false) ? trimmed : nil + } + var body: some View { - if #available(iOS 16.0, *) { + if model.showNavigationBar { + // Use the `.familyActivityPicker(isPresented:selection:)` **modifier** + // instead of the inline `FamilyActivityPicker` view. The modifier + // presents the picker as a native sheet with Cancel/Done in the nav bar. + nativeSheetPresentation + } else { + pickerContent + } + } + + // MARK: - Native sheet (modifier-based) presentation + + @ViewBuilder + private var nativeSheetPresentation: some View { + if #available(iOS 16.0, *), resolvedHeaderText != nil || resolvedFooterText != nil { + Color.clear + .familyActivityPicker( + headerText: resolvedHeaderText, + footerText: resolvedFooterText, + isPresented: $isPickerPresented, + selection: $model.activitySelection + ) + .onAppear { isPickerPresented = true } + .onChange(of: isPickerPresented) { presented in + if !presented { model.onDismissRequest?() } + } + .background(PresentedSheetBackgroundFixer()) + } else { + Color.clear + .familyActivityPicker( + isPresented: $isPickerPresented, + selection: $model.activitySelection + ) + .onAppear { isPickerPresented = true } + .onChange(of: isPickerPresented) { presented in + if !presented { model.onDismissRequest?() } + } + .background(PresentedSheetBackgroundFixer()) + } + } + + // MARK: - Inline (embedded) picker + + @ViewBuilder + private var pickerContent: some View { + if #available(iOS 16.0, *), resolvedHeaderText != nil || resolvedFooterText != nil { FamilyActivityPicker( - headerText: model.headerText, - footerText: model.footerText, + headerText: resolvedHeaderText, + footerText: resolvedFooterText, selection: $model.activitySelection ) - .allowsHitTesting(false) - .background(Color.clear) } else { FamilyActivityPicker( selection: $model.activitySelection ) - .allowsHitTesting(false) - .background(Color.clear) + } + } +} + +// MARK: - Sheet background fix + +/// Finds the presented picker sheet's view hierarchy and sets the background +/// to `systemGroupedBackground` so the empty area below the list matches +/// the rest of the sheet. Uses a VC representable that observes when our +/// hosting controller presents a child. +@available(iOS 15.0, *) +struct PresentedSheetBackgroundFixer: UIViewControllerRepresentable { + func makeUIViewController(context: Context) -> SheetBackgroundFixerController { + SheetBackgroundFixerController() + } + + func updateUIViewController(_ uiViewController: SheetBackgroundFixerController, context: Context) {} +} + +@available(iOS 15.0, *) +class SheetBackgroundFixerController: UIViewController { + private var observation: NSKeyValueObservation? + + override func viewDidAppear(_ animated: Bool) { + super.viewDidAppear(animated) + startObserving() + } + + private func startObserving() { + // Walk up to find the VC that will present the picker sheet. + var candidate: UIViewController? = self + while let c = candidate { + // Observe `presentedViewController` so we catch it the moment the + // picker sheet appears. + observation = c.observe( + \.presentedViewController, options: [.new] + ) { [weak self] vc, _ in + DispatchQueue.main.asyncAfter(deadline: .now() + 0.05) { + self?.fixPresentedBackground(from: vc) + } + } + // Also try immediately in case it's already presented. + fixPresentedBackground(from: c) + if c.presentedViewController != nil || c.parent == nil { break } + candidate = c.parent + } + } + + private func fixPresentedBackground(from vc: UIViewController) { + guard let presented = vc.presentedViewController else { return } + applySystemBackground(to: presented.view) + for child in presented.children { + applySystemBackground(to: child.view) + } + } + + private func applySystemBackground(to view: UIView) { + view.backgroundColor = .systemGroupedBackground + // The picker nests views; walk a few levels deep. + for sub in view.subviews { + if sub.backgroundColor == .white || sub.backgroundColor == .systemBackground { + sub.backgroundColor = .systemGroupedBackground + } } } } diff --git a/packages/react-native-device-activity/src/DeviceActivitySelectionSheetView.ios.tsx b/packages/react-native-device-activity/src/DeviceActivitySelectionSheetView.ios.tsx new file mode 100644 index 0000000..79f6d67 --- /dev/null +++ b/packages/react-native-device-activity/src/DeviceActivitySelectionSheetView.ios.tsx @@ -0,0 +1,21 @@ +import { requireNativeViewManager } from "expo-modules-core"; +import * as React from "react"; + +import { + DeviceActivitySelectionSheetViewProps, + DeviceActivitySelectionViewProps, +} from "./ReactNativeDeviceActivity.types"; + +type NativeSheetViewProps = DeviceActivitySelectionViewProps & { + showNavigationBar: boolean; + onDismissRequest?: DeviceActivitySelectionSheetViewProps["onDismissRequest"]; +}; + +const NativeView: React.ComponentType = + requireNativeViewManager("ReactNativeDeviceActivity"); + +export default function DeviceActivitySelectionSheetView( + props: DeviceActivitySelectionSheetViewProps, +) { + return ; +} diff --git a/packages/react-native-device-activity/src/DeviceActivitySelectionSheetView.tsx b/packages/react-native-device-activity/src/DeviceActivitySelectionSheetView.tsx new file mode 100644 index 0000000..694d8b4 --- /dev/null +++ b/packages/react-native-device-activity/src/DeviceActivitySelectionSheetView.tsx @@ -0,0 +1,11 @@ +import * as React from "react"; +import { View } from "react-native"; + +import { DeviceActivitySelectionSheetViewProps } from "./ReactNativeDeviceActivity.types"; + +export default function DeviceActivitySelectionSheetView({ + style, + children, +}: DeviceActivitySelectionSheetViewProps) { + return {children}; +} diff --git a/packages/react-native-device-activity/src/DeviceActivitySelectionSheetViewPersisted.ios.tsx b/packages/react-native-device-activity/src/DeviceActivitySelectionSheetViewPersisted.ios.tsx new file mode 100644 index 0000000..5a4c094 --- /dev/null +++ b/packages/react-native-device-activity/src/DeviceActivitySelectionSheetViewPersisted.ios.tsx @@ -0,0 +1,22 @@ +import { requireNativeViewManager } from "expo-modules-core"; +import * as React from "react"; + +import { + DeviceActivitySelectionSheetViewPersistedProps, + DeviceActivitySelectionViewPersistedProps, +} from "./ReactNativeDeviceActivity.types"; + +type NativeSheetViewPersistedProps = DeviceActivitySelectionViewPersistedProps & { + showNavigationBar: boolean; + onDismissRequest?: + DeviceActivitySelectionSheetViewPersistedProps["onDismissRequest"]; +}; + +const NativeView: React.ComponentType = + requireNativeViewManager("ReactNativeDeviceActivityViewPersistedModule"); + +export default function DeviceActivitySelectionSheetViewPersisted( + props: DeviceActivitySelectionSheetViewPersistedProps, +) { + return ; +} diff --git a/packages/react-native-device-activity/src/DeviceActivitySelectionSheetViewPersisted.tsx b/packages/react-native-device-activity/src/DeviceActivitySelectionSheetViewPersisted.tsx new file mode 100644 index 0000000..6d56026 --- /dev/null +++ b/packages/react-native-device-activity/src/DeviceActivitySelectionSheetViewPersisted.tsx @@ -0,0 +1,11 @@ +import * as React from "react"; +import { View } from "react-native"; + +import { DeviceActivitySelectionSheetViewPersistedProps } from "./ReactNativeDeviceActivity.types"; + +export default function DeviceActivitySelectionSheetViewPersisted({ + style, + children, +}: DeviceActivitySelectionSheetViewPersistedProps) { + return {children}; +} diff --git a/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts b/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts index 1fae790..5ae9bcf 100644 --- a/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts +++ b/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts @@ -46,6 +46,13 @@ export type DeviceActivitySelectionViewProps = PropsWithChildren<{ footerText?: string | null; }>; +export type DeviceActivitySelectionSheetViewProps = DeviceActivitySelectionViewProps & { + /** + * Called when the user taps Cancel or Done in the native sheet navigation bar. + */ + onDismissRequest?: (event: NativeSyntheticEvent>) => void; +}; + export type DeviceActivitySelectionViewPersistedProps = PropsWithChildren<{ style?: StyleProp; onSelectionChange?: ( @@ -61,6 +68,14 @@ export type DeviceActivitySelectionViewPersistedProps = PropsWithChildren<{ includeEntireCategory?: boolean; }>; +export type DeviceActivitySelectionSheetViewPersistedProps = + DeviceActivitySelectionViewPersistedProps & { + /** + * Called when the user taps Cancel or Done in the native sheet navigation bar. + */ + onDismissRequest?: (event: NativeSyntheticEvent>) => void; + }; + /** * @link https://developer.apple.com/documentation/foundation/datecomponents */ diff --git a/packages/react-native-device-activity/src/index.test.ts b/packages/react-native-device-activity/src/index.test.ts index db8d511..b32e1b2 100644 --- a/packages/react-native-device-activity/src/index.test.ts +++ b/packages/react-native-device-activity/src/index.test.ts @@ -1,6 +1,14 @@ // todo: skipping for now describe("test", () => { + test("Should export sheet picker views", () => { + jest.isolateModules(() => { + const module = require("./"); + expect(module.DeviceActivitySelectionSheetView).toBeDefined(); + expect(module.DeviceActivitySelectionSheetViewPersisted).toBeDefined(); + }); + }); + test("Should call stopMonitoring", () => { const mockStopMonitoring = jest.fn(); jest.mock("./ReactNativeDeviceActivityModule", () => ({ diff --git a/packages/react-native-device-activity/src/index.ts b/packages/react-native-device-activity/src/index.ts index 938f02d..0e01eaa 100644 --- a/packages/react-native-device-activity/src/index.ts +++ b/packages/react-native-device-activity/src/index.ts @@ -2,6 +2,8 @@ import { EventEmitter, EventSubscription } from "expo-modules-core"; import { useCallback, useEffect, useState } from "react"; import { Platform } from "react-native"; +import DeviceActivitySelectionSheetView from "./DeviceActivitySelectionSheetView"; +import DeviceActivitySelectionSheetViewPersisted from "./DeviceActivitySelectionSheetViewPersisted"; import DeviceActivitySelectionView from "./DeviceActivitySelectionView"; import DeviceActivitySelectionViewPersisted from "./DeviceActivitySelectionViewPersisted"; import { @@ -18,6 +20,8 @@ import { DeviceActivityEventRaw, DeviceActivityMonitorEventPayload, DeviceActivitySchedule, + DeviceActivitySelectionSheetViewPersistedProps, + DeviceActivitySelectionSheetViewProps, DeviceActivitySelectionViewPersistedProps, DeviceActivitySelectionViewProps, EventListenerMap, @@ -649,9 +653,16 @@ export function isAvailable(): boolean { ); } -export { DeviceActivitySelectionView, DeviceActivitySelectionViewPersisted }; +export { + DeviceActivitySelectionSheetView, + DeviceActivitySelectionSheetViewPersisted, + DeviceActivitySelectionView, + DeviceActivitySelectionViewPersisted, +}; export type { + DeviceActivitySelectionSheetViewProps as ReactNativeDeviceActivitySheetViewProps, + DeviceActivitySelectionSheetViewPersistedProps as ReactNativeDeviceActivitySheetViewPersistedProps, DeviceActivitySelectionViewProps as ReactNativeDeviceActivityViewProps, DeviceActivitySelectionViewPersistedProps as ReactNativeDeviceActivityViewPersistedProps, }; From 50b83ec0ef4921b2d8c5e7274e3304f44800cbc4 Mon Sep 17 00:00:00 2001 From: Copilot <198982749+Copilot@users.noreply.github.com> Date: Wed, 11 Feb 2026 01:27:36 +0100 Subject: [PATCH 15/21] Replace deprecated dcbadge.vercel.app with dcbadge.limes.pink (#87) * Initial plan * Fix broken Discord badge by replacing dcbadge.vercel.app with dcbadge.limes.pink Co-authored-by: robertherber <1467411+robertherber@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: robertherber <1467411+robertherber@users.noreply.github.com> --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index b67d4c3..5c15a61 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@ [](https://github.com/Kingstinct/react-native-device-activity/actions/workflows/test.yml) [](https://www.npmjs.com/package/react-native-device-activity) [](https://www.npmjs.com/package/react-native-device-activity) -[](https://discord.gg/hrgnETpsJA) +[](https://discord.gg/hrgnETpsJA) React Native wrapper for Apple's Screen Time, Device Activity, and Family Controls APIs. From 44fe314e517b498e37e0beba90c6060e6237c605 Mon Sep 17 00:00:00 2001 From: Luca <100935601+thisislvca@users.noreply.github.com> Date: Tue, 17 Feb 2026 15:49:41 +0100 Subject: [PATCH 16/21] feat: add web content filter policy API for adult/explicit website blocking (#86) * feat: add web content filter policy API with native/action support, docs, and tests * chore: add example web filter controls and fix swiftlint --- README.md | 76 ++++ apps/example/ios/Podfile.lock | 4 +- .../Tests/WebContentFilterPolicyTests.swift | 151 ++++++++ apps/example/screens/AllTheThings.tsx | 78 ++++ bun.lock | 9 +- .../ios/ReactNativeDeviceActivityModule.swift | 20 ++ .../ios/Shared.swift | 335 ++++++++++++++++++ .../src/ReactNativeDeviceActivity.types.ts | 35 ++ .../src/ReactNativeDeviceActivityModule.ts | 3 + .../src/index.test.ts | 82 ++++- .../react-native-device-activity/src/index.ts | 27 ++ 11 files changed, 800 insertions(+), 20 deletions(-) create mode 100644 apps/example/ios/Tests/WebContentFilterPolicyTests.swift diff --git a/README.md b/README.md index 5c15a61..2431a6d 100644 --- a/README.md +++ b/README.md @@ -25,6 +25,7 @@ React Native wrapper for Apple's Screen Time, Device Activity, and Family Contro - [Select Apps to track](#select-apps-to-track) - [Time tracking](#time-tracking) - [Block the shield](#block-the-shield) +- [Web Content Filter Policy](#web-content-filter-policy) - [Alternative Example: Blocking Apps for a Time Slot](#alternative-example-blocking-apps-for-a-time-slot) - [Key Concepts Explained](#key-concepts-explained) - [API Reference](#api-reference-the-list-is-not-exhaustive-yet-please-refer-to-the-typescript-types-for-the-full-list) @@ -428,6 +429,78 @@ ReactNativeDeviceActivity.updateShield( ) ``` +### Web Content Filter Policy + +Use this when you want to block web content without changing your app/category shield behavior, for example enabling adult/explicit site filtering during school/work hours while keeping existing app rules untouched. Under the hood this maps to Apple's [`WebContentSettings`](https://developer.apple.com/documentation/managedsettings/webcontentsettings) on [`ManagedSettingsStore.webContent`](https://developer.apple.com/documentation/managedsettings/managedsettingsstore/webcontent), including filter modes for [`auto(_:except:)`](https://developer.apple.com/documentation/managedsettings/webcontentsettings/filterpolicy/auto%28_%3Aexcept%3A%29), [`specific(_:)`](https://developer.apple.com/documentation/managedsettings/webcontentsettings/filterpolicy/specific%28_%3A%29), and [`all(except:)`](https://developer.apple.com/documentation/managedsettings/webcontentsettings/filterpolicy/all%28except%3A%29). + +```typescript +import * as ReactNativeDeviceActivity from "react-native-device-activity"; + +// Block adult/explicit websites using Apple's automatic filter. +ReactNativeDeviceActivity.setWebContentFilterPolicy({ + type: "auto", +}); +``` + +You can also provide explicit blocked and exception domains: + +```typescript +ReactNativeDeviceActivity.setWebContentFilterPolicy({ + type: "auto", + domains: ["example-adult-site.com"], + exceptDomains: ["example.com"], +}); +``` + +`specific` and `all` are also supported: + +```typescript +// Block only the listed domains +ReactNativeDeviceActivity.setWebContentFilterPolicy({ + type: "specific", + domains: ["example.com", "another-example.com"], +}); + +// Block all websites except the listed domains +ReactNativeDeviceActivity.setWebContentFilterPolicy({ + type: "all", + exceptDomains: ["example.com"], +}); +``` + +To clear web-content filtering: + +```typescript +ReactNativeDeviceActivity.clearWebContentFilterPolicy(); +``` + +To check whether a filter policy is currently active: + +```typescript +const isActive = ReactNativeDeviceActivity.isWebContentFilterPolicyActive(); +``` + +You can configure this from background actions as well: + +```typescript +ReactNativeDeviceActivity.configureActions({ + activityName: "school-hours", + callbackName: "intervalDidStart", + actions: [ + { + type: "setWebContentFilterPolicy", + policy: { + type: "auto", + }, + }, + ], +}); +``` + +Notes: +- Apple currently limits `domains` and `exceptDomains` to 50 entries each (depending on selected filter policy). +- Invalid or malformed policy input throws (for example: unknown `type`, missing required arrays, empty domains, or lists over the limit). + ## Alternative Example: Blocking Apps for a Time Slot This example shows how to implement a complete app blocking system on a given interval. The main principle is that you're configuring these apps to be blocked with FamilyControl API and then schedule when the shield should be shown with ActivityMonitor API. You're customizing the shield UI and actions with ShieldConfiguration and ShieldAction APIs. @@ -623,6 +696,9 @@ For a complete implementation, see the [example app](https://github.com/Kingstin | `setFamilyActivitySelectionId` | `{ id: string, familyActivitySelection: string }` | void | Store a family activity selection with given ID | | `updateShield` | `config`: ShieldConfiguration
`actions`: ShieldActions | void | Update the shield UI and actions | | `configureActions` | `{ activityName: string, callbackName: string, actions: Action[] }` | void | Configure actions for monitor events | +| `setWebContentFilterPolicy` | `policy`: WebContentFilterPolicyInput
`triggeredBy?`: string | void | Apply web filtering policy (`auto`, `specific`, `all`, `none`) | +| `clearWebContentFilterPolicy` | `triggeredBy?`: string | void | Clear only the web content filter policy | +| `isWebContentFilterPolicyActive` | None | boolean | Return whether web content filter policy is active | | `getEvents` | None | DeviceActivityEvent[] | Get history of triggered events | | `userDefaultsSet` | `key`: string
`value`: any | void | Store value in shared UserDefaults | | `userDefaultsGet` | `key`: string | any | Retrieve value from shared UserDefaults | diff --git a/apps/example/ios/Podfile.lock b/apps/example/ios/Podfile.lock index 40c1caf..d36bfc5 100644 --- a/apps/example/ios/Podfile.lock +++ b/apps/example/ios/Podfile.lock @@ -1601,7 +1601,7 @@ PODS: - React-logger - React-perflogger - React-utils (= 0.76.9) - - ReactNativeDeviceActivity (0.4.30): + - ReactNativeDeviceActivity (0.5.3): - ExpoModulesCore - RNVectorIcons (10.2.0): - DoubleConversion @@ -1947,7 +1947,7 @@ SPEC CHECKSUMS: React-utils: ed818f19ab445000d6b5c4efa9d462449326cc9f ReactCodegen: 2a46abb2e345dc8efaff0a724f5f8639230eb974 ReactCommon: 300d8d9c5cb1a6cd79a67cf5d8f91e4d477195f9 - ReactNativeDeviceActivity: 1017837e25b5b5247b85d7a542b5176b27ee85d3 + ReactNativeDeviceActivity: 49c0579e2cbb940f4366b917d9e17491a70c5bd7 RNVectorIcons: 4330d8f8f8f4184f436e0c08ae9950431ffe466e SocketRocket: d4aabe649be1e368d1318fdf28a022d714d65748 SwiftLint: 365bcd9ffc83d0deb874e833556d82549919d6cd diff --git a/apps/example/ios/Tests/WebContentFilterPolicyTests.swift b/apps/example/ios/Tests/WebContentFilterPolicyTests.swift new file mode 100644 index 0000000..c039adb --- /dev/null +++ b/apps/example/ios/Tests/WebContentFilterPolicyTests.swift @@ -0,0 +1,151 @@ +import ManagedSettings +import XCTest + +@available(iOS 15.0, *) +class WebContentFilterPolicyTests: XCTestCase { + override func setUp() { + super.setUp() + clearWebContentFilterPolicy(triggeredBy: "WebContentFilterPolicyTests.setUp") + } + + override func tearDown() { + clearWebContentFilterPolicy(triggeredBy: "WebContentFilterPolicyTests.tearDown") + super.tearDown() + } + + func testAutoPolicyParsesDomainsAndExceptions() throws { + let parsed = try parseWebContentFilterPolicyInput( + policyInput: [ + "type": "auto", + "domains": [ + "https://adult.example.com/path" + ], + "exceptDomains": [ + "safe.example.com" + ] + ] + ) + + switch parsed.policy { + case .auto(let domains, except: let exceptDomains): + XCTAssertEqual(domains.compactMap(\.domain).sorted(), ["adult.example.com"]) + XCTAssertEqual(exceptDomains.compactMap(\.domain).sorted(), ["safe.example.com"]) + default: + XCTFail("Expected auto policy") + } + } + + func testSpecificPolicyRejectsMoreThanFiftyDomains() { + // 51 unique domains should fail (Apple limit is 50) + let domains = (1...51).map { index in + return "blocked-\(index).example.com" + } + + XCTAssertThrowsError( + try parseWebContentFilterPolicyInput( + policyInput: [ + "type": "specific", + "domains": domains + ] + ) + ) + } + + func testSpecificPolicyAllowsExactlyFiftyDomains() throws { + let domains = (1...50).map { index in + return "blocked-\(index).example.com" + } + + let parsed = try parseWebContentFilterPolicyInput( + policyInput: [ + "type": "specific", + "domains": domains + ] + ) + + switch parsed.policy { + case .specific(let parsedDomains): + XCTAssertEqual(parsedDomains.count, 50) + default: + XCTFail("Expected specific policy") + } + } + + func testAllPolicyRejectsMoreThanFiftyExceptions() { + // 51 unique domains should fail (Apple limit is 50) + let domains = (1...51).map { index in + return "allowed-\(index).example.com" + } + + XCTAssertThrowsError( + try parseWebContentFilterPolicyInput( + policyInput: [ + "type": "all", + "exceptDomains": domains + ] + ) + ) + } + + func testAutoPolicyNormalizesQueryAndFragmentDomains() throws { + let parsed = try parseWebContentFilterPolicyInput( + policyInput: [ + "type": "auto", + "domains": ["example.com?foo=1"], + "exceptDomains": ["safe.example.com#top"] + ] + ) + + switch parsed.policy { + case .auto(let domains, except: let exceptDomains): + XCTAssertEqual(domains.compactMap(\.domain).sorted(), ["example.com"]) + XCTAssertEqual(exceptDomains.compactMap(\.domain).sorted(), ["safe.example.com"]) + default: + XCTFail("Expected auto policy") + } + } + + func testClearPolicyDeactivatesFilter() throws { + try setWebContentFilterPolicy( + policyInput: [ + "type": "auto" + ], + triggeredBy: "WebContentFilterPolicyTests.testClearPolicyDeactivatesFilter" + ) + + XCTAssertTrue(isWebContentFilterPolicyActive()) + + clearWebContentFilterPolicy( + triggeredBy: "WebContentFilterPolicyTests.testClearPolicyDeactivatesFilter" + ) + + XCTAssertFalse(isWebContentFilterPolicyActive()) + } + + func testExecuteGenericActionAppliesAndClearsPolicy() { + executeGenericAction( + action: [ + "type": "setWebContentFilterPolicy", + "policy": [ + "type": "auto", + "domains": ["adult.example.com"], + "exceptDomains": ["safe.example.com"] + ] + ], + placeholders: [:], + triggeredBy: "WebContentFilterPolicyTests.testExecuteGenericActionAppliesAndClearsPolicy" + ) + + XCTAssertTrue(isWebContentFilterPolicyActive()) + + executeGenericAction( + action: [ + "type": "clearWebContentFilterPolicy" + ], + placeholders: [:], + triggeredBy: "WebContentFilterPolicyTests.testExecuteGenericActionAppliesAndClearsPolicy" + ) + + XCTAssertFalse(isWebContentFilterPolicyActive()) + } +} diff --git a/apps/example/screens/AllTheThings.tsx b/apps/example/screens/AllTheThings.tsx index ab6fd20..d031d99 100644 --- a/apps/example/screens/AllTheThings.tsx +++ b/apps/example/screens/AllTheThings.tsx @@ -179,6 +179,8 @@ export function AllTheThings() { const [isShieldActive, setIsShieldActive] = useState(false); const [isShieldActiveWithSelection, setIsShieldActiveWithSelection] = useState(false); + const [isWebContentFilterPolicyActive, setIsWebContentFilterPolicyActive] = + useState(false); const refreshIsShieldActive = useCallback(() => { setIsShieldActive(ReactNativeDeviceActivity.isShieldActive()); @@ -200,6 +202,17 @@ export function AllTheThings() { } }, []); + const refreshWebContentFilterPolicyActive = useCallback(() => { + setIsWebContentFilterPolicyActive( + ReactNativeDeviceActivity.isWebContentFilterPolicyActive(), + ); + }, []); + + useEffect(() => { + refreshIsShieldActive(); + refreshWebContentFilterPolicyActive(); + }, [refreshIsShieldActive, refreshWebContentFilterPolicyActive]); + const [pickerVisible, setPickerVisible] = useState(false); return ( @@ -221,6 +234,10 @@ export function AllTheThings() { Shielding current selection: {isShieldActiveWithSelection ? "✅" : "❌"} + + Web content filter active: + {isWebContentFilterPolicyActive ? "✅" : "❌"} + + + { + try { + ReactNativeDeviceActivity.setWebContentFilterPolicy({ + type: "auto", + }); + refreshWebContentFilterPolicyActive(); + } catch (error) { + Alert.alert( + "Failed to set web filter", + error instanceof Error ? error.message : "Unknown error", + ); + } + }} + /> + { + try { + ReactNativeDeviceActivity.setWebContentFilterPolicy({ + type: "specific", + domains: ["example.com", "example.org"], + }); + refreshWebContentFilterPolicyActive(); + } catch (error) { + Alert.alert( + "Failed to set web filter", + error instanceof Error ? error.message : "Unknown error", + ); + } + }} + /> + { + try { + ReactNativeDeviceActivity.setWebContentFilterPolicy({ + type: "all", + exceptDomains: ["example.com"], + }); + refreshWebContentFilterPolicyActive(); + } catch (error) { + Alert.alert( + "Failed to set web filter", + error instanceof Error ? error.message : "Unknown error", + ); + } + }} + /> + { + ReactNativeDeviceActivity.clearWebContentFilterPolicy(); + refreshWebContentFilterPolicyActive(); + }} + /> [String]? { + guard let value = policyInput[key] else { + return nil + } + + guard let strings = value as? [String] else { + throw WebContentFilterPolicyError.invalidStringArray(fieldName: key) + } + + return strings +} + +func normalizedWebDomain( + from rawDomain: String, + fieldName: String +) throws -> String { + let trimmed = rawDomain.trimmingCharacters(in: .whitespacesAndNewlines) + if trimmed.isEmpty { + throw WebContentFilterPolicyError.emptyDomain(fieldName: fieldName) + } + + let lowercased = trimmed.lowercased() + let candidate = lowercased.contains("://") ? lowercased : "https://\(lowercased)" + + guard var normalizedDomain = URLComponents(string: candidate)?.host else { + throw WebContentFilterPolicyError.invalidDomain( + fieldName: fieldName, + value: rawDomain + ) + } + + normalizedDomain = normalizedDomain.trimmingCharacters(in: CharacterSet(charactersIn: ".")) + + if normalizedDomain.isEmpty { + throw WebContentFilterPolicyError.emptyDomain(fieldName: fieldName) + } + + if normalizedDomain.contains(" ") { + throw WebContentFilterPolicyError.invalidDomain( + fieldName: fieldName, + value: rawDomain + ) + } + + if normalizedDomain.contains("/") || normalizedDomain.contains("?") + || normalizedDomain.contains("#") { + throw WebContentFilterPolicyError.invalidDomain( + fieldName: fieldName, + value: rawDomain + ) + } + + // We intentionally don't enforce a TLD requirement here. Apple accepts domains + // as strings, and callers may choose internal/single-label hostnames. + return normalizedDomain +} + +@available(iOS 15.0, *) +func parseWebDomains( + rawDomains: [String], + fieldName: String +) throws -> Set { + var normalizedDomains = Set() + + for domain in rawDomains { + normalizedDomains.insert( + try normalizedWebDomain(from: domain, fieldName: fieldName) + ) + } + + // Apply limits after normalization/deduplication so repeated values don't + // count against Apple's 50-domain cap. + if normalizedDomains.count > WEB_CONTENT_FILTER_POLICY_MAX_DOMAINS { + throw WebContentFilterPolicyError.tooManyDomains( + fieldName: fieldName, + maxCount: WEB_CONTENT_FILTER_POLICY_MAX_DOMAINS + ) + } + + var parsedDomains = Set() + for normalizedDomain in normalizedDomains { + parsedDomains.insert(WebDomain(domain: normalizedDomain)) + } + + return parsedDomains +} + +@available(iOS 15.0, *) +func parseRequiredWebDomains( + policyInput: [String: Any], + key: String +) throws -> Set { + guard let rawDomains = try stringArrayFromPolicyInput(policyInput: policyInput, key: key), + !rawDomains.isEmpty + else { + throw WebContentFilterPolicyError.missingRequiredDomains(fieldName: key) + } + + return try parseWebDomains( + rawDomains: rawDomains, + fieldName: key + ) +} + +@available(iOS 15.0, *) +func sortedDomainStrings(domains: Set) -> [String] { + return domains.compactMap(\.domain).sorted() +} + +@available(iOS 15.0, *) +func parseWebContentFilterPolicyInput( + policyInput: [String: Any] +) throws -> ParsedWebContentFilterPolicy { + guard let type = policyInput["type"] as? String else { + throw WebContentFilterPolicyError.missingPolicyType + } + + if type == "none" { + return ParsedWebContentFilterPolicy( + type: type, + policy: .none, + domains: [], + exceptDomains: [] + ) + } + + if type == "auto" { + let rawDomains = try stringArrayFromPolicyInput(policyInput: policyInput, key: "domains") ?? [] + let rawExceptDomains = + try stringArrayFromPolicyInput(policyInput: policyInput, key: "exceptDomains") ?? [] + + let domains = try parseWebDomains( + rawDomains: rawDomains, + fieldName: "domains" + ) + let exceptDomains = try parseWebDomains( + rawDomains: rawExceptDomains, + fieldName: "exceptDomains" + ) + + return ParsedWebContentFilterPolicy( + type: type, + policy: .auto(domains, except: exceptDomains), + domains: sortedDomainStrings(domains: domains), + exceptDomains: sortedDomainStrings(domains: exceptDomains) + ) + } + + if type == "specific" { + let domains = try parseRequiredWebDomains( + policyInput: policyInput, + key: "domains" + ) + return ParsedWebContentFilterPolicy( + type: type, + policy: .specific(domains), + domains: sortedDomainStrings(domains: domains), + exceptDomains: [] + ) + } + + if type == "all" { + let rawExceptDomains = + try stringArrayFromPolicyInput(policyInput: policyInput, key: "exceptDomains") ?? [] + let exceptDomains = try parseWebDomains( + rawDomains: rawExceptDomains, + fieldName: "exceptDomains" + ) + return ParsedWebContentFilterPolicy( + type: type, + policy: .all(except: exceptDomains), + domains: [], + exceptDomains: sortedDomainStrings(domains: exceptDomains) + ) + } + + throw WebContentFilterPolicyError.invalidPolicyType(type) +} + +@available(iOS 15.0, *) +func setWebContentFilterPolicy( + policyInput: [String: Any], + triggeredBy: String +) throws { + let parsedPolicy = try parseWebContentFilterPolicyInput(policyInput: policyInput) + store.webContent.blockedByFilter = parsedPolicy.policy + clearWebContentFilterPolicyErrorMetadata() + + userDefaults?.set( + [ + "triggeredBy": triggeredBy, + "updatedAt": Date.now.ISO8601Format(), + "type": parsedPolicy.type, + "domains": parsedPolicy.domains, + "exceptDomains": parsedPolicy.exceptDomains + ], + forKey: WEB_CONTENT_FILTER_POLICY_LAST_UPDATE_KEY + ) +} + +@available(iOS 15.0, *) +func clearWebContentFilterPolicy( + triggeredBy: String +) { + store.webContent.blockedByFilter = nil + clearWebContentFilterPolicyErrorMetadata() + + userDefaults?.set( + [ + "triggeredBy": triggeredBy, + "updatedAt": Date.now.ISO8601Format(), + "type": "none", + "domains": [], + "exceptDomains": [] + ], + forKey: WEB_CONTENT_FILTER_POLICY_LAST_UPDATE_KEY + ) +} + +@available(iOS 15.0, *) +func isWebContentFilterPolicyActive() -> Bool { + // Intentionally read from the active ManagedSettingsStore instead of UserDefaults + // metadata. This reflects the currently applied policy in the running process. + guard let policy = store.webContent.blockedByFilter else { + return false + } + + if case .none = policy { + return false + } + + return true +} + @available(iOS 15.0, *) func getFamilyActivitySelectionIds() -> [FamilyActivitySelectionWithId] { if let familyActivitySelectionIds = userDefaults?.dictionary( diff --git a/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts b/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts index 5ae9bcf..da7edd3 100644 --- a/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts +++ b/packages/react-native-device-activity/src/ReactNativeDeviceActivity.types.ts @@ -234,6 +234,28 @@ type CommonTypeParams = { neverTriggerBefore?: Date; }; +export type WebContentFilterPolicyInput = + | { + type: "none"; + domains?: undefined; + exceptDomains?: undefined; + } + | { + type: "auto"; + domains?: string[]; + exceptDomains?: string[]; + } + | { + type: "specific"; + domains: string[]; + exceptDomains?: undefined; + } + | { + type: "all"; + domains?: undefined; + exceptDomains?: string[]; + }; + export type Action = | ({ type: "blockSelection"; @@ -303,6 +325,13 @@ export type Action = | ({ type: "removeAllDeliveredNotifications"; } & CommonTypeParams) + | ({ + type: "setWebContentFilterPolicy"; + policy: WebContentFilterPolicyInput; + } & CommonTypeParams) + | ({ + type: "clearWebContentFilterPolicy"; + } & CommonTypeParams) | ({ type: "startMonitoring"; activityName: string; @@ -483,6 +512,12 @@ export type ReactNativeDeviceActivityNativeModule = { ) => void; clearWhitelistAndUpdateBlock: (triggeredBy?: string) => void; clearWhitelist: () => void; + setWebContentFilterPolicy: ( + policy: WebContentFilterPolicyInput, + triggeredBy?: string, + ) => void; + clearWebContentFilterPolicy: (triggeredBy?: string) => void; + isWebContentFilterPolicyActive: () => boolean; // reset, reload things reloadDeviceActivityCenter: () => void; diff --git a/packages/react-native-device-activity/src/ReactNativeDeviceActivityModule.ts b/packages/react-native-device-activity/src/ReactNativeDeviceActivityModule.ts index 95f916c..33738da 100644 --- a/packages/react-native-device-activity/src/ReactNativeDeviceActivityModule.ts +++ b/packages/react-native-device-activity/src/ReactNativeDeviceActivityModule.ts @@ -77,6 +77,9 @@ const mockModule: ReactNativeDeviceActivityNativeModule | null = { clearWhitelistAndUpdateBlock: warnFn, convertToIncludeCategories: warnFnActivitySelectionWithMetadata, refreshManagedSettingsStore: warnFn, + clearWebContentFilterPolicy: warnFn, + setWebContentFilterPolicy: warnFn, + isWebContentFilterPolicyActive: warnFnBoolean, removeSelectionFromWhitelistAndUpdateBlock: warnFn, renameActivitySelection: warnFn, resetBlocks: warnFn, diff --git a/packages/react-native-device-activity/src/index.test.ts b/packages/react-native-device-activity/src/index.test.ts index b32e1b2..5b237fd 100644 --- a/packages/react-native-device-activity/src/index.test.ts +++ b/packages/react-native-device-activity/src/index.test.ts @@ -1,5 +1,3 @@ -// todo: skipping for now - describe("test", () => { test("Should export sheet picker views", () => { jest.isolateModules(() => { @@ -11,22 +9,80 @@ describe("test", () => { test("Should call stopMonitoring", () => { const mockStopMonitoring = jest.fn(); - jest.mock("./ReactNativeDeviceActivityModule", () => ({ - stopMonitoring: mockStopMonitoring, - })); - const { stopMonitoring } = require("./"); - stopMonitoring(); + + jest.isolateModules(() => { + jest.doMock("./ReactNativeDeviceActivityModule", () => ({ + stopMonitoring: mockStopMonitoring, + })); + const { stopMonitoring } = require("./"); + stopMonitoring(); + }); + expect(mockStopMonitoring).toHaveBeenCalled(); }); test("Should call startMonitoring", () => { - jest.resetAllMocks(); const mockStartMonitoring = jest.fn(); - jest.mock("./ReactNativeDeviceActivityModule", () => ({ - startMonitoring: mockStartMonitoring, - })); - const { startMonitoring } = require("./"); - startMonitoring("test", {}, []); + + jest.isolateModules(() => { + jest.doMock("./ReactNativeDeviceActivityModule", () => ({ + startMonitoring: mockStartMonitoring, + })); + const { startMonitoring } = require("./"); + startMonitoring("test", {}, []); + }); + expect(mockStartMonitoring).toHaveBeenCalled(); }); + + test("Should call setWebContentFilterPolicy", () => { + const mockSetWebContentFilterPolicy = jest.fn(); + const policy = { + type: "auto", + domains: ["adult.example.com"], + exceptDomains: ["safe.example.com"], + }; + + jest.isolateModules(() => { + jest.doMock("./ReactNativeDeviceActivityModule", () => ({ + setWebContentFilterPolicy: mockSetWebContentFilterPolicy, + })); + const { setWebContentFilterPolicy } = require("./"); + setWebContentFilterPolicy(policy, "test"); + }); + + expect(mockSetWebContentFilterPolicy).toHaveBeenCalledWith(policy, "test"); + }); + + test("Should call clearWebContentFilterPolicy", () => { + const mockClearWebContentFilterPolicy = jest.fn(); + + jest.isolateModules(() => { + jest.doMock("./ReactNativeDeviceActivityModule", () => ({ + clearWebContentFilterPolicy: mockClearWebContentFilterPolicy, + })); + const { clearWebContentFilterPolicy } = require("./"); + clearWebContentFilterPolicy("test"); + }); + + expect(mockClearWebContentFilterPolicy).toHaveBeenCalledWith("test"); + }); + + test("Should return native value for isWebContentFilterPolicyActive", () => { + jest.isolateModules(() => { + jest.doMock("./ReactNativeDeviceActivityModule", () => ({ + isWebContentFilterPolicyActive: () => true, + })); + const { isWebContentFilterPolicyActive } = require("./"); + expect(isWebContentFilterPolicyActive()).toBe(true); + }); + }); + + test("Should return false fallback for isWebContentFilterPolicyActive", () => { + jest.isolateModules(() => { + jest.doMock("./ReactNativeDeviceActivityModule", () => ({})); + const { isWebContentFilterPolicyActive } = require("./"); + expect(isWebContentFilterPolicyActive()).toBe(false); + }); + }); }); diff --git a/packages/react-native-device-activity/src/index.ts b/packages/react-native-device-activity/src/index.ts index 0e01eaa..0656b8d 100644 --- a/packages/react-native-device-activity/src/index.ts +++ b/packages/react-native-device-activity/src/index.ts @@ -32,6 +32,7 @@ import { ShieldActions, ShieldConfiguration, OnAuthorizationStatusChange, + WebContentFilterPolicyInput, } from "./ReactNativeDeviceActivity.types"; import ReactNativeDeviceActivityModule from "./ReactNativeDeviceActivityModule"; @@ -401,6 +402,12 @@ export function isShieldActive(): boolean { return ReactNativeDeviceActivityModule?.isShieldActive() ?? false; } +export function isWebContentFilterPolicyActive(): boolean { + return ( + ReactNativeDeviceActivityModule?.isWebContentFilterPolicyActive() ?? false + ); +} + export function moveFile( sourceUri: string, destinationUri: string, @@ -451,6 +458,26 @@ export function resetBlocks(triggeredBy?: string): void { return ReactNativeDeviceActivityModule?.resetBlocks(triggeredBy); } +export function setWebContentFilterPolicy( + policy: WebContentFilterPolicyInput, + triggeredBy?: string, +): void { + try { + return ReactNativeDeviceActivityModule?.setWebContentFilterPolicy( + policy, + triggeredBy, + ); + } catch (error) { + handleScreenTimeError(error); + } +} + +export function clearWebContentFilterPolicy(triggeredBy?: string): void { + return ReactNativeDeviceActivityModule?.clearWebContentFilterPolicy( + triggeredBy, + ); +} + export function unblockSelection( familyActivitySelection: ActivitySelectionInput, triggeredBy?: string, From d01e449d4be25b97e760771f913c4af358de7ef0 Mon Sep 17 00:00:00 2001 From: Ryan Iguchi Date: Tue, 17 Feb 2026 15:50:24 +0100 Subject: [PATCH 17/21] adding authorization for ios 15 (#89) * adding authorization for ios 15 * removing log --- apps/example/screens/SimpleTab.tsx | 68 +++++++++++-------- .../ios/ReactNativeDeviceActivityModule.swift | 19 ++++-- 2 files changed, 52 insertions(+), 35 deletions(-) diff --git a/apps/example/screens/SimpleTab.tsx b/apps/example/screens/SimpleTab.tsx index 82a5616..235bce4 100644 --- a/apps/example/screens/SimpleTab.tsx +++ b/apps/example/screens/SimpleTab.tsx @@ -37,28 +37,31 @@ export function SimpleTab() { const [activities, refreshActivities] = useActivities(); - const onPressRequestCallback = useCallback(async () => { - if (authorizationStatus === AuthorizationStatus.notDetermined) { - await requestAuthorization(); - } else if (authorizationStatus === AuthorizationStatus.denied) { - Alert.alert( - "You didn't grant access", - "Please go to settings and enable it", - [ - { - text: "Open settings", - onPress: () => Linking.openSettings(), - }, - { - text: "Cancel", - style: "cancel", - }, - ], - ); - } else { - await revokeAuthorization(); - } - }, [authorizationStatus]); + const onPressRequestCallback = useCallback( + async (forIndividualOrChild: "individual" | "child" = "individual") => { + if (authorizationStatus === AuthorizationStatus.notDetermined) { + await requestAuthorization(forIndividualOrChild); + } else if (authorizationStatus === AuthorizationStatus.denied) { + Alert.alert( + "You didn't grant access", + "Please go to settings and enable it", + [ + { + text: "Open settings", + onPress: () => Linking.openSettings(), + }, + { + text: "Cancel", + style: "cancel", + }, + ], + ); + } else { + await revokeAuthorization(); + } + }, + [authorizationStatus], + ); const [showCreateActivityPopup, setShowCreateActivityPopup] = useState(false); @@ -108,12 +111,21 @@ export function SimpleTab() { {authorizationStatusMap[authorizationStatus]} - - - {authorizationStatus === AuthorizationStatus.approved - ? "Revoke authorization" - : "Request authorization"} - + + onPressRequestCallback()} mode="contained"> + {authorizationStatus === AuthorizationStatus.approved + ? "Revoke authorization" + : "Request authorization"} + + onPressRequestCallback("child")} + mode="contained" + > + {authorizationStatus === AuthorizationStatus.approved + ? "Revoke child authorization" + : "Request child authorization"} + + {activities.map((activity) => ( diff --git a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift index e223bf9..8aee1f2 100644 --- a/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift +++ b/packages/react-native-device-activity/ios/ReactNativeDeviceActivityModule.swift @@ -570,13 +570,18 @@ public class ReactNativeDeviceActivityModule: Module { try await ac.requestAuthorization( for: forIndividualOrChild == "child" ? .child : .individual) } else { - let errorMessage = "iOS 16.0 or later is required to request authorization." - logger.log("⚠️ \(errorMessage)") - throw NSError( - domain: "FamilyControls", - code: 9999, - userInfo: [NSLocalizedDescriptionKey: errorMessage] - ) + // Deprecated iOS 15 API - uses completion handler + try await withCheckedThrowingContinuation { (continuation: CheckedContinuation) in + ac.requestAuthorization { result in + switch result { + case .success: + continuation.resume() + case .failure(let error): + logger.log("❌ Failed to request authorization: \(error.localizedDescription, privacy: .public)") + continuation.resume(throwing: error) + } + } + } } } From c97333b63a83058c1ab9ece515dd9a22e5704496 Mon Sep 17 00:00:00 2001 From: Ryan Iguchi Date: Tue, 17 Feb 2026 14:51:41 +0000 Subject: [PATCH 18/21] chore: update version --- packages/react-native-device-activity/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-device-activity/package.json b/packages/react-native-device-activity/package.json index 48b4090..e7e69a3 100644 --- a/packages/react-native-device-activity/package.json +++ b/packages/react-native-device-activity/package.json @@ -1,6 +1,6 @@ { "name": "react-native-device-activity", - "version": "0.5.3", + "version": "0.6.0", "description": "Provides access to Apples DeviceActivity API", "main": "build/index.js", "types": "build/index.d.ts", From f943fd715dadd55d3fe057bcbb959d19e2605da3 Mon Sep 17 00:00:00 2001 From: Copilot <198982749+Copilot@users.noreply.github.com> Date: Thu, 19 Feb 2026 02:25:33 +0100 Subject: [PATCH 19/21] Fix iconTint ignored in ShieldConfiguration (#91) * Initial plan * Fix iconTint not being applied to shield icon Co-authored-by: robertherber <1467411+robertherber@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: robertherber <1467411+robertherber@users.noreply.github.com> --- .../ShieldConfiguration/ShieldConfigurationExtension.swift | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-device-activity/targets/ShieldConfiguration/ShieldConfigurationExtension.swift b/packages/react-native-device-activity/targets/ShieldConfiguration/ShieldConfigurationExtension.swift index 48d628e..63fca8e 100644 --- a/packages/react-native-device-activity/targets/ShieldConfiguration/ShieldConfigurationExtension.swift +++ b/packages/react-native-device-activity/targets/ShieldConfiguration/ShieldConfigurationExtension.swift @@ -61,7 +61,7 @@ func resolveIcon(dict: [String: Any]) -> UIImage? { } if let iconTint = getColor(color: dict["iconTint"] as? [String: Double]) { - image?.withTintColor(iconTint) + image = image?.withTintColor(iconTint, renderingMode: .alwaysOriginal) } return image From 15656ae1de7c736f981b7c53174c165c2277901b Mon Sep 17 00:00:00 2001 From: Copilot <198982749+Copilot@users.noreply.github.com> Date: Thu, 19 Feb 2026 01:26:30 +0000 Subject: [PATCH 20/21] chore: update version --- packages/react-native-device-activity/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-native-device-activity/package.json b/packages/react-native-device-activity/package.json index e7e69a3..0d3fbb5 100644 --- a/packages/react-native-device-activity/package.json +++ b/packages/react-native-device-activity/package.json @@ -1,6 +1,6 @@ { "name": "react-native-device-activity", - "version": "0.6.0", + "version": "0.6.1", "description": "Provides access to Apples DeviceActivity API", "main": "build/index.js", "types": "build/index.d.ts", From ae6099656281cfde1bfada5cae500b14f944995f Mon Sep 17 00:00:00 2001 From: Copilot <198982749+Copilot@users.noreply.github.com> Date: Mon, 9 Mar 2026 17:30:37 +0100 Subject: [PATCH 21/21] docs: clarify Apple entitlement form must be submitted per bundle identifier (#93) * Initial plan * docs: clarify that Apple entitlement form must be filled out for each bundle identifier Co-authored-by: robertherber <1467411+robertherber@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: robertherber <1467411+robertherber@users.noreply.github.com> --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 2431a6d..fc29e12 100644 --- a/README.md +++ b/README.md @@ -185,6 +185,8 @@ For every base bundleIdentifier you need approval for 4 bundleIdentifiers (when - `com.your-bundleIdentifier.ShieldAction` - `com.your-bundleIdentifier.ShieldConfiguration` +⚠️ **You need to fill out the Apple request form once for each of these bundle identifiers** — that means filling out the form 4 separate times (one per bundle identifier listed above) if you are using all native extensions. + Once you've gotten approval you need to manually add the "Family Controls (Distribution)" under Additional Capabilities for each of the bundleIdentifiers on [developer.apple.com](https://developer.apple.com/account/resources/identifiers/list) mentioned above. If you use Expo/EAS this has to be done only once, and after that provisioning will be handled automatically. ⚠️ If you don't do all the above, you will run into a lot of strange provisioning errors.