no products yet text in place detail screen

This commit is contained in:
Bart Akeley 2018-08-12 12:18:51 -05:00
parent d66ad57bd1
commit c7ec48b2df
2 changed files with 46 additions and 13 deletions

View file

@ -4,13 +4,22 @@ import { Text, View, TouchableOpacity } from 'react-native';
import { pure } from 'recompose';
import { Icon } from 'react-native-material-ui';
type Props = { glyph: string, text: string, route: string, onPress: Function, color?: string };
type Props = {
glyph: string,
text: string,
route: string,
onPress: Function,
color?: string,
textStyle?: Object,
};
export default pure(({ glyph, text, color = 'grey', ...others }: Props) => (
export default pure(({ glyph, text, color = 'grey', textStyle, ...others }: Props) => (
<TouchableOpacity {...others}>
<View style={{ flexDirection: 'row', marginTop: 5 }}>
<Icon name={glyph} size={35} color={color} style={{ marginRight: 10 }} />
<Text style={{ lineHeight: 26 }}>{text}</Text>
<View style={{ flexDirection: 'row', alignItems: 'center' }}>
<Icon name={glyph} size={28} color={color} style={{ margin: 5, marginRight: 10 }} />
<Text numberOfLines={2} ellipsizeMode="tail" style={textStyle}>
{text}
</Text>
</View>
</TouchableOpacity>
));

View file

@ -1,7 +1,7 @@
// @flow
import React from 'react';
import { View, Image, ScrollView, TouchableOpacity } from 'react-native';
import theme from '../ui-theme';
import { View, Text, Image, ScrollView } from 'react-native';
import theme, { palette } from '../ui-theme';
import { compose, pure, withState, withHandlers, lifecycle } from 'recompose';
import typeof PlaceRecord from '../records/PlaceRecord';
import {
@ -18,6 +18,8 @@ import typeof FoodItemRecord from '../records/FoodItemRecord';
import FoodItemTile from '../components/FoodItemTile';
import { openUrl } from '../helpers/linkHelpers';
import ActionsButton from '../components/ActionsButton';
import { routeWithQuery } from '../helpers/RouteHelpers';
import { Link } from 'react-router-native';
const { placeDetails: style } = theme;
@ -62,6 +64,15 @@ const PlaceDetail = (props: Props) => {
)}
<CountBadge currentImage={currentImage + 1} totalCount={photos.size} />
</View>
<View style={{ ...contentTileStyle, marginBottom: 10, padding: 10 }}>
<IconButton
glyph="place"
text={place.address}
onPress={viewOnMap}
color={style.actionIconColor}
textStyle={{ fontSize: 16 }}
/>
</View>
<View
style={{
flexDirection: 'column',
@ -70,11 +81,6 @@ const PlaceDetail = (props: Props) => {
paddingTop: 5,
paddingBottom: 10,
}}>
<TouchableOpacity onPress={viewOnMap}>
<View style={{ marginTop: 15, marginBottom: 20 }}>
<StrongText>{place.address}</StrongText>
</View>
</TouchableOpacity>
<IconButton
glyph="favorite"
text="Add to Faves"
@ -83,12 +89,30 @@ const PlaceDetail = (props: Props) => {
/>
<IconButton glyph="phone" text="Call" onPress={phoneCall} color={style.actionIconColor} />
</View>
<View style={{ ...contentTileStyle, paddingTop: 10 }}>
<View style={{ padding: 15, ...contentTileStyle }}>
<StrongText>Products</StrongText>
{!!foodItems &&
foodItems.map(foodItem => (
<FoodItemTile key={foodItem.id} foodItem={foodItem} place={place} />
))}
{!foodItems ||
(!foodItems.size && (
<Link
to={routeWithQuery('/createFoodItem', {
routeTitle: 'Add a Food Item',
placeId: place.id,
})}>
<Text
style={{
marginTop: 15,
marginBottom: 15,
fontSize: 16,
color: palette.accentColor,
}}>
No products yet, add a new one.
</Text>
</Link>
))}
</View>
</ScrollView>
<ActionsButton actions={['add-food']} placeId={place.id} />