From dfcd9e5d47ff5cac2a02a0bbfe4ed37f60625431 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Wed, 14 Jul 2021 07:49:09 -0700 Subject: Add view count to type, moment view, endpoints --- src/components/moments/MomentPost.tsx | 24 +++++++++++++++++++++--- src/constants/api.ts | 1 + src/services/MomentService.ts | 19 +++++++++++++++++++ 3 files changed, 41 insertions(+), 3 deletions(-) (limited to 'src') diff --git a/src/components/moments/MomentPost.tsx b/src/components/moments/MomentPost.tsx index 29b82cec..7b3ce6f8 100644 --- a/src/components/moments/MomentPost.tsx +++ b/src/components/moments/MomentPost.tsx @@ -87,6 +87,7 @@ const MomentPost: React.FC = ({ moment.moment_url.endsWith('gif') ); const mediaHeight = SCREEN_WIDTH / aspectRatio; + const [viewCount, setViewCount] = useState(moment.view_count); /* * Load tags on initial render to pass tags data to moment header and content @@ -192,11 +193,18 @@ const MomentPost: React.FC = ({ screenType={screenType} editable={false} /> - {user.username} + + {user.username} + + {viewCount <= 9999 + ? `${viewCount} Views` + : `${(viewCount / 1000).toFixed(1)}K Views`} + + ), - [user.username], + [user.username, viewCount], ); const momentMedia = isVideo ? ( @@ -387,7 +395,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', diff --git a/src/constants/api.ts b/src/constants/api.ts index 6dab1153..1efc9ab7 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/services/MomentService.ts b/src/services/MomentService.ts index 25d44041..378eca54 100644 --- a/src/services/MomentService.ts +++ b/src/services/MomentService.ts @@ -5,6 +5,7 @@ import { MOMENTTAG_ENDPOINT, MOMENT_TAGS_ENDPOINT, MOMENT_THUMBNAIL_ENDPOINT, + MOMENT_VIEW_COUNT_API, PRESIGNED_URL_ENDPOINT, TAGG_CUSTOMER_SUPPORT, } from '../constants'; @@ -320,3 +321,21 @@ 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) { + return true; + } + return false; +}; -- cgit v1.2.3-70-g09d2 From 0e7201b7be3a5a96b0ab4d55600bba352c608c54 Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Thu, 15 Jul 2021 06:30:16 -0700 Subject: Add view count to type, missed --- src/types/types.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'src') diff --git a/src/types/types.ts b/src/types/types.ts index 5f70d1f8..3a8baad2 100644 --- a/src/types/types.ts +++ b/src/types/types.ts @@ -117,6 +117,7 @@ export interface MomentType { moment_category: string; moment_url: string; thumbnail_url: string; + view_count: number; } export interface MomentPostType extends MomentType { -- cgit v1.2.3-70-g09d2 From a2b699c7e00bf4ac43525e81ca96c7fbed2a6e2a Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Thu, 15 Jul 2021 06:35:19 -0700 Subject: Receive moment view count from backend --- src/services/MomentService.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/services/MomentService.ts b/src/services/MomentService.ts index 378eca54..6f97a930 100644 --- a/src/services/MomentService.ts +++ b/src/services/MomentService.ts @@ -335,7 +335,8 @@ export const increaseMomentViewCount = async (moment_id: string) => { }, }); if (response.status === 200) { - return true; + const {view_count} = await response.json(); + return view_count; } - return false; + return; }; -- cgit v1.2.3-70-g09d2 From 4193ecccac86b9428d1f17fd7a3c5cd0ff92dd0a Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Thu, 15 Jul 2021 08:44:27 -0700 Subject: Random comment cleanup --- src/RootNavigation.ts | 2 -- 1 file changed, 2 deletions(-) (limited to 'src') 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 = 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 -- cgit v1.2.3-70-g09d2 From 672a3df3c0e9761efd3701cb719970aa724f823d Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Wed, 21 Jul 2021 05:23:13 -0700 Subject: Fix bump up view count issue --- src/components/moments/MomentPost.tsx | 10 +++++---- src/screens/profile/IndividualMoment.tsx | 37 +++++++++++++++++++++++++++++--- 2 files changed, 40 insertions(+), 7 deletions(-) (limited to 'src') diff --git a/src/components/moments/MomentPost.tsx b/src/components/moments/MomentPost.tsx index 7b3ce6f8..6cb812e7 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 = ({ moment, userXId, screenType, + updateMomentViewCount, }) => { const navigation = useNavigation(); const dispatch = useDispatch(); @@ -196,15 +198,15 @@ const MomentPost: React.FC = ({ {user.username} - {viewCount <= 9999 - ? `${viewCount} Views` - : `${(viewCount / 1000).toFixed(1)}K Views`} + {moment.view_count <= 9999 + ? `${moment.view_count} Views` + : `${(moment.view_count / 1000).toFixed(1)}K Views`} ), - [user.username, viewCount], + [user.username, moment.view_count], ); const momentMedia = isVideo ? ( 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 = ({route}) => { userXId ? state.userX[screenType][userXId] : state.moments, ); const scrollRef = useRef>(null); - const momentData = moments.filter( - (m) => m.moment_category === moment_category, - ); + const [momentData, setMomentData] = useState([]); + + 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 = ({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 ( = ({route}) => { moment={item} userXId={userXId} screenType={screenType} + updateMomentViewCount={updateMomentViewCount} /> )} keyboardShouldPersistTaps={'handled'} -- cgit v1.2.3-70-g09d2 From b7acbd4ba2bf3441240a164703d83c68aabefd1a Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Thu, 22 Jul 2021 14:54:20 -0700 Subject: Fix video replay view counts issue --- src/components/moments/MomentPost.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'src') diff --git a/src/components/moments/MomentPost.tsx b/src/components/moments/MomentPost.tsx index 6cb812e7..3a96fe9a 100644 --- a/src/components/moments/MomentPost.tsx +++ b/src/components/moments/MomentPost.tsx @@ -195,7 +195,7 @@ const MomentPost: React.FC = ({ screenType={screenType} editable={false} /> - + {user.username} {moment.view_count <= 9999 @@ -226,6 +226,7 @@ const MomentPost: React.FC = ({ setAspectRatio(width / height); }} paused={moment.moment_id !== currentVisibleMomentId} + onEnd={updateMomentViewCount} /> ) : ( @@ -450,6 +451,7 @@ const styles = StyleSheet.create({ width: SCREEN_WIDTH, height: SCREEN_HEIGHT, }, + profilePreviewContainer: {paddingHorizontal: '3%'}, }); export default MomentPost; -- cgit v1.2.3-70-g09d2 From 14c151ba80672938fecd4768b30f5812bd0a996e Mon Sep 17 00:00:00 2001 From: Shravya Ramesh Date: Thu, 22 Jul 2021 14:57:16 -0700 Subject: Remove unused var --- src/components/moments/MomentPost.tsx | 1 - 1 file changed, 1 deletion(-) (limited to 'src') diff --git a/src/components/moments/MomentPost.tsx b/src/components/moments/MomentPost.tsx index 3a96fe9a..0504052b 100644 --- a/src/components/moments/MomentPost.tsx +++ b/src/components/moments/MomentPost.tsx @@ -89,7 +89,6 @@ const MomentPost: React.FC = ({ moment.moment_url.endsWith('gif') ); const mediaHeight = SCREEN_WIDTH / aspectRatio; - const [viewCount, setViewCount] = useState(moment.view_count); /* * Load tags on initial render to pass tags data to moment header and content -- cgit v1.2.3-70-g09d2 From 124bdd91ac9ae92bd5607d227b705e2b1a07cab6 Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Fri, 23 Jul 2021 18:56:54 -0400 Subject: Fixed merge issue --- src/services/MomentService.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'src') diff --git a/src/services/MomentService.ts b/src/services/MomentService.ts index 1eaead34..3a677ccc 100644 --- a/src/services/MomentService.ts +++ b/src/services/MomentService.ts @@ -340,6 +340,7 @@ export const increaseMomentViewCount = async (moment_id: string) => { return view_count; } return; +}; export const checkMomentDoneProcessing = async (momentId: string) => { try { -- cgit v1.2.3-70-g09d2