cobrowse-sdk-react-native 2.14.0 → 2.16.0

package/lib/typescript/useSession.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSession.d.ts","sourceRoot":"","sources":["../../js/useSession.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,OAAO,MAAM,WAAW,CAAA;AAEpC,wBAAgB,UAAU,IAAK,OAAO,GAAG,IAAI,CA6B5C"}

package/package.json

@@ -1,13 +1,16 @@
 {
   "name": "cobrowse-sdk-react-native",
-  "version": "2.14.0",
+  "version": "2.16.0",
   "description": "Cobrowse SDK for React Native",
-  "main": "js/index.js",
-  "types": "ts/index.d.ts",
+  "main": "lib/module/index",
+  "module": "lib/module/index",
+  "types": "lib/typescript/index.d.ts",
+  "react-native": "js/index",
   "scripts": {
-    "lint": "ts-standard ts/*.d.ts",
-    "lint:fix": "ts-standard ts/*.d.ts --fix",
-    "start:dev": "nodemon --exec ./scripts/copy.sh"
+    "lint": "ts-standard",
+    "lint:fix": "npm run lint -- --fix",
+    "start:dev": "nodemon --exec ./scripts/copy.sh",
+    "prepack": "bob build"
   },
   "author": {
     "name": "Andy Pritchard"
@@ -35,10 +38,35 @@
     "lodash": "^4.17.21"
   },
   "devDependencies": {
+    "@types/lodash": "^4.14.194",
     "@types/react": "^18.0.24",
     "@types/react-native": "^0.70.6",
     "nodemon": "^2.0.20",
-    "ts-standard": "^12.0.1",
+    "react-native-builder-bob": "^0.20.4",
+    "ts-standard": "^12.0.2",
     "typescript": "^4.8.4"
+  },
+  "ts-standard": {
+    "project": "tsconfig.eslint.json",
+    "env": [
+      "jest"
+    ],
+    "ignore": [
+      "lib"
+    ]
+  },
+  "react-native-builder-bob": {
+    "source": "js",
+    "output": "lib",
+    "targets": [
+      "commonjs",
+      "module",
+      [
+        "typescript",
+        {
+          "project": "tsconfig.build.json"
+        }
+      ]
+    ]
   }
 }

package/tsconfig.build.json

@@ -0,0 +1,5 @@
+
+{
+  "extends": "./tsconfig",
+  "exclude": ["Example"]
+}

package/tsconfig.json

@@ -0,0 +1,28 @@
+{
+  "compilerOptions": {
+    "baseUrl": "./*",
+    "paths": {
+      "cobrowse-sdk-react-native": ["./js/index"]
+    },
+    "allowUnreachableCode": false,
+    "allowUnusedLabels": false,
+    "esModuleInterop": true,
+    "importsNotUsedAsValues": "error",
+    "forceConsistentCasingInFileNames": true,
+    "jsx": "react",
+    "lib": ["esnext"],
+    "module": "esnext",
+    "moduleResolution": "node",
+    "noFallthroughCasesInSwitch": true,
+    "noImplicitReturns": true,
+    "noImplicitUseStrict": false,
+    "noStrictGenericChecks": false,
+    "noUncheckedIndexedAccess": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "resolveJsonModule": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "target": "esnext"
+  }
+}

package/js/CBIOBroadcastPickerView.js

@@ -1,11 +0,0 @@
-import React from 'react'
-import { Platform, requireNativeComponent } from 'react-native'
-
-const CBIOBroadcastPickerView = requireNativeComponent(
-  'CBIOBroadcastPickerView'
-)
-
-export default function (props) {
-  // this native component is only available on iOS
-  return Platform.OS === 'ios' ? <CBIOBroadcastPickerView {...props} /> : null
-}

package/js/CobrowseAccessibilityService.js

@@ -1,11 +0,0 @@
-const CobrowseIONative = require('react-native').NativeModules.CobrowseIO
-
-export default class CobrowseAccessibilityService {
-  static showSetup () {
-    return CobrowseIONative.accessibilityServiceShowSetup()
-  }
-
-  static isRunning () {
-    return CobrowseIONative.accessibilityServiceIsRunning()
-  }
-}

package/js/CobrowseIO.js

