cobrowse-sdk-react-native 2.10.1 → 2.11.2-unredaction.0

package/android/build.gradle

@@ -30,5 +30,5 @@ android {
 
 dependencies {
     implementation 'com.facebook.react:react-native:+' // support react-native-v0.22-rc+
-    implementation 'io.cobrowse:cobrowse-sdk-android:2.17.2'
+    implementation 'io.cobrowse:cobrowse-sdk-android:2.21.4'
 }

package/android/src/main/java/io/cobrowse/reactnative/CobrowseIOModule.java

@@ -9,56 +9,112 @@ import com.facebook.react.bridge.Promise;
 import com.facebook.react.bridge.ReactApplicationContext;
 import com.facebook.react.bridge.ReactContextBaseJavaModule;
 import com.facebook.react.bridge.ReactMethod;
+import com.facebook.react.bridge.ReadableArray;
 import com.facebook.react.bridge.ReadableMap;
 import com.facebook.react.modules.core.DeviceEventManagerModule;
+import com.facebook.react.uimanager.NativeViewHierarchyManager;
+import com.facebook.react.uimanager.UIBlock;
+import com.facebook.react.uimanager.UIManagerModule;
+import com.facebook.react.views.view.ReactViewGroup;
 
 import java.util.ArrayList;
 import java.util.HashMap;
+import java.util.HashSet;
 import java.util.List;
 import java.util.Map;
+import java.util.Set;
 
 import androidx.annotation.NonNull;
+import androidx.core.util.Predicate;
 import io.cobrowse.CobrowseIO;
 import io.cobrowse.Session;
 import io.cobrowse.CobrowseAccessibilityService;
 
 public class CobrowseIOModule extends ReactContextBaseJavaModule
   implements CobrowseIO.Delegate, CobrowseIO.SessionRequestDelegate,
-    CobrowseIO.RedactionDelegate, CobrowseIO.RemoteControlRequestDelegate {
+    CobrowseIO.SessionLoadDelegate, CobrowseIO.RedactionDelegate,
+    CobrowseIO.RemoteControlRequestDelegate {
 
+    private static final String SESSION_LOADED = "session.loaded";
     private static final String SESSION_UPDATED = "session.updated";
     private static final String SESSION_ENDED = "session.ended";
     private static final String SESSION_REQUESTED = "session.requested";
 
+    private final HashSet<Integer> unredactedTags = new HashSet<>();
+    private NativeViewHierarchyManager nodeManager;
+
     CobrowseIOModule(ReactApplicationContext reactContext) {
         super(reactContext);
         CobrowseIO.instance().setDelegate(this);
     }
 
+    private void findNodeManager() {
+        if (nodeManager != null) return;
+        final UIManagerModule uiManager = getReactApplicationContext().getNativeModule(UIManagerModule.class);
+        assert uiManager != null;
+        uiManager.prependUIBlock(new UIBlock() {
+            @Override
+            public void execute(NativeViewHierarchyManager nativeViewHierarchyManager) {
+                nodeManager = nativeViewHierarchyManager;
+            }
+        });
+    }
+
     @NonNull
     public String getName() {
         return "CobrowseIO";
     }
 
+    @Override
+    public void sessionDidLoad(@NonNull Session session) {
+        getReactApplicationContext()
+                .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
+                .emit(SESSION_LOADED, Conversion.convert(session));
+    }
+
     @Override
     public void sessionDidUpdate(@NonNull Session session) {
         getReactApplicationContext()
                 .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
-                .emit(SESSION_UPDATED, Utility.convert(session));
+                .emit(SESSION_UPDATED, Conversion.convert(session));
     }
 
     @Override
     public void sessionDidEnd(@NonNull Session session) {
         getReactApplicationContext()
                 .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
-                .emit(SESSION_ENDED, Utility.convert(session));
+                .emit(SESSION_ENDED, Conversion.convert(session));
     }
 
     @Override
     public void handleSessionRequest(@NonNull Activity activity, @NonNull Session session) {
         getReactApplicationContext()
                 .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)
-                .emit(SESSION_REQUESTED, Utility.convert(session));
+                .emit(SESSION_REQUESTED, Conversion.convert(session));
+    }
+
+    @ReactMethod
+    public void setUnredactedTags(final ReadableArray reactTags, final Promise promise) {
+        synchronized (unredactedTags) {
+            unredactedTags.clear();
+            for (int i = 0; i < reactTags.size(); i++)
+                unredactedTags.add(reactTags.getInt(i));
+            promise.resolve(null);
+        }
+    }
+
+    private Set<View> unredactedViews() {
+        synchronized (unredactedTags) {
+            HashSet<View> unredacted = new HashSet<>();
+            for (Integer i : unredactedTags) {
+                try {
+                   unredacted.add(nodeManager.resolveView(i));
+                } catch (Exception e) {
+                   Log.i("CobrowseIO", "Failed to find unredacted view for tag " + i + ", error = " + e.getMessage());
+                }
+            }
+            return unredacted;
+        }
     }
 
     @Override
@@ -69,11 +125,61 @@ public class CobrowseIOModule extends ReactContextBaseJavaModule
 
     @Override
     public List<View> redactedViews(@NonNull final Activity activity) {
-        return new ArrayList<>(RedactedViewManager.redactedViews.keySet());
+        HashSet<View> redacted = new HashSet<>();
+        Set<View> unredacted = unredactedViews();
+        // By default everything is redacted for Activities that contain
+        // a ReactRootView.
+        Set<View> rootViews = TreeUtils.findAllClosest(
+          activity.getWindow().getDecorView().getRootView(),
+          new Predicate<View>() {
+            @Override
+            public boolean test(View view) {
+              return TreeUtils.isReactView(view);
+            }
+          });
+        for (View root : rootViews) redacted.addAll(TreeUtils.directChildren(root));
+
+        // Now we can actually start working out what should be unredacted
+        // First work out the set of all parents of unredact()'ed nodes
+        // Ignores nested unredacted nodes
+        HashSet<View> unredactedParents = new HashSet<>();
+        for (View v : unredacted) {
+            if (!TreeUtils.hasAnyParent(v, unredacted))
+              unredactedParents.addAll(TreeUtils.reactParents(v));
+        }
+
+        // Then work out the set of all direct children of any unredacted parents
+        // This should give us the set including unredacted nodes, their siblings,
+        // and all their parents.
+        for (View parent : unredactedParents) redacted.addAll(TreeUtils.directChildren(parent));
+
+        // Then we can subtract the set of unredacted parents to find just the
+        // set of unredacted nodes that are leaves of the parent subtree
+        redacted.removeAll(unredactedParents);
+
+        // Finally we can subtract the set of unredacted views to get the minimal
+        // set of redactions that will redact everything that's not explicitly unredacted
+        // whilst allowing the unredacted views to be visible
+        redacted.removeAll(unredacted);
+
+        // Remove any empty ReactViewGroup from the redacted set, they're often used for wrapping
+        // or sizing other elements, and do not usually need to be redacted
+        // If it's absolutely necessary they are redacted, they can always be replaced with
+        // a <Redacted> tag instead
+        for (View v : new HashSet<>(redacted))
+            if (v instanceof ReactViewGroup && ((ReactViewGroup) v).getChildCount() == 0)
+                redacted.remove(v);
+
+        // Any explicitly redacted views surrounded by <Redacted> tags take precedence, so
+        // re-add any tagged as such that the process above might have removed
+        redacted.addAll(RedactedViewManager.redactedViews.keySet());
+
+        return new ArrayList<>(redacted);
     }
 
     @ReactMethod
     public void start() {
+        findNodeManager();
         final Activity activity = getReactApplicationContext().getCurrentActivity();
         if (activity != null)
             activity.runOnUiThread(new Runnable() {
@@ -116,7 +222,7 @@ public class CobrowseIOModule extends ReactContextBaseJavaModule
 
     @ReactMethod
     public void currentSession(final Promise promise) {
-        promise.resolve(Utility.convert(CobrowseIO.instance().currentSession()));
+        promise.resolve(Conversion.convert(CobrowseIO.instance().currentSession()));
     }
 
     @ReactMethod
@@ -128,7 +234,7 @@ public class CobrowseIOModule extends ReactContextBaseJavaModule
                     @Override
                     public void call(Error error, Session session) {
                         if (error != null) promise.reject("cbio_create_session_failed", error);
-                        else promise.resolve(Utility.convert(session));
+                        else promise.resolve(Conversion.convert(session));
                     }
                 });
             }
@@ -144,7 +250,7 @@ public class CobrowseIOModule extends ReactContextBaseJavaModule
                     @Override
                     public void call(Error error, Session session) {
                         if (error != null) promise.reject("cbio_get_session_failed", error);
-                        else promise.resolve(Utility.convert(session));
+                        else promise.resolve(Conversion.convert(session));
                     }
                 });
             }
@@ -165,7 +271,7 @@ public class CobrowseIOModule extends ReactContextBaseJavaModule
                     @Override
                     public void call(Error error, Session session) {
                         if (error != null) promise.reject("cbio_activate_session_failed", error);
-                        else promise.resolve(Utility.convert(session));
+                        else promise.resolve(Conversion.convert(session));
                     }
                 });
             }
@@ -222,7 +328,7 @@ public class CobrowseIOModule extends ReactContextBaseJavaModule
                 if (options.hasKey("remote_control")) {
                     String remoteControl = options.getString("remote_control");
 
-                    current.setRemoteControl(Utility.remoteControl(remoteControl), new io.cobrowse.Callback<Error, Session>() {
+                    current.setRemoteControl(Conversion.remoteControl(remoteControl), new io.cobrowse.Callback<Error, Session>() {
                         @Override
                         public void call(Error error, Session session) {
                             if (error != null) promise.reject("cbio_remote_control_failed", error);

package/android/src/main/java/io/cobrowse/reactnative/{Utility.java → Conversion.java}

@@ -7,7 +7,7 @@ import io.cobrowse.Agent;
 import io.cobrowse.Session;
 import io.cobrowse.Session.RemoteControlState;
 
-final class Utility {
+final class Conversion {
 
     static WritableMap convert(Session session) {
         WritableMap map = Arguments.createMap();
@@ -16,7 +16,7 @@ final class Utility {
         map.putString("state", session.state());
         map.putString("id", session.id());
         map.putBoolean("full_device", session.fullDevice());
-        map.putString("remote_control", Utility.remoteControl(session.remoteControl()));
+        map.putString("remote_control", Conversion.remoteControl(session.remoteControl()));
 
         Agent agent = session.agent();
         if (agent != null) {

package/android/src/main/java/io/cobrowse/reactnative/TreeUtils.java

@@ -0,0 +1,69 @@
+package io.cobrowse.reactnative;
+
+import android.view.View;
+import android.view.ViewGroup;
+import android.view.ViewParent;
+
+import com.facebook.react.ReactRootView;
+import com.facebook.react.views.view.ReactViewGroup;
+
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.HashSet;
+import java.util.List;
+import java.util.Set;
+
+import androidx.core.util.Predicate;
+
+class TreeUtils {
+
+    public static Set<View> directChildren(View root) {
+        HashSet<View> children = new HashSet<>();
+        if (root instanceof ViewGroup) {
+            ViewGroup viewGroup = (ViewGroup) root;
+            for (int i = 0; i < viewGroup.getChildCount(); i++) {
+                children.add(viewGroup.getChildAt(i));
+            }
+        }
+        return children;
+    }
+
+    public static List<View> allParents(View root) {
+        ArrayList<View> parents = new ArrayList<>();
+        ViewParent target = root.getParent();
+        while (target != null) {
+            if (target instanceof View) parents.add(0, (View) target);
+            target = target.getParent();
+        }
+        return parents;
+    }
+
+    public static List<View> reactParents(View root) {
+      List<View> parents = allParents(root);
+      ArrayList<View> reactParents = new ArrayList<>(parents);
+      for (View v : parents) {
+        if (isReactView(v)) break;
+        reactParents.remove(v);
+      }
+      return reactParents;
+    }
+
+    public static Set<View> findAllClosest(View root, Predicate<View> predicate) {
+        HashSet<View> found = new HashSet<>();
+        if (predicate.test(root)) found.add(root);
+        else {
+            for (View v : directChildren(root)) {
+               found.addAll(findAllClosest(v, predicate));
+           }
+       }
+       return found;
+    }
+
+    public static boolean isReactView(View view) {
+      return view instanceof ReactRootView || view instanceof ReactViewGroup;
+    }
+
+    public static boolean hasAnyParent(View node, Set<View> matches) {
+      return !Collections.disjoint(TreeUtils.allParents(node), matches);
+    }
+}

package/cobrowse-sdk-react-native.podspec

@@ -11,8 +11,7 @@ Pod::Spec.new do |s|
   s.homepage      = package["homepage"]
   s.source        = { :git => 'https://github.com/cobrowseio/cobrowse-sdk-react-native.git' }
   s.platform      = :ios, '9.0'
-
-  s.dependency      'CobrowseIO/Framework', '2.16.4'
+  s.dependency      'CobrowseIO/XCFramework', '2.19.0'
   s.dependency      'React'
   s.source_files =  'ios/*.{h,m}'
 end

package/ios/RCTCBIOTreeUtils.h

@@ -0,0 +1,15 @@
+#import <Foundation/Foundation.h>
+
+@interface RCTCBIOTreeUtils : NSObject
+
++(NSArray*) allParents: (UIView*) root;
+
++(NSArray*) reactParents: (UIView*) root;
+
++(NSMutableSet*) findAllClosest: (BOOL (^)(UIView* view))predicate under: (UIView*) root;
+
++(bool) isReactView: (UIView*) view;
+
++(bool) hasAnyParent: (UIView*) view matches: (NSSet*) matches;
+
+@end

package/ios/RCTCBIOTreeUtils.m

@@ -0,0 +1,47 @@
+#import "RCTCBIOTreeUtils.h"
+#import <React/RCTRootView.h>
+#import <React/RCTView.h>
+
+@implementation RCTCBIOTreeUtils
+
++(NSArray*) allParents: (UIView*) root {
+    NSMutableArray* parents = [NSMutableArray array];
+    UIView* target = root.superview;
+    while (target) {
+        [parents insertObject:target atIndex:0];
+        target = target.superview;
+    }
+    return parents;
+}
+
++(NSArray*) reactParents: (UIView*) root {
+    NSArray* allParents = [self allParents: root];
+    NSMutableArray* reactParents = [allParents mutableCopy];
+    for (id view in allParents) {
+        if ([self isReactView:view]) break;
+        [reactParents removeObject: view];
+    }
+    return reactParents;
+}
+
++(NSMutableSet*) findAllClosest: (BOOL (^)(UIView* view))predicate under: (UIView*) root {
+    NSMutableSet* found = [NSMutableSet set];
+    if (predicate(root)) [found addObject:root];
+    else {
+        for (UIView* child in root.subviews) {
+            [found addObjectsFromArray: [self findAllClosest:predicate under:child].allObjects];
+        }
+    }
+    return found;
+}
+
++(bool) isReactView: (UIView*) view {
+    return [view isKindOfClass:RCTRootView.class] || [view isKindOfClass: RCTView.class];
+}
+
++(bool) hasAnyParent: (UIView*) view matches: (NSSet*) matches {
+    NSSet* parents = [NSSet setWithArray: [self allParents:view]];
+    return [parents intersectsSet: matches];
+}
+
+@end

package/ios/RCTCobrowseIO.m

@@ -5,8 +5,11 @@
 #import <React/RCTUtils.h>
 #import <React/RCTView.h>
 #import <React/RCTBridge.h>
+#import <React/RCTUIManager.h>
 #import "RCTCobrowseIO.h"
+#import "RCTCBIOTreeUtils.h"
 
+#define SESSION_LOADED "session.loaded"
 #define SESSION_UPDATED "session.updated"
 #define SESSION_ENDED "session.ended"
 #define SESSION_REQUESTED "session.requested"
@@ -15,6 +18,7 @@
 
 @implementation RCTCobrowseIO {
     bool hasListeners;
+    NSMutableSet* unredactedTags;
 }
 
 RCT_EXPORT_MODULE();
@@ -23,6 +27,7 @@ RCT_EXPORT_MODULE();
     self = [super init];
     if (self) {
         [CobrowseIO.instance setDelegate:self];
+        unredactedTags = [NSMutableSet set];
     }
     return self;
 }
@@ -44,7 +49,22 @@ RCT_EXPORT_MODULE();
 }
 
 -(NSArray<NSString *> *)supportedEvents {
-    return @[@SESSION_UPDATED, @SESSION_ENDED, @SESSION_REQUESTED];
+    return @[@SESSION_LOADED, @SESSION_UPDATED, @SESSION_ENDED, @SESSION_REQUESTED];
+}
+
+-(void)cobrowseSessionDidLoad:(CBIOSession *)session {
+    if (hasListeners) [self sendEventWithName:@SESSION_LOADED body:[session toDict]];
+}
+
+-(NSSet<UIView*>*) unredactedViews {
+    NSMutableSet* views = [NSMutableSet set];
+    @synchronized(unredactedTags) {
+        for (id tag in unredactedTags) {
+            UIView* v = [self.bridge.uiManager viewForReactTag: tag];
+            if (v != nil) [views addObject:v];
+        }
+    }
+    return views;
 }
 
 -(void)cobrowseSessionDidUpdate:(CBIOSession *)session {
@@ -65,11 +85,59 @@ RCT_EXPORT_MODULE();
 }
 
 -(NSArray<UIView *> *)cobrowseRedactedViewsForViewController:(UIViewController *)vc {
-    NSMutableArray* views = [NSMutableArray array];
-    for (UIView* v in CBIOCobrowseRedactedManager.redactedViews.allObjects) {
-        if ([v isDescendantOfView:vc.view]) [views addObject:v];
+    NSMutableSet* redacted = [NSMutableSet set];
+    NSSet* unredacted = self.unredactedViews;
+
+    // By default everything managed by react is redacted for view controllers
+    // that contain react views. If we were to always redact vc.view this would lead
+    // to instances where windows that do not contain a RN context could
+    // not be unredacted.
+    // A simple example of this is the overlay window that cobrowse adds to
+    // render its annotations. This window sits on top of all the other windows
+    // and would always be redacted, effecivley redacting the entire screen all
+    // the time.
+    // To get around this, we only redact views below RCTViews or RCTRootViews
+    // (not inclusive), as then it's always possible to add an unredact()'ed component
+    // around a subview in the react tree to make parent visible.
+    NSSet* rootViews = [RCTCBIOTreeUtils findAllClosest:^BOOL(UIView *view) {
+        return [RCTCBIOTreeUtils isReactView: view];
+    } under: vc.view];
+    for (UIView* v in rootViews) [redacted addObjectsFromArray: v.subviews];
+
+    // Now we can actually start working out what should be unredacted
+    // First work out the set of all parents of unredact()'ed nodes
+    // that are inside a react view (ignoring any nested unredaction)
+    NSMutableSet* unredactedParents = [NSMutableSet set];
+    for (id view in unredacted) {
+        if (![RCTCBIOTreeUtils hasAnyParent:view matches:unredacted])
+            [unredactedParents addObjectsFromArray: [RCTCBIOTreeUtils reactParents: view]];
     }
-    return views;
+    // Then work out the set of all direct children of any unredacted parents
+    // This should give us the set including unredacted nodes, their siblings,
+    // and all their parents.
+    for (UIView* parent in unredactedParents) [redacted addObjectsFromArray: parent.subviews];
+
+    // Then we can subtract the set of unredacted parents to find just the
+    // set of unredacted nodes that are leaves of the parent subtree
+    for (id v in unredactedParents) [redacted removeObject:v];
+
+    // Finally we can subtract the set of unredacted views to get the minimal
+    // set of redactions that will redact everything that's not explicitly unredacted
+    // whilst allowing the unredacted views to be visible
+    for (UIView* v in unredacted) [redacted removeObject:v];
+
+    // Remove any empty RCTViews from the redacted set, they're often used for wrapping
+    // or sizing other elements, and do not usually need to be redacted
+    // If it's absolutely necessary they are redacted, they can always be replaced with
+    // a <Redacted> tag instead
+    for (UIView* v in [redacted copy])
+        if ([v isKindOfClass:RCTView.class] && v.subviews.count == 0) [redacted removeObject: v];
+
+    // Any explicitly redacted views surroudned by <Redacted> tags take precedence, so
+    // re-add any tagged as such that the process above might have removed
+    for (id v in CBIOCobrowseRedactedManager.redactedViews.allObjects) [redacted addObject: v];
+
+    return redacted.allObjects;;
 }
 
 - (bool) cobrowseShouldCaptureWindow:(UIWindow *)window {
@@ -80,6 +148,14 @@ RCT_EXPORT_MODULE();
     }
 }
 
+-(void) forceRedactionUpdate {
+    // TODO: expose an API for forcing redaction updates?
+    static UIView* v;
+    if (!v) v = [[UIView alloc] init];
+    [UIApplication.sharedApplication.keyWindow addSubview: v];
+    [v removeFromSuperview];
+}
+
 RCT_EXPORT_METHOD(start) {
     [CobrowseIO.instance start];
 }
@@ -101,6 +177,18 @@ RCT_EXPORT_METHOD(api: (NSString*) api) {
     CobrowseIO.instance.api = api;
 }
 
+RCT_REMAP_METHOD(setUnredactedTags,
+                 setUnredactedTags: (NSArray*) reactTags
+                 resolver:(RCTPromiseResolveBlock)resolve
+                 rejecter:(RCTPromiseRejectBlock)reject) {
+    @synchronized(unredactedTags) {
+        [unredactedTags removeAllObjects];
+        [unredactedTags addObjectsFromArray:reactTags];
+    }
+    [self forceRedactionUpdate];
+    resolve(nil);
+}
+
 RCT_EXPORT_METHOD(customData: (NSDictionary*) customData) {
     CobrowseIO.instance.customData = customData;
 }

package/js/Redacted.js

@@ -1,19 +1,7 @@
-import React, { useContext } from 'react'
-import { View, requireNativeComponent } from 'react-native'
+import React from 'react'
+import { requireNativeComponent } from 'react-native'
 const CBIOCobrowseRedacted = requireNativeComponent('CBIOCobrowseRedacted')
 
-const RedactionContext = React.createContext(false)
-
-export default function (props) {
-  const alreadyRedacted = useContext(RedactionContext)
-  if (!alreadyRedacted) {
-    return (
-      <RedactionContext.Provider value>
-        <CBIOCobrowseRedacted style={props.style}>
-          <View>{props.children}</View>
-        </CBIOCobrowseRedacted>
-      </RedactionContext.Provider>
-    )
-  }
-  return props.children
+module.exports = function (props) {
+  return <CBIOCobrowseRedacted {...props}>{props.children}</CBIOCobrowseRedacted>
 }

package/js/Unredacted.js

@@ -0,0 +1,82 @@
+import React, { useRef, useEffect, useCallback, useMemo } from 'react'
+import { View, findNodeHandle } from 'react-native'
+import { throttle } from 'lodash'
+const CobrowseIONative = require('react-native').NativeModules.CobrowseIO
+
+function mergeRefs (refs) {
+  return (value) => {
+    refs.forEach((ref) => {
+      if (typeof ref === 'function') {
+        ref(value)
+      } else if (ref != null) {
+        ref.current = value
+      }
+    })
+  }
+}
+
+const unredactedTags = new Set()
+const sendUnredactionUpdates = throttle(() => {
+  CobrowseIONative.setUnredactedTags([...unredactedTags])
+}, 50, { leading: false })
+
+const removeUnredactedView = (view) => {
+  if (view) {
+    unredactedTags.delete(view)
+    sendUnredactionUpdates()
+  }
+}
+
+export const useUnredaction = (shouldWarnUnhandledRefs = true, componentName = '') => {
+  const ref = useRef(null)
+
+  const setRef = useCallback((node) => {
+    let hasRemovedRef = false
+    if (ref.current) {
+      hasRemovedRef = true
+      removeUnredactedView(ref.current)
+    }
+
+    if (node) {
+      const view = findNodeHandle(node)
+
+      if (view) {
+        unredactedTags.add(view)
+        sendUnredactionUpdates()
+
+        ref.current = view
+      } else {
+        console.warn(`Failed to apply unredact() to ${componentName} due to view not found`)
+      }
+    } else if (!hasRemovedRef) {
+      console.warn(
+        `Failed to apply unredact() to ${componentName} due to null node handle – make sure you are forwarding refs`
+      )
+    }
+  }, [])
+
+  useEffect(() => {
+    if (shouldWarnUnhandledRefs && !ref.current) {
+      console.warn(
+        `Failed to apply unredact() to ${componentName} due to null node handle – make sure the setRef function is called with the ref`
+      )
+    }
+
+    return () => removeUnredactedView(ref.current)
+  }, [])
+
+  return setRef
+}
+
+// HOC for adding unredaction to a whole component class
+export function unredact(Component) {
+  return React.forwardRef(function Redacted(props, ref) {
+    const localRef = useUnredaction(true, Component?.name)
+    const refs = useMemo(() => mergeRefs([localRef, ref]), [localRef, ref])
+    return <Component {...props} collapsable={false} ref={refs} />
+  })
+}
+
+// also expose a basic Component based on a View
+const Unredacted = unredact(View)
+export default Unredacted

package/js/index.js

@@ -1,5 +1,6 @@
 export { default } from './CobrowseIO'
 export { default as CobrowseView } from './CobrowseView'
 export { default as Redacted } from './Redacted'
+export { default as Unredacted, unredact, useUnredaction } from './Unredacted'
 export { default as SessionControl } from './SessionControl'
 export { default as CobrowseAccessibilityService } from './CobrowseAccessibilityService'

package/package.json

@@ -1,12 +1,11 @@
 {
   "name": "cobrowse-sdk-react-native",
-  "version": "2.10.1",
+  "version": "2.11.2-unredaction.0",
   "description": "Cobrowse SDK for React Native",
   "main": "js/index.js",
   "types": "ts/index.d.ts",
   "scripts": {
     "lint-fix": "ts-standard ts/*.d.ts --fix",
-    "watch": "node scripts/watch.mjs",
     "start:dev": "nodemon --exec ./scripts/copy.sh"
   },
   "author": {
@@ -31,14 +30,14 @@
     "@types/react": "^17.0.38",
     "@types/react-native": "^0.66.15"
   },
-  "dependencies": {},
+  "dependencies": {
+    "lodash": "^4.17.21"
+  },
   "devDependencies": {
     "@types/react": "^17.0.38",
     "@types/react-native": "^0.66.15",
-    "managed-service-daemon": "^1.2.1",
     "nodemon": "^2.0.15",
     "ts-standard": "^11.0.0",
-    "typescript": "^4.5.5",
-    "watchr": "^6.11.0"
+    "typescript": "^4.5.5"
   }
 }

package/ts/Redacted.d.ts

@@ -1,7 +1,8 @@
-import type { Provider, ReactNode } from 'react'
+import type { ReactNode, ReactElement } from 'react'
 
-type Props = Readonly<{}> & Readonly<{
-  children?: ReactNode
-}>
+type Props = Readonly<{}> &
+  Readonly<{
+    children?: ReactNode | undefined
+  }>
 
-export default function (props: Props): Provider<boolean>
+export default function (props: Props): ReactElement | null

package/ts/Unredacted.d.ts

@@ -0,0 +1,15 @@
+import React, { ReactElement, ForwardRefRenderFunction } from 'react'
+import { View, ScrollView, Text, Image, FlatList, SectionList } from 'react-native'
+
+export function useUnredaction<
+  T = View | ScrollView | Text | Image | FlatList | SectionList
+>(shouldWarnUnhandledRefs?: boolean , componentName?: string): (elem: T) => void
+
+type ForwardedRefType<T, P> = typeof React.forwardRef
+
+// HOC for adding unredaction to a whole component class
+export function unredact(Component: ReactElement): ForwardedRefType<View, Record<string, unknown>>
+
+// also expose a basic Component based on a View
+declare const Unredacted: ForwardRefRenderFunction<View, Record<string, unknown>>
+export default Unredacted

package/ts/index.d.ts

@@ -2,4 +2,5 @@ export { default } from './CobrowseIO'
 export { default as CobrowseView } from './CobrowseView'
 export { default as Redacted } from './Redacted'
 export { default as SessionControl } from './SessionControl'
+export { default as Unredacted, unredact, useUnredaction } from './Unredacted'
 export { default as CobrowseAccessibilityService } from './CobrowseAccessibilityService'

package/ios/RCTCobrowseIO.xcodeproj/project.xcworkspace/contents.xcworkspacedata

@@ -1,7 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<Workspace
-   version = "1.0">
-   <FileRef
-      location = "self:">
-   </FileRef>
-</Workspace>

package/ios/RCTCobrowseIO.xcodeproj/project.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
-<plist version="1.0">
-<dict>
-	<key>IDEDidComputeMac32BitWarning</key>
-	<true/>
-</dict>
-</plist>