From 765c59d6aa0850ad946e1b3dd79de52afee397ee Mon Sep 17 00:00:00 2001
From: Thu Nguyen <tmnguyen@berkeley.edu>
Date: Sun, 19 Apr 2020 19:50:36 -0700
Subject: [PATCH 1/6] componentalizing tags
---
components/store/ProgramTag.js | 47 ++++++++++++++++++++++++++++++++++
1 file changed, 47 insertions(+)
create mode 100644 components/store/ProgramTag.js
diff --git a/components/store/ProgramTag.js b/components/store/ProgramTag.js
new file mode 100644
index 00000000..ec60b8a9
--- /dev/null
+++ b/components/store/ProgramTag.js
@@ -0,0 +1,47 @@
+import { FontAwesome5 } from '@expo/vector-icons';
+import PropTypes from 'prop-types';
+import React from 'react';
+import { Chip } from 'react-native-paper';
+import Colors from '../../constants/Colors';
+
+/**
+ * @prop
+ * */
+
+function ProgramTag({program}) {
+ const programToIcon = {
+ snapOrEbtAccepted: 'credit-card',
+ wic: 'heart',
+ couponProgramPartner: 'carrot',
+ rewardsAccepted: 'star',
+ };
+
+ const programToLabel = {
+ snapOrEbtAccepted: 'EBT',
+ wic: 'WIC',
+ couponProgramPartner: 'SNAP Match',
+ rewardsAccepted: 'Healthy Rewards',
+ }
+ return (
+ <Chip
+ icon={() => (
+ <FontAwesome5
+ name={programToIcon[program]}
+ solid
+ size={10}
+ color={Colors.darkerGreen}
+ style={{ marginTop: -1 }}
+ />
+ )}
+ textStyle={styles.chipText}
+ style={styles.chip}>
+ <Caption color={Colors.darkerGreen}>{programToLabel[]}</Caption>
+ </Chip>
+ );
+}
+
+ProgramTag.propTypes = {
+ callBack: PropTypes.func.isRequired,
+};
+
+export default ProgramTag;
From f5fe5e02f23d237aac5c9b06f83a3a62dd60ab94 Mon Sep 17 00:00:00 2001
From: Thu Nguyen <tmnguyen@berkeley.edu>
Date: Sun, 26 Apr 2020 20:11:59 -0700
Subject: [PATCH 2/6] finished tag componentalization
---
components/store/ProgramTag.js | 58 ++++++++++++++++-----
components/store/StoreCard.js | 69 ++-----------------------
screens/map/StoreDetailsScreen.js | 85 +++----------------------------
3 files changed, 58 insertions(+), 154 deletions(-)
diff --git a/components/store/ProgramTag.js b/components/store/ProgramTag.js
index ec60b8a9..df9de738 100644
--- a/components/store/ProgramTag.js
+++ b/components/store/ProgramTag.js
@@ -3,25 +3,59 @@ import PropTypes from 'prop-types';
import React from 'react';
import { Chip } from 'react-native-paper';
import Colors from '../../constants/Colors';
+import { styles } from '../../styled/store';
+import { Caption } from '../BaseComponents';
/**
* @prop
* */
-function ProgramTag({program}) {
+function capitalizeFirstLetters(word) {
+ // Separate each individual word in phrase
+ const splitWord = word.toLowerCase().split(' ');
+
+ for (var i = 0; i < splitWord.length; i++) {
+ splitWord[i] =
+ splitWord[i].charAt(0).toUpperCase() + splitWord[i].substring(1);
+ }
+
+ return splitWord.join(' ');
+}
+
+// program: a string representing the program name (valid programs are keys in programToIcon)
+function ProgramTag({ program }) {
+ let programLabel = program;
+
+ // Error checking: We'll fix the program label if it was somehow entered incorrectly
+ // i.e. "WIC" was entered as "WIc" or "SNAP Match" was entered as "snap Match"
+ // Hopefully ensures that chips will work most of the time, only not displaying if
+ // they enter the wrong string of words
+ if (
+ (program.toLowerCase() === 'wic' && program !== 'WIC') ||
+ (program.toLowerCase() === 'ebt' && program !== 'EBT')
+ ) {
+ programLabel = program.toUpperCase();
+ }
+
+ if (
+ (program.toLowerCase() === 'snap match' && program !== 'SNAP Match') ||
+ (program.toLowerCase() === 'healthy rewards' &&
+ program !== 'Healthy Rewards')
+ ) {
+ programLabel = capitalizeFirstLetters(program);
+ }
+
const programToIcon = {
- snapOrEbtAccepted: 'credit-card',
- wic: 'heart',
- couponProgramPartner: 'carrot',
- rewardsAccepted: 'star',
+ EBT: 'credit-card',
+ WIC: 'heart',
+ 'SNAP Match': 'carrot',
+ 'Healthy Rewards': 'star',
};
- const programToLabel = {
- snapOrEbtAccepted: 'EBT',
- wic: 'WIC',
- couponProgramPartner: 'SNAP Match',
- rewardsAccepted: 'Healthy Rewards',
+ if (!Object.keys(programToIcon).includes(program)) {
+ return null;
}
+
return (
<Chip
icon={() => (
@@ -35,13 +69,13 @@ function ProgramTag({program}) {
)}
textStyle={styles.chipText}
style={styles.chip}>
- <Caption color={Colors.darkerGreen}>{programToLabel[]}</Caption>
+ <Caption color={Colors.darkerGreen}>{programLabel}</Caption>
</Chip>
);
}
ProgramTag.propTypes = {
- callBack: PropTypes.func.isRequired,
+ program: PropTypes.string.isRequired,
};
export default ProgramTag;
diff --git a/components/store/StoreCard.js b/components/store/StoreCard.js
index 53a6b1f1..3944be9b 100644
--- a/components/store/StoreCard.js
+++ b/components/store/StoreCard.js
@@ -3,7 +3,6 @@ import { useNavigation } from '@react-navigation/native';
import PropTypes from 'prop-types';
import React from 'react';
import { Dimensions, TouchableOpacity } from 'react-native';
-import { Chip } from 'react-native-paper';
import Colors from '../../constants/Colors';
import { formatPhoneNumber } from '../../lib/authUtils';
import {
@@ -21,9 +20,9 @@ import {
DividerBar,
StoreCardContainer,
StoreDetailText,
- styles,
} from '../../styled/store';
import { Caption, Title } from '../BaseComponents';
+import ProgramTag from './ProgramTag';
/**
* @prop
@@ -94,68 +93,10 @@ export default function StoreCard({ store, storeList, seeDistance }) {
flexWrap: 'wrap',
marginTop: 6,
}}>
- {snapOrEbtAccepted && (
- <Chip
- icon={() => (
- <FontAwesome5
- name="credit-card"
- size={10}
- color={Colors.darkerGreen}
- style={{ marginTop: -1 }}
- />
- )}
- textStyle={styles.chipText}
- style={styles.chip}>
- <Caption color={Colors.darkerGreen}>EBT</Caption>
- </Chip>
- )}
- {wic && (
- <Chip
- icon={() => (
- <FontAwesome5
- name="heart"
- solid
- size={10}
- color={Colors.darkerGreen}
- style={{ marginTop: -1 }}
- />
- )}
- textStyle={styles.chipText}
- style={styles.chip}>
- <Caption color={Colors.darkerGreen}>WIC</Caption>
- </Chip>
- )}
- {couponProgramPartner && (
- <Chip
- icon={() => (
- <FontAwesome5
- name="carrot"
- size={10}
- color={Colors.darkerGreen}
- style={{ marginTop: -1 }}
- />
- )}
- textStyle={styles.chipText}
- style={styles.chip}>
- <Caption color={Colors.darkerGreen}>SNAP Match</Caption>
- </Chip>
- )}
- {rewardsAccepted && (
- <Chip
- icon={() => (
- <FontAwesome5
- name="star"
- solid
- size={10}
- color={Colors.darkerGreen}
- style={{ marginTop: -1 }}
- />
- )}
- textStyle={styles.chipText}
- style={styles.chip}>
- <Caption color={Colors.darkerGreen}>Healthy Rewards</Caption>
- </Chip>
- )}
+ {snapOrEbtAccepted && <ProgramTag program="EBT" />}
+ {wic && <ProgramTag program="WIC" />}
+ {couponProgramPartner && <ProgramTag program="SNAP Match" />}
+ {rewardsAccepted && <ProgramTag program="Healthy Rewards" />}
</InLineContainer>
)}
{seeDistance && (
diff --git a/screens/map/StoreDetailsScreen.js b/screens/map/StoreDetailsScreen.js
index 77cb62d7..3c2057c3 100644
--- a/screens/map/StoreDetailsScreen.js
+++ b/screens/map/StoreDetailsScreen.js
@@ -3,24 +3,13 @@ import { Linking } from 'expo';
import PropTypes from 'prop-types';
import React from 'react';
import { ScrollView, TouchableOpacity, View } from 'react-native';
-import { Chip } from 'react-native-paper';
-import {
- Body,
- Caption,
- NavButton,
- NavHeaderContainer,
- NavTitle,
- TabSelected,
-} from '../../components/BaseComponents';
+import { Body, Caption, NavButton, NavHeaderContainer, NavTitle, TabSelected } from '../../components/BaseComponents';
+import ProgramTag from '../../components/store/ProgramTag';
import StoreHours from '../../components/store/StoreHours';
import Colors from '../../constants/Colors';
import { formatPhoneNumber } from '../../lib/authUtils';
import { openDirections, writeToClipboard } from '../../lib/mapUtils';
-import {
- ColumnContainer,
- InLineContainer,
- RowContainer,
-} from '../../styled/shared';
+import { ColumnContainer, InLineContainer, RowContainer } from '../../styled/shared';
import { styles } from '../../styled/store';
export default class StoreDetailsScreen extends React.Component {
@@ -172,70 +161,10 @@ export default class StoreDetailsScreen extends React.Component {
justifyContent: 'space-evenly',
width: '40%',
}}>
- {snapOrEbtAccepted && (
- <Chip
- icon={() => (
- <FontAwesome5
- name="credit-card"
- size={10}
- color={Colors.darkerGreen}
- style={{ marginTop: -1 }}
- />
- )}
- textStyle={styles.chipText}
- style={styles.chip}>
- <Caption color={Colors.darkerGreen}>EBT</Caption>
- </Chip>
- )}
- {wic && (
- <Chip
- icon={() => (
- <FontAwesome5
- name="heart"
- size={10}
- color={Colors.darkerGreen}
- style={{ marginTop: -1 }}
- />
- )}
- textStyle={styles.chipText}
- style={styles.chip}>
- <Caption color={Colors.darkerGreen}>WIC</Caption>
- </Chip>
- )}
- {couponProgramPartner && (
- <Chip
- icon={() => (
- <FontAwesome5
- name="carrot"
- size={10}
- color={Colors.darkerGreen}
- style={{ marginTop: -1 }}
- />
- )}
- textStyle={styles.chipText}
- style={styles.chip}>
- <Caption color={Colors.darkerGreen}>SNAP Match</Caption>
- </Chip>
- )}
-
- {rewardsAccepted && (
- <Chip
- icon={() => (
- <FontAwesome5
- name="star"
- solid
- size={10}
- color={Colors.darkerGreen}
- style={{ marginTop: -1 }}
- />
- )}
- textStyle={styles.chipText}
- style={styles.chip}>
- <Caption color={Colors.darkerGreen}>
- Healthy Rewards
- </Caption>
- </Chip>
- )}
+ {snapOrEbtAccepted && <ProgramTag program="EBT" />}
+ {wic && <ProgramTag program="WIC" />}
+ {couponProgramPartner && <ProgramTag program="SNAP Match" />}
+ {rewardsAccepted && <ProgramTag program="Healthy Rewards" />}
</View>
<View
style={{
From 0b1c723d114de1e74d6ee8cf05ef74dd7c12eef5 Mon Sep 17 00:00:00 2001
From: Thu Nguyen <tmnguyen@berkeley.edu>
Date: Sun, 26 Apr 2020 20:46:06 -0700
Subject: [PATCH 3/6] added no programs accepted text
---
components/store/ProgramTag.js | 2 +-
screens/map/StoreDetailsScreen.js | 122 ++++++++++++++++++------------
2 files changed, 74 insertions(+), 50 deletions(-)
diff --git a/components/store/ProgramTag.js b/components/store/ProgramTag.js
index df9de738..c146f0b6 100644
--- a/components/store/ProgramTag.js
+++ b/components/store/ProgramTag.js
@@ -69,7 +69,7 @@ function ProgramTag({ program }) {
)}
textStyle={styles.chipText}
style={styles.chip}>
- <Caption color={Colors.darkerGreen}>{programLabel}</Caption>
+ <Caption color={Colors.darkerGreen}>{programLabel}</Caption>
</Chip>
);
}
diff --git a/screens/map/StoreDetailsScreen.js b/screens/map/StoreDetailsScreen.js
index 3c2057c3..03be7ea2 100644
--- a/screens/map/StoreDetailsScreen.js
+++ b/screens/map/StoreDetailsScreen.js
@@ -3,13 +3,24 @@ import { Linking } from 'expo';
import PropTypes from 'prop-types';
import React from 'react';
import { ScrollView, TouchableOpacity, View } from 'react-native';
-import { Body, Caption, NavButton, NavHeaderContainer, NavTitle, TabSelected } from '../../components/BaseComponents';
+import {
+ Body,
+ Caption,
+ NavButton,
+ NavHeaderContainer,
+ NavTitle,
+ TabSelected,
+} from '../../components/BaseComponents';
import ProgramTag from '../../components/store/ProgramTag';
import StoreHours from '../../components/store/StoreHours';
import Colors from '../../constants/Colors';
import { formatPhoneNumber } from '../../lib/authUtils';
import { openDirections, writeToClipboard } from '../../lib/mapUtils';
-import { ColumnContainer, InLineContainer, RowContainer } from '../../styled/shared';
+import {
+ ColumnContainer,
+ InLineContainer,
+ RowContainer,
+} from '../../styled/shared';
import { styles } from '../../styled/store';
export default class StoreDetailsScreen extends React.Component {
@@ -153,53 +164,66 @@ export default class StoreDetailsScreen extends React.Component {
<ColumnContainer style={{ width: '100%' }}>
<Body style={{ marginBottom: 8 }}>Accepted Programs</Body>
{/* Chips */}
- <RowContainer>
- <View
- style={{
- flexDirection: 'column',
- alignItems: 'flex-start',
- justifyContent: 'space-evenly',
- width: '40%',
- }}>
- {snapOrEbtAccepted && <ProgramTag program="EBT" />}
- {wic && <ProgramTag program="WIC" />}
- {couponProgramPartner && <ProgramTag program="SNAP Match" />}
- {rewardsAccepted && <ProgramTag program="Healthy Rewards" />}
- </View>
- <View
- style={{
- flexDirection: 'column',
- flexWrap: 'wrap',
- maxWidth: '60%',
- }}>
- {snapOrEbtAccepted && (
- <View style={styles.chipDesc}>
- <Body>Accepts SNAP/EBT</Body>
- </View>
- )}
- {wic && (
- <View style={styles.chipDesc}>
- <Body numberOfLines={1} ellipsizeMode="tail">
- WIC approved
- </Body>
- </View>
- )}
- {couponProgramPartner && (
- <View style={styles.chipDesc}>
- <Body numberOfLines={1} ellipsizeMode="tail">
- Accepts SNAP Matching
- </Body>
- </View>
- )}
- {rewardsAccepted && (
- <View style={styles.chipDesc}>
- <Body numberOfLines={1} ellipsizeMode="tail">
- Accepts Healthy Rewards
- </Body>
- </View>
- )}
- </View>
- </RowContainer>
+ {snapOrEbtAccepted ||
+ wic ||
+ couponProgramPartner ||
+ rewardsAccepted ? (
+ <RowContainer>
+ <View
+ style={{
+ flexDirection: 'column',
+ alignItems: 'flex-start',
+ justifyContent: 'space-evenly',
+ width: '40%',
+ }}>
+ {snapOrEbtAccepted && <ProgramTag program="EBT" />}
+ {wic && <ProgramTag program="WIC" />}
+ {couponProgramPartner && (
+ <ProgramTag program="SNAP Match" />
+ )}
+ {rewardsAccepted && (
+ <ProgramTag program="Healthy Rewards" />
+ )}
+ </View>
+ <View
+ style={{
+ flexDirection: 'column',
+ flexWrap: 'wrap',
+ maxWidth: '60%',
+ }}>
+ {snapOrEbtAccepted && (
+ <View style={styles.chipDesc}>
+ <Body>Accepts SNAP/EBT</Body>
+ </View>
+ )}
+ {wic && (
+ <View style={styles.chipDesc}>
+ <Body numberOfLines={1} ellipsizeMode="tail">
+ WIC approved
+ </Body>
+ </View>
+ )}
+ {couponProgramPartner && (
+ <View style={styles.chipDesc}>
+ <Body numberOfLines={1} ellipsizeMode="tail">
+ Accepts SNAP Matching
+ </Body>
+ </View>
+ )}
+ {rewardsAccepted && (
+ <View style={styles.chipDesc}>
+ <Body numberOfLines={1} ellipsizeMode="tail">
+ Accepts Healthy Rewards
+ </Body>
+ </View>
+ )}
+ </View>
+ </RowContainer>
+ ) : (
+ <Body color={Colors.secondaryText}>
+ No programs accepted at this time
+ </Body>
+ )}
</ColumnContainer>
</InLineContainer>
</ScrollView>
From 19f7b89727231a67019871af7f73ad6a5fc84dab Mon Sep 17 00:00:00 2001
From: Thu Nguyen <tmnguyen@berkeley.edu>
Date: Tue, 28 Apr 2020 23:36:57 -0700
Subject: [PATCH 4/6] fixed store program description wrap bug
---
components/store/AcceptedPrograms.js | 86 ++++++++++++++++++++++++++++
screens/map/StoreDetailsScreen.js | 66 +++------------------
styled/store.js | 4 +-
3 files changed, 96 insertions(+), 60 deletions(-)
create mode 100644 components/store/AcceptedPrograms.js
diff --git a/components/store/AcceptedPrograms.js b/components/store/AcceptedPrograms.js
new file mode 100644
index 00000000..ce57516d
--- /dev/null
+++ b/components/store/AcceptedPrograms.js
@@ -0,0 +1,86 @@
+import { FontAwesome5 } from '@expo/vector-icons';
+import { Linking } from 'expo';
+import PropTypes from 'prop-types';
+import React from 'react';
+import { TouchableOpacity, View } from 'react-native';
+import Colors from '../../constants/Colors';
+import { ColumnContainer, SpaceBetweenRowContainer } from '../../styled/shared';
+import { styles } from '../../styled/store';
+import { Body, TabSelected } from '../BaseComponents';
+import ProgramTag from './ProgramTag';
+
+/**
+ * @prop
+ * */
+
+const programToDesc = {
+ EBT: 'Accepts SNAP/EBT',
+ WIC: 'WIC approved',
+ 'SNAP Match':
+ 'Spend $5 with SNAP and include fresh produce in purchase to get $5 free on fresh produce',
+ 'Healthy Rewards': 'Accepts Healthy Rewards',
+};
+
+const snapURL = 'https://dccentralkitchen.org/5for5/';
+
+function Program({ programName }) {
+ return (
+ <SpaceBetweenRowContainer>
+ <ProgramTag program={programName} />
+ <View style={styles.tagChipDesc}>
+ <Body>{programToDesc[programName]}</Body>
+ {programName === 'SNAP Match' && (
+ <TouchableOpacity
+ style={{ flexDirection: 'row' }}
+ onPress={() => Linking.openURL(snapURL)}>
+ <TabSelected
+ color={Colors.primaryOrange}
+ style={{ marginRight: 4 }}>
+ Learn More
+ </TabSelected>
+ <FontAwesome5
+ name="external-link-alt"
+ size={14}
+ color={Colors.primaryOrange}
+ />
+ </TouchableOpacity>
+ )}
+ </View>
+ </SpaceBetweenRowContainer>
+ );
+}
+
+export default function AcceptedPrograms({
+ snapOrEbtAccepted,
+ wic,
+ couponProgramPartner,
+ rewardsAccepted,
+}) {
+ return (
+ <ColumnContainer
+ style={{ justifyContent: 'space-between', paddingRight: '20%' }}>
+ {snapOrEbtAccepted && <Program programName="EBT" />}
+ {wic && <Program programName="WIC" />}
+ {couponProgramPartner && <Program programName="SNAP Match" />}
+ {rewardsAccepted && <Program programName="Healthy Rewards" />}
+ </ColumnContainer>
+ );
+}
+
+AcceptedPrograms.propTypes = {
+ snapOrEbtAccepted: PropTypes.bool,
+ wic: PropTypes.bool,
+ couponProgramPartner: PropTypes.bool,
+ rewardsAccepted: PropTypes.bool,
+};
+
+AcceptedPrograms.defaultProps = {
+ snapOrEbtAccepted: false,
+ wic: false,
+ couponProgramPartner: false,
+ rewardsAccepted: false,
+};
+
+Program.propTypes = {
+ programName: PropTypes.string.isRequired,
+};
diff --git a/screens/map/StoreDetailsScreen.js b/screens/map/StoreDetailsScreen.js
index b69e1ae8..69a2dfc4 100644
--- a/screens/map/StoreDetailsScreen.js
+++ b/screens/map/StoreDetailsScreen.js
@@ -11,16 +11,11 @@ import {
NavTitle,
TabSelected,
} from '../../components/BaseComponents';
-import ProgramTag from '../../components/store/ProgramTag';
+import AcceptedPrograms from '../../components/store/AcceptedPrograms';
import StoreHours from '../../components/store/StoreHours';
import Colors from '../../constants/Colors';
import { openDirections, writeToClipboard } from '../../lib/mapUtils';
-import {
- ColumnContainer,
- InLineContainer,
- RowContainer,
-} from '../../styled/shared';
-import { styles } from '../../styled/store';
+import { ColumnContainer, InLineContainer } from '../../styled/shared';
export default class StoreDetailsScreen extends React.Component {
constructor(props) {
@@ -166,57 +161,12 @@ export default class StoreDetailsScreen extends React.Component {
wic ||
couponProgramPartner ||
rewardsAccepted ? (
- <RowContainer>
- <View
- style={{
- flexDirection: 'column',
- alignItems: 'flex-start',
- justifyContent: 'space-evenly',
- width: '40%',
- }}>
- {snapOrEbtAccepted && <ProgramTag program="EBT" />}
- {wic && <ProgramTag program="WIC" />}
- {couponProgramPartner && (
- <ProgramTag program="SNAP Match" />
- )}
- {rewardsAccepted && (
- <ProgramTag program="Healthy Rewards" />
- )}
- </View>
- <View
- style={{
- flexDirection: 'column',
- flexWrap: 'wrap',
- maxWidth: '60%',
- }}>
- {snapOrEbtAccepted && (
- <View style={styles.tagChipDesc}>
- <Body>Accepts SNAP/EBT</Body>
- </View>
- )}
- {wic && (
- <View style={styles.tagChipDesc}>
- <Body numberOfLines={1} ellipsizeMode="tail">
- WIC approved
- </Body>
- </View>
- )}
- {couponProgramPartner && (
- <View style={styles.tagChipDesc}>
- <Body numberOfLines={1} ellipsizeMode="tail">
- Accepts SNAP Matching
- </Body>
- </View>
- )}
- {rewardsAccepted && (
- <View style={styles.tagChipDesc}>
- <Body numberOfLines={1} ellipsizeMode="tail">
- Accepts Healthy Rewards
- </Body>
- </View>
- )}
- </View>
- </RowContainer>
+ <AcceptedPrograms
+ snapOrEbtAccepted={snapOrEbtAccepted}
+ wic={wic}
+ couponProgramPartner={couponProgramPartner}
+ rewardsAccepted={rewardsAccepted}
+ />
) : (
<Body color={Colors.secondaryText}>
No programs accepted at this time
diff --git a/styled/store.js b/styled/store.js
index 994fae8b..c95f16ed 100644
--- a/styled/store.js
+++ b/styled/store.js
@@ -1,6 +1,5 @@
import { StyleSheet } from 'react-native';
import styled from 'styled-components/native';
-
import { Body, ButtonContainer } from '../components/BaseComponents';
import Colors from '../constants/Colors';
@@ -133,7 +132,8 @@ export const styles = StyleSheet.create({
tagChipDesc: {
flex: 1,
paddingBottom: 10,
- justifyContent: 'center',
+ justifyContent: 'flex-end',
+ maxWidth: '50%',
},
tagChipText: {
minHeight: 16,
From f3ded96c725a67abc6f2e8a0af3530fcc7d1cc30 Mon Sep 17 00:00:00 2001
From: Thu Nguyen <tmnguyen@berkeley.edu>
Date: Tue, 28 Apr 2020 23:40:21 -0700
Subject: [PATCH 5/6] moved accepted programs to the top of store details
screen
---
components/store/AcceptedPrograms.js | 2 +-
screens/map/StoreDetailsScreen.js | 58 ++++++++++++++--------------
2 files changed, 30 insertions(+), 30 deletions(-)
diff --git a/components/store/AcceptedPrograms.js b/components/store/AcceptedPrograms.js
index ce57516d..46b1dcad 100644
--- a/components/store/AcceptedPrograms.js
+++ b/components/store/AcceptedPrograms.js
@@ -18,7 +18,7 @@ const programToDesc = {
WIC: 'WIC approved',
'SNAP Match':
'Spend $5 with SNAP and include fresh produce in purchase to get $5 free on fresh produce',
- 'Healthy Rewards': 'Accepts Healthy Rewards',
+ 'Healthy Rewards': 'Participates in Healthy Rewards',
};
const snapURL = 'https://dccentralkitchen.org/5for5/';
diff --git a/screens/map/StoreDetailsScreen.js b/screens/map/StoreDetailsScreen.js
index 69a2dfc4..9f0c4a4b 100644
--- a/screens/map/StoreDetailsScreen.js
+++ b/screens/map/StoreDetailsScreen.js
@@ -50,6 +50,35 @@ export default class StoreDetailsScreen extends React.Component {
<NavTitle>{storeName}</NavTitle>
</NavHeaderContainer>
<ScrollView style={{ marginLeft: 16, marginTop: 30 }}>
+ {/* Accepted Programs */}
+ <InLineContainer style={{ paddingBottom: 32 }}>
+ <FontAwesome5
+ name="star"
+ solid
+ size={24}
+ color={Colors.activeText}
+ style={{ marginRight: 12 }}
+ />
+ <ColumnContainer style={{ width: '100%' }}>
+ <Body style={{ marginBottom: 8 }}>Accepted Programs</Body>
+ {/* Chips */}
+ {snapOrEbtAccepted ||
+ wic ||
+ couponProgramPartner ||
+ rewardsAccepted ? (
+ <AcceptedPrograms
+ snapOrEbtAccepted={snapOrEbtAccepted}
+ wic={wic}
+ couponProgramPartner={couponProgramPartner}
+ rewardsAccepted={rewardsAccepted}
+ />
+ ) : (
+ <Body color={Colors.secondaryText}>
+ No programs accepted at this time
+ </Body>
+ )}
+ </ColumnContainer>
+ </InLineContainer>
{/* Directions */}
<View style={{ paddingBottom: 32 }}>
<InLineContainer>
@@ -145,35 +174,6 @@ export default class StoreDetailsScreen extends React.Component {
<StoreHours hours={storeHours} />
</View>
</InLineContainer>
- {/* Accepted Programs */}
- <InLineContainer style={{ paddingBottom: 32 }}>
- <FontAwesome5
- name="star"
- solid
- size={24}
- color={Colors.activeText}
- style={{ marginRight: 12 }}
- />
- <ColumnContainer style={{ width: '100%' }}>
- <Body style={{ marginBottom: 8 }}>Accepted Programs</Body>
- {/* Chips */}
- {snapOrEbtAccepted ||
- wic ||
- couponProgramPartner ||
- rewardsAccepted ? (
- <AcceptedPrograms
- snapOrEbtAccepted={snapOrEbtAccepted}
- wic={wic}
- couponProgramPartner={couponProgramPartner}
- rewardsAccepted={rewardsAccepted}
- />
- ) : (
- <Body color={Colors.secondaryText}>
- No programs accepted at this time
- </Body>
- )}
- </ColumnContainer>
- </InLineContainer>
</ScrollView>
</View>
);
From 211840cbcddc94a7af485b0f240366624efb664c Mon Sep 17 00:00:00 2001
From: Annie Wang <anniedwang02@gmail.com>
Date: Wed, 29 Apr 2020 19:53:00 -0700
Subject: [PATCH 6/6] Added store details scrollview fix
---
screens/map/StoreDetailsScreen.js | 8 ++++----
1 file changed, 4 insertions(+), 4 deletions(-)
diff --git a/screens/map/StoreDetailsScreen.js b/screens/map/StoreDetailsScreen.js
index 9f0c4a4b..c6f84cb9 100644
--- a/screens/map/StoreDetailsScreen.js
+++ b/screens/map/StoreDetailsScreen.js
@@ -42,16 +42,16 @@ export default class StoreDetailsScreen extends React.Component {
} = store;
return (
- <View>
- <NavHeaderContainer withMargin>
+ <View style={{ flex: 1 }}>
+ <NavHeaderContainer>
<NavButton onPress={() => this.props.navigation.goBack()}>
<FontAwesome5 name="arrow-left" solid size={24} />
</NavButton>
<NavTitle>{storeName}</NavTitle>
</NavHeaderContainer>
- <ScrollView style={{ marginLeft: 16, marginTop: 30 }}>
+ <ScrollView style={{ marginLeft: 16 }}>
{/* Accepted Programs */}
- <InLineContainer style={{ paddingBottom: 32 }}>
+ <InLineContainer style={{ paddingBottom: 32, marginTop: 30 }}>
<FontAwesome5
name="star"
solid