@@ -1,141 +0,0 @@
-import { Platform, Alert } from 'react-native'
-import Session from './Session'
-const CobrowseIONative = require('react-native').NativeModules.CobrowseIO
-const NativeEventEmitter = require('react-native').NativeEventEmitter
-
-const emitter = new NativeEventEmitter(CobrowseIONative)
-
-export default class CobrowseIO {
-  /** @deprecated */
-  static get SESSION_UPDATED () {
-    return 'session.updated'
-  }
-
-  /** @deprecated */
-  static get SESSION_ENDED () {
-    return 'session.ended'
-  }
-
-  static handleSessionRequest (session) {
-    if (this._sessionRequestShown) return
-    this._sessionRequestShown = true
-    Alert.alert(
-      'Support Request',
-      'A support agent would like to use this app with you. Do you accept?',
-      [{
-        text: 'Reject',
-        onPress: () => {
-          this._sessionRequestShown = false
-          session.end()
-        },
-        style: 'cancel'
-      }, {
-        text: 'Accept',
-        onPress: () => {
-          this._sessionRequestShown = false
-          session.activate()
-        }
-      }], { cancelable: false })
-  }
-
-  static handleRemoteControlRequest (session) {
-    if (this._remoteControlRequestShown) return
-    this._remoteControlRequestShown = true
-    Alert.alert(
-      'Remote Control Request',
-      'A support agent would like to take remote control of this app. Do you accept?',
-      [{
-        text: 'Reject',
-        onPress: () => {
-          this._remoteControlRequestShown = false
-          session.setRemoteControl('rejected')
-        },
-        style: 'cancel'
-      }, {
-        text: 'Accept',
-        onPress: () => {
-          this._remoteControlRequestShown = false
-          session.setRemoteControl('on')
-        }
-      }], { cancelable: false })
-  }
-
-  static addListener (event, cb) {
-    return emitter.addListener(event, (session) => cb(new Session(session)))
-  }
-
-  static start () {
-    return CobrowseIONative.start()
-  }
-
-  static stop () {
-    return CobrowseIONative.stop()
-  }
-
-  static set api (api) {
-    CobrowseIONative.api(api)
-  }
-
-  static set license (license) {
-    CobrowseIONative.license(license)
-  }
-
-  static set customData (customData) {
-    CobrowseIONative.customData(customData)
-  }
-
-  static set deviceToken (token) {
-    CobrowseIONative.deviceToken(token)
-  }
-
-  static currentSession () {
-    return CobrowseIONative.currentSession().then((session) => session ? new Session(session) : null)
-  }
-
-  static createSession () {
-    return CobrowseIONative.createSession().then((session) => session ? new Session(session) : null)
-  }
-
-  static getSession (codeOrId) {
-    return CobrowseIONative.getSession(codeOrId).then((session) => session ? new Session(session) : null)
-  }
-
-  /** @deprecated */
-  static activateSession () {
-    return CobrowseIONative.activateSession().then((session) => session ? new Session(session) : null)
-  }
-
-  /** @deprecated */
-  static endSession () {
-    return CobrowseIONative.endSession()
-  }
-}
-
-// the session.requested event is considered internal, it should
-// not be used outside these bindings
-CobrowseIO.addListener('session.requested', (session) => {
-  if (CobrowseIO.showSessionControls === false) {
-    CobrowseIONative.overwriteSessionIndicator()
-  }
-
-  if (Platform.OS === 'ios' && CobrowseIO.handleFullDeviceRequest) {
-    CobrowseIONative.overwriteFullControlUI()
-  }
-
-  CobrowseIO.handleSessionRequest(session)
-})
-
-CobrowseIO.addListener('session.updated', (session) => {
-  if (session.isActive() && session.remote_control === 'requested') {
-    CobrowseIO.handleRemoteControlRequest(session)
-  } 
-  
-  if (session.isActive() && session.full_device_state === 'requested') {
-    if (CobrowseIO.handleFullDeviceRequest) {
-      CobrowseIO.handleFullDeviceRequest(session)
-    } else if (Platform.OS === 'android') {
-      // accept the incoming connection by default
-      session.setFullDevice('on')
-    }
-  }
-})

package/js/CobrowseView.js

