Skip to content

Cant use singleton hook in "Routes" on Debug mode #319

@luisfuertes

Description

@luisfuertes

Hi, i created my own custom hook and use react-singleton-hook to use it.

My App.js code:

const App: FC = () => (
  <NotifierWrapper>
    <QueryClientProvider client={queryClient}>
      <>
        <SingletonHooksContainer />
        <Routes />
      </>
    </QueryClientProvider>
  </NotifierWrapper>
)

My Routes.js component

const Routes: FC = () => {

  const { play, pause, loaded } = useMusic()

  const onStateChange = useCallback(() => {
    if (loaded && play && pause) {
      if (checkSceneHasMusic()) {
        play()
      } else {
        pause()
      }
    }
  }, [loaded, play, pause])

  return (
    <Router onStateChange={onStateChange}>
      <Lightbox>
        <Stack key='root'>
          <Scene key='Splash' component={Splash} hideNavBar initial />
          <Scene key='List' component={List} hideNavBar />
        </Stack>
      </Lightbox>
    </Router>
  )
}

export default Routes

My hook (i tried to reduce code to minimal but app crash too)

import { useCallback, useRef, useEffect, useState } from 'react'
import { singletonHook } from 'react-singleton-hook'
import { Player } from '@react-native-community/audio-toolkit'
import { checkSceneHasMusic } from 'utils'

const trackUrl = 'https://file-examples-com.github.io/uploads/2017/11/file_example_MP3_700KB.mp3'
const trackUrl2 = 'https://www.learningcontainer.com/wp-content/uploads/2020/02/Kalimba.mp3'

const mockFunction = () => {
  // MOCK
}

const init = { load: mockFunction, play: mockFunction, pause: mockFunction, paused: true, loaded: false }

type ReturnType = {
  load: (url: string) => void,
  play: () => void,
  pause: () => void,
  paused: boolean,
  loaded: boolean,
}

const useMusic = (): ReturnType => {
  const [paused, setPaused] = useState(false)
  const [loaded, setLoaded] = useState(false)

  useEffect(() => {
    if (!loaded) {
      setLoaded(true)
    }
  }, [loaded])

  return { load: mockFunction, play: mockFunction, pause: mockFunction, paused, loaded }
}

export default singletonHook(init, useMusic)

If i execute hook on "Routes" component app crash on iOS with this error:

2021-05-10 13:44:22.267632+0200 myapp[20448:251440] *** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '*** -[__NSArrayM insertObject:atIndex:]: object cannot be nil'
*** First throw call stack:
(
	0   CoreFoundation                      0x00007fff20421af6 __exceptionPreprocess + 242
	1   libobjc.A.dylib                     0x00007fff20177e78 objc_exception_throw + 48
	2   CoreFoundation                      0x00007fff2049e77f _CFThrowFormattedException + 194
	3   CoreFoundation                      0x00007fff2049c656 -[__NSArrayM insertObject:atIndex:].cold.2 + 0
	4   CoreFoundation                      0x00007fff2031f678 -[__NSArrayM insertObject:atIndex:] + 1134
	5   UIKitCore                           0x00007fff23f677ac -[UIViewController _addChildViewController:performHierarchyCheck:notifyWillMove:] + 571
	6   myapp                               0x000000010d6d220d -[RNSScreenContainerView attachScreen:atIndex:] + 125
	7   myapp                               0x000000010d6d2bd8 -[RNSScreenContainerView updateContainer] + 2168
	8   myapp                               0x000000010d6d39f0 __41-[RNSScreenContainerManager markUpdated:]_block_invoke + 352
	9   libdispatch.dylib                   0x000000011118c7ec _dispatch_call_block_and_release + 12
	10  libdispatch.dylib                   0x000000011118d9c8 _dispatch_client_callout + 8
	11  libdispatch.dylib                   0x000000011119be75 _dispatch_main_queue_callback_4CF + 1152
	12  CoreFoundation                      0x00007fff2038fdbb __CFRUNLOOP_IS_SERVICING_THE_MAIN_DISPATCH_QUEUE__ + 9
	13  CoreFoundation                      0x00007fff2038a63e __CFRunLoopRun + 2685
	14  CoreFoundation                      0x00007fff203896d6 CFRunLoopRunSpecific + 567
	15  GraphicsServices                    0x00007fff2c257db3 GSEventRunModal + 139
	16  UIKitCore                           0x00007fff24696cf7 -[UIApplication _run] + 912
	17  UIKitCore                           0x00007fff2469bba8 UIApplicationMain + 101
	18  myapp                               0x000000010d11b630 main + 112
	19  libdyld.dylib                       0x00007fff2025a3e9 start + 1
	20  ???                                 0x0000000000000001 0x0 + 1
)
libc++abi.dylib: terminating with uncaught exception of type NSException
*** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '*** -[__NSArrayM insertObject:atIndex:]: object cannot be nil'
terminating with uncaught exception of type NSException
CoreSimulator 732.18.6 - Device: iPhone 12 (7E7D3327-1ACA-482F-B440-1302588C9173) - Runtime: iOS 14.4 (18D46) - DeviceType: iPhone 12

If i use on Scene components it works fine. And on iOS release mode only fail if i call some hook function (with same error that show above)

On Android not crash app but reload "Routes" if i call hook function, and music player not works if i used on "Routes". In Scenes components all work fines like on iOS

My versions

    "react": "17.0.1",
    "react-native": "0.64.0",
    "react-singleton-hook": "^3.1.1"

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions