aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/RootNavigation.ts2
-rw-r--r--src/components/moments/MomentPost.tsx27
-rw-r--r--src/constants/api.ts1
-rw-r--r--src/screens/profile/IndividualMoment.tsx37
-rw-r--r--src/services/MomentService.ts19
-rw-r--r--src/types/types.ts1
6 files changed, 79 insertions, 8 deletions
diff --git a/src/RootNavigation.ts b/src/RootNavigation.ts
index 9baa7828..bd2ba20d 100644
--- a/src/RootNavigation.ts
+++ b/src/RootNavigation.ts
@@ -6,8 +6,6 @@ export const navigationRef: React.RefObject<NavigationContainerRef> =
export function navigate(name: string) {
if (navigationRef.current) {
- // Perform navigation if the app has mounted
- //console.log('Reached root navigation');
navigationRef.current.navigate(name);
} else {
// TODO: Decide what to do if the app hasn't mounted
diff --git a/src/components/moments/MomentPost.tsx b/src/components/moments/MomentPost.tsx
index 29b82cec..0504052b 100644
--- a/src/components/moments/MomentPost.tsx
+++ b/src/components/moments/MomentPost.tsx
@@ -42,12 +42,14 @@ interface MomentPostProps {
moment: MomentPostType;
userXId: string | undefined;
screenType: ScreenType;
+ updateMomentViewCount: () => void;
}
const MomentPost: React.FC<MomentPostProps> = ({
moment,
userXId,
screenType,
+ updateMomentViewCount,
}) => {
const navigation = useNavigation();
const dispatch = useDispatch();
@@ -192,11 +194,18 @@ const MomentPost: React.FC<MomentPostProps> = ({
screenType={screenType}
editable={false}
/>
- <Text style={styles.headerText}>{user.username}</Text>
+ <View style={styles.profilePreviewContainer}>
+ <Text style={styles.headerText}>{user.username}</Text>
+ <Text style={styles.viewCount}>
+ {moment.view_count <= 9999
+ ? `${moment.view_count} Views`
+ : `${(moment.view_count / 1000).toFixed(1)}K Views`}
+ </Text>
+ </View>
</TouchableOpacity>
</View>
),
- [user.username],
+ [user.username, moment.view_count],
);
const momentMedia = isVideo ? (
@@ -216,6 +225,7 @@ const MomentPost: React.FC<MomentPostProps> = ({
setAspectRatio(width / height);
}}
paused={moment.moment_id !== currentVisibleMomentId}
+ onEnd={updateMomentViewCount}
/>
</View>
) : (
@@ -387,7 +397,17 @@ const styles = StyleSheet.create({
fontSize: 15,
fontWeight: 'bold',
color: 'white',
- paddingHorizontal: '3%',
+ },
+ viewCount: {
+ height: normalize(12),
+ left: 0,
+ top: '8%',
+ fontSize: 11,
+ fontWeight: '600',
+ lineHeight: 13,
+ letterSpacing: 0.08,
+ textAlign: 'left',
+ color: '#fff',
},
header: {
alignItems: 'center',
@@ -430,6 +450,7 @@ const styles = StyleSheet.create({
width: SCREEN_WIDTH,
height: SCREEN_HEIGHT,
},
+ profilePreviewContainer: {paddingHorizontal: '3%'},
});
export default MomentPost;
diff --git a/src/constants/api.ts b/src/constants/api.ts
index b4548634..1de6871c 100644
--- a/src/constants/api.ts
+++ b/src/constants/api.ts
@@ -34,6 +34,7 @@ export const MOMENTS_ENDPOINT: string = API_URL + 'moments/';
export const MOMENT_TAGS_ENDPOINT: string = API_URL + 'moments/tags/';
export const MOMENTTAG_ENDPOINT: string = API_URL + 'moment-tag/';
export const MOMENT_THUMBNAIL_ENDPOINT: string = API_URL + 'moment-thumbnail/';
+export const MOMENT_VIEW_COUNT_API: string = API_URL + 'moment-view-count/';
export const VERIFY_INVITATION_CODE_ENDPOUNT: string = API_URL + 'verify-code/';
export const COMMENTS_ENDPOINT: string = API_URL + 'comments/';
export const COMMENT_REACTIONS_ENDPOINT: string = API_URL + 'reaction-comment/';
diff --git a/src/screens/profile/IndividualMoment.tsx b/src/screens/profile/IndividualMoment.tsx
index 1b0c7c2b..0cfbce28 100644
--- a/src/screens/profile/IndividualMoment.tsx
+++ b/src/screens/profile/IndividualMoment.tsx
@@ -5,6 +5,7 @@ import {FlatList, Keyboard, ViewToken} from 'react-native';
import {useSelector} from 'react-redux';
import {MomentPost, TabsGradient} from '../../components';
import {MainStackParams} from '../../routes';
+import {increaseMomentViewCount} from '../../services';
import {RootState} from '../../store/rootreducer';
import {MomentPostType} from '../../types';
import {SCREEN_HEIGHT} from '../../utils';
@@ -38,9 +39,16 @@ const IndividualMoment: React.FC<IndividualMomentProps> = ({route}) => {
userXId ? state.userX[screenType][userXId] : state.moments,
);
const scrollRef = useRef<FlatList<MomentPostType>>(null);
- const momentData = moments.filter(
- (m) => m.moment_category === moment_category,
- );
+ const [momentData, setMomentData] = useState<MomentPostType[]>([]);
+
+ useEffect(() => {
+ const extractedMoments = moments.filter(
+ (m) => m.moment_category === moment_category,
+ );
+ setMomentData(extractedMoments);
+ console.log('momentData: ', momentData);
+ }, [moments]);
+
const initialIndex = momentData.findIndex((m) => m.moment_id === moment_id);
const [keyboardVisible, setKeyboardVisible] = useState(false);
const [currentVisibleMomentId, setCurrentVisibleMomentId] = useState<
@@ -75,6 +83,28 @@ const IndividualMoment: React.FC<IndividualMomentProps> = ({route}) => {
};
}, []);
+ const updateMomentViewCount = () => {
+ if (currentVisibleMomentId) {
+ increaseMomentViewCount(currentVisibleMomentId)
+ .then((updatedViewCount) => {
+ const updatedMomentData = momentData.map((x) => {
+ return x.moment_id === currentVisibleMomentId
+ ? {...x, view_count: updatedViewCount}
+ : x;
+ });
+ setMomentData(updatedMomentData);
+ })
+ .catch(() => console.log('Error updating view count!'));
+ }
+ };
+
+ /*
+ * Increments view count when user swipes up or down on Flatlist
+ */
+ useEffect(() => {
+ updateMomentViewCount();
+ }, [currentVisibleMomentId]);
+
return (
<MomentContext.Provider
value={{
@@ -90,6 +120,7 @@ const IndividualMoment: React.FC<IndividualMomentProps> = ({route}) => {
moment={item}
userXId={userXId}
screenType={screenType}
+ updateMomentViewCount={updateMomentViewCount}
/>
)}
keyboardShouldPersistTaps={'handled'}
diff --git a/src/services/MomentService.ts b/src/services/MomentService.ts
index b67cd169..1eaead34 100644
--- a/src/services/MomentService.ts
+++ b/src/services/MomentService.ts
@@ -6,6 +6,7 @@ import {
MOMENTTAG_ENDPOINT,
MOMENT_TAGS_ENDPOINT,
MOMENT_THUMBNAIL_ENDPOINT,
+ MOMENT_VIEW_COUNT_API,
PRESIGNED_URL_ENDPOINT,
TAGG_CUSTOMER_SUPPORT,
} from '../constants';
@@ -322,6 +323,24 @@ export const handleVideoUpload = async (
return false;
};
+/*
+ * Records a view on a moment
+ */
+export const increaseMomentViewCount = async (moment_id: string) => {
+ const token = await AsyncStorage.getItem('token');
+
+ const response = await fetch(MOMENT_VIEW_COUNT_API + `${moment_id}/`, {
+ method: 'PATCH',
+ headers: {
+ Authorization: 'Token ' + token,
+ },
+ });
+ if (response.status === 200) {
+ const {view_count} = await response.json();
+ return view_count;
+ }
+ return;
+
export const checkMomentDoneProcessing = async (momentId: string) => {
try {
const token = await AsyncStorage.getItem('token');
diff --git a/src/types/types.ts b/src/types/types.ts
index 685e3784..0f0957fc 100644
--- a/src/types/types.ts
+++ b/src/types/types.ts
@@ -130,6 +130,7 @@ export interface MomentType {
moment_category: string;
moment_url: string;
thumbnail_url: string;
+ view_count: number;
}
export interface MomentPostType extends MomentType {
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 11:18:33 +0000