import { useRef , useCallback } from 'react' ; import Setting from '@joplin/lib/models/Setting' ; import useSource from './hooks/useSource' ; import useOnMessage from './hooks/useOnMessage' ; import useOnResourceLongPress from './hooks/useOnResourceLongPress' ; const React = require ( 'react' ) ; const { View } = require ( 'react-native' ) ; const { WebView } = require ( 'react-native-webview' ) ; const { themeStyle } = require ( '../global-style.js' ) ; import BackButtonDialogBox from '../BackButtonDialogBox' ; import { reg } from '@joplin/lib/registry' ; interface Props { themeId : number ; style : any ; noteBody : string ; noteMarkupLanguage : number ; highlightedKeywords : string [ ] ; noteResources : any ; paddingBottom : number ; noteHash : string ; onJoplinLinkClick : Function ; onCheckboxChange ? : Function ; onMarkForDownload ? : Function ; onLoadEnd ? : Function ; } const webViewStyle = { backgroundColor : 'transparent' , } ; export default function NoteBodyViewer ( props ) { const theme = themeStyle ( props . themeId ) ; const dialogBoxRef = useRef ( null ) ; const { source , injectedJs } = useSource ( props . noteBody , props . noteMarkupLanguage , props . themeId , props . highlightedKeywords , props . noteResources , props . paddingBottom , props . noteHash ) ; const onResourceLongPress = useOnResourceLongPress ( props . onJoplinLinkClick , dialogBoxRef ) ; const onMessage = useOnMessage ( props . onCheckboxChange , props . noteBody , props . onMarkForDownload , props . onJoplinLinkClick , onResourceLongPress ) ; const onLoadEnd = useCallback ( ( ) => { if ( props . onLoadEnd ) props . onLoadEnd ( ) ; } , [ props . onLoadEnd ] ) ; function onError ( ) { reg . logger ( ) . error ( 'WebView error' ) ; } const BackButtonDialogBox_ = BackButtonDialogBox as any ; return ( < View style = { props . style } > < WebView theme = { theme } useWebKit = { true } allowingReadAccessToURL = { `file://${ Setting . value ( 'resourceDir' ) }` } style = { webViewStyle } source = { source } injectedJavaScript = { injectedJs . join ( '\n' ) } originWhitelist = { [ 'file://*' , './*' , 'http://*' , 'https://*' ] } mixedContentMode = "always" allowFileAccess = { true } onLoadEnd = { onLoadEnd } onError = { onError } onMessage = { onMessage } / > < BackButtonDialogBox_ ref = { dialogBoxRef } /> < /View>); }