Merge branch 'master' of https://github.com/jesus-collective/mobile

jesus-collective · Dec 8, 2020 · e5f35a7 · e5f35a7
2 parents d5d6881 + 6377289
commit e5f35a7
Show file tree

Hide file tree

Showing 17 changed files with 507 additions and 109 deletions.
diff --git a/assets/svg/business-and-trade.svg b/assets/svg/business-and-trade.svg
diff --git a/assets/svg/person-silhouette.svg b/assets/svg/person-silhouette.svg
diff --git a/components/CourseViewer/CourseDetail.tsx b/components/CourseViewer/CourseDetail.tsx
@@ -330,6 +330,7 @@ class CourseDetailImpl extends JCComponent<Props, State>{
   }
   navigate(id) {
     window.location.href = id
+
   }
   renderYoutube(state: CourseState, actions: any, week, lesson) {
     return (
@@ -342,13 +343,13 @@ class CourseDetailImpl extends JCComponent<Props, State>{
             <Text style={this.styles.style.courseDetailLessonText}>Lesson {state.activeLesson + 1} - {lesson.name}</Text>
           </Container>
           <Image style={this.styles.style.courseDetailCalendarImage} source={require('../../assets/svg/calendar.svg')}></Image>
-          <Text style={{ fontSize: 16, lineHeight: 21, fontFamily: 'Graphik-Regular-App', color: '#333333', marginTop: 45 }}>{lesson.time}</Text>
+          <Text style={this.styles.style.detailsYoutubeDateText}>{lesson.time}</Text>
         </Container>
         <Container style={{ width: '100%'}}>
           <Container style={this.styles.style.courseDetailHr}></Container>
           {lesson.zoomRecording && lesson.zoomRecording != "" ?
             <iframe title="Youtube" src={"https://www.youtube.com/embed/" + lesson.zoomRecording}
-              style={{ width: "80vw", height: "60vw", marginBottom: 20 }}
+              style={{ width: "95%", height: "95%", marginBottom: 20 }}
               frameBorder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
               allowFullScreen></iframe>
 
@@ -427,7 +428,7 @@ class CourseDetailImpl extends JCComponent<Props, State>{
             <Text style={this.styles.style.courseDetailCalendarText}>{lesson.time}</Text>
           </Container>
         </Container>
-        <Container>
+        <Container style={{ width: '100%' }}>
           <Container style={{ borderBottomColor: '#333333', opacity: 0.2, borderBottomWidth: 1, width: '95%', marginBottom: 30, marginTop: 30 }}></Container>
           <EditableRichText onChange={(val) => { actions.updateLesson(state.activeWeek, state.activeLesson, "description", val) }}
             value={lesson.description}

diff --git a/components/Forms/EditableDate.tsx b/components/Forms/EditableDate.tsx
@@ -90,7 +90,7 @@ export default class EditableDate extends JCComponent<Props> {
                             />
                             <Picker
                                 mode="dropdown"
-                                style={{ width: "75%", marginBottom: 15, marginTop: 15, fontSize: 16, height: 30, flexGrow: 0, paddingTop: 3, paddingBottom: 3 }}
+                                style={{ width: "100%", marginBottom: 15, marginTop: 15, fontSize: 16, height: 30, flexGrow: 0, paddingTop: 3, paddingBottom: 3 }}
                                 selectedValue={this.props.tz}
                                 placeholder="Timezone"
                                 placeholderStyle={{ color: "#bfc6ea" }}

diff --git a/components/Forms/EditableUrl.tsx b/components/Forms/EditableUrl.tsx
@@ -23,7 +23,8 @@ class EditableUrlImpl extends JCComponent<Props> {
             this.props.onChange(val.target.value)
     }
     navigate(id: string) {
-        window.location.href = id
+        // window.location.href = id
+        window.open(this.props.value, '_blank');
     }
     render() {
 

diff --git a/components/Forms/JCButton.tsx b/components/Forms/JCButton.tsx
@@ -10,6 +10,7 @@ export enum ButtonTypes {
     AdminOutline,
     AdminSmallOutline,
     AdminAdd,
+    AdminInvite,
     CourseSideBar,
     CourseSideBarFirst,
     CourseHome,

diff --git a/components/Forms/JCButtonStyle.ts b/components/Forms/JCButtonStyle.ts
@@ -71,8 +71,8 @@ export default EStyleSheet.create({
         paddingBottom: 10,
         paddingLeft: 29,
         paddingRight: 29,
-        marginLeft: 10,
-        marginRight: 10,
+        marginLeft: 30,
+        marginRight: 30,
         //    color:"#F0493E",
         backgroundColor: "#ffffff",
         borderWidth: 1,
@@ -91,7 +91,7 @@ export default EStyleSheet.create({
         paddingBottom: 7,
         paddingLeft: 7,
         paddingRight: 7,
-        marginLeft: 10,
+        marginLeft: 0,
         marginRight: 0,
         //    color:"#F0493E",
         backgroundColor: "#ffffff",
@@ -124,6 +124,24 @@ export default EStyleSheet.create({
         textAlign: 'center',
         width: '100%'
     },
+    AdminInviteButton: {
+        paddingTop: 7,
+        paddingBottom: 7,
+        paddingLeft: 7,
+        paddingRight: 7,
+        backgroundColor: "#F0493E",
+        boxShadow: "unset",
+        width: '100%',
+        marginTop: 10,
+    },
+    AdminInviteText: {
+        color: "#FFFFFF",
+        fontFamily: 'Graphik-Regular-App',
+        fontSize: 16,
+        padding: 5, 
+        textAlign: 'center',
+        width: '100%'
+    },
     AdminModalButton: {
         backgroundColor: "#FFFFFF",
     },
@@ -1107,6 +1125,10 @@ export default EStyleSheet.create({
             paddingRight: 0,
             paddingLeft: 0,
         },
+        AdminSmallOutlineButton: {
+            paddingLeft: 3,
+            paddingRight: 3,
+        },
     },
     // Media Query Mobile
     '@media (min-width: 320px) and (max-width: 480px)': {

diff --git a/components/Header/style.ts b/components/Header/style.ts
@@ -39,10 +39,18 @@ export default class HeaderStyles {
 
                 display: Platform.OS === 'web' && Dimensions.get('window').width > 720 ? 'none' : 'flex',
             },
+            // leftButtonsSubNav: {
+
+            //     display: Platform.OS === 'web' && Dimensions.get('window').width > 720 ? 'none' : 'flex',
+            // },
             centerMenuButtons: {
                 display: Platform.OS === 'web' && Dimensions.get('window').width > 720 ? 'flex' : 'none',
                 paddingBottom: 12
             },
+            centerMenuButtonsSubNav: {
+                display: 'flex',
+                paddingBottom: 12
+            },
             centerMenuButtonsText: {
                 color: '#aaaaaa',
                 fontSize: 15,
@@ -102,6 +110,9 @@ export default class HeaderStyles {
                 resourceContainer: {
                     overflowX: 'scroll'
                 },
+                centerMenuButtonsSubNav: {
+                    overflowX: 'scroll',
+                },
             },
 
         });

diff --git a/components/HeaderAdmin/HeaderAdmin.tsx b/components/HeaderAdmin/HeaderAdmin.tsx
@@ -80,55 +80,56 @@ export default class HeaderJC extends JCComponent<Props> {
     return (
 
       <Header style={this.headerStyles.style.adminContainer}>
-        <Left>
-          <Button style={this.headerStyles.style.leftButtons}
+        {/* <Left>
+          <Button style={this.headerStyles.style.leftButtonsSubNav}
             transparent
             onPress={this.openDrawer}>
             <Ionicons name="md-menu" style={this.headerStyles.style.icon} />
           </Button>
-        </Left>
+        </Left> */}
         <Body style={this.styles.style.adminSubNav}>
           <Button
             transparent
             data-testId="header-events"
             onPress={this.openAdmin}
-            style={this.headerStyles.style.centerMenuButtons}>
+            style={this.headerStyles.style.centerMenuButtonsSubNav}>
             <Text style={this.headerStyles.style.centerMenuButtonsText}>Admin</Text>
           </Button>
           <Button
             transparent
             data-testid="header-events"
             onPress={this.openAdminCRM}
-            style={this.headerStyles.style.centerMenuButtons}>
+            style={this.headerStyles.style.centerMenuButtonsSubNav}>
             <Text style={this.headerStyles.style.centerMenuButtonsText}>CRM</Text>
           </Button>
+
           <Button
             transparent
             data-testid="header-events"
             onPress={this.openProducts}
-            style={this.headerStyles.style.centerMenuButtons}>
+            style={this.headerStyles.style.centerMenuButtonsSubNav}>
             <Text style={this.headerStyles.style.centerMenuButtonsText}>Products</Text>
           </Button>
           <Button
             transparent
             data-testId="header-events"
             onPress={this.openEvents}
-            style={this.headerStyles.style.centerMenuButtons}>
+            style={this.headerStyles.style.centerMenuButtonsSubNav}>
             <Text style={this.headerStyles.style.centerMenuButtonsText}>Stats</Text>
           </Button>
           <Button
             transparent
             data-testId="header-events"
             onPress={this.openEvents}
-            style={this.headerStyles.style.centerMenuButtons}>
+            style={this.headerStyles.style.centerMenuButtonsSubNav}>
             <Text style={this.headerStyles.style.centerMenuButtonsText}>Config</Text>
           </Button>
 
         </Body>
-        <Right>
+        {/* <Right>
 
 
-        </Right>
+        </Right> */}
       </Header>
     )
   }

diff --git a/components/JCSwitch/JCSwitch.tsx b/components/JCSwitch/JCSwitch.tsx
@@ -66,7 +66,7 @@ export default class JCSwitch extends JCComponent<Props, State> {
   }
 
   render(): React.ReactNode {
-    return <View style={{ width: this.props.containerWidth ? this.props.containerWidth : 170 , flexDirection: 'row', justifyContent: this.props.toggleSpacing ? 'space-between' : null, marginTop: this.props.toggleMargin ? 10 : null, marginBottom: this.props.toggleMargin ? 10 : null }}>
+    return <View style={{ width: this.props.containerWidth ? this.props.containerWidth : 175 , flexDirection: 'row', justifyContent: this.props.toggleSpacing ? 'space-between' : null, marginTop: this.props.toggleMargin ? 10 : null, marginBottom: this.props.toggleMargin ? 10 : null }}>
       <Text style={this.styles.style.fontMyMapOptions}>{this.props.switchLabel}</Text>
       <TouchableWithoutFeedback onPress={() => this.onPress()}>
         <View style={{

diff --git a/components/MyMap/MyMap.web.tsx b/components/MyMap/MyMap.web.tsx
@@ -197,12 +197,12 @@ class MyMapImpl extends JCComponent<Props, State> {
                 <JCSwitch switchLabel="Show Events" initState={false} onPress={() => this.setState({ eventsEnabled: !this.state.eventsEnabled })}></JCSwitch>
                 <JCSwitch switchLabel="Show Profiles" initState={true} onPress={() => this.setState({ profilesEnabled: !this.state.profilesEnabled })}></JCSwitch>
                 <JCSwitch switchLabel="Show Organizations" initState={true} containerWidth={200} onPress={() => this.setState({ organizationsEnabled: !this.state.organizationsEnabled })}></JCSwitch>
-                <View style={{ flex: 1, flexDirection: 'row', justifyContent: 'flex-end', paddingRight: '2%' }}>
-                  <View style={{ flexDirection: 'row', alignItems: 'center', paddingLeft: 20 }}>
+                <View style={this.styles.style.partnerFriendsLegend}>
+                  <View style={this.styles.style.partnerLegend}>
                     <View style={{ backgroundColor: '#f0493e', borderRadius: 25, width: 25, height: 13, }}></View>
                     <Text style={this.styles.style.fontMyMapLegend}>Partners</Text>
                   </View>
-                  <View style={{ flexDirection: 'row', alignItems: 'center', paddingLeft: 20 }}>
+                  <View style={this.styles.style.friendsLegend}>
                     <View style={{ backgroundColor: '#ffb931', borderRadius: 25, width: 25, height: 13 }}></View>
                     <Text style={this.styles.style.fontMyMapLegend}>Friends</Text>
                   </View>
@@ -242,10 +242,16 @@ class MyMapImpl extends JCComponent<Props, State> {
                           mapItem={mapItem}
                           onClick={this.onMarkerClick}
                           position={{ lat: mapItem.latitude, lng: mapItem.longitude }}
-                          icon={{
+                          icon={this.state.eventsEnabled ? {
                             url: require("../../assets/svg/map-icon-red.svg"),
                             scaledSize: new google.maps.Size(32, 32)
-                          }}>
+                          } : this.state.organizationsEnabled ? {
+                            url: require("../../assets/svg/business-and-trade.svg"),
+                            scaledSize: new google.maps.Size(32, 32)
+                          } : {
+                            url: require("../../assets/svg/person-silhouette.svg"),
+                            scaledSize: new google.maps.Size(32, 32)
+                          } }>
                         </Marker>
                       }
 

diff --git a/components/MyPeople/MyPeople.tsx b/components/MyPeople/MyPeople.tsx
@@ -113,7 +113,7 @@ export default class MyPeople extends JCComponent<Props, State> {
                       <Card style={this.styles.style.dashboardConversationCard}>
                         <CardItem>
                           <Left style={this.styles.style.dashboardConversationCardLeft}>
-                            <ProfileImage user={item} size='medium' style='my-people' />
+                            <ProfileImage user={item} size='small2' style='my-people' />
 
                             <Body style={this.styles.style.dashboardConversationBody}>
                               <Text style={this.styles.style.fontConnectWithName}>{item.given_name} {item.family_name}</Text>

diff --git a/components/ProfileImage/ProfileImage.tsx b/components/ProfileImage/ProfileImage.tsx
@@ -11,7 +11,7 @@ Amplify.configure(awsconfig);
 
 interface Props {
     user: any
-    size: "small" | "xsmall" | "medium" | "large" | "small2" | "small3"
+    size: "small" | "xsmall" | "medium" | "large" | "small2" | "small3" | 'small4'
     style?: 'map' | 'my-people' | 'courseProfile'
     isOrg?: boolean
     linkToProfile?: boolean
@@ -118,7 +118,7 @@ class MyProfileImpl extends JCComponent<Props, State> {
                     { width: "20px", height: "20px", borderRadius: 18, marginRight: 5, marginBottom: 5 }
                     : this.props.size == 'small' ?
                         this.styles.style.smallProfileImageMBoard : this.props.size == 'small3' ?
-                            this.styles.style.smallProfileImageConversations :
+                            this.styles.style.smallProfileImageConversations : this.props.size == 'small4' ? this.styles.style.small4ProfileImageConversations : 
                             this.props.size == 'small2' ?
                                 { width: "50px", height: "66px", borderRadius: 120, marginRight: 10, marginBottom: 0, marginLeft: 10, top: 0 } :
                                 this.props.style === "map" || this.props.style === "my-people" ? { width: "80px", height: "96px", borderRadius: 120, marginRight: 10, marginBottom: 15 } : this.props.style === 'courseProfile' ? { width: "80px", height: "96px", borderRadius: 120, marginRight: 10, marginBottom: 15, alignSelf: 'center' } :