Skip to content

T
TMP-23-068
Commit 534d704b authored by Balasooriya B.M.D.D's avatar Balasooriya B.M.D.D
Browse files
Options

Notifications Updated

parent fea8c04f
Hide whitespace changes
Inline Side-by-side
Showing with 99 additions and 346 deletions
App.js
View file @ 534d704b
......@@ -32,7 +32,7 @@ import MoodWelcome from "./screens/MoodWelcome";
import PreviousPlan from "./screens/PreviousPlan";
import SuggestionComponent from "./screens/SuggestionComponent";
import LineChartComponent from "./screens/Graph";
import NotificationInbox from "./screens/NotificationInbox";
const Stack = createStackNavigator()
......@@ -76,6 +76,7 @@ export default function App() {
<Stack.Screen name="MyMed" component={MyMed} />
<Stack.Screen name="SuggestionComponent" component={SuggestionComponent} />
<Stack.Screen name="Graph" component={LineChartComponent} />
<Stack.Screen name="NotificationInbox" component={NotificationInbox} />
</Stack.Navigator>
</NavigationContainer>
......
navigation/TabNavigator.js
View file @ 534d704b
......@@ -6,7 +6,7 @@ import Nutrition from "../screens/Nutrition";
import UsImage from "../screens/CaptureImage";
import Prescription from "../screens/CapturePrescription";
import Sidebar from "../screens/Sidebar";
import Notification from "../screens/Notification";
import NotificationInbox from "../screens/NotificationInbox";
const Tab = createBottomTabNavigator();
......@@ -19,7 +19,7 @@ const tabs = [
},
{
name: "Notification",
component: Notification,
component: NotificationInbox,
source: require("../assets/event-icon.png"),
label: "Notification",
},
......
package-lock.json
View file @ 534d704b
......@@ -15,7 +15,7 @@
"@react-navigation/stack": "^6.3.20",
"axios": "^1.6.0",
"expo": "~48.0.18",
"expo-camera": "^13.6.0",
"expo-camera": "~13.2.1",
"expo-dev-client": "~2.2.1",
"expo-device": "~5.2.1",
"expo-image-picker": "^14.1.1",
......@@ -5989,6 +5989,14 @@
"prop-types": "*"
}
},
"node_modules/dequal": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/dequal/-/dequal-1.0.1.tgz",
"integrity": "sha512-Fx8jxibzkJX2aJgyfSdLhr9tlRoTnHKrRJuu2XHlAgKioN2j19/Bcbe0d4mFXYZ3+wpE2KVobUVTfDutcD17xQ==",
"engines": {
"node": ">=6"
}
},
"node_modules/destroy": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/destroy/-/destroy-1.2.0.tgz",
......@@ -6296,16 +6304,42 @@
}
},
"node_modules/expo-camera": {
"version": "13.6.0",
"resolved": "https://registry.npmjs.org/expo-camera/-/expo-camera-13.6.0.tgz",
"integrity": "sha512-8lxK15D2tuEZom9bhDMMqNPW+5241Ak4wIup/ebh4JekgOtSQ/egbq7qDn2FCFi+5vPFKX4nRsvGOuzfuzvmZA==",
"version": "13.2.1",
"resolved": "https://registry.npmjs.org/expo-camera/-/expo-camera-13.2.1.tgz",
"integrity": "sha512-fZdRyF402jJGGmLVlumrLcr5Em9+Y2SO1MIlxLBtHXnybyHbTRMRAbzVapKX1Aryfujqadh+Kl+sdsWYkMuJjg==",
"dependencies": {
"@koale/useworker": "^4.0.2",
"invariant": "^2.2.4"
},
"peerDependencies": {
"expo": "*"
}
},
"node_modules/expo-camera/node_modules/@koale/useworker": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/@koale/useworker/-/useworker-4.0.2.tgz",
"integrity": "sha512-xPIPADtom8/3/4FLNj7MvNcBM/Z2FleH85Fdx2O869eoKW8+PoEgtSVvoxWjCWMA46Sm9A5/R1TyzNGc+yM0wg==",
"dependencies": {
"dequal": "^1.0.0"
},
"peerDependencies": {
"react": "^16.8.0"
}
},
"node_modules/expo-camera/node_modules/react": {
"version": "16.14.0",
"resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz",
"integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==",
"peer": true,
"dependencies": {
"loose-envify": "^1.1.0",
"object-assign": "^4.1.1",
"prop-types": "^15.6.2"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/expo-constants": {
"version": "14.2.1",
"resolved": "https://registry.npmjs.org/expo-constants/-/expo-constants-14.2.1.tgz",
......
screens/Notification.js deleted 100644 → 0
View file @ fea8c04f
import React, { useState, useEffect } from "react"
import {
View,
Text,
FlatList,
StyleSheet,
TextInput,
TouchableOpacity,
Keyboard,
Pressable,
Alert,
Image,
TouchableHighlight,
} from "react-native"
import { firebase } from "../config"
import { FontAwesome } from "@expo/vector-icons"
import { useNavigation } from "@react-navigation/native"
import { SafeAreaView } from "react-native-safe-area-context"
import * as ImagePicker from "expo-image-picker"
import Swipeout from 'react-native-swipeout';
const MAX_LENGTH = 25;
const Notification = () => {
const [notifications, setNotifications] = useState([])
const [addData, setAddData] = useState("")
const [addDescription, setDescription] = useState("")
const [image, setImage] = useState(null)
const [uploading, setUploading] = useState(false)
const notificationReference = firebase.firestore().collection("notifications")
const navigation = useNavigation()
//fetch the data from firestore
useEffect(() => {
notificationReference
.orderBy("createdAt", "desc")
.onSnapshot((querySnapshot) => {
const notifications = []
querySnapshot.forEach((doc) => {
const { heading, description } = doc.data()
notifications.push({
id: doc.id,
heading,
description,
})
})
setNotifications(notifications)
})
}, [])
//alert box
const deleteNotification = (notification) => {
Alert.alert("Delete Details", "Do you want to delete this details?", [
{
text: "Cancel",
onPress: () => console.log("Cancel Pressed"),
style: "cancel",
},
{
text: "OK",
onPress: () => {
Delete(notification)
},
},
])
}
//delete a notification details from firestore database
const Delete = (notification) => {
notificationReference
.doc(notification.id)
.delete()
.then(() => {
alert("Deleted notification details successfully")
})
.catch((error) => {
alert(error)
})
}
//add a notification details item
const addNotification = () => {
//check if we have a notification item
if (addData && addData.length > 0) {
//get the timestamp
const timestamp = firebase.firestore.FieldValue.serverTimestamp()
const data = {
heading: addData,
description: addDescription,
createdAt: timestamp,
}
notificationReference
.add(data)
.then(() => {
setAddData("")
setDescription("")
//release keyboard
Keyboard.dismiss()
})
.catch((error) => {
alert(error)
})
}
}
const pickImage = async () => {
let result = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.All,
allowsEditing: true,
aspect: [4, 3],
quantity: 1,
});
const source = {uri: result.uri}
console.log(source)
setImage(source)
};
const uploadImage = async () => {
setUploading(true);
try {
const response = await fetch(image.uri);
const blob = await response.blob();
const filename = image.uri.substring(image.uri.lastIndexOf("/") + 1);
var ref = firebase.storage().ref().child(filename);
await ref.put(blob);
Alert.alert("Photo uploaded...");
setImage(null);
} catch (error) {
console.error(error);
} finally {
setUploading(false);
}
};
return (
<View style={styles.subContainer}>
<View style={{ flex: 1 }}>
{/* <View style={styles.textAreaView}>
<Text style={{ fontWeight: "bold" }}>Notification</Text>
<TextInput
style={styles.textAreacontainer}
placeholder="Add your Weight"
maxLength={MAX_LENGTH}
placeholderTextColor="#aaaaaa"
onChangeText={(heading) => setAddData(heading)}
value={addData}
underlineColorAndroid="transparent"
autoCapitalize="none"
/>
</View>
<View style={styles.textAreaView}>
<Text style={{ fontWeight: "bold" }}>Details</Text>
<TextInput
multiline={true}
style={styles.textAreacontainer}
placeholder="Add your Height"
placeholderTextColor="#aaaaaa"
onChangeText={(description) => setDescription(description)}
value={addDescription}
underlineColorAndroid="transparent"
autoCapitalize="none"
/>
</View> */}
{/* <TouchableHighlight
style={styles.button}
underlayColor="#FF9DD2"
onPress={addNotification}
>
<Text style={styles.buttonText}>Get Notification</Text>
</TouchableHighlight> */}
<FlatList
data={notifications}
numColumns={1}
renderItem={({ item }) => (
<Swipeout
right={[
{
text: 'Delete',
backgroundColor: 'red',
onPress: () => deleteNotification(item), // Call your delete function here
},
]}
>
<Pressable
style={styles.container}
onPress={() => navigation.navigate("Prescription", { item })}
>
<FontAwesome
name="trash-o"
color="red"
onPress={() => deleteNotification(item)}
style={styles.recipieIcon}
/>
<View style={styles.innerContainer}>
<Text style={styles.itemHeading}>
{item.heading[0].toUpperCase() + item.heading.slice(1)}
</Text>
<Text style={styles.itemBody}>
{item.description[0].toUpperCase() + item.description.slice(1)}
</Text>
</View>
</Pressable>
</Swipeout>
)}
/>
</View>
</View>
)
}
export default Notification
const styles = StyleSheet.create({
notificationContainer: {
flex: 1,
alignItems: "center",
justifyContent: "center",
},
subContainer:{
backgroundColor: "white",
flex: 1,
justifyContent: "center",
},
container: {
padding: 15,
borderRadius: 15,
margin: 5,
marginHorizontal: 10,
flexDirection: "row",
alignItems: "center",
},
textAreacontainer: {
backgroundColor: "white",
padding: 10,
borderRadius: 5,
margin: 5,
marginHorizontal: 10,
flexDirection: "row",
alignItems: "center",
height: 48,
overflow: "hidden",
paddingLeft: 16,
flex: 1,
marginRight: 5,
},
textAreaView: {
backgroundColor: "#e5e5e5",
borderRadius: 15,
margin: 5,
marginHorizontal: 10,
flexDirection: "row",
alignItems: "center",
},
innerContainer: {
alignItems: "center",
flexDirection: "column",
marginLeft: 100,
},
itemHeading: {
fontWeight: "bold",
fontSize: 18,
marginRight: 30,
},
itemBody: {
fontWeight: "italic",
fontSize: 14,
marginRight: 30,
},
formContainer: {
flexDirection: "row",
height: 80,
marginTop: 100,
},
input: {
height: 48,
borderRadius: 5,
overflow: "hidden",
backgroundColor: "white",
paddingLeft: 16,
flex: 1,
marginRight: 5,
},
button: {
height: 47,
borderRadius: 5,
borderWidth: 2,
borderColor: "#FF9DD2",
width: 180,
alignItems: "center",
justifyContent: "center",
marginLeft: 210
},
recipieIcon: {
marginTop: 5,
fontSize: 20,
marginLeft: 14,
},
selectButton: {
borderRadius: 5,
width: 200,
height: 40,
backgroundColor: "pink",
alignItems: "center",
justifyContent: "center",
},
uploadButton: {
borderRadius: 5,
width: 200,
height: 40,
backgroundColor: "#FF9DD2",
alignItems: "center",
justifyContent: "center",
marginTop: 10
},
buttonText: {
color: "black",
fontSize: 14,
fontWeight: "bold",
},
imageContainer: {
marginTop: 2,
marginBottom: 100,
alignItems: "center",
},
})
screens/NotificationInbox.js 0 → 100644
View file @ 534d704b
import React, { useState, useEffect } from "react";
import { View, Text, StyleSheet } from "react-native";
import { getNotificationInbox } from 'native-notify';
const NotificationInbox = () => {
const [data, setData] = useState([]);
useEffect(() => {
const fetchData = async () => {
try {
const notifications = await getNotificationInbox(14166, '8pIb6JqSUszbTdAIturtcO');
setData(notifications);
} catch (error) {
console.error("Error fetching notifications: ", error);
}
};
fetchData();
}, []);
return (
<View style={styles.container}>
{data.map((item) => (
<View style={styles.notification} key={item.notification_id}>
<Text style={styles.title}>{item.title}</Text>
<Text style={styles.message}>{item.message}</Text>
</View>
))}
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
padding: 16,
backgroundColor: "#ffffff",
},
notification: {
borderWidth: 1,
borderColor: "#ccc",
borderRadius: 8,
padding: 16,
marginBottom: 16,
},
title: {
fontSize: 18,
fontWeight: "bold",
marginBottom: 8,
},
message: {
fontSize: 16,
color: "#333",
},
});
export default NotificationInbox;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment