Prettify common files

This commit is contained in:
Sofiya Tepikin
2022-08-23 12:55:25 +02:00
parent 732f19ed63
commit 1b8fd97d16
13 changed files with 52 additions and 52 deletions
+5 -5
View File
@@ -14,17 +14,17 @@ const AppIcon = ({ color, name, style, ...props }) => {
AppIcon.propTypes = { AppIcon.propTypes = {
color: PropTypes.string, color: PropTypes.string,
name: PropTypes.string.isRequired, name: PropTypes.string.isRequired,
style: PropTypes.object style: PropTypes.object,
} }
AppIcon.defaultProps = { AppIcon.defaultProps = {
color: 'black' color: 'black',
} }
const styles = StyleSheet.create({ const styles = StyleSheet.create({
icon: { icon: {
fontSize: Sizes.subtitle fontSize: Sizes.subtitle,
} },
}) })
export default AppIcon export default AppIcon
+2 -2
View File
@@ -17,8 +17,8 @@ const AppLoadingView = () => {
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
...Containers.centerItems ...Containers.centerItems,
} },
}) })
export default AppLoadingView export default AppLoadingView
+4 -4
View File
@@ -3,9 +3,9 @@ import { Modal, StyleSheet, TouchableOpacity } from 'react-native'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
const AppModal = ({ children, onClose }) => { const AppModal = ({ children, onClose }) => {
return( return (
<Modal <Modal
animationType='fade' animationType="fade"
onRequestClose={onClose} onRequestClose={onClose}
transparent={true} transparent={true}
visible={true} visible={true}
@@ -18,7 +18,7 @@ const AppModal = ({ children, onClose }) => {
AppModal.propTypes = { AppModal.propTypes = {
children: PropTypes.node, children: PropTypes.node,
onClose: PropTypes.func onClose: PropTypes.func,
} }
const styles = StyleSheet.create({ const styles = StyleSheet.create({
@@ -26,7 +26,7 @@ const styles = StyleSheet.create({
backgroundColor: 'black', backgroundColor: 'black',
flex: 1, flex: 1,
opacity: 0.5, opacity: 0.5,
} },
}) })
export default AppModal export default AppModal
+7 -7
View File
@@ -13,7 +13,7 @@ const AppPage = ({
title, title,
...props ...props
}) => { }) => {
return( return (
<View style={styles.container}> <View style={styles.container}>
<ScrollView <ScrollView
contentContainerStyle={[styles.scrollView, contentContainerStyle]} contentContainerStyle={[styles.scrollView, contentContainerStyle]}
@@ -31,21 +31,21 @@ AppPage.propTypes = {
children: PropTypes.node, children: PropTypes.node,
contentContainerStyle: PropTypes.object, contentContainerStyle: PropTypes.object,
scrollViewStyle: PropTypes.object, scrollViewStyle: PropTypes.object,
title: PropTypes.string title: PropTypes.string,
} }
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
backgroundColor: Colors.turquoiseLight, backgroundColor: Colors.turquoiseLight,
flex: 1 flex: 1,
}, },
scrollView: { scrollView: {
backgroundColor: Colors.turquoiseLight, backgroundColor: Colors.turquoiseLight,
flexGrow: 1 flexGrow: 1,
}, },
title: { title: {
...Typography.title ...Typography.title,
} },
}) })
export default AppPage export default AppPage
+1 -1
View File
@@ -23,7 +23,7 @@ const styles = StyleSheet.create({
statusBar: { statusBar: {
backgroundColor: Colors.purple, backgroundColor: Colors.purple,
height: STATUSBAR_HEIGHT, height: STATUSBAR_HEIGHT,
} },
}) })
export default AppStatusBar export default AppStatusBar
+4 -4
View File
@@ -20,19 +20,19 @@ const AppSwitch = ({ onToggle, text, value }) => {
AppSwitch.propTypes = { AppSwitch.propTypes = {
onToggle: PropTypes.func.isRequired, onToggle: PropTypes.func.isRequired,
text: PropTypes.string, text: PropTypes.string,
value: PropTypes.bool value: PropTypes.bool,
} }
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
...Containers.rowContainer ...Containers.rowContainer,
}, },
switch: { switch: {
flex: 1, flex: 1,
}, },
textContainer: { textContainer: {
flex: 4, flex: 4,
} },
}) })
export default AppSwitch export default AppSwitch
+3 -3
View File
@@ -5,7 +5,7 @@ import PropTypes from 'prop-types'
import { Colors, Spacing, Typography } from '../../styles' import { Colors, Spacing, Typography } from '../../styles'
const AppTextInput = ({ style, isKeyboardOffset, ...props }) => { const AppTextInput = ({ style, isKeyboardOffset, ...props }) => {
const behavior = isKeyboardOffset ? "padding" : "height" const behavior = isKeyboardOffset ? 'padding' : 'height'
const keyboardVerticalOffset = isKeyboardOffset ? 300 : 0 const keyboardVerticalOffset = isKeyboardOffset ? 300 : 0
return ( return (
@@ -39,8 +39,8 @@ const styles = StyleSheet.create({
minWidth: '80%', minWidth: '80%',
paddingHorizontal: Spacing.base, paddingHorizontal: Spacing.base,
paddingVertical: Spacing.tiny, paddingVertical: Spacing.tiny,
...Typography.mainText ...Typography.mainText,
} },
}) })
export default AppTextInput export default AppTextInput
+3 -3
View File
@@ -26,8 +26,8 @@ AppText.propTypes = {
const styles = StyleSheet.create({ const styles = StyleSheet.create({
text: { text: {
color: Colors.greyDark, color: Colors.greyDark,
...Typography.mainText ...Typography.mainText,
} },
}) })
export default AppText export default AppText
+4 -4
View File
@@ -4,7 +4,7 @@ import { StyleSheet, TouchableOpacity } from 'react-native'
import AppIcon from './app-icon' import AppIcon from './app-icon'
import { HIT_SLOP} from '../../config' import { HIT_SLOP } from '../../config'
import { Colors, Sizes } from '../../styles' import { Colors, Sizes } from '../../styles'
const CloseIcon = ({ onClose, color, ...props }) => { const CloseIcon = ({ onClose, color, ...props }) => {
@@ -15,21 +15,21 @@ const CloseIcon = ({ onClose, color, ...props }) => {
style={styles.container} style={styles.container}
{...props} {...props}
> >
<AppIcon name='cross' color={color ? color : Colors.orange} /> <AppIcon name="cross" color={color ? color : Colors.orange} />
</TouchableOpacity> </TouchableOpacity>
) )
} }
CloseIcon.propTypes = { CloseIcon.propTypes = {
onClose: PropTypes.func.isRequired, onClose: PropTypes.func.isRequired,
color: PropTypes.string color: PropTypes.string,
} }
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
alignSelf: 'flex-start', alignSelf: 'flex-start',
marginBottom: Sizes.base, marginBottom: Sizes.base,
} },
}) })
export default CloseIcon export default CloseIcon
+4 -4
View File
@@ -21,7 +21,7 @@ const Link = ({ children, style }) => {
Link.propTypes = { Link.propTypes = {
children: PropTypes.node, children: PropTypes.node,
style: PropTypes.object style: PropTypes.object,
} }
const styles = StyleSheet.create({ const styles = StyleSheet.create({
@@ -29,12 +29,12 @@ const styles = StyleSheet.create({
color: Colors.purple, color: Colors.purple,
textDecorationLine: 'underline', textDecorationLine: 'underline',
...Typography.mainText, ...Typography.mainText,
} },
}) })
function replaceUrlWithText(url) { function replaceUrlWithText(url) {
const link = Object.values(links).find(l => l.url === url) const link = Object.values(links).find((l) => l.url === url)
return (link && link.text) || url return (link && link.text) || url
} }
export default Link export default Link
+2 -2
View File
@@ -15,7 +15,7 @@ const MenuIcon = ({ isActive, name }) => {
MenuIcon.propTypes = { MenuIcon.propTypes = {
isActive: PropTypes.bool, isActive: PropTypes.bool,
name: PropTypes.string.isRequired name: PropTypes.string.isRequired,
} }
export default MenuIcon export default MenuIcon
+2 -2
View File
@@ -43,7 +43,7 @@ const styles = StyleSheet.create({
}, },
title: { title: {
...Typography.subtitle, ...Typography.subtitle,
} },
}) })
export default Segment export default Segment
+11 -11
View File
@@ -7,17 +7,17 @@ import AppText from './app-text'
import { Sizes, Spacing, Typography } from '../../styles' import { Sizes, Spacing, Typography } from '../../styles'
const Table = ({ tableContent }) => { const Table = ({ tableContent }) => {
return ( return tableContent.map((rowContent, i) => (
tableContent.map((rowContent, i) => <Row key={i} rowContent={rowContent} />) <Row key={i} rowContent={rowContent} />
) ))
} }
Table.propTypes = { Table.propTypes = {
tableContent: PropTypes.array.isRequired tableContent: PropTypes.array.isRequired,
} }
const Row = ({ rowContent }) => { const Row = ({ rowContent }) => {
return( return (
<View style={styles.row}> <View style={styles.row}>
<Cell content={rowContent[0]} isLeft /> <Cell content={rowContent[0]} isLeft />
<Cell content={rowContent[1]} /> <Cell content={rowContent[1]} />
@@ -26,7 +26,7 @@ const Row = ({ rowContent }) => {
} }
Row.propTypes = { Row.propTypes = {
rowContent: PropTypes.array.isRequired rowContent: PropTypes.array.isRequired,
} }
const Cell = ({ content, isLeft }) => { const Cell = ({ content, isLeft }) => {
@@ -35,7 +35,7 @@ const Cell = ({ content, isLeft }) => {
const numberOfLines = isLeft ? 1 : 2 const numberOfLines = isLeft ? 1 : 2
const ellipsizeMode = isLeft ? 'clip' : 'tail' const ellipsizeMode = isLeft ? 'clip' : 'tail'
return( return (
<View style={styleContainer}> <View style={styleContainer}>
<AppText <AppText
numberOfLines={numberOfLines} numberOfLines={numberOfLines}
@@ -61,7 +61,7 @@ const styles = StyleSheet.create({
}, },
accentPurpleBig: { accentPurpleBig: {
...Typography.accentPurpleBig, ...Typography.accentPurpleBig,
marginRight: Spacing.tiny marginRight: Spacing.tiny,
}, },
cellLeft: { cellLeft: {
alignItems: 'flex-end', alignItems: 'flex-end',
@@ -75,8 +75,8 @@ const styles = StyleSheet.create({
row: { row: {
flexDirection: 'row', flexDirection: 'row',
marginBottom: Spacing.tiny, marginBottom: Spacing.tiny,
marginLeft: Spacing.tiny marginLeft: Spacing.tiny,
} },
}) })
export default Table export default Table