aboutsummaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/common/BasicButton.tsx12
-rw-r--r--src/components/friends/InviteFriendTile.tsx56
-rw-r--r--src/components/messages/MessageButton.tsx73
-rw-r--r--src/components/messages/index.ts1
-rw-r--r--src/components/moments/MomentPostContent.tsx4
-rw-r--r--src/components/notifications/Notification.tsx41
-rw-r--r--src/components/profile/FriendsCount.tsx2
-rw-r--r--src/components/profile/ProfileBody.tsx58
-rw-r--r--src/components/taggs/TaggsBar.tsx14
9 files changed, 182 insertions, 79 deletions
diff --git a/src/components/common/BasicButton.tsx b/src/components/common/BasicButton.tsx
index 1fe29cd9..e2274dbd 100644
--- a/src/components/common/BasicButton.tsx
+++ b/src/components/common/BasicButton.tsx
@@ -1,5 +1,12 @@
import React from 'react';
-import {StyleProp, StyleSheet, Text, View, ViewStyle} from 'react-native';
+import {
+ StyleProp,
+ StyleSheet,
+ Text,
+ TextStyle,
+ View,
+ ViewStyle,
+} from 'react-native';
import {TAGG_LIGHT_BLUE} from '../../constants';
import {TouchableOpacity} from 'react-native-gesture-handler';
import {normalize} from '../../utils';
@@ -8,7 +15,7 @@ interface BasicButtonProps {
title: string;
onPress: () => void;
solid?: boolean;
- externalStyles?: Record<string, StyleProp<ViewStyle>>;
+ externalStyles?: Record<string, StyleProp<ViewStyle | TextStyle>>;
}
const BasicButton: React.FC<BasicButtonProps> = ({
title,
@@ -27,6 +34,7 @@ const BasicButton: React.FC<BasicButtonProps> = ({
<Text
style={[
styles.buttonTitle,
+ externalStyles?.buttonTitle,
solid
? styles.solidButtonTitleColor
: styles.outlineButtonTitleColor,
diff --git a/src/components/friends/InviteFriendTile.tsx b/src/components/friends/InviteFriendTile.tsx
index 5237389a..abd017d0 100644
--- a/src/components/friends/InviteFriendTile.tsx
+++ b/src/components/friends/InviteFriendTile.tsx
@@ -1,21 +1,30 @@
import React, {useEffect, useState} from 'react';
import {
Alert,
+ Linking,
StyleSheet,
Text,
TouchableOpacity,
TouchableWithoutFeedback,
View,
} from 'react-native';
+import {useSelector} from 'react-redux';
+import {RootState} from 'src/store/rootReducer';
import {TAGG_LIGHT_BLUE} from '../../constants';
import {
ERROR_NO_CONTACT_INVITE_LEFT,
ERROR_SOMETHING_WENT_WRONG,
- SUCCESS_INVITE_CONTACT,
+ INVITE_USER_SMS_BODY,
+ SUCCESS_CONFIRM_INVITE_CONTACT_MESSAGE,
+ SUCCESS_CONFIRM_INVITE_CONTACT_TITLE,
SUCCESS_LAST_CONTACT_INVITE,
} from '../../constants/strings';
import {InviteContactType} from '../../screens/profile/InviteFriendsScreen';
-import {inviteFriendService} from '../../services';
+import {
+ getRemainingInviteCount,
+ handleCreateInviteCode,
+ inviteFriendService,
+} from '../../services';
import {normalize} from '../../utils';
interface InviteFriendTileProps {
@@ -24,20 +33,41 @@ interface InviteFriendTileProps {
const InviteFriendTile: React.FC<InviteFriendTileProps> = ({item}) => {
const [invited, setInvited] = useState<boolean>(false);
+ const {name} = useSelector((state: RootState) => state.user.profile);
const [formatedPhoneNumber, setFormattedPhoneNumber] = useState<string>('');
const handleInviteFriend = async () => {
- const invites_left = await inviteFriendService(
- item.phoneNumber,
- item.firstName,
- item.lastName,
- );
+ const invites_left = await getRemainingInviteCount();
if (invites_left > 0) {
- setInvited(true);
- Alert.alert(SUCCESS_INVITE_CONTACT(invites_left));
- } else if (invites_left === 0) {
- setInvited(true);
- Alert.alert(SUCCESS_LAST_CONTACT_INVITE);
- } else if (invites_left === -1) {
+ Alert.alert(
+ SUCCESS_CONFIRM_INVITE_CONTACT_TITLE(invites_left),
+ SUCCESS_CONFIRM_INVITE_CONTACT_MESSAGE,
+ [
+ {text: 'No!', style: 'cancel'},
+ {
+ text: 'Yes!',
+ onPress: async () => {
+ setInvited(true);
+ const inviteCode = await handleCreateInviteCode();
+ await inviteFriendService(
+ item.phoneNumber,
+ item.firstName,
+ item.lastName,
+ );
+ Linking.openURL(
+ `sms:${item.phoneNumber}&body=${INVITE_USER_SMS_BODY(
+ item.firstName,
+ name,
+ inviteCode,
+ )}`,
+ );
+ if (invites_left === 1) {
+ Alert.alert(SUCCESS_LAST_CONTACT_INVITE);
+ }
+ },
+ },
+ ],
+ );
+ } else if (invites_left === -1 || invites_left === 0) {
Alert.alert(ERROR_NO_CONTACT_INVITE_LEFT);
} else {
Alert.alert(ERROR_SOMETHING_WENT_WRONG);
diff --git a/src/components/messages/MessageButton.tsx b/src/components/messages/MessageButton.tsx
new file mode 100644
index 00000000..5ac42c4c
--- /dev/null
+++ b/src/components/messages/MessageButton.tsx
@@ -0,0 +1,73 @@
+import React from 'react';
+import {Fragment, useContext} from 'react';
+import {useStore} from 'react-redux';
+import {ChatContext} from '../../App';
+import {RootState} from '../../store/rootReducer';
+import {FriendshipStatusType} from '../../types';
+import {createChannel} from '../../utils';
+import {Alert, StyleProp, TextStyle, ViewStyle} from 'react-native';
+import {BasicButton} from '../common';
+import {useNavigation} from '@react-navigation/native';
+import {ERROR_UNABLE_CONNECT_CHAT} from '../../constants/strings';
+
+interface MessageButtonProps {
+ userXId: string;
+ isBlocked: boolean;
+ friendship_status: FriendshipStatusType;
+ friendship_requester_id?: string;
+ solid?: boolean;
+ externalStyles?: Record<string, StyleProp<ViewStyle | TextStyle>>;
+}
+
+const MessageButton: React.FC<MessageButtonProps> = ({
+ userXId,
+ isBlocked,
+ friendship_status,
+ friendship_requester_id,
+ solid,
+ externalStyles,
+}) => {
+ const navigation = useNavigation();
+ const {chatClient, setChannel} = useContext(ChatContext);
+
+ const state: RootState = useStore().getState();
+ const loggedInUserId = state.user.user.userId;
+
+ const canMessage = () => {
+ if (
+ userXId &&
+ !isBlocked &&
+ (friendship_status === 'no_record' ||
+ friendship_status === 'friends' ||
+ (friendship_status === 'requested' &&
+ friendship_requester_id === loggedInUserId))
+ ) {
+ return true;
+ } else {
+ return false;
+ }
+ };
+
+ const onPressMessage = async () => {
+ if (chatClient.user && userXId) {
+ const channel = await createChannel(loggedInUserId, userXId, chatClient);
+ setChannel(channel);
+ navigation.navigate('Chat');
+ } else {
+ Alert.alert(ERROR_UNABLE_CONNECT_CHAT);
+ }
+ };
+
+ return canMessage() ? (
+ <BasicButton
+ title={'Message'}
+ onPress={onPressMessage}
+ externalStyles={externalStyles}
+ solid={solid ? solid : false}
+ />
+ ) : (
+ <Fragment />
+ );
+};
+
+export default MessageButton;
diff --git a/src/components/messages/index.ts b/src/components/messages/index.ts
index b19067ca..7270e2e2 100644
--- a/src/components/messages/index.ts
+++ b/src/components/messages/index.ts
@@ -7,3 +7,4 @@ export {default as MessageAvatar} from './MessageAvatar';
export {default as TypingIndicator} from './TypingIndicator';
export {default as MessageFooter} from './MessageFooter';
export {default as DateHeader} from './DateHeader';
+export {default as MessageButton} from './MessageButton';
diff --git a/src/components/moments/MomentPostContent.tsx b/src/components/moments/MomentPostContent.tsx
index 45186ba1..193bf40c 100644
--- a/src/components/moments/MomentPostContent.tsx
+++ b/src/components/moments/MomentPostContent.tsx
@@ -10,6 +10,7 @@ import {
navigateToProfile,
SCREEN_HEIGHT,
SCREEN_WIDTH,
+ normalize,
} from '../../utils';
import {mentionPartTypes, renderTextWithMentions} from '../../utils/comments';
import {CommentsCount} from '../comments';
@@ -103,6 +104,9 @@ const styles = StyleSheet.create({
marginRight: '5%',
color: '#ffffff',
fontWeight: '500',
+ fontSize: normalize(13),
+ lineHeight: normalize(15.51),
+ letterSpacing: normalize(0.6),
},
});
export default MomentPostContent;
diff --git a/src/components/notifications/Notification.tsx b/src/components/notifications/Notification.tsx
index ae884b42..cb62047a 100644
--- a/src/components/notifications/Notification.tsx
+++ b/src/components/notifications/Notification.tsx
@@ -34,6 +34,7 @@ import {
} from '../../utils';
import {Avatar} from '../common';
import AcceptDeclineButtons from '../common/AcceptDeclineButtons';
+import {MessageButton} from '../messages';
interface NotificationProps {
item: NotificationType;
@@ -61,6 +62,10 @@ const Notification: React.FC<NotificationProps> = (props) => {
const [avatar, setAvatar] = useState<string | undefined>(undefined);
const [momentURI, setMomentURI] = useState<string | undefined>(undefined);
+ const notification_title =
+ notification_type === 'FRD_ACPT'
+ ? `Say Hi to ${first_name}!`
+ : `${first_name} ${last_name}`;
useEffect(() => {
(async () => {
@@ -246,9 +251,7 @@ const Notification: React.FC<NotificationProps> = (props) => {
{/* Text content: Actor name and verbage*/}
<View style={styles.contentContainer}>
<TouchableWithoutFeedback onPress={navigateToProfile}>
- <Text style={styles.actorName}>
- {first_name} {last_name}
- </Text>
+ <Text style={styles.actorName}>{notification_title}</Text>
</TouchableWithoutFeedback>
<TouchableWithoutFeedback
style={styles.textContainerStyles}
@@ -273,6 +276,30 @@ const Notification: React.FC<NotificationProps> = (props) => {
/>
</View>
)}
+ {notification_type === 'FRD_ACPT' && (
+ <View style={styles.buttonsContainer}>
+ <MessageButton
+ userXId={id}
+ isBlocked={false}
+ friendship_status={'friends'}
+ externalStyles={{
+ container: {
+ width: normalize(63),
+ height: normalize(21),
+ marginTop: '7%',
+ },
+ buttonTitle: {
+ fontSize: normalize(11),
+ lineHeight: normalize(13.13),
+ letterSpacing: normalize(0.5),
+ fontWeight: '700',
+ textAlign: 'center',
+ },
+ }}
+ solid
+ />
+ </View>
+ )}
{/* Moment Image Preview */}
{(notification_type === 'CMT' ||
notification_type === 'MOM_3+' ||
@@ -306,7 +333,7 @@ const styles = StyleSheet.create({
flex: 1,
alignSelf: 'center',
alignItems: 'center',
- paddingHorizontal: '8%',
+ paddingHorizontal: '6.3%',
},
avatarContainer: {
height: 42,
@@ -348,9 +375,9 @@ const styles = StyleSheet.create({
lineHeight: normalize(13.13),
},
timeStampStyles: {
- fontWeight: '700',
- fontSize: normalize(12),
- lineHeight: normalize(14.32),
+ fontWeight: '500',
+ fontSize: normalize(11),
+ lineHeight: normalize(13.13),
marginHorizontal: 2,
color: '#828282',
textAlignVertical: 'center',
diff --git a/src/components/profile/FriendsCount.tsx b/src/components/profile/FriendsCount.tsx
index 8252266e..a299e9a1 100644
--- a/src/components/profile/FriendsCount.tsx
+++ b/src/components/profile/FriendsCount.tsx
@@ -37,7 +37,7 @@ const FriendsCount: React.FC<FriendsCountProps> = ({
return (
<TouchableOpacity
onPress={() =>
- navigation.navigate('FriendsListScreen', {
+ navigation.push('FriendsListScreen', {
userXId,
screenType,
})
diff --git a/src/components/profile/ProfileBody.tsx b/src/components/profile/ProfileBody.tsx
index 3d654724..7557de00 100644
--- a/src/components/profile/ProfileBody.tsx
+++ b/src/components/profile/ProfileBody.tsx
@@ -1,17 +1,7 @@
-import {useNavigation} from '@react-navigation/core';
-import React, {useContext} from 'react';
-import {
- Alert,
- LayoutChangeEvent,
- Linking,
- StyleSheet,
- Text,
- View,
-} from 'react-native';
+import React from 'react';
+import {LayoutChangeEvent, Linking, StyleSheet, Text, View} from 'react-native';
import {useDispatch, useSelector, useStore} from 'react-redux';
-import {ChatContext} from '../../App';
import {TAGG_DARK_BLUE, TOGGLE_BUTTON_TYPE} from '../../constants';
-import {ERROR_UNABLE_CONNECT_CHAT} from '../../constants/strings';
import {
acceptFriendRequest,
declineFriendRequest,
@@ -22,14 +12,14 @@ import {NO_PROFILE} from '../../store/initialStates';
import {RootState} from '../../store/rootReducer';
import {ScreenType} from '../../types';
import {
- createChannel,
getUserAsProfilePreviewType,
normalize,
SCREEN_HEIGHT,
SCREEN_WIDTH,
} from '../../utils';
import {canViewProfile} from '../../utils/users';
-import {BasicButton, FriendsButton} from '../common';
+import {FriendsButton} from '../common';
+import {MessageButton} from '../messages';
import ToggleButton from './ToggleButton';
interface ProfileBodyProps {
@@ -47,7 +37,6 @@ const ProfileBody: React.FC<ProfileBodyProps> = ({
screenType,
}) => {
const dispatch = useDispatch();
- const navigation = useNavigation();
const {profile = NO_PROFILE, user} = useSelector((state: RootState) =>
userXId ? state.userX[screenType][userXId] : state.user,
@@ -65,10 +54,7 @@ const ProfileBody: React.FC<ProfileBodyProps> = ({
profile,
);
- const {chatClient, setChannel} = useContext(ChatContext);
-
const state: RootState = useStore().getState();
- const loggedInUserId = state.user.user.userId;
const handleAcceptRequest = async () => {
await dispatch(acceptFriendRequest({id, username, first_name, last_name}));
@@ -81,32 +67,6 @@ const ProfileBody: React.FC<ProfileBodyProps> = ({
dispatch(updateUserXProfileAllScreens(id, state));
};
- const canMessage = () => {
- if (
- userXId &&
- !isBlocked &&
- (friendship_status === 'no_record' ||
- friendship_status === 'friends' ||
- (friendship_status === 'requested' &&
- friendship_requester_id === loggedInUserId)) &&
- canViewProfile(state, userXId, screenType)
- ) {
- return true;
- } else {
- return false;
- }
- };
-
- const onPressMessage = async () => {
- if (chatClient.user && userXId) {
- const channel = await createChannel(loggedInUserId, userXId, chatClient);
- setChannel(channel);
- navigation.navigate('Chat');
- } else {
- Alert.alert(ERROR_UNABLE_CONNECT_CHAT);
- }
- };
-
return (
<View onLayout={onLayout} style={styles.container}>
<Text style={styles.username}>{`@${username}`}</Text>
@@ -142,10 +102,12 @@ const ProfileBody: React.FC<ProfileBodyProps> = ({
onAcceptRequest={handleAcceptRequest}
onRejectRequest={handleDeclineFriendRequest}
/>
- {canMessage() && (
- <BasicButton
- title={'Message'}
- onPress={onPressMessage}
+ {canViewProfile(state, userXId, screenType) && (
+ <MessageButton
+ userXId={userXId}
+ isBlocked={isBlocked}
+ friendship_status={friendship_status}
+ friendship_requester_id={friendship_requester_id}
externalStyles={{
container: {
width: SCREEN_WIDTH * 0.42,
diff --git a/src/components/taggs/TaggsBar.tsx b/src/components/taggs/TaggsBar.tsx
index 4d567b25..a7e8fc7a 100644
--- a/src/components/taggs/TaggsBar.tsx
+++ b/src/components/taggs/TaggsBar.tsx
@@ -113,13 +113,11 @@ const TaggsBar: React.FC<TaggsBarProps> = ({
loadData();
}
}, [taggsNeedUpdate, user]);
- const paddingTopStylesProgress = useDerivedValue(() =>
- interpolate(
- y.value,
- [PROFILE_CUTOUT_BOTTOM_Y, PROFILE_CUTOUT_BOTTOM_Y + profileBodyHeight],
- [0, 1],
- Extrapolate.CLAMP,
- ),
+ const paddingTopStylesProgress = interpolate(
+ y.value,
+ [PROFILE_CUTOUT_BOTTOM_Y, PROFILE_CUTOUT_BOTTOM_Y + profileBodyHeight],
+ [0, 1],
+ Extrapolate.CLAMP,
);
const shadowOpacityStylesProgress = useDerivedValue(() =>
interpolate(
@@ -134,7 +132,7 @@ const TaggsBar: React.FC<TaggsBarProps> = ({
);
const animatedStyles = useAnimatedStyle(() => ({
shadowOpacity: shadowOpacityStylesProgress.value / 5,
- paddingTop: paddingTopStylesProgress.value * insetTop,
+ paddingTop: paddingTopStylesProgress + insetTop,
}));
return taggs.length > 0 ? (
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-11-24 16:22:24 +0000