Propose feature: add useLinking custom hook

README.md

@@ -31,6 +31,7 @@ yarn add @react-native-community/hooks
 - [useDeviceOrientation](https://github.com/react-native-community/hooks#usedeviceorientation)
 - [useLayout](https://github.com/react-native-community/hooks#uselayout)
 - [useRefresh](https://github.com/react-native-community/hooks#useRefresh)
+- [useLinking](https://github.com/react-native-community/hooks#useLinking)
 
 ### `useAccessibilityInfo`
 
@@ -153,6 +154,18 @@ const { isRefreshing, onRefresh } = useRefresh(fetch);
 />
 ```
 
+### `useLinking`
+
+useLinking can handle incoming your app's deeplinks and opening external urls through the [`Linking`](https://reactnative.dev/docs/linking) API.
+
+```js
+import {useLinking} from '@react-native-community/hooks'
+
+const { deepLink, openLinkInBrowser } = useLinking()
+
+console.log('Initial deep link is:', deepLink)
+```
+
 [version-badge]: https://img.shields.io/npm/v/@react-native-community/hooks.svg?style=flat-square
 [package]: https://www.npmjs.com/package/@react-native-community/hooks
 

src/useLinking.test.ts

@@ -0,0 +1,58 @@
+import {Linking} from 'react-native'
+import {act, renderHook} from '@testing-library/react-hooks'
+
+import {useLinking} from './useLinking'
+
+jest.mock('react-native', () => ({
+  Linking: {
+    addEventListener: jest.fn((_, fn) => ({remove: jest.fn()})),
+    getInitialURL: jest.fn(() => Promise.resolve()),
+    openSettings: jest.fn(() => Promise.resolve()),
+    canOpenURL: jest.fn(() => Promise.resolve(true)),
+    openURL: jest.fn((url: string) => Promise.resolve()),
+  },
+}))
+
+describe('useLinking', () => {
+  it('should return deeplink as null', () => {
+    const {result, waitForNextUpdate} = renderHook(() => useLinking())
+
+    waitForNextUpdate()
+
+    expect(result.current.deepLink).toBe(null)
+  })
+
+  it('calls getInitialURL with initial deeplink url', async () => {
+    const url = 'app://magic_screen'
+    const getInitialURLSpy = jest.spyOn(Linking, 'getInitialURL')
+    getInitialURLSpy.mockResolvedValueOnce(url)
+
+    const {result, waitForNextUpdate} = renderHook(() => useLinking())
+
+    await waitForNextUpdate()
+
+    expect(result.current.deepLink).toBe('app://magic_screen')
+  })
+
+  it('should open link in browser', async () => {
+    const {result} = renderHook(() => useLinking())
+    const url = 'https://reactnative.dev'
+
+    await act(async () => {
+      result.current.openLinkInBrowser(url)
+    })
+
+    expect(Linking.canOpenURL).toHaveBeenCalledWith(url)
+    expect(Linking.openURL).toHaveBeenCalledWith(url)
+  })
+
+  it('should open app settings', async () => {
+    const {result} = renderHook(() => useLinking())
+
+    await act(async () => {
+      result.current.openAppSettings()
+    })
+
+    expect(Linking.openSettings).toHaveBeenCalled()
+  })
+})

src/useLinking.ts

@@ -0,0 +1,30 @@
+import {useEffect, useState} from 'react'
+import {Linking} from 'react-native'
+
+const useLinking = () => {
+  const [deepLink, setDeepLink] = useState<string | null>(null)
+
+  const openLinkInBrowser = (url: string) => {
+    Linking.canOpenURL(url).then((canOpen) => canOpen && Linking.openURL(url))
+  }
+
+  const openAppSettings = async () => await Linking.openSettings()
+
+  const handleURLChange = (event: {url: string}) => {
+    setDeepLink(event.url)
+  }
+
+  useEffect(() => {
+    Linking.getInitialURL().then((url) => setDeepLink(url))
+  }, [])
+
+  useEffect(() => {
+    const listener = Linking.addEventListener('url', handleURLChange)
+
+    return () => listener.remove()
+  }, [])
+
+  return {openLinkInBrowser, openAppSettings, deepLink}
+}
+
+export {useLinking}