@@ -1,129 +0,0 @@
-import React, { Component } from 'react'
-import {
-  View,
-  Text,
-  ActivityIndicator,
-  TouchableOpacity,
-  StyleSheet
-} from 'react-native'
-import CobrowseIO from './CobrowseIO'
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: 'flex-end'
-  },
-  text: {
-    textAlign: 'center',
-    margin: 15,
-    fontSize: 15,
-    lineHeight: 20
-  },
-  code: {
-    fontSize: 29,
-    padding: 20,
-    fontWeight: 'bold',
-    textAlign: 'center'
-  },
-  button: {
-    color: 'rgb(0, 122, 255)',
-    fontSize: 18,
-    margin: 10
-  }
-})
-
-export default class CobrowseView extends Component {
-  constructor () {
-    super()
-    this.state = { error: null, session: null }
-  }
-
-  async componentDidMount () {
-    if (this.props.license) {
-      console.warn('Passing license to view is deprecated. Use CobrowseIO.license = "..." instead')
-      CobrowseIO.license = this.props.license
-    }
-
-    try {
-      const current = await CobrowseIO.currentSession()
-      if (current) this.setState({ session: current })
-      else {
-        const session = await CobrowseIO.createSession()
-        this.setState({ session })
-      }
-    } catch (error) {
-      this.setState({ error })
-    }
-
-    this.updateListener = CobrowseIO.addListener('session.updated', (session) => {
-      this.setState({ session })
-    })
-    this.endListener = CobrowseIO.addListener('session.ended', (session) => {
-      if (this.props.onEnded) this.props.onEnded()
-      this.setState({ session: null })
-    })
-  }
-
-  componentWillUnmount () {
-    if (this.updateListener) this.updateListener.remove()
-    if (this.endListener) this.endListener.remove()
-  }
-
-  async endSession () {
-    try {
-      const { session } = this.state
-      await session.end()
-      this.setState({ session: null })
-    } catch (error) {
-      this.setState({ error })
-    }
-  }
-
-  renderError () {
-    return (
-      <Text style={[styles.text]}>{this.state.error.message}</Text>
-    )
-  }
-
-  renderCode () {
-    let code = this.state.session && this.state.session.code
-    if (code) code = code.substr(0, 3) + '-' + code.substr(3)
-    return (
-      <View>
-        <Text style={[styles.code, { opacity: code ? 1 : 0.2 }]}>{code || '000-000'}</Text>
-        <Text style={[styles.text]}>Provide this code to your support agent to begin screen sharing.</Text>
-        <ActivityIndicator />
-      </View>
-    )
-  }
-
-  renderManageSession () {
-    return (
-      <View>
-        <Text style={[styles.text]}>You{"'"}re sharing screens from this app with a support agent.</Text>
-        <TouchableOpacity onPress={() => this.endSession()}>
-          <Text style={[styles.text, styles.button]}>End Session</Text>
-        </TouchableOpacity>
-      </View>
-    )
-  }
-
-  renderContent () {
-    const { error, session } = this.state
-    if (error) {
-      return this.renderError()
-    } else if ((!session) || (session.state === 'pending' || session.state === 'authorizing')) {
-      return this.renderCode()
-    } else {
-      return this.renderManageSession()
-    }
-  }
-
-  render () {
-    return (
-      <View style={styles.container}>
-        {this.renderContent()}
-      </View>
-    )
-  }
-}

package/js/Session.js

