Add chat tab. Add GiftedChat & customize it a bit
This commit is contained in:
parent
c001c71df8
commit
fb0d89eba8
10
app.json
10
app.json
@ -17,6 +17,10 @@
|
||||
"usesAppleSignIn": true,
|
||||
"config": {
|
||||
"usesNonExemptEncryption": false
|
||||
},
|
||||
"infoPList": {
|
||||
"NSLocationWhenInUseUsageDescription": "This app uses your location in order to allow you to share your location in chat.",
|
||||
"NSCameraUsageDescription": "This app uses your camera to take photos & send them in the chat."
|
||||
}
|
||||
},
|
||||
"android": {
|
||||
@ -38,6 +42,12 @@
|
||||
{
|
||||
"faceIDPermission": "Allow $(PRODUCT_NAME) to access your Face ID biometric data."
|
||||
}
|
||||
],
|
||||
[
|
||||
"expo-location",
|
||||
{
|
||||
"locationAlwaysAndWhenInUsePermission": "Allow $(PRODUCT_NAME) to use your location."
|
||||
}
|
||||
]
|
||||
],
|
||||
"experiments": {
|
||||
|
||||
@ -30,6 +30,17 @@ const TabLayout = () => {
|
||||
),
|
||||
}}
|
||||
/>
|
||||
|
||||
<Tabs.Screen
|
||||
name='messages'
|
||||
options={{
|
||||
title: 'Messages',
|
||||
tabBarIcon: ({ color, focused }) => (
|
||||
<TabBarIcon name={focused ? 'chatbubbles' : 'chatbubbles-outline'} color={color} />
|
||||
),
|
||||
}}
|
||||
/>
|
||||
|
||||
<Tabs.Screen
|
||||
name='settings'
|
||||
options={{
|
||||
|
||||
@ -1,14 +1,64 @@
|
||||
import { StyleSheet } from "react-native";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { StyleSheet, Alert } from "react-native";
|
||||
import { ThemedText } from "@/components/ThemedText";
|
||||
import { ThemedView } from "@/components/ThemedView";
|
||||
import { Colors } from '@/constants/Colors';
|
||||
import { useColorScheme } from '@/hooks/useColorScheme';
|
||||
import FontAwesome from "@expo/vector-icons/FontAwesome";
|
||||
|
||||
import Button from "@/components/buttons/Button";
|
||||
import { getUserData } from "@/components/services/securestorage/UserData";
|
||||
|
||||
const Index = () => {
|
||||
const scheme = useColorScheme() ?? 'light';
|
||||
const [pushToken, setPushToken] = useState<string | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchUserData = async () => {
|
||||
const userData = await getUserData();
|
||||
if (userData) {
|
||||
setPushToken(userData.pushToken);
|
||||
}
|
||||
};
|
||||
fetchUserData();
|
||||
}, []);
|
||||
|
||||
const sendPushNotification = async () => {
|
||||
if (!pushToken) {
|
||||
Alert.alert('Error', 'Push token not available');
|
||||
return;
|
||||
}
|
||||
|
||||
const message = {
|
||||
to: pushToken,
|
||||
sound: 'default',
|
||||
title: 'Hey Baby!',
|
||||
body: 'Are you ready for push notifications?!?',
|
||||
data: {
|
||||
someData: 'goes here'
|
||||
},
|
||||
};
|
||||
|
||||
try {
|
||||
const response = await fetch(`https://exp.host/--/api/v2/push/send`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
Accept: 'application/json',
|
||||
'Accept-encoding': 'gzip, deflate',
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(message),
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
console.log('Result:', result);
|
||||
Alert.alert('Success', 'Push notification sent successfully');
|
||||
|
||||
} catch (error) {
|
||||
console.error('Error sending push notification:', error);
|
||||
Alert.alert('Error', 'Failed to send push notification');
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemedView style={styles.container}>
|
||||
<ThemedText style={styles.text}>
|
||||
@ -16,9 +66,9 @@ const Index = () => {
|
||||
</ThemedText>
|
||||
<ThemedView style={styles.footerContainer}>
|
||||
<Button width={220} height={60}
|
||||
onPress={() => alert('You pressed a button.')}
|
||||
onPress={sendPushNotification}
|
||||
>
|
||||
<FontAwesome name="picture-o" size={18}
|
||||
<FontAwesome name="bell" size={18}
|
||||
color={Colors[scheme].background} style={styles.buttonIcon}
|
||||
/>
|
||||
<ThemedText
|
||||
@ -27,7 +77,7 @@ const Index = () => {
|
||||
{color: Colors[scheme].background}
|
||||
]}
|
||||
>
|
||||
Press this button
|
||||
Send Push Notification
|
||||
</ThemedText>
|
||||
</Button>
|
||||
</ThemedView>
|
||||
|
||||
320
app/(tabs)/messages.tsx
Normal file
320
app/(tabs)/messages.tsx
Normal file
@ -0,0 +1,320 @@
|
||||
import React, { useCallback, useReducer } from 'react'
|
||||
import { ThemedView } from '@/components/ThemedView'
|
||||
import { ThemedText } from '@/components/ThemedText'
|
||||
import { Alert, Linking, Platform, StyleSheet } from 'react-native'
|
||||
import { MaterialIcons } from '@expo/vector-icons'
|
||||
import {
|
||||
GiftedChat,
|
||||
IMessage,
|
||||
Send,
|
||||
SendProps,
|
||||
SystemMessage,
|
||||
} from 'react-native-gifted-chat'
|
||||
import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context'
|
||||
import NavBar from '@/components/chat/NavBar'
|
||||
import AccessoryBar from '@/components/chat/AccessoryBar'
|
||||
import CustomActions from '@/components/chat/CustomActions'
|
||||
import CustomView from '@/components/chat/CustomView'
|
||||
import earlierMessages from '@/components/chat/data/earlierMessages'
|
||||
import messagesData from '@/components/chat/data/messages'
|
||||
import * as Clipboard from 'expo-clipboard'
|
||||
|
||||
const user = {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
}
|
||||
|
||||
// const otherUser = {
|
||||
// _id: 2,
|
||||
// name: 'React Native',
|
||||
// avatar: 'https://facebook.github.io/react/img/logo_og.png',
|
||||
// }
|
||||
|
||||
interface IState {
|
||||
messages: any[]
|
||||
step: number
|
||||
loadEarlier?: boolean
|
||||
isLoadingEarlier?: boolean
|
||||
isTyping: boolean
|
||||
}
|
||||
|
||||
enum ActionKind {
|
||||
SEND_MESSAGE = 'SEND_MESSAGE',
|
||||
LOAD_EARLIER_MESSAGES = 'LOAD_EARLIER_MESSAGES',
|
||||
LOAD_EARLIER_START = 'LOAD_EARLIER_START',
|
||||
SET_IS_TYPING = 'SET_IS_TYPING',
|
||||
// LOAD_EARLIER_END = 'LOAD_EARLIER_END',
|
||||
}
|
||||
|
||||
// An interface for our actions
|
||||
interface StateAction {
|
||||
type: ActionKind
|
||||
payload?: any
|
||||
}
|
||||
|
||||
function reducer (state: IState, action: StateAction) {
|
||||
switch (action.type) {
|
||||
case ActionKind.SEND_MESSAGE: {
|
||||
return {
|
||||
...state,
|
||||
step: state.step + 1,
|
||||
messages: action.payload,
|
||||
}
|
||||
}
|
||||
case ActionKind.LOAD_EARLIER_MESSAGES: {
|
||||
return {
|
||||
...state,
|
||||
loadEarlier: true,
|
||||
isLoadingEarlier: false,
|
||||
messages: action.payload,
|
||||
}
|
||||
}
|
||||
case ActionKind.LOAD_EARLIER_START: {
|
||||
return {
|
||||
...state,
|
||||
isLoadingEarlier: true,
|
||||
}
|
||||
}
|
||||
case ActionKind.SET_IS_TYPING: {
|
||||
return {
|
||||
...state,
|
||||
isTyping: action.payload,
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const App = () => {
|
||||
const [state, dispatch] = useReducer(reducer, {
|
||||
messages: messagesData,
|
||||
step: 0,
|
||||
loadEarlier: true,
|
||||
isLoadingEarlier: false,
|
||||
isTyping: false,
|
||||
})
|
||||
|
||||
const onSend = useCallback(
|
||||
(messages: any[]) => {
|
||||
const sentMessages = [{ ...messages[0], sent: true, received: true }]
|
||||
const newMessages = GiftedChat.append(
|
||||
state.messages,
|
||||
sentMessages,
|
||||
Platform.OS !== 'web'
|
||||
)
|
||||
|
||||
dispatch({ type: ActionKind.SEND_MESSAGE, payload: newMessages })
|
||||
},
|
||||
[dispatch, state.messages]
|
||||
)
|
||||
|
||||
const onLoadEarlier = useCallback(() => {
|
||||
dispatch({ type: ActionKind.LOAD_EARLIER_START })
|
||||
setTimeout(() => {
|
||||
const newMessages = GiftedChat.prepend(
|
||||
state.messages,
|
||||
earlierMessages() as IMessage[],
|
||||
Platform.OS !== 'web'
|
||||
)
|
||||
|
||||
dispatch({ type: ActionKind.LOAD_EARLIER_MESSAGES, payload: newMessages })
|
||||
}, 1500) // simulating network
|
||||
}, [dispatch, state.messages])
|
||||
|
||||
const parsePatterns = useCallback(() => {
|
||||
return [
|
||||
{
|
||||
pattern: /#(\w+)/,
|
||||
style: { textDecorationLine: 'underline', color: 'darkorange' },
|
||||
onPress: () => Linking.openURL('http://gifted.chat'),
|
||||
},
|
||||
]
|
||||
}, [])
|
||||
|
||||
const onLongPressAvatar = useCallback((pressedUser: any) => {
|
||||
Alert.alert(JSON.stringify(pressedUser))
|
||||
}, [])
|
||||
|
||||
const onPressAvatar = useCallback(() => {
|
||||
Alert.alert('On avatar press')
|
||||
}, [])
|
||||
|
||||
const handleLongPress = useCallback((context: unknown, currentMessage: object) => {
|
||||
if (!currentMessage.text)
|
||||
return
|
||||
|
||||
const options = [
|
||||
'Copy text',
|
||||
'Cancel',
|
||||
]
|
||||
|
||||
const cancelButtonIndex = options.length - 1
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
;(context as any).actionSheet().showActionSheetWithOptions(
|
||||
{
|
||||
options,
|
||||
cancelButtonIndex,
|
||||
},
|
||||
(buttonIndex: number) => {
|
||||
switch (buttonIndex) {
|
||||
case 0:
|
||||
Clipboard.setStringAsync(currentMessage.text)
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
}
|
||||
)
|
||||
}, [])
|
||||
|
||||
const onQuickReply = useCallback((replies: any[]) => {
|
||||
const createdAt = new Date()
|
||||
if (replies.length === 1)
|
||||
onSend([
|
||||
{
|
||||
createdAt,
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: replies[0].title,
|
||||
user,
|
||||
},
|
||||
])
|
||||
else if (replies.length > 1)
|
||||
onSend([
|
||||
{
|
||||
createdAt,
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: replies.map(reply => reply.title).join(', '),
|
||||
user,
|
||||
},
|
||||
])
|
||||
else
|
||||
console.warn('replies param is not set correctly')
|
||||
}, [])
|
||||
|
||||
const renderQuickReplySend = useCallback(() => {
|
||||
return <ThemedText>{' custom send =>'}</ThemedText>
|
||||
}, [])
|
||||
|
||||
const setIsTyping = useCallback(
|
||||
(isTyping: boolean) => {
|
||||
dispatch({ type: ActionKind.SET_IS_TYPING, payload: isTyping })
|
||||
},
|
||||
[dispatch]
|
||||
)
|
||||
|
||||
const onSendFromUser = useCallback(
|
||||
(messages: IMessage[] = []) => {
|
||||
const createdAt = new Date()
|
||||
const messagesToUpload = messages.map(message => ({
|
||||
...message,
|
||||
user,
|
||||
createdAt,
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
}))
|
||||
|
||||
onSend(messagesToUpload)
|
||||
},
|
||||
[onSend]
|
||||
)
|
||||
|
||||
const renderAccessory = useCallback(() => {
|
||||
return (
|
||||
<AccessoryBar
|
||||
onSend={onSendFromUser}
|
||||
isTyping={() => setIsTyping(!state.isTyping)}
|
||||
/>
|
||||
)
|
||||
}, [onSendFromUser, setIsTyping, state.isTyping])
|
||||
|
||||
const renderCustomActions = useCallback(
|
||||
props =>
|
||||
Platform.OS === 'web'
|
||||
? null
|
||||
: (
|
||||
<CustomActions {...props} onSend={onSendFromUser} />
|
||||
),
|
||||
[onSendFromUser]
|
||||
)
|
||||
|
||||
const renderSystemMessage = useCallback(props => {
|
||||
return (
|
||||
<SystemMessage
|
||||
{...props}
|
||||
containerStyle={{
|
||||
marginBottom: 15,
|
||||
}}
|
||||
textStyle={{
|
||||
fontSize: 14,
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}, [])
|
||||
|
||||
const renderCustomView = useCallback(props => {
|
||||
return <CustomView {...props} />
|
||||
}, [])
|
||||
|
||||
const renderSend = useCallback((props: SendProps<IMessage>) => {
|
||||
return (
|
||||
<Send {...props} containerStyle={{ justifyContent: 'center', paddingHorizontal: 10 }}>
|
||||
<MaterialIcons size={30} color={'tomato'} name={'send'} />
|
||||
</Send>
|
||||
)
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<SafeAreaView style={styles.fill}>
|
||||
<NavBar />
|
||||
<ThemedView style={styles.fill}>
|
||||
<GiftedChat
|
||||
messages={state.messages}
|
||||
onSend={onSend}
|
||||
loadEarlier={state.loadEarlier}
|
||||
onLoadEarlier={onLoadEarlier}
|
||||
isLoadingEarlier={state.isLoadingEarlier}
|
||||
parsePatterns={parsePatterns}
|
||||
user={user}
|
||||
scrollToBottom
|
||||
onPressAvatar={onPressAvatar}
|
||||
onLongPressAvatar={onLongPressAvatar}
|
||||
onLongPress={handleLongPress}
|
||||
onQuickReply={onQuickReply}
|
||||
quickReplyStyle={{ borderRadius: 2 }}
|
||||
quickReplyTextStyle={{
|
||||
fontWeight: '200',
|
||||
}}
|
||||
renderQuickReplySend={renderQuickReplySend}
|
||||
renderAccessory={renderAccessory}
|
||||
renderActions={renderCustomActions}
|
||||
renderSystemMessage={renderSystemMessage}
|
||||
renderCustomView={renderCustomView}
|
||||
renderSend={renderSend}
|
||||
keyboardShouldPersistTaps='never'
|
||||
timeTextStyle={{
|
||||
left: { color: 'red' },
|
||||
right: { color: 'yellow' },
|
||||
}}
|
||||
isTyping={state.isTyping}
|
||||
inverted={Platform.OS !== 'web'}
|
||||
infiniteScroll
|
||||
/>
|
||||
</ThemedView>
|
||||
</SafeAreaView>
|
||||
)
|
||||
}
|
||||
|
||||
const AppWrapper = () => {
|
||||
return (
|
||||
<SafeAreaProvider>
|
||||
<App />
|
||||
</SafeAreaProvider>
|
||||
)
|
||||
}
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
fill: {
|
||||
flex: 1,
|
||||
},
|
||||
})
|
||||
|
||||
export default AppWrapper
|
||||
0
assets/fonts/SpaceMono-Regular.ttf
Normal file → Executable file
0
assets/fonts/SpaceMono-Regular.ttf
Normal file → Executable file
53
components/chat/AccessoryBar.tsx
Normal file
53
components/chat/AccessoryBar.tsx
Normal file
@ -0,0 +1,53 @@
|
||||
import { MaterialIcons } from '@expo/vector-icons'
|
||||
import React from 'react'
|
||||
import { StyleSheet, TouchableOpacity } from 'react-native'
|
||||
import { ThemedView } from '@/components/ThemedView'
|
||||
|
||||
import {
|
||||
getLocationAsync,
|
||||
pickImageAsync,
|
||||
takePictureAsync,
|
||||
} from '@/components/chat/mediaUtils'
|
||||
|
||||
export default class AccessoryBar extends React.Component<any> {
|
||||
render () {
|
||||
const { onSend, isTyping } = this.props
|
||||
|
||||
return (
|
||||
<ThemedView style={styles.container}>
|
||||
<Button onPress={() => pickImageAsync(onSend)} name='photo' />
|
||||
<Button onPress={() => takePictureAsync(onSend)} name='camera' />
|
||||
<Button onPress={() => getLocationAsync(onSend)} name='my-location' />
|
||||
<Button
|
||||
onPress={() => {
|
||||
isTyping()
|
||||
}}
|
||||
name='chat'
|
||||
/>
|
||||
</ThemedView>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
const Button = ({
|
||||
onPress,
|
||||
size = 30,
|
||||
color = 'rgba(255,255,255, 0.8)',
|
||||
...props
|
||||
}) => (
|
||||
<TouchableOpacity onPress={onPress}>
|
||||
<MaterialIcons size={size} color={color} {...props} />
|
||||
</TouchableOpacity>
|
||||
)
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
height: 44,
|
||||
width: '100%',
|
||||
flexDirection: 'row',
|
||||
justifyContent: 'space-around',
|
||||
alignItems: 'center',
|
||||
borderTopWidth: StyleSheet.hairlineWidth,
|
||||
borderTopColor: 'rgba(0,0,0,0.3)',
|
||||
},
|
||||
})
|
||||
111
components/chat/CustomActions.tsx
Normal file
111
components/chat/CustomActions.tsx
Normal file
@ -0,0 +1,111 @@
|
||||
import React, { useCallback } from 'react'
|
||||
import {
|
||||
StyleProp,
|
||||
ViewStyle,
|
||||
TextStyle,
|
||||
StyleSheet,
|
||||
Text,
|
||||
TouchableOpacity,
|
||||
View,
|
||||
} from 'react-native'
|
||||
|
||||
import { useActionSheet } from '@expo/react-native-action-sheet'
|
||||
import {
|
||||
getLocationAsync,
|
||||
pickImageAsync,
|
||||
takePictureAsync,
|
||||
} from '@/components/chat/mediaUtils'
|
||||
|
||||
interface Props {
|
||||
renderIcon?: () => React.ReactNode
|
||||
wrapperStyle?: StyleProp<ViewStyle>
|
||||
containerStyle?: StyleProp<ViewStyle>
|
||||
iconTextStyle?: StyleProp<TextStyle>
|
||||
onSend: (messages: unknown) => void
|
||||
}
|
||||
|
||||
const CustomActions = ({
|
||||
renderIcon,
|
||||
iconTextStyle,
|
||||
containerStyle,
|
||||
wrapperStyle,
|
||||
onSend,
|
||||
}: Props) => {
|
||||
const { showActionSheetWithOptions } = useActionSheet()
|
||||
|
||||
const onActionsPress = useCallback(() => {
|
||||
const options = [
|
||||
'Choose From Library',
|
||||
'Take Picture',
|
||||
'Send Location',
|
||||
'Cancel',
|
||||
]
|
||||
const cancelButtonIndex = options.length - 1
|
||||
|
||||
showActionSheetWithOptions(
|
||||
{
|
||||
options,
|
||||
cancelButtonIndex,
|
||||
},
|
||||
async buttonIndex => {
|
||||
switch (buttonIndex) {
|
||||
case 0:
|
||||
pickImageAsync(onSend)
|
||||
return
|
||||
case 1:
|
||||
takePictureAsync(onSend)
|
||||
return
|
||||
case 2:
|
||||
getLocationAsync(onSend)
|
||||
}
|
||||
}
|
||||
)
|
||||
}, [showActionSheetWithOptions, onSend])
|
||||
|
||||
const renderIconComponent = useCallback(() => {
|
||||
if (renderIcon)
|
||||
return renderIcon()
|
||||
|
||||
return (
|
||||
<View style={[styles.wrapper, wrapperStyle]}>
|
||||
<Text style={[styles.iconText, iconTextStyle]}>+</Text>
|
||||
</View>
|
||||
)
|
||||
}, [renderIcon, wrapperStyle, iconTextStyle])
|
||||
|
||||
return (
|
||||
<TouchableOpacity
|
||||
style={[styles.container, containerStyle]}
|
||||
onPress={onActionsPress}
|
||||
>
|
||||
{renderIconComponent()}
|
||||
</TouchableOpacity>
|
||||
)
|
||||
}
|
||||
|
||||
export default CustomActions
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
width: 26,
|
||||
height: 26,
|
||||
marginLeft: 10,
|
||||
marginBottom: 10,
|
||||
},
|
||||
wrapper: {
|
||||
borderRadius: 13,
|
||||
borderColor: '#b2b2b2',
|
||||
borderWidth: 2,
|
||||
flex: 1,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
},
|
||||
iconText: {
|
||||
color: '#b2b2b2',
|
||||
fontWeight: 'bold',
|
||||
fontSize: 16,
|
||||
lineHeight: 16,
|
||||
backgroundColor: 'transparent',
|
||||
textAlign: 'center',
|
||||
},
|
||||
})
|
||||
92
components/chat/CustomView.tsx
Normal file
92
components/chat/CustomView.tsx
Normal file
@ -0,0 +1,92 @@
|
||||
import React, { useCallback } from 'react'
|
||||
import * as Linking from 'expo-linking'
|
||||
import {
|
||||
Platform,
|
||||
StyleSheet,
|
||||
TouchableOpacity,
|
||||
View,
|
||||
Text,
|
||||
StyleProp,
|
||||
ViewStyle,
|
||||
} from 'react-native'
|
||||
import MapView from 'react-native-maps'
|
||||
|
||||
interface Props {
|
||||
currentMessage: any
|
||||
containerStyle?: StyleProp<ViewStyle>
|
||||
mapViewStyle?: StyleProp<ViewStyle>
|
||||
}
|
||||
|
||||
const CustomView = ({
|
||||
currentMessage,
|
||||
containerStyle,
|
||||
mapViewStyle,
|
||||
}: Props) => {
|
||||
const openMapAsync = useCallback(async () => {
|
||||
if (Platform.OS === 'web') {
|
||||
alert('Opening the map is not supported.')
|
||||
return
|
||||
}
|
||||
|
||||
const { location = {} } = currentMessage
|
||||
|
||||
const url = Platform.select({
|
||||
ios: `http://maps.apple.com/?ll=${location.latitude},${location.longitude}`,
|
||||
default: `http://maps.google.com/?q=${location.latitude},${location.longitude}`,
|
||||
})
|
||||
|
||||
try {
|
||||
const supported = await Linking.canOpenURL(url)
|
||||
if (supported)
|
||||
return Linking.openURL(url)
|
||||
|
||||
alert('Opening the map is not supported.')
|
||||
} catch (e) {
|
||||
alert(e.message)
|
||||
}
|
||||
}, [currentMessage])
|
||||
|
||||
if (currentMessage.location)
|
||||
return (
|
||||
<TouchableOpacity
|
||||
style={[styles.container, containerStyle]}
|
||||
onPress={openMapAsync}
|
||||
>
|
||||
{Platform.OS !== 'web'
|
||||
? (
|
||||
<MapView
|
||||
style={[styles.mapView, mapViewStyle]}
|
||||
region={{
|
||||
latitude: currentMessage.location.latitude,
|
||||
longitude: currentMessage.location.longitude,
|
||||
latitudeDelta: 0.0922,
|
||||
longitudeDelta: 0.0421,
|
||||
}}
|
||||
scrollEnabled={false}
|
||||
zoomEnabled={false}
|
||||
/>
|
||||
)
|
||||
: (
|
||||
<View style={{ padding: 15 }}>
|
||||
<Text style={{ color: 'tomato', fontWeight: 'bold' }}>
|
||||
Map not supported in web yet, sorry!
|
||||
</Text>
|
||||
</View>
|
||||
)}
|
||||
</TouchableOpacity>
|
||||
)
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
export default CustomView
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {},
|
||||
mapView: {
|
||||
width: 150,
|
||||
height: 100,
|
||||
borderRadius: 13,
|
||||
margin: 3,
|
||||
},
|
||||
})
|
||||
21
components/chat/NavBar.tsx
Normal file
21
components/chat/NavBar.tsx
Normal file
@ -0,0 +1,21 @@
|
||||
import React from 'react'
|
||||
import { ThemedView } from '@/components/ThemedView'
|
||||
import { ThemedText } from '@/components/ThemedText'
|
||||
import { Platform } from 'react-native'
|
||||
|
||||
const NavBar = () => {
|
||||
if (Platform.OS === 'web')
|
||||
return null
|
||||
|
||||
return (
|
||||
<ThemedView
|
||||
style={{
|
||||
alignItems: 'center',
|
||||
paddingTop: 10,
|
||||
}}
|
||||
>
|
||||
<ThemedText>💬 Chat{'\n'}</ThemedText>
|
||||
</ThemedView>
|
||||
)
|
||||
}
|
||||
export default NavBar
|
||||
129
components/chat/data/earlierMessages.js
Normal file
129
components/chat/data/earlierMessages.js
Normal file
@ -0,0 +1,129 @@
|
||||
export default () => [
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text:
|
||||
'It uses the same design as React, letting you compose a rich mobile UI from declarative components https://facebook.github.io/react-native/',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text:
|
||||
'It uses the same design as React, letting you compose a rich mobile UI from declarative components https://facebook.github.io/react-native/',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text:
|
||||
'It uses the same design as React, letting you compose a rich mobile UI from declarative components https://facebook.github.io/react-native/',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text:
|
||||
'It uses the same design as React, letting you compose a rich mobile UI from declarative components https://facebook.github.io/react-native/',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: 'React Native lets you build mobile apps using only JavaScript',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: 'React Native lets you build mobile apps using only JavaScript',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: 'React Native lets you build mobile apps using only JavaScript',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: 'React Native lets you build mobile apps using only JavaScript',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: 'React Native lets you build mobile apps using only JavaScript',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: 'React Native lets you build mobile apps using only JavaScript',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: 'React Native lets you build mobile apps using only JavaScript',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: 'React Native lets you build mobile apps using only JavaScript',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: 'React Native lets you build mobile apps using only JavaScript',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: Math.round(Math.random() * 1000000),
|
||||
text: 'This is a system message.',
|
||||
createdAt: new Date(Date.UTC(2016, 7, 30, 17, 20, 0)),
|
||||
system: true,
|
||||
},
|
||||
]
|
||||
168
components/chat/data/messages.js
Normal file
168
components/chat/data/messages.js
Normal file
@ -0,0 +1,168 @@
|
||||
export default [
|
||||
{
|
||||
_id: 9,
|
||||
text: '#awesome 3',
|
||||
createdAt: new Date(),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: 8,
|
||||
text: '#awesome 2',
|
||||
createdAt: new Date(),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: 7,
|
||||
text: '#awesome',
|
||||
createdAt: new Date(),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: 6,
|
||||
text: 'Paris',
|
||||
createdAt: new Date(),
|
||||
user: {
|
||||
_id: 2,
|
||||
name: 'React Native',
|
||||
},
|
||||
image:
|
||||
'https://www.xtrafondos.com/wallpapers/torre-eiffel-en-paris-415.jpg',
|
||||
sent: true,
|
||||
received: true,
|
||||
},
|
||||
{
|
||||
_id: 5,
|
||||
text: 'Send me a picture!',
|
||||
createdAt: new Date(),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: 4,
|
||||
text: '',
|
||||
createdAt: new Date(),
|
||||
user: {
|
||||
_id: 2,
|
||||
name: 'React Native',
|
||||
},
|
||||
sent: true,
|
||||
received: true,
|
||||
location: {
|
||||
latitude: 48.864601,
|
||||
longitude: 2.398704,
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: 3,
|
||||
text: 'Where are you?',
|
||||
createdAt: new Date(),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: 2,
|
||||
text: 'Yes, and I use #GiftedChat!',
|
||||
createdAt: new Date(),
|
||||
user: {
|
||||
_id: 2,
|
||||
name: 'React Native',
|
||||
},
|
||||
sent: true,
|
||||
received: true,
|
||||
},
|
||||
{
|
||||
_id: 1,
|
||||
text: 'Are you building a chat app?',
|
||||
createdAt: new Date(),
|
||||
user: {
|
||||
_id: 1,
|
||||
name: 'Developer',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: 10,
|
||||
text: 'This is a quick reply. Do you love Gifted Chat? (radio) KEEP IT',
|
||||
createdAt: new Date(),
|
||||
quickReplies: {
|
||||
type: 'radio', // or 'checkbox',
|
||||
keepIt: true,
|
||||
values: [
|
||||
{
|
||||
title: '😋 Yes',
|
||||
value: 'yes',
|
||||
},
|
||||
{
|
||||
title:
|
||||
'📷 Yes, let me show you with a picture! Again let me show you with a picture!',
|
||||
value: 'yes_picture',
|
||||
},
|
||||
{
|
||||
title: '😞 Nope. What?',
|
||||
value: 'no',
|
||||
},
|
||||
],
|
||||
},
|
||||
user: {
|
||||
_id: 2,
|
||||
name: 'React Native',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: 20,
|
||||
text: 'This is a quick reply. Do you love Gifted Chat? (checkbox)',
|
||||
createdAt: new Date(),
|
||||
quickReplies: {
|
||||
type: 'checkbox', // or 'checkbox',
|
||||
values: [
|
||||
{
|
||||
title: 'Yes',
|
||||
value: 'yes',
|
||||
},
|
||||
{
|
||||
title: 'Yes, let me show you with a picture!',
|
||||
value: 'yes_picture',
|
||||
},
|
||||
{
|
||||
title: 'Nope. What?',
|
||||
value: 'no',
|
||||
},
|
||||
],
|
||||
},
|
||||
user: {
|
||||
_id: 2,
|
||||
name: 'React Native',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: 30,
|
||||
createdAt: new Date(),
|
||||
video: 'https://media.giphy.com/media/3o6ZthZjk09Xx4ktZ6/giphy.mp4',
|
||||
user: {
|
||||
_id: 2,
|
||||
name: 'React Native',
|
||||
},
|
||||
},
|
||||
{
|
||||
_id: 31,
|
||||
createdAt: new Date(),
|
||||
audio:
|
||||
'https://file-examples.com/wp-content/uploads/2017/11/file_example_MP3_700KB.mp3',
|
||||
user: {
|
||||
_id: 2,
|
||||
name: 'React Native',
|
||||
},
|
||||
},
|
||||
]
|
||||
82
components/chat/mediaUtils.ts
Normal file
82
components/chat/mediaUtils.ts
Normal file
@ -0,0 +1,82 @@
|
||||
import * as Linking from 'expo-linking'
|
||||
import * as Location from 'expo-location'
|
||||
import * as Permissions from 'expo-permissions'
|
||||
import * as ImagePicker from 'expo-image-picker'
|
||||
|
||||
import { Alert } from 'react-native'
|
||||
|
||||
export default async function getPermissionAsync (
|
||||
permission: Permissions.PermissionType
|
||||
) {
|
||||
const { status } = await Permissions.askAsync(permission)
|
||||
if (status !== 'granted') {
|
||||
const permissionName = permission.toLowerCase().replace('_', ' ')
|
||||
Alert.alert(
|
||||
'Cannot be done 😞',
|
||||
`If you would like to use this feature, you'll need to enable the ${permissionName} permission in your phone settings.`,
|
||||
[
|
||||
{
|
||||
text: 'Let\'s go!',
|
||||
onPress: () => Linking.openURL('app-settings:'),
|
||||
},
|
||||
{ text: 'Nevermind', onPress: () => {}, style: 'cancel' },
|
||||
],
|
||||
{ cancelable: true }
|
||||
)
|
||||
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
export async function getLocationAsync (
|
||||
onSend: (locations: { location: Location.LocationObjectCoords }[]) => void
|
||||
) {
|
||||
const response = await Location.requestForegroundPermissionsAsync()
|
||||
if (!response.granted)
|
||||
return
|
||||
|
||||
const location = await Location.getCurrentPositionAsync()
|
||||
if (!location)
|
||||
return
|
||||
|
||||
onSend([{ location: location.coords }])
|
||||
}
|
||||
|
||||
export async function pickImageAsync (
|
||||
onSend: (images: { image: string }[]) => void
|
||||
) {
|
||||
const response = await ImagePicker.requestMediaLibraryPermissionsAsync()
|
||||
if (!response.granted)
|
||||
return
|
||||
|
||||
const result = await ImagePicker.launchImageLibraryAsync({
|
||||
allowsEditing: true,
|
||||
aspect: [4, 3],
|
||||
})
|
||||
|
||||
if (result.canceled)
|
||||
return
|
||||
|
||||
const images = result.assets.map(({ uri: image }) => ({ image }))
|
||||
onSend(images)
|
||||
}
|
||||
|
||||
export async function takePictureAsync (
|
||||
onSend: (images: { image: string }[]) => void
|
||||
) {
|
||||
const response = await ImagePicker.requestCameraPermissionsAsync()
|
||||
if (!response.granted)
|
||||
return
|
||||
|
||||
const result = await ImagePicker.launchCameraAsync({
|
||||
allowsEditing: true,
|
||||
aspect: [4, 3],
|
||||
})
|
||||
|
||||
if (result.canceled)
|
||||
return
|
||||
|
||||
const images = result.assets.map(({ uri: image }) => ({ image }))
|
||||
onSend(images)
|
||||
}
|
||||
0
example/assets/fonts/SpaceMono-Regular.ttf
Normal file → Executable file
0
example/assets/fonts/SpaceMono-Regular.ttf
Normal file → Executable file
0
example/scripts/reset-project.js
Normal file → Executable file
0
example/scripts/reset-project.js
Normal file → Executable file
205
package-lock.json
generated
205
package-lock.json
generated
@ -12,13 +12,16 @@
|
||||
"@react-navigation/native": "^6.0.2",
|
||||
"expo": "~51.0.28",
|
||||
"expo-apple-authentication": "~6.4.2",
|
||||
"expo-clipboard": "~6.0.3",
|
||||
"expo-constants": "~16.0.2",
|
||||
"expo-device": "~6.0.2",
|
||||
"expo-font": "~12.0.9",
|
||||
"expo-image": "~1.13.0",
|
||||
"expo-image-picker": "~15.0.7",
|
||||
"expo-linking": "~6.3.1",
|
||||
"expo-location": "~17.0.1",
|
||||
"expo-notifications": "~0.28.18",
|
||||
"expo-permissions": "^14.4.0",
|
||||
"expo-router": "~3.5.23",
|
||||
"expo-secure-store": "~13.0.2",
|
||||
"expo-splash-screen": "~0.27.5",
|
||||
@ -29,6 +32,9 @@
|
||||
"react-dom": "18.2.0",
|
||||
"react-native": "0.74.5",
|
||||
"react-native-gesture-handler": "~2.16.1",
|
||||
"react-native-get-random-values": "~1.11.0",
|
||||
"react-native-gifted-chat": "^2.6.4",
|
||||
"react-native-maps": "1.14.0",
|
||||
"react-native-reanimated": "~3.10.1",
|
||||
"react-native-safe-area-context": "4.10.5",
|
||||
"react-native-screens": "3.31.1",
|
||||
@ -3378,6 +3384,19 @@
|
||||
"node": ">= 10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@expo/react-native-action-sheet": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@expo/react-native-action-sheet/-/react-native-action-sheet-4.1.0.tgz",
|
||||
"integrity": "sha512-RILoWhREgjMdr1NUSmZa/cHg8onV2YPDAMOy0iIP1c3H7nT9QQZf5dQNHK8ehcLM82sarVxriBJyYSSHAx7j6w==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/hoist-non-react-statics": "^3.3.1",
|
||||
"hoist-non-react-statics": "^3.3.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=18.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@expo/rudder-sdk-node": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@expo/rudder-sdk-node/-/rudder-sdk-node-1.1.1.tgz",
|
||||
@ -7158,6 +7177,12 @@
|
||||
"integrity": "sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/geojson": {
|
||||
"version": "7946.0.14",
|
||||
"resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.14.tgz",
|
||||
"integrity": "sha512-WCfD5Ht3ZesJUsONdhvm84dmzWOiOzOAqOncN0++w0lBw1o8OuDNJF2McvvCef/yBqb/HYRahp1BYtODFQ8bRg==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/graceful-fs": {
|
||||
"version": "4.1.9",
|
||||
"resolved": "https://registry.npmjs.org/@types/graceful-fs/-/graceful-fs-4.1.9.tgz",
|
||||
@ -7174,6 +7199,16 @@
|
||||
"integrity": "sha512-ynRvcq6wvqexJ9brDMS4BnBLzmr0e14d6ZJTEShTBWKymQiHwlAyGu0ZPEFI2Fh1U53F7tN9ufClWM5KvqkKOw==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/hoist-non-react-statics": {
|
||||
"version": "3.3.5",
|
||||
"resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.5.tgz",
|
||||
"integrity": "sha512-SbcrWzkKBw2cdwRTwQAswfpB9g9LJWfjtUeW/jvNwbhC8cpmmNYVePa+ncbUe0rGTQ7G3Ff6mYUN2VMfLVr+Sg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/react": "*",
|
||||
"hoist-non-react-statics": "^3.3.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/istanbul-lib-coverage": {
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.6.tgz",
|
||||
@ -7227,6 +7262,21 @@
|
||||
"integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/lodash": {
|
||||
"version": "4.17.10",
|
||||
"resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.17.10.tgz",
|
||||
"integrity": "sha512-YpS0zzoduEhuOWjAotS6A5AVCva7X4lVlYLF0FYHAY9sdraBfnatttHItlWeZdGhuEkf+OzMNg2ZYAx8t+52uQ==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/lodash.isequal": {
|
||||
"version": "4.5.8",
|
||||
"resolved": "https://registry.npmjs.org/@types/lodash.isequal/-/lodash.isequal-4.5.8.tgz",
|
||||
"integrity": "sha512-uput6pg4E/tj2LGxCZo9+y27JNyB2OZuuI/T5F+ylVDYuqICLG2/ktjxx0v6GvVntAf8TvEzeQLcV0ffRirXuA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/lodash": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/node": {
|
||||
"version": "18.19.55",
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.55.tgz",
|
||||
@ -7249,14 +7299,12 @@
|
||||
"version": "15.7.13",
|
||||
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.13.tgz",
|
||||
"integrity": "sha512-hCZTSvwbzWGvhqxp/RqVqwU999pBf2vp7hzIjiYOsl8wqOmUxkQ6ddw1cV3l8811+kdUFus/q4d1Y3E3SyEifA==",
|
||||
"devOptional": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/react": {
|
||||
"version": "18.2.79",
|
||||
"resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.79.tgz",
|
||||
"integrity": "sha512-RwGAGXPl9kSXwdNTafkOEuFrTBD5SA2B3iEB96xi8+xu5ddUa/cpvyVCSNn+asgLCTHkb5ZxN8gbuibYJi4s1w==",
|
||||
"devOptional": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/prop-types": "*",
|
||||
@ -9199,7 +9247,6 @@
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
|
||||
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
|
||||
"devOptional": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/dag-map": {
|
||||
@ -10117,6 +10164,15 @@
|
||||
"expo": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-clipboard": {
|
||||
"version": "6.0.3",
|
||||
"resolved": "https://registry.npmjs.org/expo-clipboard/-/expo-clipboard-6.0.3.tgz",
|
||||
"integrity": "sha512-RIKDsuHkYfaspifbFpVC8sBVFKR05L7Pj7mU2/XkbrW9m01OBNvdpGraXEMsTFCx97xMGsZpEw9pPquL4j4xVg==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"expo": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-constants": {
|
||||
"version": "16.0.2",
|
||||
"resolved": "https://registry.npmjs.org/expo-constants/-/expo-constants-16.0.2.tgz",
|
||||
@ -10212,6 +10268,15 @@
|
||||
"invariant": "^2.2.4"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-location": {
|
||||
"version": "17.0.1",
|
||||
"resolved": "https://registry.npmjs.org/expo-location/-/expo-location-17.0.1.tgz",
|
||||
"integrity": "sha512-m+OzotzlAXO3ZZ1uqW5GC25nXW868zN+ROyBA1V4VF6jGay1ZEs4URPglCVUDzZby2F5wt24cMzqDKw2IX6nRw==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"expo": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-modules-autolinking": {
|
||||
"version": "1.11.3",
|
||||
"resolved": "https://registry.npmjs.org/expo-modules-autolinking/-/expo-modules-autolinking-1.11.3.tgz",
|
||||
@ -10400,6 +10465,15 @@
|
||||
"node": ">= 10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-permissions": {
|
||||
"version": "14.4.0",
|
||||
"resolved": "https://registry.npmjs.org/expo-permissions/-/expo-permissions-14.4.0.tgz",
|
||||
"integrity": "sha512-oAcnJ7dlZhpBydK73cwomA2xofizayVUz+FW5REl7dMu7MYyeN/3aqhlpZ3mYddrxvG161bqu97MQr01UixUnw==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"expo": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-router": {
|
||||
"version": "3.5.23",
|
||||
"resolved": "https://registry.npmjs.org/expo-router/-/expo-router-3.5.23.tgz",
|
||||
@ -10651,6 +10725,12 @@
|
||||
"integrity": "sha512-dX7e/LHVJ6W3DE1MHWi9S1EYzDESENfLrYohG2G++ovZrYOkm4Knwa0mc1cn84xJOR4KEU0WSchhLbd0UklbHw==",
|
||||
"license": "Apache-2.0"
|
||||
},
|
||||
"node_modules/fast-base64-decode": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/fast-base64-decode/-/fast-base64-decode-1.0.0.tgz",
|
||||
"integrity": "sha512-qwaScUgUGBYeDNRnbc/KyllVU88Jk1pRHPStuF/lO7B0/RTRLj7U0lkdTAutlBblY08rwZDff6tNU9cjv6j//Q==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/fast-deep-equal": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
||||
@ -15086,6 +15166,12 @@
|
||||
"integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/lodash.isequal": {
|
||||
"version": "4.5.0",
|
||||
"resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
|
||||
"integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/lodash.throttle": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
|
||||
@ -17276,6 +17362,12 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-communications": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/react-native-communications/-/react-native-communications-2.2.1.tgz",
|
||||
"integrity": "sha512-5+C0X9mopI0+qxyQHzOPEi5v5rxNBQjxydPPiKMQSlX1RBIcJ8uTcqUPssQ9Mo8p6c1IKIWJUSqCj4jAmD0qVQ==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/react-native-gesture-handler": {
|
||||
"version": "2.16.2",
|
||||
"resolved": "https://registry.npmjs.org/react-native-gesture-handler/-/react-native-gesture-handler-2.16.2.tgz",
|
||||
@ -17293,6 +17385,59 @@
|
||||
"react-native": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-get-random-values": {
|
||||
"version": "1.11.0",
|
||||
"resolved": "https://registry.npmjs.org/react-native-get-random-values/-/react-native-get-random-values-1.11.0.tgz",
|
||||
"integrity": "sha512-4BTbDbRmS7iPdhYLRcz3PGFIpFJBwNZg9g42iwa2P6FOv9vZj/xJc678RZXnLNZzd0qd7Q3CCF6Yd+CU2eoXKQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"fast-base64-decode": "^1.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react-native": ">=0.56"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-gifted-chat": {
|
||||
"version": "2.6.4",
|
||||
"resolved": "https://registry.npmjs.org/react-native-gifted-chat/-/react-native-gifted-chat-2.6.4.tgz",
|
||||
"integrity": "sha512-Ut31I1w6g4hG/iMyC1mVNVPZCNAUfijbJaEbRmKQnTPG+nAvYFje57OHr5coe9w+IBWsJKKoNvaI4h8w9Il5aQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@expo/react-native-action-sheet": "^4.1.0",
|
||||
"@types/lodash.isequal": "^4.5.8",
|
||||
"dayjs": "^1.11.13",
|
||||
"lodash.isequal": "^4.5.0",
|
||||
"prop-types": "^15.8.1",
|
||||
"react-native-communications": "^2.2.1",
|
||||
"react-native-iphone-x-helper": "^1.3.1",
|
||||
"react-native-lightbox-v2": "^0.9.0",
|
||||
"react-native-parsed-text": "^0.0.22",
|
||||
"uuid": "^10.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "*",
|
||||
"react-native": "*",
|
||||
"react-native-get-random-values": "*",
|
||||
"react-native-reanimated": "*",
|
||||
"react-native-safe-area-context": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-gifted-chat/node_modules/uuid": {
|
||||
"version": "10.0.0",
|
||||
"resolved": "https://registry.npmjs.org/uuid/-/uuid-10.0.0.tgz",
|
||||
"integrity": "sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ==",
|
||||
"funding": [
|
||||
"https://github.com/sponsors/broofa",
|
||||
"https://github.com/sponsors/ctavan"
|
||||
],
|
||||
"license": "MIT",
|
||||
"bin": {
|
||||
"uuid": "dist/bin/uuid"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-helmet-async": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/react-native-helmet-async/-/react-native-helmet-async-2.0.4.tgz",
|
||||
@ -17307,6 +17452,60 @@
|
||||
"react": "^16.6.0 || ^17.0.0 || ^18.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-iphone-x-helper": {
|
||||
"version": "1.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-native-iphone-x-helper/-/react-native-iphone-x-helper-1.3.1.tgz",
|
||||
"integrity": "sha512-HOf0jzRnq2/aFUcdCJ9w9JGzN3gdEg0zFE4FyYlp4jtidqU03D5X7ZegGKfT1EWteR0gPBGp9ye5T5FvSWi9Yg==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"react-native": ">=0.42.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-lightbox-v2": {
|
||||
"version": "0.9.2",
|
||||
"resolved": "https://registry.npmjs.org/react-native-lightbox-v2/-/react-native-lightbox-v2-0.9.2.tgz",
|
||||
"integrity": "sha512-+8LwINeSWvPP69YAyWhiJQyaw4Gtu8X4EMvT3PEN615NrOeDaz8jOcIw73pzYJst3z4Z0vxvFB73iH16wCPXtw==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"react": ">=16.8.0",
|
||||
"react-native": ">=0.61.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-maps": {
|
||||
"version": "1.14.0",
|
||||
"resolved": "https://registry.npmjs.org/react-native-maps/-/react-native-maps-1.14.0.tgz",
|
||||
"integrity": "sha512-ai7h4UdRLGPFCguz1fI8n4sKLEh35nZXHAH4nSWyAeHGrN8K9GjICu9Xd4Q5Ok4h+WwrM6Xz5pGbF3Qm1tO6iQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/geojson": "^7946.0.13"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">= 17.0.1",
|
||||
"react-native": ">= 0.64.3",
|
||||
"react-native-web": ">= 0.11"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"react-native-web": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-parsed-text": {
|
||||
"version": "0.0.22",
|
||||
"resolved": "https://registry.npmjs.org/react-native-parsed-text/-/react-native-parsed-text-0.0.22.tgz",
|
||||
"integrity": "sha512-hfD83RDXZf9Fvth3DowR7j65fMnlqM9PpxZBGWkzVcUTFtqe6/yPcIoIAgrJbKn6YmtzkivmhWE2MCE4JKBXrQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"prop-types": "^15.7.x"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "*",
|
||||
"react-native": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-reanimated": {
|
||||
"version": "3.10.1",
|
||||
"resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-3.10.1.tgz",
|
||||
|
||||
@ -19,13 +19,16 @@
|
||||
"@react-navigation/native": "^6.0.2",
|
||||
"expo": "~51.0.28",
|
||||
"expo-apple-authentication": "~6.4.2",
|
||||
"expo-clipboard": "~6.0.3",
|
||||
"expo-constants": "~16.0.2",
|
||||
"expo-device": "~6.0.2",
|
||||
"expo-font": "~12.0.9",
|
||||
"expo-image": "~1.13.0",
|
||||
"expo-image-picker": "~15.0.7",
|
||||
"expo-linking": "~6.3.1",
|
||||
"expo-location": "~17.0.1",
|
||||
"expo-notifications": "~0.28.18",
|
||||
"expo-permissions": "^14.4.0",
|
||||
"expo-router": "~3.5.23",
|
||||
"expo-secure-store": "~13.0.2",
|
||||
"expo-splash-screen": "~0.27.5",
|
||||
@ -36,10 +39,13 @@
|
||||
"react-dom": "18.2.0",
|
||||
"react-native": "0.74.5",
|
||||
"react-native-gesture-handler": "~2.16.1",
|
||||
"react-native-get-random-values": "~1.11.0",
|
||||
"react-native-gifted-chat": "^2.6.4",
|
||||
"react-native-reanimated": "~3.10.1",
|
||||
"react-native-safe-area-context": "4.10.5",
|
||||
"react-native-screens": "3.31.1",
|
||||
"react-native-web": "~0.19.10"
|
||||
"react-native-web": "~0.19.10",
|
||||
"react-native-maps": "1.14.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.20.0",
|
||||
|
||||
Loading…
Reference in New Issue
Block a user