use React.ReactNode as type for children elements

src/components/App.tsx

@@ -230,7 +230,7 @@ function _App() {
 	)
 }
 
-function NavContainer({ children }: { children: JSX.Element | JSX.Element[] }) {
+function NavContainer({ children }: { children: React.ReactNode }) {
 	const navigation = useRef<NavigationContainerRef<ReactNavigation.RootParamList>>(null)
 	const { theme } = useThemeContext()
 

src/components/Screen.tsx

@@ -4,7 +4,7 @@ import { globals } from '@styles'
 import { View } from 'react-native'
 
 interface IContainerProps {
-	children: JSX.Element | JSX.Element[]
+	children: React.ReactNode
 	screenName?: string
 	withBackBtn?: boolean
 	withCancelBtn?: boolean

src/context/FocusClaim.tsx

@@ -108,7 +108,7 @@ const FocusClaimCtx = createContext<useFocusClaimType>({
 
 export const useFocusClaimContext = () => useContext(FocusClaimCtx)
 
-export const FocusClaimProvider = ({ children }: { children: JSX.Element }) => (
+export const FocusClaimProvider = ({ children }: { children: React.ReactNode }) => (
 	<FocusClaimCtx.Provider value={useFocusClaim()} >
 		{children}
 	</FocusClaimCtx.Provider>

src/context/Keyboard.tsx

@@ -29,7 +29,7 @@ const KeyboardCtx = createContext<useKeyboardType>({
 
 export const useKeyboardCtx = () => useContext(KeyboardCtx)
 
-export const KeyboardProvider = ({ children }: { children: JSX.Element | JSX.Element[] }) => (
+export const KeyboardProvider = ({ children }: { children: React.ReactNode }) => (
 	<KeyboardCtx.Provider value={useKeyboard()}>
 		{children}
 	</KeyboardCtx.Provider>

src/context/Nostr.tsx

@@ -128,7 +128,7 @@ const NostrContext = createContext<useNostrType>({
 
 export const useNostrContext = () => useContext(NostrContext)
 
-export const NostrProvider = ({ children }: { children: JSX.Element }) => (
+export const NostrProvider = ({ children }: { children: React.ReactNode }) => (
 	<NostrContext.Provider value={useNostr()} >
 		{children}
 	</NostrContext.Provider>

src/context/Privacy.tsx

@@ -81,7 +81,7 @@ const PrivacyContext = createContext<usePrivacyType>({
 
 export const usePrivacyContext = () => useContext(PrivacyContext)
 
-export const PrivacyProvider = ({ children }: { children: JSX.Element }) => (
+export const PrivacyProvider = ({ children }: { children: React.ReactNode }) => (
 	<PrivacyContext.Provider value={usePrivacy()} >
 		{children}
 	</PrivacyContext.Provider>

src/context/Prompt.tsx

@@ -56,7 +56,7 @@ const PromptCtx = createContext<usePromptType>({
 
 export const usePromptContext = () => useContext(PromptCtx)
 
-export const PromptProvider = ({ children }: { children: JSX.Element }) => (
+export const PromptProvider = ({ children }: { children: React.ReactNode }) => (
 	<PromptCtx.Provider value={usePrompt()} >
 		{children}
 	</PromptCtx.Provider>

src/context/Release.tsx

@@ -41,7 +41,7 @@ const ReleaseCtx = createContext<useReleaseType>({
 
 export const useReleaseContext = () => useContext(ReleaseCtx)
 
-export const ReleaseProvider = ({ children }: { children: JSX.Element | JSX.Element[] }) => (
+export const ReleaseProvider = ({ children }: { children: React.ReactNode }) => (
 	<ReleaseCtx.Provider value={useRelease()} >
 		{children}
 	</ReleaseCtx.Provider>

src/context/Theme.tsx

@@ -85,7 +85,7 @@ const ThemeContext = createContext<useThemeType>({
 
 export const useThemeContext = () => useContext(ThemeContext)
 
-export const ThemeProvider = ({ children }: { children: JSX.Element }) => (
+export const ThemeProvider = ({ children }: { children: React.ReactNode }) => (
 	<ThemeContext.Provider value={useTheme()} >
 		{children}
 	</ThemeContext.Provider>

src/screens/Addressbook/Contact/index.tsx

@@ -225,7 +225,7 @@ export default function ContactPage({ navigation, route }: IContactPageProps) {
 }
 
 interface ISmallBtnProps {
-	children: JSX.Element
+	children: React.ReactNode
 	onPress: () => void
 }