import React from 'react';
import {
	StyleSheet,
	View,
} from 'react-native';
import { ContentGridEmpty } from 'nixplay-ui-kit';
// import { TutorialContents } from '~comp/PhotoPrintTutorial/tutorialContents';
// import i18n from '~/locale/i18n';

const styles = StyleSheet.create({
	container: {
		alignItems: 'center',
		height: '100%',
		justifyContent: 'space-between',
	},
	textContainer: {
		justifyContent: 'center',
		alignItems: 'center',
		margin: 40,
	},
	centerText: {
		textAlign: 'center',
	},
	buttonContainer: {
		height: 128,
	},
	loadingContainer: {
		flex: 1,
		alignItems: 'center',
		justifyContent: 'center',
	},
});

// Photo print will be set to english only so i18n's will be removed
// this is the wrike task for that: https://www.wrike.com/open.htm?id=453723168
const PrintQueueEmptyComponent = () => (
	<View style={styles.container}>
		<View style={styles.textContainer}>
			<ContentGridEmpty>
				<ContentGridEmpty.Icon name="photos" />
				{/* <ContentGridEmpty.Title>{i18n.t('contents.letsGetStarted')}</ContentGridEmpty.Title> */}
				<ContentGridEmpty.Title>{'Let\'s Get Started'}</ContentGridEmpty.Title>
				{/* <ContentGridEmpty.Description>
					{i18n.t('contents.selectPhotosToContinue')}
				</ContentGridEmpty.Description> */}
				<ContentGridEmpty.Description>
					Select Photos to continue
				</ContentGridEmpty.Description>
			</ContentGridEmpty>
		</View>

	</View>

);

export const PrintQueueEmpty = (props) => (<PrintQueueEmptyComponent {...props} />);

