import React, { Component } from 'react';
import { Provider, connect } from 'react-redux';
import { store } from '~/store/store';
import { DEFAULT_SHARE_EXT } from '~/store/actionTypes';
import { Header } from 'nixplay-ui-kit';
import { View, Dimensions } from 'react-native';
import * as containers from '~cont/*/index.js'; // eslint-disable-line import/no-unresolved, import/extensions
import { createStackNavigator, createAppContainer } from 'react-navigation';


const headerSetting = {
	headerMode: 'screen',
	defaultNavigationOptions: {
		header: (props) => (<Header {...props} />),
	},
};

const RootStack = createStackNavigator(
	{
		ShareExtPreview: containers.ShareExtPreview,
		ShareExtPlaylist: containers.ShareExtPlaylist,
	},
	{
		...headerSetting,
		initialRouteName: 'ShareExtPreview',
	},
);

const screen = Dimensions.get('window');

const Root = createAppContainer(RootStack);

export class Share extends Component {
	constructor(props, context) {
		super(props, context);
		this.state = {};
		this.onSetDefault();
	}

	componentDidMount() {
		this.onSetDefault();
	}

	onSetDefault = () => {
		store.dispatch({
			type: DEFAULT_SHARE_EXT,
			payload: {},
		});
	}

	render() {
		return (
			<Provider store={store}>
				<View style={{
					position: 'relative', borderWidth: 0, backgroundColor: 'transparent', width: screen.width, height: screen.height,
				}}
				>
					<Root
						ref={(nav) => { this.navigation = nav; }}
						screenProps={{}}
					/>
				</View>
			</Provider>
		);
	}
}

export default connect()(Share);
