import React, { PureComponent } from "react";
import { View } from "react-native";
import { LINEGREY } from "../colours";
import { FOOTER_HEIGHT } from "../constants";

class StickyFooter extends PureComponent {
	render() {
		return (
			<View
				style={[
					styles.section,
					this.props.lineSeparated && styles.lineSeparated,
					this.props.style,
				]}
			>
				{this.props.children}
			</View>
		);
	}
}

const styles = {
	section: {
		backgroundColor: "#fff",
		height: FOOTER_HEIGHT,
		borderTopWidth: 0,
		shadowColor: "#000",
		shadowOffset: {
			width: 0,
			height: -1,
		},
		shadowOpacity: 0.1,
		shadowRadius: 6,
		elevation: 16,
	},
	lineSeparated: {
		borderTopWidth: 1,
		borderColor: LINEGREY,
		shadowOpacity: 0,
		elevation: 0,
	},
};

export { StickyFooter };