@@ -1,107 +0,0 @@
-const CobrowseIONative = require('react-native').NativeModules.CobrowseIO
-const NativeEventEmitter = require('react-native').NativeEventEmitter
-
-const emitter = new NativeEventEmitter(CobrowseIONative)
-
-export default class Session {
-  constructor (session) {
-    this._session = session || {}
-    this._listen()
-  }
-
-  _update (session, onMatch) {
-    if (this._session.id === undefined || (session && this._session.id === session.id)) {
-      this._session = session
-      if (typeof onMatch === 'function') onMatch()
-    }
-  }
-
-  _listen () {
-    const updates = emitter.addListener('session.updated', (session) => this._update(session))
-    const ended = emitter.addListener('session.ended', (session) => {
-      this._update(session, () => {
-        updates.remove()
-        ended.remove()
-      })
-    })
-  }
-
-  addListener (eventType, listener) {
-    // TODO: this class should extend EventEmitter and forward
-    //       on the non-namespaced versions of these events
-    switch (eventType) {
-      case 'ended':
-        eventType = 'session.updated'
-        break
-      case 'updated':
-        eventType = 'session.ended'
-        break
-    }
-
-    return emitter.addListener(eventType, (session) => {
-      this._update(session, () => {
-        listener(this)
-      })
-    })
-  }
-
-  get id () {
-    return this._session.id
-  }
-
-  get code () {
-    return this._session.code
-  }
-
-  get state () {
-    return this._session.state
-  }
-
-  get full_device () {
-    return this._session.full_device
-  }
-
-  get full_device_state () {
-    return this._session.full_device_state
-  }
-
-  get remote_control () {
-    return this._session.remote_control
-  }
-
-  get agent () {
-    return this._session.agent
-  }
-
-  activate () {
-    return CobrowseIONative.activateSession().then(() => {})
-  }
-
-  end () {
-    return CobrowseIONative.endSession()
-  }
-
-  isActive () {
-    return this._session.state === 'active'
-  }
-
-  isAuthorizing () {
-    return this._session.state === 'authorizing'
-  }
-
-  isPending () {
-    return this._session.state === 'pending'
-  }
-
-  isEnded () {
-    return this._session.state === 'ended'
-  }
-
-  setFullDevice (state) {
-    return CobrowseIONative.updateSession({ full_device: state })
-  }
-
-  setRemoteControl (state) {
-    return CobrowseIONative.updateSession({ remote_control: state })
-  }
-}

package/js/SessionControl.js

@@ -1,26 +0,0 @@
-import React from 'react'
-import CobrowseIO from './CobrowseIO'
-
-export default class SessionControl extends React.Component {
-  constructor () {
-    super()
-    this.state = { session: null }
-  }
-
-  async componentDidMount () {
-    this.setState({ session: await CobrowseIO.currentSession() })
-    this.updateListener = CobrowseIO.addListener(CobrowseIO.SESSION_UPDATED, (session) => {
-      this.setState({ session })
-    })
-  }
-
-  componentWillUnmount () {
-    if (this.updateListener) this.updateListener.remove()
-  }
-
-  render () {
-    const { session } = this.state
-    if (session && session.isActive()) return this.props.children
-    else return null
-  }
-}

package/js/Unredacted.js

@@ -1,82 +0,0 @@
-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/ts/CBIOBroadcastPickerView.d.ts

@@ -1,8 +0,0 @@
-import type { ReactElement } from 'react'
-import type { ViewProps } from 'react-native'
-
-type Props = Readonly<{
-  buttonColor?: string
-}> & ViewProps
-
-export default function (props: Props): ReactElement | null

package/ts/CobrowseAccessibilityService.d.ts

@@ -1,6 +0,0 @@
-/* eslint-disable @typescript-eslint/no-extraneous-class,accessor-pairs */
-export default class CobrowseAccessibilityService {
-  static showSetup (): Promise<void>
-
-  static isRunning (): Promise<boolean>
-}

package/ts/CobrowseIO.d.ts

@@ -1,29 +0,0 @@
-/* eslint-disable @typescript-eslint/no-extraneous-class,accessor-pairs */
-import type { EmitterSubscription } from 'react-native'
-import Session from './Session'
-
-export type NativeSessionEvent = 'session.updated' | 'session.ended'
-
-export default class CobrowseIO {
-  static handleSessionRequest (session?: Session): void
-
-  static addListener (eventType: NativeSessionEvent, listener: (session: Session) => void): EmitterSubscription
-
-  static start (): void
-
-  static stop (): void
-
-  static set api (api: string)
-
-  static set license (license: string)
-
-  static set customData (customData: Record<string, any>)
-
-  static set deviceToken (token: string)
-
-  static currentSession (): Promise<Session>
-
-  static createSession (): Promise<Session>
-
-  static getSession (codeOrId: string): Promise<Session>
-}

package/ts/CobrowseView.d.ts

@@ -1,20 +0,0 @@
-import type { Component } from 'react'
-import type { View, Text } from 'react-native'
-
-export default class CobrowseView extends Component {
-  componentDidMount (): Promise<void>
-
-  componentWillUnmount (): void
-
-  endSession (): Promise<void>
-
-  renderError (): Text
-
-  renderCode (): View
-
-  renderManageSession (): View
-
-  renderContent (): Text | View
-
-  render (): View
-}

package/ts/Redacted.d.ts

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