aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/assets/ionicons/close-outline.svg1
-rw-r--r--src/components/comments/CommentsCount.tsx16
-rw-r--r--src/components/common/GenericMoreInfoDrawer.tsx2
-rw-r--r--src/components/moments/CaptionScreenHeader.tsx3
-rw-r--r--src/components/moments/IndividualMomentTitleBar.tsx45
-rw-r--r--src/components/moments/MomentPostContent.tsx85
-rw-r--r--src/components/moments/MomentPostHeader.tsx84
-rw-r--r--src/components/moments/index.ts5
-rw-r--r--src/components/profile/Avatar.tsx5
-rw-r--r--src/components/profile/MomentMoreInfoDrawer.tsx61
-rw-r--r--src/routes/Routes.tsx2
-rw-r--r--src/screens/profile/IndividualMoment.tsx253
-rw-r--r--src/screens/profile/MomentCommentsScreen.tsx2
-rw-r--r--src/services/MomentServices.ts2
-rw-r--r--src/services/ReportingService.ts9
-rw-r--r--src/types/types.ts2
16 files changed, 366 insertions, 211 deletions
diff --git a/src/assets/ionicons/close-outline.svg b/src/assets/ionicons/close-outline.svg
new file mode 100644
index 00000000..4e8abc1c
--- /dev/null
+++ b/src/assets/ionicons/close-outline.svg
@@ -0,0 +1 @@
+<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><title>Close</title><path fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='32' d='M368 368L144 144M368 144L144 368'/></svg> \ No newline at end of file
diff --git a/src/components/comments/CommentsCount.tsx b/src/components/comments/CommentsCount.tsx
index d210c39a..325e2788 100644
--- a/src/components/comments/CommentsCount.tsx
+++ b/src/components/comments/CommentsCount.tsx
@@ -1,8 +1,8 @@
+import {useNavigation} from '@react-navigation/native';
import * as React from 'react';
-import {Text} from 'react-native-animatable';
import {StyleSheet, TouchableOpacity} from 'react-native';
+import {Text} from 'react-native-animatable';
import CommentIcon from '../../assets/icons/moment-comment-icon.svg';
-import {useNavigation} from '@react-navigation/native';
import {ScreenType} from '../../types';
/**
@@ -11,20 +11,20 @@ import {ScreenType} from '../../types';
*/
type CommentsCountProps = {
- comments_count: string;
- moment_id: string;
+ commentsCount: string;
+ momentId: string;
screenType: ScreenType;
};
const CommentsCount: React.FC<CommentsCountProps> = ({
- comments_count,
- moment_id,
+ commentsCount,
+ momentId,
screenType,
}) => {
const navigation = useNavigation();
const navigateToCommentsScreen = async () => {
navigation.push('MomentCommentsScreen', {
- moment_id,
+ moment_id: momentId,
screenType,
});
};
@@ -33,7 +33,7 @@ const CommentsCount: React.FC<CommentsCountProps> = ({
<TouchableOpacity onPress={() => navigateToCommentsScreen()}>
<CommentIcon style={styles.image} />
<Text style={styles.count}>
- {comments_count !== '0' ? comments_count : ''}
+ {commentsCount !== '0' ? commentsCount : ''}
</Text>
</TouchableOpacity>
</>
diff --git a/src/components/common/GenericMoreInfoDrawer.tsx b/src/components/common/GenericMoreInfoDrawer.tsx
index 5c58f903..3607ef8f 100644
--- a/src/components/common/GenericMoreInfoDrawer.tsx
+++ b/src/components/common/GenericMoreInfoDrawer.tsx
@@ -74,7 +74,7 @@ const styles = StyleSheet.create({
panelButtonTitle: {
fontSize: 18,
fontWeight: 'bold',
- color: 'black',
+ color: 'red',
},
icon: {
height: 25,
diff --git a/src/components/moments/CaptionScreenHeader.tsx b/src/components/moments/CaptionScreenHeader.tsx
index 4715b4ef..46dfddfe 100644
--- a/src/components/moments/CaptionScreenHeader.tsx
+++ b/src/components/moments/CaptionScreenHeader.tsx
@@ -20,7 +20,8 @@ const styles = StyleSheet.create({
container: {
flexDirection: 'row',
justifyContent: 'center',
- height: 30,
+ alignItems: 'center',
+ height: '5%',
},
headerContainer: {
position: 'absolute',
diff --git a/src/components/moments/IndividualMomentTitleBar.tsx b/src/components/moments/IndividualMomentTitleBar.tsx
new file mode 100644
index 00000000..bd5b307f
--- /dev/null
+++ b/src/components/moments/IndividualMomentTitleBar.tsx
@@ -0,0 +1,45 @@
+import React from 'react';
+import {TouchableOpacity} from 'react-native';
+import {Text, View, StyleSheet, ViewProps} from 'react-native';
+import CloseIcon from '../../assets/ionicons/close-outline.svg';
+
+interface IndividualMomentTitleBarProps extends ViewProps {
+ title: string;
+ close: () => void;
+}
+const IndividualMomentTitleBar: React.FC<IndividualMomentTitleBarProps> = ({
+ title,
+ close,
+ style,
+}) => {
+ return (
+ <View style={[styles.container, style]}>
+ <TouchableOpacity style={styles.closeButton} onPress={close}>
+ <CloseIcon height={'100%'} width={'100%'} color={'white'} />
+ </TouchableOpacity>
+ <Text style={styles.header}>{title}</Text>
+ </View>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flexDirection: 'row',
+ alignItems: 'center',
+ justifyContent: 'center',
+ height: '5%',
+ },
+ header: {
+ fontSize: 20,
+ fontWeight: 'bold',
+ color: 'white',
+ },
+ closeButton: {
+ position: 'absolute',
+ height: '50%',
+ aspectRatio: 1,
+ left: '3%',
+ },
+});
+
+export default IndividualMomentTitleBar;
diff --git a/src/components/moments/MomentPostContent.tsx b/src/components/moments/MomentPostContent.tsx
new file mode 100644
index 00000000..93271fa1
--- /dev/null
+++ b/src/components/moments/MomentPostContent.tsx
@@ -0,0 +1,85 @@
+import React, {useEffect} from 'react';
+import {Image, StyleSheet, Text, View, ViewProps} from 'react-native';
+import {getMomentCommentsCount} from '../../services';
+import {ScreenType} from '../../types';
+import {getTimePosted, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
+import {CommentsCount} from '../comments';
+
+interface MomentPostContentProps extends ViewProps {
+ screenType: ScreenType;
+ momentId: string;
+ caption: string;
+ pathHash: string;
+ dateTime: string;
+}
+const MomentPostContent: React.FC<MomentPostContentProps> = ({
+ screenType,
+ momentId,
+ caption,
+ pathHash,
+ dateTime,
+ style,
+}) => {
+ const [elapsedTime, setElapsedTime] = React.useState<string>();
+ const [comments_count, setCommentsCount] = React.useState('');
+
+ useEffect(() => {
+ setElapsedTime(getTimePosted(dateTime));
+ getMomentCommentsCount(momentId, setCommentsCount);
+ }, [dateTime, momentId]);
+ return (
+ <View style={[styles.container, style]}>
+ <Image
+ style={styles.image}
+ source={{uri: pathHash}}
+ resizeMode={'cover'}
+ />
+ <View style={styles.footerContainer}>
+ <CommentsCount
+ commentsCount={comments_count}
+ momentId={momentId}
+ screenType={screenType}
+ />
+ <Text style={styles.text}>{elapsedTime}</Text>
+ </View>
+ <Text style={styles.captionText}>{caption}</Text>
+ </View>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ height: SCREEN_HEIGHT,
+ },
+ image: {
+ width: SCREEN_WIDTH,
+ aspectRatio: 1,
+ marginBottom: '3%',
+ },
+ footerContainer: {
+ flexDirection: 'row',
+ justifyContent: 'space-between',
+ marginLeft: '7%',
+ marginRight: '5%',
+ marginBottom: '2%',
+ },
+ text: {
+ position: 'relative',
+ paddingBottom: '1%',
+ paddingTop: '1%',
+ marginLeft: '7%',
+ marginRight: '2%',
+ color: '#ffffff',
+ fontWeight: 'bold',
+ },
+ captionText: {
+ position: 'relative',
+ paddingBottom: '34%',
+ paddingTop: '1%',
+ marginLeft: '5%',
+ marginRight: '5%',
+ color: '#ffffff',
+ fontWeight: 'bold',
+ },
+});
+export default MomentPostContent;
diff --git a/src/components/moments/MomentPostHeader.tsx b/src/components/moments/MomentPostHeader.tsx
new file mode 100644
index 00000000..810ccea9
--- /dev/null
+++ b/src/components/moments/MomentPostHeader.tsx
@@ -0,0 +1,84 @@
+import React, {useState} from 'react';
+import {StyleSheet, Text, View, ViewProps} from 'react-native';
+import {MomentMoreInfoDrawer} from '..';
+import {loadUserMoments} from '../../store/actions';
+import {useDispatch, useSelector} from 'react-redux';
+import {ScreenType} from '../../types';
+import Avatar from '../profile/Avatar';
+import {useNavigation} from '@react-navigation/native';
+import {RootState} from '../../store/rootReducer';
+
+interface MomentPostHeaderProps extends ViewProps {
+ userXId?: string;
+ screenType: ScreenType;
+ username: string;
+ momentId: string;
+}
+
+const MomentPostHeader: React.FC<MomentPostHeaderProps> = ({
+ userXId,
+ screenType,
+ username,
+ momentId,
+ style,
+}) => {
+ const [drawerVisible, setDrawerVisible] = useState(false);
+ const dispatch = useDispatch();
+ const navigation = useNavigation();
+ const {userId: loggedInUserId, username: loggedInUserName} = useSelector(
+ (state: RootState) => state.user.user,
+ );
+ const isOwnProfile = loggedInUserName === username;
+
+ return (
+ <View style={[styles.container, style]}>
+ <View style={styles.header}>
+ <Avatar
+ style={styles.avatar}
+ userXId={userXId}
+ screenType={screenType}
+ />
+ <Text style={styles.headerText}>{username}</Text>
+ </View>
+ <MomentMoreInfoDrawer
+ isOpen={drawerVisible}
+ setIsOpen={setDrawerVisible}
+ momentId={momentId}
+ isOwnProfile={isOwnProfile}
+ dismissScreenAndUpdate={() => {
+ dispatch(loadUserMoments(loggedInUserId));
+ navigation.pop();
+ }}
+ />
+ </View>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ justifyContent: 'space-around',
+ flexDirection: 'row',
+ alignItems: 'center',
+ marginVertical: '2%',
+ },
+ header: {
+ alignItems: 'center',
+ flexDirection: 'row',
+ flex: 1,
+ },
+ avatar: {
+ flex: 0.2,
+ aspectRatio: 1,
+ borderRadius: 999999,
+ marginLeft: '3%',
+ },
+ headerText: {
+ fontSize: 15,
+ fontWeight: 'bold',
+ color: 'white',
+ paddingHorizontal: '3%',
+ flex: 1,
+ },
+});
+export default MomentPostHeader;
diff --git a/src/components/moments/index.ts b/src/components/moments/index.ts
index 339e0e19..89fd689c 100644
--- a/src/components/moments/index.ts
+++ b/src/components/moments/index.ts
@@ -1,2 +1,5 @@
-export {default as CaptionScreenHeader} from '../moments/CaptionScreenHeader';
+export {default as IndividualMomentTitleBar} from './IndividualMomentTitleBar';
+export {default as CaptionScreenHeader} from './CaptionScreenHeader';
+export {default as MomentPostHeader} from './MomentPostHeader';
+export {default as MomentPostContent} from './MomentPostContent';
export {default as Moment} from './Moment';
diff --git a/src/components/profile/Avatar.tsx b/src/components/profile/Avatar.tsx
index d3c53043..ba4ec36c 100644
--- a/src/components/profile/Avatar.tsx
+++ b/src/components/profile/Avatar.tsx
@@ -1,12 +1,13 @@
-import React, {useContext} from 'react';
+import React from 'react';
import {Image, StyleSheet} from 'react-native';
import {useSelector} from 'react-redux';
import {RootState} from '../../store/rootreducer';
import {ScreenType} from '../../types';
const PROFILE_DIM = 100;
+
interface AvatarProps {
- style: object;
+ style?: object;
userXId: string | undefined;
screenType: ScreenType;
}
diff --git a/src/components/profile/MomentMoreInfoDrawer.tsx b/src/components/profile/MomentMoreInfoDrawer.tsx
index 18462cbb..91fb3d2b 100644
--- a/src/components/profile/MomentMoreInfoDrawer.tsx
+++ b/src/components/profile/MomentMoreInfoDrawer.tsx
@@ -1,18 +1,19 @@
import React from 'react';
-import {Alert, TouchableOpacity} from 'react-native';
+import {Alert, StyleSheet, TouchableOpacity, ViewProps} from 'react-native';
import MoreIcon from '../../assets/icons/more_horiz-24px.svg';
-import {deleteMoment} from '../../services';
+import {deleteMoment, sendReport} from '../../services';
import {GenericMoreInfoDrawer} from '../common';
-interface MomentMoreInfoDrawerProps {
+interface MomentMoreInfoDrawerProps extends ViewProps {
isOpen: boolean;
setIsOpen: (visible: boolean) => void;
momentId: string;
- dismissScreenAndUpdate: Function;
+ isOwnProfile: boolean;
+ dismissScreenAndUpdate: () => void;
}
const MomentMoreInfoDrawer: React.FC<MomentMoreInfoDrawerProps> = (props) => {
- const {momentId, setIsOpen, dismissScreenAndUpdate} = props;
+ const {momentId, setIsOpen, isOwnProfile, dismissScreenAndUpdate} = props;
const handleDeleteMoment = async () => {
setIsOpen(false);
@@ -38,21 +39,61 @@ const MomentMoreInfoDrawer: React.FC<MomentMoreInfoDrawerProps> = (props) => {
});
};
+ const handleReportMoment = async () => {
+ setIsOpen(false);
+ setTimeout(() => {
+ Alert.alert(
+ 'Report Issue',
+ undefined,
+ [
+ {
+ text: 'Mark as inappropriate',
+ onPress: () => sendReport(momentId, 'Mark as inappropriate'),
+ },
+ {
+ text: 'Cancel',
+ style: 'cancel',
+ },
+ {
+ text: 'Mark as abusive',
+ onPress: () => sendReport(momentId, 'Mark as abusive'),
+ },
+ ],
+ {cancelable: false},
+ );
+ }, 500);
+ };
+
return (
<>
<TouchableOpacity
+ style={styles.icon}
onPress={() => {
setIsOpen(true);
}}>
<MoreIcon height={30} width={30} color={'white'} />
</TouchableOpacity>
- <GenericMoreInfoDrawer
- {...props}
- showIcons={false}
- buttons={[['Delete Moment', handleDeleteMoment]]}
- />
+ {isOwnProfile ? (
+ <GenericMoreInfoDrawer
+ {...props}
+ showIcons={false}
+ buttons={[['Delete Moment', handleDeleteMoment]]}
+ />
+ ) : (
+ <GenericMoreInfoDrawer
+ {...props}
+ showIcons={false}
+ buttons={[['Report an Issue', handleReportMoment]]}
+ />
+ )}
</>
);
};
+const styles = StyleSheet.create({
+ icon: {
+ marginRight: '3%',
+ },
+});
+
export default MomentMoreInfoDrawer;
diff --git a/src/routes/Routes.tsx b/src/routes/Routes.tsx
index cb45ead6..38a987f7 100644
--- a/src/routes/Routes.tsx
+++ b/src/routes/Routes.tsx
@@ -30,7 +30,7 @@ const Routes: React.FC = () => {
} else {
SplashScreen.hide();
}
- }, [userId, userLogin]);
+ }, [dispatch, userId]);
return userId ? <NavigationBar /> : <Onboarding />;
};
diff --git a/src/screens/profile/IndividualMoment.tsx b/src/screens/profile/IndividualMoment.tsx
index d1b21d0f..469c648e 100644
--- a/src/screens/profile/IndividualMoment.tsx
+++ b/src/screens/profile/IndividualMoment.tsx
@@ -1,30 +1,18 @@
-import AsyncStorage from '@react-native-community/async-storage';
import {BlurView} from '@react-native-community/blur';
import {RouteProp} from '@react-navigation/native';
import {StackNavigationProp} from '@react-navigation/stack';
-import React, {useEffect, useState} from 'react';
-import {Alert, Image, StyleSheet, View} from 'react-native';
-import {Button} from 'react-native-elements';
-import {TouchableOpacity} from 'react-native-gesture-handler';
-import Animated from 'react-native-reanimated';
-import {useDispatch, useSelector} from 'react-redux';
+import React from 'react';
+import {FlatList, StyleSheet, View} from 'react-native';
+import {useSelector} from 'react-redux';
import {ProfileStackParams} from 'src/routes/profile/ProfileStack';
import {
- CaptionScreenHeader,
- CommentsCount,
- MomentMoreInfoDrawer,
+ IndividualMomentTitleBar,
+ MomentPostContent,
+ MomentPostHeader,
} from '../../components';
-import {getMomentCommentsCount} from '../../services';
-import {sendReport} from '../../services/ReportingService';
-import {loadUserMoments, logout} from '../../store/actions';
-import {DUMMY_USERNAME} from '../../store/initialStates';
import {RootState} from '../../store/rootreducer';
-import {
- getTimePosted,
- SCREEN_HEIGHT,
- SCREEN_WIDTH,
- StatusBarHeight,
-} from '../../utils';
+import {MomentType} from '../../types';
+import {SCREEN_HEIGHT, SCREEN_WIDTH, StatusBarHeight} from '../../utils';
/**
* Individual moment view opened when user clicks on a moment tile
@@ -42,89 +30,52 @@ interface IndividualMomentProps {
navigation: IndividualMomentNavigationProp;
}
+const ITEM_HEIGHT = SCREEN_HEIGHT * (9 / 10);
+
const IndividualMoment: React.FC<IndividualMomentProps> = ({
route,
navigation,
}) => {
- const {
- moment_category,
- path_hash,
- date_time,
- moment_id,
- } = route.params.moment;
+ const {moment_category, moment_id} = route.params.moment;
const {userXId, screenType} = route.params;
-
- const {
- user: {userId: loggedInUserId, username: loggedInUsername},
- } = useSelector((state: RootState) => state.user);
-
+ const {username: loggedInUsername} = useSelector(
+ (state: RootState) => state.user.user,
+ );
const {
user: {username},
} = userXId
? useSelector((state: RootState) => state.userX[screenType][userXId])
- : {user: {username: DUMMY_USERNAME}};
+ : useSelector((state: RootState) => state.user);
- const isOwnProfile = username === loggedInUsername;
- const [elapsedTime, setElapsedTime] = React.useState<string>();
- const [comments_count, setCommentsCount] = React.useState('');
- const [isReporting, setIsReporting] = React.useState(false);
- const dispatch = useDispatch();
- const [drawerVisible, setDrawerVisible] = useState(false);
-
- useEffect(() => {
- const timePeriod = async () => {
- setElapsedTime(getTimePosted(date_time));
- };
-
- const loadComments = async () => {
- const token = await AsyncStorage.getItem('token');
- if (!token) {
- dispatch(logout());
- return;
- }
- getMomentCommentsCount(moment_id, setCommentsCount, token);
- };
+ const {moments} = userXId
+ ? useSelector((state: RootState) => state.userX[screenType][userXId])
+ : useSelector((state: RootState) => state.moments);
- timePeriod();
- loadComments();
- }, [date_time, dispatch, loggedInUserId, moment_id]);
+ const isOwnProfile = username === loggedInUsername;
+ const momentData = moments.filter(
+ (m) => m.moment_category === moment_category,
+ );
+ const initialIndex = momentData.findIndex((m) => m.moment_id === moment_id);
- const sendReportAlert = async () => {
- const token = await AsyncStorage.getItem('token');
- setIsReporting(true);
- Alert.alert(
- 'Report Issue',
- undefined,
- [
- {
- text: 'Mark as inappropriate',
- onPress: () =>
- sendReport(
- moment_id,
- 'Mark as inappropriate',
- token ? token : '',
- setIsReporting,
- ),
- },
- {
- text: 'Cancel',
- onPress: () => setIsReporting(false),
- style: 'cancel',
- },
- {
- text: 'Mark as abusive',
- onPress: () =>
- sendReport(
- moment_id,
- 'Mark as abusive',
- token ? token : '',
- setIsReporting,
- ),
- },
- ],
- {cancelable: false},
- );
- };
+ const renderMomentPost = ({item}: {item: MomentType}) => (
+ <View style={styles.postContainer}>
+ <MomentPostHeader
+ userXId={userXId}
+ screenType={screenType}
+ username={isOwnProfile ? loggedInUsername : username}
+ momentId={item.moment_id}
+ style={styles.postHeader}
+ />
+ <MomentPostContent
+ style={styles.postContent}
+ momentId={item.moment_id}
+ caption={item.caption}
+ pathHash={item.path_hash}
+ dateTime={item.date_time}
+ screenType={screenType}
+ />
+ </View>
+ );
return (
<BlurView
@@ -132,119 +83,59 @@ const IndividualMoment: React.FC<IndividualMomentProps> = ({
blurAmount={10}
reducedTransparencyFallbackColor="white"
style={styles.contentContainer}>
- <View style={styles.buttonsContainer}>
- <Button
- title="Close"
- buttonStyle={styles.button}
- onPress={() => {
- navigation.pop();
- }}
- />
- {!userXId && (
- <MomentMoreInfoDrawer
- isOpen={drawerVisible}
- setIsOpen={setDrawerVisible}
- momentId={moment_id}
- dismissScreenAndUpdate={() => {
- dispatch(loadUserMoments(loggedInUserId));
- navigation.pop();
- }}
- />
- )}
- </View>
- <CaptionScreenHeader
+ <IndividualMomentTitleBar
style={styles.header}
+ close={() => navigation.pop()}
{...{title: moment_category}}
/>
- <Image
- style={styles.image}
- source={{uri: path_hash}}
- resizeMode={'cover'}
- />
-
- <View style={styles.bodyContainer}>
- <CommentsCount
- comments_count={comments_count}
- moment_id={moment_id}
- screenType={screenType}
+ <View style={styles.content}>
+ <FlatList
+ data={momentData}
+ renderItem={renderMomentPost}
+ keyExtractor={(item, index) => index.toString()}
+ showsVerticalScrollIndicator={false}
+ snapToAlignment={'start'}
+ snapToInterval={ITEM_HEIGHT}
+ decelerationRate={'fast'}
+ initialScrollIndex={initialIndex}
+ getItemLayout={(data, index) => ({
+ length: ITEM_HEIGHT,
+ offset: ITEM_HEIGHT * index,
+ index,
+ })}
+ pagingEnabled
/>
- <Animated.Text style={styles.text}>{elapsedTime}</Animated.Text>
</View>
- <Animated.Text style={styles.captionText}>
- {route.params.moment.caption}
- </Animated.Text>
- {userXId && !isOwnProfile && !isReporting && (
- <TouchableOpacity onPress={sendReportAlert}>
- <Animated.Text style={styles.reportIssue}>
- {'Report an issue'}
- </Animated.Text>
- </TouchableOpacity>
- )}
</BlurView>
);
};
const styles = StyleSheet.create({
contentContainer: {
width: SCREEN_WIDTH,
- paddingTop: StatusBarHeight,
height: SCREEN_HEIGHT,
- flex: 2,
- flexDirection: 'column',
+ paddingTop: StatusBarHeight,
+ flex: 1,
paddingBottom: 0,
},
- buttonsContainer: {
- flexDirection: 'row',
- justifyContent: 'space-between',
- marginLeft: '3%',
- marginRight: '3%',
- },
- button: {
- backgroundColor: 'transparent',
- },
shareButtonTitle: {
fontWeight: 'bold',
color: '#6EE7E7',
},
+ content: {
+ flex: 9,
+ },
header: {
- marginVertical: 20,
+ flex: 1,
},
- image: {
- position: 'relative',
+ postContainer: {
+ height: ITEM_HEIGHT,
width: SCREEN_WIDTH,
- aspectRatio: 1,
- marginBottom: '3%',
- },
- bodyContainer: {
- flexDirection: 'row',
- justifyContent: 'space-between',
- marginLeft: '7%',
- marginRight: '5%',
- marginBottom: '2%',
- },
- text: {
- position: 'relative',
- paddingBottom: '1%',
- paddingTop: '1%',
- marginLeft: '7%',
- marginRight: '2%',
- color: '#ffffff',
- fontWeight: 'bold',
- },
- captionText: {
- position: 'relative',
- paddingBottom: '34%',
- paddingTop: '1%',
- marginLeft: '5%',
- marginRight: '5%',
- color: '#ffffff',
- fontWeight: 'bold',
+ flex: 1,
},
- reportIssue: {
- position: 'relative',
- color: 'white',
- textAlign: 'center',
- textDecorationLine: 'underline',
+ postHeader: {
+ flex: 1,
},
+ postContent: {flex: 9},
});
export default IndividualMoment;
diff --git a/src/screens/profile/MomentCommentsScreen.tsx b/src/screens/profile/MomentCommentsScreen.tsx
index 34f85c28..2cc809a3 100644
--- a/src/screens/profile/MomentCommentsScreen.tsx
+++ b/src/screens/profile/MomentCommentsScreen.tsx
@@ -48,7 +48,7 @@ const MomentCommentsScreen: React.FC<MomentCommentsScreenProps> = ({route}) => {
if (newCommentsAvailable) {
loadComments();
}
- }, [newCommentsAvailable]);
+ }, [dispatch, moment_id, newCommentsAvailable]);
return (
<CenteredView>
diff --git a/src/services/MomentServices.ts b/src/services/MomentServices.ts
index ed868582..96643bc3 100644
--- a/src/services/MomentServices.ts
+++ b/src/services/MomentServices.ts
@@ -69,9 +69,9 @@ export const postMomentComment = async (
export const getMomentCommentsCount = async (
momentId: string,
callback: Function,
- token: string,
) => {
try {
+ const token = await AsyncStorage.getItem('token');
const response = await fetch(COMMENTS_ENDPOINT + `${momentId}/`, {
method: 'GET',
headers: {
diff --git a/src/services/ReportingService.ts b/src/services/ReportingService.ts
index 2650a703..1563d086 100644
--- a/src/services/ReportingService.ts
+++ b/src/services/ReportingService.ts
@@ -2,14 +2,15 @@
import {REPORT_ISSUE_ENDPOINT} from '../constants';
import {Alert} from 'react-native';
+import AsyncStorage from '@react-native-community/async-storage';
export const sendReport = async (
moment_id: string,
message: string,
- token: string,
- callback: Function,
+ callback?: Function,
) => {
try {
+ let token = await AsyncStorage.getItem('token');
let response = await fetch(REPORT_ISSUE_ENDPOINT, {
method: 'POST',
body: JSON.stringify({
@@ -28,7 +29,9 @@ export const sendReport = async (
} else {
Alert.alert('Something went wrong!', 'Please try again.');
}
- callback(false);
+ if (callback) {
+ callback();
+ }
} catch (error) {
Alert.alert('Something went wrong!', 'Please try again.');
console.log(
diff --git a/src/types/types.ts b/src/types/types.ts
index bfd0cd93..e25d1ca7 100644
--- a/src/types/types.ts
+++ b/src/types/types.ts
@@ -73,11 +73,11 @@ export interface LinkerType {
}
export interface MomentType {
+ moment_id: string;
caption: string;
date_time: string;
moment_category: string;
path_hash: string;
- moment_id: string;
}
export interface CommentType {
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 11:00:04 +0000