diff --git a/jest.mocks.js b/jest.mocks.js
index e2ef93a..42d7d73 100644
--- a/jest.mocks.js
+++ b/jest.mocks.js
@@ -2,32 +2,58 @@
import React from 'react'
import { Image } from 'react-native'
-// Mock font awesome
-const Icon = 'Icon'
-const getIconType = (prefix) => {
- switch (prefix) {
- case 'fas':
- return 'solid'
- case 'fal':
- return 'light'
- case 'fab':
- return 'brand'
- default:
- throw new Error()
+// === Globals ===
+
+if (typeof global.requestIdleCallback === 'undefined') {
+ global.requestIdleCallback = function (callback) {
+ return setTimeout(function () {
+ callback({
+ timeRemaining: function () {
+ return 50
+ },
+ didTimeout: false,
+ })
+ }, 0)
}
}
-jest.mock('@fortawesome/react-native-fontawesome', () => ({
- FontAwesomeIcon: (faIcon) => (
-
- ),
-}))
+
+if (typeof global.cancelIdleCallback === 'undefined') {
+ global.cancelIdleCallback = function (id) {
+ clearTimeout(id)
+ }
+}
+
+// === Third-party libraries ===
+
+jest.mock('@fortawesome/react-native-fontawesome', () => {
+ const Icon = 'Icon'
+
+ const getIconType = (prefix) => {
+ switch (prefix) {
+ case 'fas':
+ return 'solid'
+ case 'fal':
+ return 'light'
+ case 'fab':
+ return 'brand'
+ default:
+ throw new Error()
+ }
+ }
+
+ return {
+ FontAwesomeIcon: (faIcon) => (
+
+ ),
+ }
+})
Image.getSizeWithHeaders = jest.fn(() => Promise.resolve({ width: 0, height: 0 }))
diff --git a/package.json b/package.json
index 70a10c2..3acde31 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@observation.org/react-native-components",
- "version": "1.67.0",
+ "version": "1.68.0",
"main": "src/index.ts",
"repository": "git@github.com:observation/react-native-components.git",
"author": "Observation.org",
diff --git a/src/@types/requestIdleCallback.d.ts b/src/@types/requestIdleCallback.d.ts
new file mode 100644
index 0000000..0e55d7a
--- /dev/null
+++ b/src/@types/requestIdleCallback.d.ts
@@ -0,0 +1,10 @@
+declare global {
+ function requestIdleCallback(
+ callback: (deadline: { timeRemaining(): number; didTimeout: boolean }) => void,
+ options?: { timeout: number },
+ ): number
+
+ function cancelIdleCallback(handle: number): void
+}
+
+export {}
diff --git a/src/hooks/useShowBlurView.ts b/src/hooks/useShowBlurView.ts
index 562f550..fa6e72e 100644
--- a/src/hooks/useShowBlurView.ts
+++ b/src/hooks/useShowBlurView.ts
@@ -1,5 +1,5 @@
import React, { useState } from 'react'
-import { InteractionManager, Platform } from 'react-native'
+import { Platform } from 'react-native'
import { useFocusEffect } from '@react-navigation/native'
@@ -21,14 +21,14 @@ const useShowBlurView = () => {
React.useCallback(() => {
let timer: Timeout
const timeout = isIOSDevice ? 0 : 200
- const task = InteractionManager.runAfterInteractions(() => {
+ const taskHandle = requestIdleCallback(() => {
timer = setTimeout(() => {
setShowBlurView(true)
}, timeout)
})
return () => {
- task.cancel()
+ cancelIdleCallback(taskHandle)
clearTimeout(timer)
setShowBlurView(isIOSDevice)
}
diff --git a/tsconfig.json b/tsconfig.json
index 8a28ab3..53da7a4 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,5 +1,6 @@
{
"extends": "@react-native/typescript-config",
+ "typeRoots": ["./src/@types", "./node_modules/@types"],
"compilerOptions": {
"types": ["jest"],
},