aboutsummaryrefslogtreecommitdiff
path: root/src/screens
diff options
context:
space:
mode:
Diffstat (limited to 'src/screens')
-rw-r--r--src/screens/profile/EditProfile.tsx48
-rw-r--r--src/screens/profile/MomentCommentsScreen.tsx149
-rw-r--r--src/screens/profile/MomentUploadPromptScreen.tsx8
-rw-r--r--src/screens/search/SearchScreen.tsx5
4 files changed, 123 insertions, 87 deletions
diff --git a/src/screens/profile/EditProfile.tsx b/src/screens/profile/EditProfile.tsx
index 3b3fa36e..7d3ca581 100644
--- a/src/screens/profile/EditProfile.tsx
+++ b/src/screens/profile/EditProfile.tsx
@@ -29,9 +29,10 @@ import {
websiteRegex,
bioRegex,
genderRegex,
+ CLASS_YEAR_LIST,
} from '../../constants';
import AsyncStorage from '@react-native-community/async-storage';
-import {ProfileStackParams} from '../../routes';
+import {MainStackParams} from '../../routes';
import Animated from 'react-native-reanimated';
import {HeaderHeight, SCREEN_HEIGHT} from '../../utils';
import {RootState} from '../../store/rootReducer';
@@ -47,12 +48,12 @@ import {
import TaggLoadingIndicator from '../../components/common/TaggLoadingIndicator';
type EditProfileNavigationProp = StackNavigationProp<
- ProfileStackParams,
+ MainStackParams,
'EditProfile'
>;
interface EditProfileProps {
- route: RouteProp<ProfileStackParams, 'EditProfile'>;
+ route: RouteProp<MainStackParams, 'EditProfile'>;
navigation: EditProfileNavigationProp;
}
@@ -65,7 +66,7 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
const y: Animated.Value<number> = Animated.useValue(0);
const {userId, username} = route.params;
const {
- profile: {website, biography, gender, snapchat, tiktok},
+ profile: {website, biography, gender, snapchat, tiktok, university_class},
avatar,
cover,
} = useSelector((state: RootState) => state.user);
@@ -99,6 +100,13 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
isValidSnapchat: true,
isValidTiktok: true,
attemptedSubmit: false,
+ classYear: university_class,
+ });
+
+ var classYearList: Array<any> = [];
+
+ CLASS_YEAR_LIST.map((value) => {
+ classYearList.push({label: value, value: value});
});
/**
@@ -254,6 +262,14 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
});
};
+ const handleClassYearUpdate = (value: string) => {
+ const classYear = Number.parseInt(value);
+ setForm({
+ ...form,
+ classYear,
+ });
+ };
+
const handleSubmit = useCallback(async () => {
if (!form.largePic) {
Alert.alert(ERROR_UPLOAD_LARGE_PROFILE_PIC);
@@ -297,7 +313,7 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
if (form.bio) {
if (form.isValidBio) {
- request.append('biography', form.bio);
+ request.append('biography', form.bio.trim());
} else {
setForm({...form, attemptedSubmit: false});
setTimeout(() => setForm({...form, attemptedSubmit: true}));
@@ -335,6 +351,15 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
invalidFields = true;
}
+ if (form.classYear !== university_class) {
+ if (!form.classYear) {
+ invalidFields = true;
+ Alert.alert('Please select a valid class year');
+ } else {
+ request.append('university_class', form.classYear);
+ }
+ }
+
if (invalidFields) {
return;
}
@@ -487,6 +512,19 @@ const EditProfile: React.FC<EditProfileProps> = ({route, navigation}) => {
value={form.customGenderText}
/>
)}
+
+ <TaggDropDown
+ value={form.classYear.toString()}
+ onValueChange={(value: string) =>
+ handleClassYearUpdate(value)
+ }
+ items={classYearList}
+ placeholder={{
+ label: 'Class Year',
+ value: null,
+ color: '#ddd',
+ }}
+ />
{snapchat !== '' && (
<View style={styles.row}>
<SocialIcon social={'Snapchat'} style={styles.icon} />
diff --git a/src/screens/profile/MomentCommentsScreen.tsx b/src/screens/profile/MomentCommentsScreen.tsx
index ebe4da28..2bceafc9 100644
--- a/src/screens/profile/MomentCommentsScreen.tsx
+++ b/src/screens/profile/MomentCommentsScreen.tsx
@@ -1,17 +1,21 @@
-import * as React from 'react';
import {RouteProp, useNavigation} from '@react-navigation/native';
+import React, {useEffect, useRef} from 'react';
+import {
+ ScrollView,
+ StyleSheet,
+ Text,
+ TouchableOpacity,
+ View,
+} from 'react-native';
+import {SafeAreaView} from 'react-native-safe-area-context';
+import {useDispatch} from 'react-redux';
+import {getMomentComments} from '../..//services';
+import BackIcon from '../../assets/icons/back-arrow.svg';
+import {CommentTile, TabsGradient} from '../../components';
+import {AddComment} from '../../components/';
import {ProfileStackParams} from '../../routes/main';
-import {CenteredView, CommentTile} from '../../components';
import {CommentType} from '../../types';
-import {ScrollView, StyleSheet, Text, View} from 'react-native';
-import {SCREEN_WIDTH} from '../../utils/screenDimensions';
-import {Button} from 'react-native-elements';
-import {AddComment} from '../../components/';
-import {useEffect} from 'react';
-import AsyncStorage from '@react-native-community/async-storage';
-import {getMomentComments} from '../..//services';
-import {useDispatch} from 'react-redux';
-import {logout} from '../../store/actions';
+import {SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
/**
* Comments Screen for an image uploaded
@@ -34,105 +38,98 @@ const MomentCommentsScreen: React.FC<MomentCommentsScreenProps> = ({route}) => {
const [commentsList, setCommentsList] = React.useState([]);
const [newCommentsAvailable, setNewCommentsAvailable] = React.useState(true);
const dispatch = useDispatch();
+ const ref = useRef<ScrollView>(null);
useEffect(() => {
const loadComments = async () => {
- const token = await AsyncStorage.getItem('token');
- if (!token) {
- dispatch(logout());
- return;
- }
- getMomentComments(moment_id, setCommentsList, token);
+ getMomentComments(moment_id, setCommentsList);
setNewCommentsAvailable(false);
};
if (newCommentsAvailable) {
loadComments();
+ setTimeout(() => {
+ ref.current?.scrollToEnd({
+ animated: true,
+ });
+ }, 500);
}
}, [dispatch, moment_id, newCommentsAvailable]);
return (
- <CenteredView>
- <View style={styles.modalView}>
+ <View style={styles.background}>
+ <SafeAreaView>
<View style={styles.header}>
- <Button
- title="X"
- buttonStyle={styles.button}
- titleStyle={styles.buttonText}
+ <TouchableOpacity
+ style={styles.headerButton}
onPress={() => {
navigation.pop();
- }}
- />
+ }}>
+ <BackIcon height={'100%'} width={'100%'} color={'white'} />
+ </TouchableOpacity>
<Text style={styles.headerText}>
{commentsList.length + ' Comments'}
</Text>
</View>
- <ScrollView
- style={styles.modalScrollView}
- contentContainerStyle={styles.modalScrollViewContent}>
- {commentsList &&
- commentsList.map((comment: CommentType) => (
- <CommentTile
- key={comment.comment_id}
- comment_object={comment}
- screenType={screenType}
- />
- ))}
- </ScrollView>
- <AddComment
- setNewCommentsAvailable={setNewCommentsAvailable}
- moment_id={moment_id}
- />
- </View>
- </CenteredView>
+ <View style={styles.body}>
+ <ScrollView
+ ref={ref}
+ style={styles.scrollView}
+ contentContainerStyle={styles.scrollViewContent}>
+ {commentsList &&
+ commentsList.map((comment: CommentType) => (
+ <CommentTile
+ key={comment.comment_id}
+ comment_object={comment}
+ screenType={screenType}
+ />
+ ))}
+ </ScrollView>
+ <AddComment
+ setNewCommentsAvailable={setNewCommentsAvailable}
+ moment_id={moment_id}
+ />
+ </View>
+ </SafeAreaView>
+ <TabsGradient />
+ </View>
);
};
const styles = StyleSheet.create({
- header: {flexDirection: 'row'},
+ background: {
+ backgroundColor: 'white',
+ height: '100%',
+ },
+ header: {justifyContent: 'center', padding: '3%'},
headerText: {
- position: 'relative',
- left: '180%',
+ position: 'absolute',
alignSelf: 'center',
- fontSize: 18,
- fontWeight: '500',
+ fontSize: 20.5,
+ fontWeight: '600',
},
- container: {
- position: 'relative',
- top: '5%',
- left: '5%',
- backgroundColor: 'white',
- borderRadius: 5,
- width: SCREEN_WIDTH / 1.1,
- height: '55%',
- },
- button: {
- backgroundColor: 'transparent',
+ headerButton: {
+ width: '5%',
+ aspectRatio: 1,
+ padding: 0,
+ marginLeft: '5%',
+ alignSelf: 'flex-start',
},
- buttonText: {
+ headerButtonText: {
color: 'black',
fontSize: 18,
fontWeight: '400',
},
- modalView: {
- width: '85%',
- height: '70%',
- backgroundColor: '#fff',
- shadowColor: '#000',
- shadowOpacity: 30,
- shadowOffset: {width: 0, height: 2},
- shadowRadius: 5,
- borderRadius: 8,
- paddingBottom: 15,
+ body: {
+ width: SCREEN_WIDTH,
+ height: SCREEN_HEIGHT * 0.8,
+ paddingTop: '3%',
+ },
+ scrollView: {
paddingHorizontal: 20,
- paddingTop: 5,
- justifyContent: 'space-between',
},
- modalScrollViewContent: {
+ scrollViewContent: {
justifyContent: 'center',
},
- modalScrollView: {
- marginBottom: 10,
- },
});
export default MomentCommentsScreen;
diff --git a/src/screens/profile/MomentUploadPromptScreen.tsx b/src/screens/profile/MomentUploadPromptScreen.tsx
index 6111985d..9d46c1e9 100644
--- a/src/screens/profile/MomentUploadPromptScreen.tsx
+++ b/src/screens/profile/MomentUploadPromptScreen.tsx
@@ -6,6 +6,7 @@ import CloseIcon from '../../assets/ionicons/close-outline.svg';
import {StyleSheet, Text, View} from 'react-native';
import {Moment} from '../../components';
import {Image} from 'react-native-animatable';
+import {UPLOAD_MOMENT_PROMPT_ONE_MESSAGE} from '../../constants/strings';
type MomentUploadPromptScreenRouteProp = RouteProp<
MainStackParams,
@@ -38,10 +39,7 @@ const MomentUploadPromptScreen: React.FC<MomentUploadPromptScreenProps> = ({
}}
/>
- <Text style={styles.text}>
- Post your first moment to {'\n'} continue building your digital {'\n'}{' '}
- identity!
- </Text>
+ <Text style={styles.text}>{UPLOAD_MOMENT_PROMPT_ONE_MESSAGE}</Text>
<Image
source={require('../../assets/gifs/dotted-arrow-white.gif')}
style={styles.arrowGif}
@@ -54,6 +52,8 @@ const MomentUploadPromptScreen: React.FC<MomentUploadPromptScreenProps> = ({
screenType={screenType}
handleMomentCategoryDelete={() => {}}
shouldAllowDeletion={false}
+ showDownButton={false}
+ showUpButton={false}
externalStyles={{
container: styles.momentContainer,
titleText: styles.momentHeaderText,
diff --git a/src/screens/search/SearchScreen.tsx b/src/screens/search/SearchScreen.tsx
index 9f98b4d7..059bd968 100644
--- a/src/screens/search/SearchScreen.tsx
+++ b/src/screens/search/SearchScreen.tsx
@@ -2,6 +2,7 @@ import AsyncStorage from '@react-native-community/async-storage';
import {useFocusEffect} from '@react-navigation/native';
import React, {useCallback, useEffect, useState} from 'react';
import {
+ Dimensions,
Keyboard,
RefreshControl,
ScrollView,
@@ -20,7 +21,7 @@ import {
SearchResultsBackground,
TabsGradient,
} from '../../components';
-import {SEARCH_ENDPOINT, TAGG_TEXT_LIGHT_BLUE} from '../../constants';
+import {SEARCH_ENDPOINT, TAGG_LIGHT_BLUE} from '../../constants';
import {loadRecentlySearched, resetScreenType} from '../../store/actions';
import {RootState} from '../../store/rootReducer';
import {ProfilePreviewType, ScreenType, UserType} from '../../types';
@@ -213,7 +214,7 @@ const styles = StyleSheet.create({
clear: {
fontSize: 17,
fontWeight: 'bold',
- color: TAGG_TEXT_LIGHT_BLUE,
+ color: TAGG_LIGHT_BLUE,
},
image: {
width: SCREEN_WIDTH,
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-19 07:42:22 +0000