React-native communication between extension app and host app - ios

Question

I am developing ios action extension using react-native. I have created it but when i'm trying to open extension from another app e.g safari or chrome it not showing the UI for extension instead it shows blank screen. If any one know how to create UI for extension and communicate with host app, please let me know. How we debug the extension when opened from another app?. I have referred below example.
https://github.com/promptworks/react-native-action-extension-example.
Thanks in advance.
Below is my index.js file
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import {
AppRegistry,
StyleSheet,
Text,
View
} from 'react-native';
export class AppComponent extends Component {
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React Native!
</Text>
<Text style={styles.instructions}>
To get started, edit index.ios.js
</Text>
<Text style={styles.instructions}>
Press Cmd+R to reload,{'\n'}
Cmd+D or shake for dev menu
</Text>
</View>
);
}
}
export class ActionExtensionComponent extends Component {
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to our Action Extension!
</Text>
<Text style={styles.instructions}>
To get started, edit index.ios.js
</Text>
<Text style={styles.instructions}>
Press Cmd+R to reload,{'\n'}
Cmd+D or shake for dev menu
</Text>
</View>
);
}
}
export default class RNShare extends Component {
static propTypes = {
isActionExtension: PropTypes.bool.bool
}
static defaultProps = {
isActionExtension: false
}
render() {
if (this.props.isActionExtension) {
return <ActionExtensionComponent />
} else {
return <AppComponent />
}
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});
AppRegistry.registerComponent('RNShare', () => RNShare);