From 84c103614247ab7dc8b86767f3bfa83c13f224aa Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Thu, 8 Apr 2021 17:38:55 -0700 Subject: Modal viw added --- src/screens/chat/ChatListScreen.tsx | 15 ++-- src/screens/chat/ChatResultsCell.tsx | 122 +++++++++++++++++++++++++++++++ src/screens/chat/ChatResultsList.tsx | 107 +++++++++++++++++++++++++++ src/screens/chat/ChatSearchBar.tsx | 119 ++++++++++++++++++++++++++++++ src/screens/chat/NewChatModal.tsx | 137 +++++++++++++++++++++++++++++++++++ src/screens/chat/index.ts | 4 + src/screens/search/SearchScreen.tsx | 4 +- 7 files changed, 498 insertions(+), 10 deletions(-) create mode 100644 src/screens/chat/ChatResultsCell.tsx create mode 100644 src/screens/chat/ChatResultsList.tsx create mode 100644 src/screens/chat/ChatSearchBar.tsx create mode 100644 src/screens/chat/NewChatModal.tsx (limited to 'src/screens') diff --git a/src/screens/chat/ChatListScreen.tsx b/src/screens/chat/ChatListScreen.tsx index 3290116b..ca1461fe 100644 --- a/src/screens/chat/ChatListScreen.tsx +++ b/src/screens/chat/ChatListScreen.tsx @@ -19,6 +19,7 @@ import { LocalUserType, } from '../../types'; +import NewChatModal from './NewChatModal'; type ChatListScreenNavigationProp = StackNavigationProp< MainStackParams, 'ChatList' @@ -29,8 +30,10 @@ interface ChatListScreenProps { /* * Screen that displays all of the user's active conversations. */ -const ChatListScreen: React.FC = () => { - const {chatClient} = useContext(ChatContext); +const ChatListScreen: React.FC = ({navigation}) => { + const {chatClient, setChannel} = useContext(ChatContext); + const [modalVisible, setChatModalVisible] = useState(false); + const [clientReady, setClientReady] = useState(false); const state: RootState = useStore().getState(); const loggedInUserId = state.user.user.userId; @@ -67,12 +70,7 @@ const ChatListScreen: React.FC = () => { { - // TODO: (CHAT) change me - const channel = chatClient.channel('messaging', { - name: 'Awesome channel with foobar', - members: [loggedInUserId, 'd5295557-59ce-49fc-aa8a-442874dbffc3'], - }); - channel.create(); + setChatModalVisible(true); }} /> {clientReady && ( @@ -100,6 +98,7 @@ const ChatListScreen: React.FC = () => { )} + {modalVisible && } diff --git a/src/screens/chat/ChatResultsCell.tsx b/src/screens/chat/ChatResultsCell.tsx new file mode 100644 index 00000000..00f7130d --- /dev/null +++ b/src/screens/chat/ChatResultsCell.tsx @@ -0,0 +1,122 @@ +import {useNavigation} from '@react-navigation/native'; +import React, {useContext, useEffect, useState} from 'react'; +import {Alert, Image, StyleSheet, Text, View} from 'react-native'; +import {TouchableOpacity} from 'react-native-gesture-handler'; +import {useDispatch, useSelector, useStore} from 'react-redux'; +import {loadImageFromURL} from '../../services'; +import {RootState} from '../../store/rootReducer'; +import {ProfilePreviewType, UserType} from '../../types'; +import {createChannel, normalize, SCREEN_WIDTH} from '../../utils'; +import {defaultUserProfile} from '../../utils/users'; +import {ChatContext} from '../../App'; +import {ERROR_FAILED_TO_CREATE_CHANNEL} from '../../constants/strings'; + +interface ChatResults { + profileData: ProfilePreviewType; + loggedInUser: UserType; + setChatModalVisible: Function; +} + +const ChatResultsCell: React.FC = ({ + profileData: {id, username, first_name, last_name, thumbnail_url}, + loggedInUser, + setChatModalVisible, +}) => { + const [avatar, setAvatar] = useState(undefined); + const {chatClient, setChannel} = useContext(ChatContext); + const {university} = useSelector((state: RootState) => state.user.profile); + + useEffect(() => { + (async () => { + if (thumbnail_url !== undefined) { + try { + const response = await loadImageFromURL(thumbnail_url); + if (response) { + setAvatar(response); + } + } catch (error) { + console.log('Error while downloading ', error); + throw error; + } + } + })(); + }, [thumbnail_url]); + + const dispatch = useDispatch(); + const state: RootState = useStore().getState(); + const navigation = useNavigation(); + const createChannelIfNotPresentAndNavigate = async () => { + try { + const channel = await createChannel(loggedInUser.userId, id, chatClient); + setChannel(channel); + setTimeout(() => { + setChatModalVisible(false); + navigation.navigate('Chat'); + }, 500); + } catch (error) { + Alert.alert(ERROR_FAILED_TO_CREATE_CHANNEL); + } + }; + + const userCell = () => { + return ( + + + + {`@${username}`} + + {first_name + ' ' + last_name} + + + + ); + }; + + return userCell(); +}; + +const styles = StyleSheet.create({ + cellContainer: { + flexDirection: 'row', + paddingHorizontal: 25, + paddingVertical: 15, + width: SCREEN_WIDTH, + }, + imageContainer: { + width: SCREEN_WIDTH * 0.112, + height: SCREEN_WIDTH * 0.112, + borderRadius: (SCREEN_WIDTH * 0.112) / 2, + }, + categoryBackground: { + backgroundColor: 'rgba(196, 196, 196, 0.45)', + justifyContent: 'center', + alignItems: 'center', + }, + categoryImage: { + width: '40%', + height: '40%', + }, + initialTextContainer: { + marginLeft: SCREEN_WIDTH * 0.08, + flexDirection: 'column', + justifyContent: 'center', + }, + initialTextStyle: { + fontWeight: '500', + fontSize: normalize(14), + }, + secondaryTextStyle: { + fontWeight: '500', + fontSize: normalize(12), + color: '#828282', + }, + multiText: {justifyContent: 'space-between'}, +}); + +export default ChatResultsCell; diff --git a/src/screens/chat/ChatResultsList.tsx b/src/screens/chat/ChatResultsList.tsx new file mode 100644 index 00000000..17a16572 --- /dev/null +++ b/src/screens/chat/ChatResultsList.tsx @@ -0,0 +1,107 @@ +import {useBottomTabBarHeight} from '@react-navigation/bottom-tabs'; +import React, {useEffect, useState} from 'react'; +import { + Keyboard, + SectionList, + SectionListData, + StyleSheet, + Text, + View, +} from 'react-native'; +import {useSelector} from 'react-redux'; +import {NO_RESULTS_FOUND} from '../../constants/strings'; +import {RootState} from '../../store/rootreducer'; +import {PreviewType, ScreenType} from '../../types'; +import {normalize, SCREEN_WIDTH} from '../../utils'; +import ChatResultsCell from './ChatResultsCell'; + +interface ChatResultsProps { + // TODO: make sure results come in as same type, regardless of profile, category, badges + results: SectionListData[]; + previewType: PreviewType; + screenType: ScreenType; + setChatModalVisible: Function; +} + +const sectionHeader: React.FC = () => { + return null; +}; + +const ChatResultsList: React.FC = ({ + results, + setChatModalVisible, +}) => { + const [showEmptyView, setshowEmptyView] = useState(false); + const {user: loggedInUser} = useSelector((state: RootState) => state.user); + + useEffect(() => { + if (results && results.length > 0) { + let showEmpty = true; + + results.forEach((e) => { + if (e.data.length > 0) { + showEmpty = false; + } + }); + setshowEmptyView(showEmpty); + } + }, [results]); + + return showEmptyView ? ( + + {NO_RESULTS_FOUND} + + ) : ( + item.id + index} + renderItem={({item}) => { + return ( + + ); + }} + stickySectionHeadersEnabled={false} + ListEmptyComponent={() => ( + + Start a new chat by searching for someone + + )} + /> + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + marginTop: 30, + alignItems: 'center', + }, + sectionHeaderStyle: { + width: '100%', + height: 0.5, + marginVertical: 5, + backgroundColor: '#C4C4C4', + }, + noResultsTextContainer: { + justifyContent: 'center', + flexDirection: 'row', + width: SCREEN_WIDTH, + }, + noResultsTextStyle: { + fontWeight: '500', + fontSize: normalize(14), + }, +}); + +export default ChatResultsList; diff --git a/src/screens/chat/ChatSearchBar.tsx b/src/screens/chat/ChatSearchBar.tsx new file mode 100644 index 00000000..294efa57 --- /dev/null +++ b/src/screens/chat/ChatSearchBar.tsx @@ -0,0 +1,119 @@ +import React, {useEffect, useState} from 'react'; +import { + Keyboard, + NativeSyntheticEvent, + StyleSheet, + Text, + TextInput, + TextInputProps, + TextInputSubmitEditingEventData, + TouchableOpacity, + View, + ViewStyle, + LayoutChangeEvent, +} from 'react-native'; +import {normalize} from 'react-native-elements'; +import Animated, {useAnimatedStyle} from 'react-native-reanimated'; +import Icon from 'react-native-vector-icons/Feather'; +import {useSelector} from 'react-redux'; +import {RootState} from '../../store/rootReducer'; +import {getSearchSuggestions} from '../../utils'; + +const AnimatedIcon = Animated.createAnimatedComponent(Icon); + +interface SearchBarProps extends TextInputProps { + onCancel: () => void; + animationProgress: Animated.SharedValue; + searching: boolean; + placeholder: string; +} +const ChatSearchBar: React.FC = ({ + onFocus, + onBlur, + onChangeText, + value, + onCancel, + searching, + animationProgress, + onLayout, + placeholder, +}) => { + const handleSubmit = ( + e: NativeSyntheticEvent, + ) => { + e.preventDefault(); + Keyboard.dismiss(); + }; + + /* + * On-search marginRight style ("cancel" button slides and fades in). + */ + const animatedStyles = useAnimatedStyle(() => ({ + marginRight: animationProgress.value * 58, + opacity: animationProgress.value, + })); + + return ( + + + + To: + + + + + + Cancel + + + + ); +}; + +const styles = StyleSheet.create({ + container: { + height: 40, + paddingHorizontal: 20, + flexDirection: 'row', + zIndex: 2, + }, + searchTextContainer: {marginHorizontal: 12}, + searchTextStyes: {fontWeight: 'bold', fontSize: 14, lineHeight: 17}, + inputContainer: { + flexGrow: 1, + flexDirection: 'row', + alignItems: 'center', + paddingHorizontal: 8, + borderRadius: 20, + backgroundColor: '#F0F0F0', + }, + searchIcon: { + marginRight: 8, + }, + input: { + flex: 1, + fontSize: 16, + color: '#000', + letterSpacing: normalize(0.5), + }, + cancelButton: { + height: '100%', + position: 'absolute', + justifyContent: 'center', + paddingHorizontal: 8, + }, + cancelText: { + color: '#818181', + fontWeight: '500', + }, +}); + +export default ChatSearchBar; diff --git a/src/screens/chat/NewChatModal.tsx b/src/screens/chat/NewChatModal.tsx new file mode 100644 index 00000000..2bbaf8d2 --- /dev/null +++ b/src/screens/chat/NewChatModal.tsx @@ -0,0 +1,137 @@ +import {useNavigation} from '@react-navigation/core'; +import React, {useEffect, useRef, useState} from 'react'; +import { + Keyboard, + SectionListData, + StatusBar, + StyleSheet, + Text, + View, +} from 'react-native'; +import {useSharedValue} from 'react-native-reanimated'; +import {BottomDrawer} from '../../components'; +import {SEARCH_ENDPOINT} from '../../constants'; +import {loadSearchResults} from '../../services'; +import {ScreenType} from '../../types'; +import {normalize} from '../../utils'; +import {ChatResultsList, ChatSearchBar} from './index'; +interface NewChatModalProps { + setChatModalVisible: (open: boolean) => void; +} + +const NewChatModal: React.FC = ({setChatModalVisible}) => { + const [modalVisible, setModalVisible] = useState(true); + const navigation = useNavigation(); + const sheetRef = useRef(null); + const [searching, setSearching] = useState(false); + /* + * Animated value + */ + const animationProgress = useSharedValue(0); + const [results, setResults] = useState[]>([]); + const [query, setQuery] = useState(''); + const handleFocus = () => { + setSearching(true); + }; + const handleBlur = () => { + Keyboard.dismiss(); + }; + const handleCancel = () => { + setSearching(false); + }; + + useEffect(() => { + if (!searching) { + return; + } + if (query.length < 3) { + return; + } + (async () => { + const searchResults = await loadSearchResults( + `${SEARCH_ENDPOINT}?query=${query}`, + ); + if (query.length > 2) { + const sanitizedResult = [ + { + title: 'users', + data: searchResults?.users, + }, + ]; + setResults(sanitizedResult); + } else { + setResults([]); + } + })(); + }, [query]); + + const _modalContent = () => { + return ( + + + New Message + + + {results.length > 0 && ( + + Suggested + + )} + + + ); + }; + + return ( + + + + {_modalContent()} + + + ); +}; + +const styles = StyleSheet.create({ + modalShadowContainer: { + height: '100%', + borderRadius: 9, + backgroundColor: 'white', + }, + titleContainerStyles: {marginVertical: 24}, + titleTextStyles: { + fontWeight: 'bold', + fontSize: normalize(18), + lineHeight: normalize(21), + textAlign: 'center', + }, + headerContainerStyles: { + marginTop: 26, + marginBottom: 10, + marginHorizontal: 28, + }, + headerTextStyles: { + fontWeight: 'bold', + fontSize: normalize(17), + lineHeight: normalize(20), + }, +}); + +export default NewChatModal; diff --git a/src/screens/chat/index.ts b/src/screens/chat/index.ts index d2ccb02b..328eb8bf 100644 --- a/src/screens/chat/index.ts +++ b/src/screens/chat/index.ts @@ -1,2 +1,6 @@ export {default as ChatListScreen} from './ChatListScreen'; export {default as ChatScreen} from './ChatScreen'; +export {default as NewChatModal} from './NewChatModal'; +export {default as ChatSearchBar} from './ChatSearchBar'; +export {default as ChatResultsList} from './ChatResultsList'; +export {default as ChatResultsCell} from './ChatResultsCell'; diff --git a/src/screens/search/SearchScreen.tsx b/src/screens/search/SearchScreen.tsx index f7e1c467..6d8e4848 100644 --- a/src/screens/search/SearchScreen.tsx +++ b/src/screens/search/SearchScreen.tsx @@ -24,7 +24,7 @@ import { SearchResultsBackground, TabsGradient, } from '../../components'; -import {SEARCH_ENDPOINT} from '../../constants'; +import {SEARCH_ENDPOINT_V2} from '../../constants'; import {loadSearchResults} from '../../services'; import {resetScreenType} from '../../store/actions'; import {RootState} from '../../store/rootReducer'; @@ -71,7 +71,7 @@ const SearchScreen: React.FC = () => { } (async () => { const searchResults = await loadSearchResults( - `${SEARCH_ENDPOINT}?query=${query}`, + `${SEARCH_ENDPOINT_V2}?query=${query}`, ); if (query.length > 2) { const sanitizedResult = [ -- cgit v1.2.3-70-g09d2 From 0ebd64161da70d5d417886d7026ec8e0f4691db3 Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Fri, 9 Apr 2021 09:46:55 -0700 Subject: Changes for default suggested --- src/screens/chat/ChatListScreen.tsx | 2 +- src/screens/chat/NewChatModal.tsx | 64 +++++++++++++++++++++++++------------ 2 files changed, 44 insertions(+), 22 deletions(-) (limited to 'src/screens') diff --git a/src/screens/chat/ChatListScreen.tsx b/src/screens/chat/ChatListScreen.tsx index ca1461fe..daea9984 100644 --- a/src/screens/chat/ChatListScreen.tsx +++ b/src/screens/chat/ChatListScreen.tsx @@ -98,7 +98,7 @@ const ChatListScreen: React.FC = ({navigation}) => { )} - {modalVisible && } + diff --git a/src/screens/chat/NewChatModal.tsx b/src/screens/chat/NewChatModal.tsx index 2bbaf8d2..32a9b667 100644 --- a/src/screens/chat/NewChatModal.tsx +++ b/src/screens/chat/NewChatModal.tsx @@ -16,13 +16,14 @@ import {ScreenType} from '../../types'; import {normalize} from '../../utils'; import {ChatResultsList, ChatSearchBar} from './index'; interface NewChatModalProps { + modalVisible: boolean; setChatModalVisible: (open: boolean) => void; } -const NewChatModal: React.FC = ({setChatModalVisible}) => { - const [modalVisible, setModalVisible] = useState(true); - const navigation = useNavigation(); - const sheetRef = useRef(null); +const NewChatModal: React.FC = ({ + modalVisible, + setChatModalVisible, +}) => { const [searching, setSearching] = useState(false); /* * Animated value @@ -40,29 +41,51 @@ const NewChatModal: React.FC = ({setChatModalVisible}) => { setSearching(false); }; + const getDefaultSuggested = async () => { + const searchResults = await loadSearchResults( + `${SEARCH_ENDPOINT}?query=&requestType=suggested`, + ); + console.log(searchResults); + const sanitizedResult = [ + { + title: 'users', + data: searchResults?.users, + }, + ]; + console.log(searchResults, sanitizedResult); + setResults(sanitizedResult); + }; + + const getQuerySuggested = async () => { + const searchResults = await loadSearchResults( + `${SEARCH_ENDPOINT}?query=${query}&requestType='search'`, + ); + if (query.length > 2) { + const sanitizedResult = [ + { + title: 'users', + data: searchResults?.users, + }, + ]; + setResults(sanitizedResult); + } else { + setResults([]); + } + }; + useEffect(() => { + if (query.length === 0) { + getDefaultSuggested(); + } + if (!searching) { return; } + if (query.length < 3) { return; } - (async () => { - const searchResults = await loadSearchResults( - `${SEARCH_ENDPOINT}?query=${query}`, - ); - if (query.length > 2) { - const sanitizedResult = [ - { - title: 'users', - data: searchResults?.users, - }, - ]; - setResults(sanitizedResult); - } else { - setResults([]); - } - })(); + getQuerySuggested(); }, [query]); const _modalContent = () => { @@ -100,7 +123,6 @@ const NewChatModal: React.FC = ({setChatModalVisible}) => { {_modalContent()} -- cgit v1.2.3-70-g09d2 From c54a25dc05eeb70780bc3a3ec05cb8cbed3f334b Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Fri, 9 Apr 2021 13:27:45 -0400 Subject: code cleanup --- src/routes/main/MainStackScreen.tsx | 24 ++++++++++-------------- src/screens/chat/ChatResultsCell.tsx | 9 ++------- src/screens/chat/ChatResultsList.tsx | 19 ++++++++----------- src/screens/chat/ChatSearchBar.tsx | 9 +-------- src/screens/chat/NewChatModal.tsx | 3 +-- 5 files changed, 22 insertions(+), 42 deletions(-) (limited to 'src/screens') diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx index 1d222040..37867151 100644 --- a/src/routes/main/MainStackScreen.tsx +++ b/src/routes/main/MainStackScreen.tsx @@ -1,11 +1,6 @@ import AsyncStorage from '@react-native-community/async-storage'; import {RouteProp} from '@react-navigation/native'; -import { - StackNavigationOptions, - createStackNavigator, - TransitionSpecs, -} from '@react-navigation/stack'; -import {NavigationContainer} from '@react-navigation/native'; +import {StackNavigationOptions} from '@react-navigation/stack'; import React, {useEffect, useState} from 'react'; import {StyleSheet, Text} from 'react-native'; import {normalize} from 'react-native-elements'; @@ -16,6 +11,8 @@ import { BadgeSelection, CaptionScreen, CategorySelection, + ChatListScreen, + ChatScreen, CreateCustomCategory, DiscoverUsers, EditProfile, @@ -24,19 +21,17 @@ import { InviteFriendsScreen, MomentCommentsScreen, MomentUploadPromptScreen, + NewChatModal, NotificationsScreen, - ProfileScreen, PrivacyScreen, + ProfileScreen, RequestContactsAccess, SearchScreen, + SettingsScreen, SocialMediaTaggs, SuggestedPeopleScreen, SuggestedPeopleUploadPictureScreen, SuggestedPeopleWelcomeScreen, - SettingsScreen, - ChatListScreen, - ChatScreen, - NewChatModal, } from '../../screens'; import MutualBadgeHolders from '../../screens/suggestedPeople/MutualBadgeHolders'; import {ScreenType} from '../../types'; @@ -58,8 +53,6 @@ type MainStackRouteProps = RouteProp; interface MainStackProps { route: MainStackRouteProps; } -const RootStack = createStackNavigator(); -const tempStack = createStackNavigator(); const MainStackScreen: React.FC = ({route}) => { const {screenType} = route.params; @@ -322,7 +315,10 @@ const MainStackScreen: React.FC = ({route}) => { = ({ }) => { const [avatar, setAvatar] = useState(undefined); const {chatClient, setChannel} = useContext(ChatContext); - const {university} = useSelector((state: RootState) => state.user.profile); useEffect(() => { (async () => { @@ -42,8 +39,6 @@ const ChatResultsCell: React.FC = ({ })(); }, [thumbnail_url]); - const dispatch = useDispatch(); - const state: RootState = useStore().getState(); const navigation = useNavigation(); const createChannelIfNotPresentAndNavigate = async () => { try { diff --git a/src/screens/chat/ChatResultsList.tsx b/src/screens/chat/ChatResultsList.tsx index 17a16572..0c6d58e4 100644 --- a/src/screens/chat/ChatResultsList.tsx +++ b/src/screens/chat/ChatResultsList.tsx @@ -23,16 +23,13 @@ interface ChatResultsProps { setChatModalVisible: Function; } -const sectionHeader: React.FC = () => { - return null; -}; - const ChatResultsList: React.FC = ({ results, setChatModalVisible, }) => { const [showEmptyView, setshowEmptyView] = useState(false); const {user: loggedInUser} = useSelector((state: RootState) => state.user); + const tabbarHeight = useBottomTabBarHeight(); useEffect(() => { if (results && results.length > 0) { @@ -54,7 +51,7 @@ const ChatResultsList: React.FC = ({ ) : ( item.id + index} renderItem={({item}) => { @@ -68,12 +65,7 @@ const ChatResultsList: React.FC = ({ }} stickySectionHeadersEnabled={false} ListEmptyComponent={() => ( - + Start a new chat by searching for someone )} @@ -102,6 +94,11 @@ const styles = StyleSheet.create({ fontWeight: '500', fontSize: normalize(14), }, + empty: { + marginTop: 20, + justifyContent: 'center', + alignItems: 'center', + }, }); export default ChatResultsList; diff --git a/src/screens/chat/ChatSearchBar.tsx b/src/screens/chat/ChatSearchBar.tsx index 294efa57..4916ec45 100644 --- a/src/screens/chat/ChatSearchBar.tsx +++ b/src/screens/chat/ChatSearchBar.tsx @@ -1,4 +1,4 @@ -import React, {useEffect, useState} from 'react'; +import React from 'react'; import { Keyboard, NativeSyntheticEvent, @@ -10,16 +10,9 @@ import { TouchableOpacity, View, ViewStyle, - LayoutChangeEvent, } from 'react-native'; import {normalize} from 'react-native-elements'; import Animated, {useAnimatedStyle} from 'react-native-reanimated'; -import Icon from 'react-native-vector-icons/Feather'; -import {useSelector} from 'react-redux'; -import {RootState} from '../../store/rootReducer'; -import {getSearchSuggestions} from '../../utils'; - -const AnimatedIcon = Animated.createAnimatedComponent(Icon); interface SearchBarProps extends TextInputProps { onCancel: () => void; diff --git a/src/screens/chat/NewChatModal.tsx b/src/screens/chat/NewChatModal.tsx index 32a9b667..a7754d3a 100644 --- a/src/screens/chat/NewChatModal.tsx +++ b/src/screens/chat/NewChatModal.tsx @@ -1,5 +1,4 @@ -import {useNavigation} from '@react-navigation/core'; -import React, {useEffect, useRef, useState} from 'react'; +import React, {useEffect, useState} from 'react'; import { Keyboard, SectionListData, -- cgit v1.2.3-70-g09d2 From c8d5992ca659a1984194718703dd1b036e1fb59e Mon Sep 17 00:00:00 2001 From: ankit-thanekar007 Date: Fri, 9 Apr 2021 11:14:46 -0700 Subject: Changes for default suggested --- src/constants/api.ts | 24 +++++++++++++++--------- src/screens/chat/NewChatModal.tsx | 9 ++++++--- src/screens/search/SearchScreen.tsx | 4 ++-- 3 files changed, 23 insertions(+), 14 deletions(-) (limited to 'src/screens') diff --git a/src/constants/api.ts b/src/constants/api.ts index ef33631a..43294386 100644 --- a/src/constants/api.ts +++ b/src/constants/api.ts @@ -2,7 +2,7 @@ // Dev const BASE_URL: string = 'http://127.0.0.1:8000/'; -export const STREAM_CHAT_API = 'g2hvnyqx9cmv' +export const STREAM_CHAT_API = 'g2hvnyqx9cmv'; // Prod // const BASE_URL: string = 'http://app-prod.tagg.id/'; @@ -25,7 +25,8 @@ export const GET_IG_POSTS_ENDPOINT: string = API_URL + 'posts-ig/'; export const GET_FB_POSTS_ENDPOINT: string = API_URL + 'posts-fb/'; export const GET_TWITTER_POSTS_ENDPOINT: string = API_URL + 'posts-twitter/'; export const SEARCH_ENDPOINT: string = API_URL + 'search/'; -export const SEARCH_ENDPOINT_V2: string = API_URL + 'search/v2/'; +export const SEARCH_ENDPOINT_MESSAGES: string = API_URL + 'search/messages/'; +export const SEARCH_ENDPOINT_SUGGESTED: string = API_URL + 'search/suggested/'; export const MOMENTS_ENDPOINT: string = API_URL + 'moments/'; export const MOMENT_THUMBNAIL_ENDPOINT: string = API_URL + 'moment-thumbnail/'; export const VERIFY_INVITATION_CODE_ENDPOUNT: string = API_URL + 'verify-code/'; @@ -38,20 +39,24 @@ export const PASSWORD_RESET_ENDPOINT: string = API_URL + 'password-reset/'; export const MOMENT_CATEGORY_ENDPOINT: string = API_URL + 'moment-category/'; export const NOTIFICATIONS_ENDPOINT: string = API_URL + 'notifications/'; export const DISCOVER_ENDPOINT: string = API_URL + 'discover/'; -export const SEARCH_BUTTONS_ENDPOPINT: string = DISCOVER_ENDPOINT + 'search_buttons/'; +export const SEARCH_BUTTONS_ENDPOPINT: string = + DISCOVER_ENDPOINT + 'search_buttons/'; export const WAITLIST_USER_ENDPOINT: string = API_URL + 'waitlist-user/'; export const COMMENT_THREAD_ENDPOINT: string = API_URL + 'reply/'; export const USERS_FROM_CONTACTS_ENDPOINT: string = API_URL + 'user_contacts/find_friends/'; export const INVITE_FRIEND_ENDPOINT: string = -API_URL + 'user_contacts/invite_friend/'; + API_URL + 'user_contacts/invite_friend/'; // Suggested People export const SP_USERS_ENDPOINT: string = API_URL + 'suggested_people/'; -export const SP_UPDATE_PICTURE_ENDPOINT: string = SP_USERS_ENDPOINT + 'update_picture/'; -export const SP_MUTUAL_BADGE_HOLDERS_ENDPOINT: string = SP_USERS_ENDPOINT + 'get_mutual_badge_holders/'; +export const SP_UPDATE_PICTURE_ENDPOINT: string = + SP_USERS_ENDPOINT + 'update_picture/'; +export const SP_MUTUAL_BADGE_HOLDERS_ENDPOINT: string = + SP_USERS_ENDPOINT + 'get_mutual_badge_holders/'; export const ADD_BADGES_ENDPOINT: string = SP_USERS_ENDPOINT + 'add_badges/'; -export const UPDATE_BADGES_ENDPOINT: string = SP_USERS_ENDPOINT + 'update_badges/'; +export const UPDATE_BADGES_ENDPOINT: string = + SP_USERS_ENDPOINT + 'update_badges/'; // Register as FCM device export const FCM_ENDPOINT: string = API_URL + 'fcm/'; @@ -72,6 +77,7 @@ export const LINK_IG_OAUTH: string = `https://www.instagram.com/oauth/authorize/ export const LINK_FB_OAUTH: string = `https://www.facebook.com/v8.0/dialog/oauth?client_id=1308555659343609&redirect_uri=${DEEPLINK}&scope=user_posts,public_profile&response_type=code`; export const LINK_TWITTER_OAUTH: string = API_URL + 'link-twitter-request/'; -// Profile Links -export const COMMUNITY_GUIDELINES: string = 'https://www.tagg.id/community-guidelines'; +// Profile Links +export const COMMUNITY_GUIDELINES: string = + 'https://www.tagg.id/community-guidelines'; export const PRIVACY_POLICY: string = 'https://www.tagg.id/privacy-policy'; diff --git a/src/screens/chat/NewChatModal.tsx b/src/screens/chat/NewChatModal.tsx index a7754d3a..95e46ecd 100644 --- a/src/screens/chat/NewChatModal.tsx +++ b/src/screens/chat/NewChatModal.tsx @@ -9,7 +9,10 @@ import { } from 'react-native'; import {useSharedValue} from 'react-native-reanimated'; import {BottomDrawer} from '../../components'; -import {SEARCH_ENDPOINT} from '../../constants'; +import { + SEARCH_ENDPOINT_MESSAGES, + SEARCH_ENDPOINT_SUGGESTED, +} from '../../constants'; import {loadSearchResults} from '../../services'; import {ScreenType} from '../../types'; import {normalize} from '../../utils'; @@ -42,7 +45,7 @@ const NewChatModal: React.FC = ({ const getDefaultSuggested = async () => { const searchResults = await loadSearchResults( - `${SEARCH_ENDPOINT}?query=&requestType=suggested`, + `${SEARCH_ENDPOINT_SUGGESTED}`, ); console.log(searchResults); const sanitizedResult = [ @@ -57,7 +60,7 @@ const NewChatModal: React.FC = ({ const getQuerySuggested = async () => { const searchResults = await loadSearchResults( - `${SEARCH_ENDPOINT}?query=${query}&requestType='search'`, + `${SEARCH_ENDPOINT_MESSAGES}?query=${query}`, ); if (query.length > 2) { const sanitizedResult = [ diff --git a/src/screens/search/SearchScreen.tsx b/src/screens/search/SearchScreen.tsx index 6d8e4848..f7e1c467 100644 --- a/src/screens/search/SearchScreen.tsx +++ b/src/screens/search/SearchScreen.tsx @@ -24,7 +24,7 @@ import { SearchResultsBackground, TabsGradient, } from '../../components'; -import {SEARCH_ENDPOINT_V2} from '../../constants'; +import {SEARCH_ENDPOINT} from '../../constants'; import {loadSearchResults} from '../../services'; import {resetScreenType} from '../../store/actions'; import {RootState} from '../../store/rootReducer'; @@ -71,7 +71,7 @@ const SearchScreen: React.FC = () => { } (async () => { const searchResults = await loadSearchResults( - `${SEARCH_ENDPOINT_V2}?query=${query}`, + `${SEARCH_ENDPOINT}?query=${query}`, ); if (query.length > 2) { const sanitizedResult = [ -- cgit v1.2.3-70-g09d2 From db51757cb968564dbc1554e0f10880eb009db7bc Mon Sep 17 00:00:00 2001 From: Ivan Chen Date: Fri, 9 Apr 2021 16:27:54 -0400 Subject: tweaked animation --- src/screens/chat/ChatResultsCell.tsx | 4 ++-- src/screens/chat/ChatResultsList.tsx | 16 +++++++--------- 2 files changed, 9 insertions(+), 11 deletions(-) (limited to 'src/screens') diff --git a/src/screens/chat/ChatResultsCell.tsx b/src/screens/chat/ChatResultsCell.tsx index 3678a2d7..d947c122 100644 --- a/src/screens/chat/ChatResultsCell.tsx +++ b/src/screens/chat/ChatResultsCell.tsx @@ -42,12 +42,12 @@ const ChatResultsCell: React.FC = ({ const navigation = useNavigation(); const createChannelIfNotPresentAndNavigate = async () => { try { + setChatModalVisible(false); const channel = await createChannel(loggedInUser.userId, id, chatClient); setChannel(channel); setTimeout(() => { - setChatModalVisible(false); navigation.navigate('Chat'); - }, 500); + }, 100); } catch (error) { Alert.alert(ERROR_FAILED_TO_CREATE_CHANNEL); } diff --git a/src/screens/chat/ChatResultsList.tsx b/src/screens/chat/ChatResultsList.tsx index 0c6d58e4..b9970772 100644 --- a/src/screens/chat/ChatResultsList.tsx +++ b/src/screens/chat/ChatResultsList.tsx @@ -54,15 +54,13 @@ const ChatResultsList: React.FC = ({ contentContainerStyle={[{paddingBottom: tabbarHeight}]} sections={results} keyExtractor={(item, index) => item.id + index} - renderItem={({item}) => { - return ( - - ); - }} + renderItem={({item}) => ( + + )} stickySectionHeadersEnabled={false} ListEmptyComponent={() => ( -- cgit v1.2.3-70-g09d2