From 5b017afe1db8c547ce058f58de8698ef2682fef4 Mon Sep 17 00:00:00 2001 From: rbehrendt Date: Wed, 8 Jun 2022 23:53:53 +0200 Subject: [PATCH 1/5] add filtering events in view --- components/eventListComponent.tsx | 25 ++++++++ components/eventListWithFilterComponent.tsx | 38 ++++++++++++ screens/eventViewScreen.tsx | 66 ++++----------------- screens/likedViewEventsScreen.tsx | 19 ++++++ services/dbService.tsx | 12 ++-- 5 files changed, 101 insertions(+), 59 deletions(-) create mode 100644 components/eventListComponent.tsx create mode 100644 components/eventListWithFilterComponent.tsx create mode 100644 screens/likedViewEventsScreen.tsx diff --git a/components/eventListComponent.tsx b/components/eventListComponent.tsx new file mode 100644 index 0000000..64279d9 --- /dev/null +++ b/components/eventListComponent.tsx @@ -0,0 +1,25 @@ +import { StyleSheet, SafeAreaView, StatusBar, Text, View } from 'react-native'; +import Event from '../models/event'; +import EventComponent from '../components/eventComponent'; +import { ScrollView } from 'react-native-gesture-handler'; + +export default function EventListComponent(events: Array) { + + const items = events.map((val) => { + return + }); + + return ( + + + {items} + + + ); +} + const styles = StyleSheet.create({ + container: { + flex: 1, + marginTop: StatusBar.currentHeight || 0, + }, + }); diff --git a/components/eventListWithFilterComponent.tsx b/components/eventListWithFilterComponent.tsx new file mode 100644 index 0000000..5fe8551 --- /dev/null +++ b/components/eventListWithFilterComponent.tsx @@ -0,0 +1,38 @@ +import { useEffect, useState } from 'react'; +import { View } from 'react-native'; +import { getEvents } from '../services/dbService'; +import Event from '../models/event'; +import { Spinner } from '@ui-kitten/components'; +import EventListComponent from '../components/eventListComponent'; +import { QueryConstraint } from 'firebase/firestore'; + +export default function EventListWithFilterComponent(filter: QueryConstraint) { + const [events, setEvents] = useState([]); + const [hasLoaded, setHasLoaded] = useState(false); + + useEffect(() => { + getEvents(filter).then(eventDocs => { + eventDocs.forEach(doc => { + events.push(doc) + }) + setEvents(events); + }).then(() => { + setHasLoaded(true) + }) + }, [events]) + + if(hasLoaded) + return ( + + ); + + return ( + + + + ); +} diff --git a/screens/eventViewScreen.tsx b/screens/eventViewScreen.tsx index 67cda5a..2d0cd51 100644 --- a/screens/eventViewScreen.tsx +++ b/screens/eventViewScreen.tsx @@ -1,61 +1,19 @@ -import React, { useEffect, useState } from 'react'; -import { StyleSheet, SafeAreaView, StatusBar, Text, View } from 'react-native'; -import { getEvents } from '../services/dbService'; -import Event from '../models/event'; -import EventComponent from '../components/eventComponent'; -import { ScrollView } from 'react-native-gesture-handler'; -import { Spinner } from '@ui-kitten/components'; +import { where } from "firebase/firestore"; +import { useEffect, useState } from "react"; +import EventListWithFilterComponent from "../components/eventListWithFilterComponent"; +import { getLoggedInUserUID } from "../services/authService"; -export default function EventViewScreen() { - const [events, setEvents] = useState([]); - const [hasLoaded, setHasLoaded] = useState(false); +export default function LikedViewEventsScreen() { + const [user, setUser] = useState(""); useEffect(() => { - getEvents().then(eventDocs => { - eventDocs.forEach(doc => { - events.push(doc) - }) - setEvents(events); - }).then(() => { - setHasLoaded(true) + getLoggedInUserUID().then(uid => { + if(uid) + setUser(uid) }) - }, [events]) + }, []) - const items = events.map((val) => { - return - }); + const query = where("createdBy", "==", user); - if(hasLoaded) - return ( - - - {items} - - - ); - - return ( - - - - ); + } - const styles = StyleSheet.create({ - container: { - flex: 1, - marginTop: StatusBar.currentHeight || 0, - }, - item: { - backgroundColor: '#f9c2ff', - padding: 20, - marginVertical: 8, - marginHorizontal: 16, - }, - title: { - fontSize: 32, - }, - }); diff --git a/screens/likedViewEventsScreen.tsx b/screens/likedViewEventsScreen.tsx new file mode 100644 index 0000000..54718b7 --- /dev/null +++ b/screens/likedViewEventsScreen.tsx @@ -0,0 +1,19 @@ +import { where } from "firebase/firestore"; +import { useEffect, useState } from "react"; +import EventListWithFilterComponent from "../components/eventListWithFilterComponent"; +import { getLoggedInUserUID } from "../services/authService"; + +export default function LikedViewEventsScreen() { + const [user, setUser] = useState(""); + + useEffect(() => { + getLoggedInUserUID().then(uid => { + if(uid) + setUser(uid) + }) + }, []) + + const query = where("votes", "array-contains", user); + + +} diff --git a/services/dbService.tsx b/services/dbService.tsx index 3cb5dd4..7c23c3b 100644 --- a/services/dbService.tsx +++ b/services/dbService.tsx @@ -1,16 +1,17 @@ import { db } from '../firebase/firebase.config'; -import { collection, addDoc, QuerySnapshot, DocumentData, where, query, getDocs, getDoc, doc } from "firebase/firestore"; -import { GeoPoint } from 'firebase/firestore'; +import { collection, addDoc, DocumentData, where, query, getDocs, getDoc, doc, QueryConstraint } from "firebase/firestore"; import Event from '../models/event'; import User from '../models/user'; +import { getLoggedInUserUID } from './authService'; export async function addEvent(event: Event) { try { - console.log(event); + const loggedInUser = await getLoggedInUserUID() const docRef = await addDoc(collection(db, "events"), { id: event.id, name: event.name, type: event.type, + createdBy: loggedInUser, description: event.description, startDate: event.startDate, endDate: event.endDate, @@ -23,11 +24,12 @@ export async function addEvent(event: Event) { } catch (e) { console.error("Error adding document: ", e); } + } -export async function getEvents(): Promise { - const events = await getDocs(collection(db, "events")); +export async function getEvents(queryConstraint: QueryConstraint = where("1", "==", "1")): Promise { + const events = await getDocs(query(collection(db, "events"), queryConstraint)); let arr: Event[] = []; if (events.size > 0) { events.forEach(doc => { From d7df9f46cf877bea522058b9b1ee97f32543207d Mon Sep 17 00:00:00 2001 From: rbehrendt Date: Wed, 8 Jun 2022 23:53:53 +0200 Subject: [PATCH 2/5] add filtering events in view --- components/eventListComponent.tsx | 25 ++++++++ components/eventListWithFilterComponent.tsx | 38 ++++++++++++ screens/eventViewScreen.tsx | 66 ++++----------------- screens/likedViewEventsScreen.tsx | 19 ++++++ services/dbService.tsx | 4 +- 5 files changed, 97 insertions(+), 55 deletions(-) create mode 100644 components/eventListComponent.tsx create mode 100644 components/eventListWithFilterComponent.tsx create mode 100644 screens/likedViewEventsScreen.tsx diff --git a/components/eventListComponent.tsx b/components/eventListComponent.tsx new file mode 100644 index 0000000..64279d9 --- /dev/null +++ b/components/eventListComponent.tsx @@ -0,0 +1,25 @@ +import { StyleSheet, SafeAreaView, StatusBar, Text, View } from 'react-native'; +import Event from '../models/event'; +import EventComponent from '../components/eventComponent'; +import { ScrollView } from 'react-native-gesture-handler'; + +export default function EventListComponent(events: Array) { + + const items = events.map((val) => { + return + }); + + return ( + + + {items} + + + ); +} + const styles = StyleSheet.create({ + container: { + flex: 1, + marginTop: StatusBar.currentHeight || 0, + }, + }); diff --git a/components/eventListWithFilterComponent.tsx b/components/eventListWithFilterComponent.tsx new file mode 100644 index 0000000..5fe8551 --- /dev/null +++ b/components/eventListWithFilterComponent.tsx @@ -0,0 +1,38 @@ +import { useEffect, useState } from 'react'; +import { View } from 'react-native'; +import { getEvents } from '../services/dbService'; +import Event from '../models/event'; +import { Spinner } from '@ui-kitten/components'; +import EventListComponent from '../components/eventListComponent'; +import { QueryConstraint } from 'firebase/firestore'; + +export default function EventListWithFilterComponent(filter: QueryConstraint) { + const [events, setEvents] = useState([]); + const [hasLoaded, setHasLoaded] = useState(false); + + useEffect(() => { + getEvents(filter).then(eventDocs => { + eventDocs.forEach(doc => { + events.push(doc) + }) + setEvents(events); + }).then(() => { + setHasLoaded(true) + }) + }, [events]) + + if(hasLoaded) + return ( + + ); + + return ( + + + + ); +} diff --git a/screens/eventViewScreen.tsx b/screens/eventViewScreen.tsx index 67cda5a..2d0cd51 100644 --- a/screens/eventViewScreen.tsx +++ b/screens/eventViewScreen.tsx @@ -1,61 +1,19 @@ -import React, { useEffect, useState } from 'react'; -import { StyleSheet, SafeAreaView, StatusBar, Text, View } from 'react-native'; -import { getEvents } from '../services/dbService'; -import Event from '../models/event'; -import EventComponent from '../components/eventComponent'; -import { ScrollView } from 'react-native-gesture-handler'; -import { Spinner } from '@ui-kitten/components'; +import { where } from "firebase/firestore"; +import { useEffect, useState } from "react"; +import EventListWithFilterComponent from "../components/eventListWithFilterComponent"; +import { getLoggedInUserUID } from "../services/authService"; -export default function EventViewScreen() { - const [events, setEvents] = useState([]); - const [hasLoaded, setHasLoaded] = useState(false); +export default function LikedViewEventsScreen() { + const [user, setUser] = useState(""); useEffect(() => { - getEvents().then(eventDocs => { - eventDocs.forEach(doc => { - events.push(doc) - }) - setEvents(events); - }).then(() => { - setHasLoaded(true) + getLoggedInUserUID().then(uid => { + if(uid) + setUser(uid) }) - }, [events]) + }, []) - const items = events.map((val) => { - return - }); + const query = where("createdBy", "==", user); - if(hasLoaded) - return ( - - - {items} - - - ); - - return ( - - - - ); + } - const styles = StyleSheet.create({ - container: { - flex: 1, - marginTop: StatusBar.currentHeight || 0, - }, - item: { - backgroundColor: '#f9c2ff', - padding: 20, - marginVertical: 8, - marginHorizontal: 16, - }, - title: { - fontSize: 32, - }, - }); diff --git a/screens/likedViewEventsScreen.tsx b/screens/likedViewEventsScreen.tsx new file mode 100644 index 0000000..54718b7 --- /dev/null +++ b/screens/likedViewEventsScreen.tsx @@ -0,0 +1,19 @@ +import { where } from "firebase/firestore"; +import { useEffect, useState } from "react"; +import EventListWithFilterComponent from "../components/eventListWithFilterComponent"; +import { getLoggedInUserUID } from "../services/authService"; + +export default function LikedViewEventsScreen() { + const [user, setUser] = useState(""); + + useEffect(() => { + getLoggedInUserUID().then(uid => { + if(uid) + setUser(uid) + }) + }, []) + + const query = where("votes", "array-contains", user); + + +} diff --git a/services/dbService.tsx b/services/dbService.tsx index bbbd587..a3eba9e 100644 --- a/services/dbService.tsx +++ b/services/dbService.tsx @@ -12,11 +12,12 @@ import {boundingBoxCoordinates} from "../utils/coordinateUtils" export async function addEvent(event: Event) { try { - console.log(event); + const loggedInUser = await getLoggedInUserUID() const docRef = await addDoc(collection(db, "events"), { id: event.id, name: event.name, type: event.type, + createdBy: loggedInUser, description: event.description, startDate: event.startDate, endDate: event.endDate, @@ -29,6 +30,7 @@ export async function addEvent(event: Event) { } catch (e) { console.error("Error adding document: ", e); } + } From e68d470315e357c8c2712d5a9012e828428f3d05 Mon Sep 17 00:00:00 2001 From: rafal Date: Sun, 12 Jun 2022 01:31:46 +0200 Subject: [PATCH 3/5] almost there --- screens/eventViewScreen.tsx | 14 +++++++------- screens/mapScreen.tsx | 38 ++++++++++++++++++------------------- services/dbService.tsx | 18 +++++++++++++----- 3 files changed, 39 insertions(+), 31 deletions(-) diff --git a/screens/eventViewScreen.tsx b/screens/eventViewScreen.tsx index 0c383ef..e187fc4 100644 --- a/screens/eventViewScreen.tsx +++ b/screens/eventViewScreen.tsx @@ -20,7 +20,7 @@ export default function EventListWithFilterComponent(props) { filter.likes = passedFilter.likes filter.onlyLikedByMe = passedFilter.onlyLikedByMe filter.onlyMyEvents = passedFilter.onlyMyEvents - + setFilter(filter) getEvents(filter).then(eventDocs => { eventDocs?.forEach(doc => { events.push(doc) @@ -28,24 +28,24 @@ export default function EventListWithFilterComponent(props) { }).then(() => { setHasLoaded(true) }) - }, [events]) + }, []) async function handleFilter(newFilter: Filter) { newFilter.onlyLikedByMe = filter.onlyLikedByMe newFilter.onlyMyEvents = filter.onlyMyEvents setFilter(newFilter) const eventDocs = await getEvents(newFilter); - setEvents([]) + const newEvents: Event[] = [] eventDocs?.forEach(doc => { - events.push(doc) + newEvents.push(doc) }) - setEvents(events) - + setEvents(newEvents) + console.log(events) } if(hasLoaded) return ( - + diff --git a/screens/mapScreen.tsx b/screens/mapScreen.tsx index bb73184..8382220 100644 --- a/screens/mapScreen.tsx +++ b/screens/mapScreen.tsx @@ -1,7 +1,7 @@ import React, {useCallback, useEffect, useRef, useState} from 'react'; import {DefaultScreenProps} from '../common/DefaultScreenProps'; import MapView, {LatLng, MapEvent, Marker} from 'react-native-maps'; -import {StyleSheet, View} from 'react-native'; +import {LogBox, StyleSheet, View} from 'react-native'; import {getEvent, getEvents} from "../services/dbService"; import BottomSheet from "reanimated-bottom-sheet"; import {Layout} from "@ui-kitten/components"; @@ -32,30 +32,30 @@ export default function MapScreen({navigation}: DefaultScreenProps) { eventDocs.forEach(doc => { events.push(doc) }) - getLoggedInUserUID().then(uid => { - if(!uid) - navigation.navigate("LoginScreen") - }) + // getLoggedInUserUID().then(uid => { + // if(!uid) + // navigation.navigate("LoginScreen") + // }) setEvents(events) setEventMarkers(prepareEventMarker(eventDocs)) } - - fetchEvents(); + fetchEvents() }, [events]) function prepareEventMarker(eventDocs: Event[]) { - return eventDocs.map(eventDoc => { - return { - id: eventDoc.id, - title: eventDoc.name, - // description: eventDoc.description, - coordinate: { - latitude: !!eventDoc.latitude ? eventDoc.latitude : eventDoc.location.latitude, - longitude: !!eventDoc.longitude ? eventDoc.longitude : eventDoc.location.longitude, + const docs = eventDocs.filter(doc => doc.location).map(eventDoc => { + return { + id: eventDoc.id, + title: eventDoc.name, + // description: eventDoc.description, + coordinate: { + latitude: eventDoc?.location?.latitude, + longitude: eventDoc?.location?.longitude + } } - } - }) + }) + return docs } async function clickOnMarker(e: MapEvent) { @@ -70,14 +70,14 @@ export default function MapScreen({navigation}: DefaultScreenProps) { ); async function handleFilter(newFilter) { + LogBox.ignoreAllLogs(); setFilter(newFilter) const eventDocs = await getEvents(newFilter); eventDocs.forEach(doc => { events.push(doc) }) - setEvents(events) - setEventMarkers(prepareEventMarker(eventDocs)) + setEventMarkers(prepareEventMarker(events)) } const bs = React.createRef(); diff --git a/services/dbService.tsx b/services/dbService.tsx index 2257119..79966fe 100644 --- a/services/dbService.tsx +++ b/services/dbService.tsx @@ -28,6 +28,12 @@ export async function getEvents(filter: Filter): Promise { let queryConstraints: Array = [] const usr = await getLoggedInUserUID() + if(filter.onlyLikedByMe) + queryConstraints.push(where("votes", "array-contains", usr)) + + if(filter.onlyMyEvents) + queryConstraints.push(where("creatorId", "==", usr)) + if(!!filter.distance && parseInt(filter.distance) > 0) { let { status } = await Location.requestForegroundPermissionsAsync(); if (status !== 'granted') { @@ -35,20 +41,22 @@ export async function getEvents(filter: Filter): Promise { return; } const distance = parseInt(filter.distance) + let location_corrds = await Location.getCurrentPositionAsync({}); - const box = boundingBoxCoordinates(location_corrds.coords, distance); + const box = boundingBoxCoordinates(location_corrds.coords, distance); const lesserGeopoint = new GeoPoint(box.swCorner.latitude, box.swCorner.longitude); const greaterGeopoint = new GeoPoint(box.neCorner.latitude, box.neCorner.longitude); queryConstraints.concat([where("location", ">", lesserGeopoint), where("location", "<", greaterGeopoint)]) - events = await getDocs(query(collection(db, "events"), where("location", ">", lesserGeopoint), where("location", "<", greaterGeopoint))) } + + console.log(queryConstraints) - events = await getDocs(query(collection(db, "events"))) - // events = await getDocs(query(collection(db, "events"), where("location", ">", lesserGeopoint), where("location", "<", greaterGeopoint))) + events = await getDocs(query(collection(db, "events"), ...queryConstraints)) let arr: Event[] = []; + // console.log(events) if (events.size > 0) { events.forEach(doc => { let isValid = true @@ -67,7 +75,7 @@ export async function getEvents(filter: Filter): Promise { endDate: doc.data().endDate, postTime: doc.data().postTime, stars: doc.data().stars, - votes: doc.data().votes + votes: doc.data().votes || [] } if(!!filter && filter.likes > 0 && event.votes.length < filter.likes) isValid = false From c5a4c88ad7650424a51449539a4e01f08bc142fe Mon Sep 17 00:00:00 2001 From: rafal Date: Sun, 12 Jun 2022 01:31:46 +0200 Subject: [PATCH 4/5] almost there --- screens/eventViewScreen.tsx | 13 ++++++------- screens/mapScreen.tsx | 38 ++++++++++++++++++------------------- services/dbService.tsx | 23 ++++++++++++++++------ 3 files changed, 42 insertions(+), 32 deletions(-) diff --git a/screens/eventViewScreen.tsx b/screens/eventViewScreen.tsx index 0c383ef..835135b 100644 --- a/screens/eventViewScreen.tsx +++ b/screens/eventViewScreen.tsx @@ -20,7 +20,7 @@ export default function EventListWithFilterComponent(props) { filter.likes = passedFilter.likes filter.onlyLikedByMe = passedFilter.onlyLikedByMe filter.onlyMyEvents = passedFilter.onlyMyEvents - + setFilter(filter) getEvents(filter).then(eventDocs => { eventDocs?.forEach(doc => { events.push(doc) @@ -28,24 +28,23 @@ export default function EventListWithFilterComponent(props) { }).then(() => { setHasLoaded(true) }) - }, [events]) + }, []) async function handleFilter(newFilter: Filter) { newFilter.onlyLikedByMe = filter.onlyLikedByMe newFilter.onlyMyEvents = filter.onlyMyEvents setFilter(newFilter) const eventDocs = await getEvents(newFilter); - setEvents([]) + const newEvents: Event[] = [] eventDocs?.forEach(doc => { - events.push(doc) + newEvents.push(doc) }) - setEvents(events) - + setEvents(newEvents) } if(hasLoaded) return ( - + diff --git a/screens/mapScreen.tsx b/screens/mapScreen.tsx index bb73184..8382220 100644 --- a/screens/mapScreen.tsx +++ b/screens/mapScreen.tsx @@ -1,7 +1,7 @@ import React, {useCallback, useEffect, useRef, useState} from 'react'; import {DefaultScreenProps} from '../common/DefaultScreenProps'; import MapView, {LatLng, MapEvent, Marker} from 'react-native-maps'; -import {StyleSheet, View} from 'react-native'; +import {LogBox, StyleSheet, View} from 'react-native'; import {getEvent, getEvents} from "../services/dbService"; import BottomSheet from "reanimated-bottom-sheet"; import {Layout} from "@ui-kitten/components"; @@ -32,30 +32,30 @@ export default function MapScreen({navigation}: DefaultScreenProps) { eventDocs.forEach(doc => { events.push(doc) }) - getLoggedInUserUID().then(uid => { - if(!uid) - navigation.navigate("LoginScreen") - }) + // getLoggedInUserUID().then(uid => { + // if(!uid) + // navigation.navigate("LoginScreen") + // }) setEvents(events) setEventMarkers(prepareEventMarker(eventDocs)) } - - fetchEvents(); + fetchEvents() }, [events]) function prepareEventMarker(eventDocs: Event[]) { - return eventDocs.map(eventDoc => { - return { - id: eventDoc.id, - title: eventDoc.name, - // description: eventDoc.description, - coordinate: { - latitude: !!eventDoc.latitude ? eventDoc.latitude : eventDoc.location.latitude, - longitude: !!eventDoc.longitude ? eventDoc.longitude : eventDoc.location.longitude, + const docs = eventDocs.filter(doc => doc.location).map(eventDoc => { + return { + id: eventDoc.id, + title: eventDoc.name, + // description: eventDoc.description, + coordinate: { + latitude: eventDoc?.location?.latitude, + longitude: eventDoc?.location?.longitude + } } - } - }) + }) + return docs } async function clickOnMarker(e: MapEvent) { @@ -70,14 +70,14 @@ export default function MapScreen({navigation}: DefaultScreenProps) { ); async function handleFilter(newFilter) { + LogBox.ignoreAllLogs(); setFilter(newFilter) const eventDocs = await getEvents(newFilter); eventDocs.forEach(doc => { events.push(doc) }) - setEvents(events) - setEventMarkers(prepareEventMarker(eventDocs)) + setEventMarkers(prepareEventMarker(events)) } const bs = React.createRef(); diff --git a/services/dbService.tsx b/services/dbService.tsx index 2257119..368ed20 100644 --- a/services/dbService.tsx +++ b/services/dbService.tsx @@ -28,6 +28,12 @@ export async function getEvents(filter: Filter): Promise { let queryConstraints: Array = [] const usr = await getLoggedInUserUID() + if(filter.onlyLikedByMe) + queryConstraints.push(where("votes", "array-contains", usr)) + + if(filter.onlyMyEvents) + queryConstraints.push(where("creatorId", "==", usr)) + if(!!filter.distance && parseInt(filter.distance) > 0) { let { status } = await Location.requestForegroundPermissionsAsync(); if (status !== 'granted') { @@ -35,20 +41,25 @@ export async function getEvents(filter: Filter): Promise { return; } const distance = parseInt(filter.distance) + let location_corrds = await Location.getCurrentPositionAsync({}); - const box = boundingBoxCoordinates(location_corrds.coords, distance); + console.log("?????") + const box = boundingBoxCoordinates(location_corrds.coords, distance); const lesserGeopoint = new GeoPoint(box.swCorner.latitude, box.swCorner.longitude); const greaterGeopoint = new GeoPoint(box.neCorner.latitude, box.neCorner.longitude); - queryConstraints.concat([where("location", ">", lesserGeopoint), where("location", "<", greaterGeopoint)]) - events = await getDocs(query(collection(db, "events"), where("location", ">", lesserGeopoint), where("location", "<", greaterGeopoint))) + console.log("im pushin") + queryConstraints.push(where("location", ">", lesserGeopoint)) + queryConstraints.push(where("location", "<", greaterGeopoint)) } + + console.log(queryConstraints) - events = await getDocs(query(collection(db, "events"))) - // events = await getDocs(query(collection(db, "events"), where("location", ">", lesserGeopoint), where("location", "<", greaterGeopoint))) + events = await getDocs(query(collection(db, "events"), ...queryConstraints)) let arr: Event[] = []; + // console.log(events) if (events.size > 0) { events.forEach(doc => { let isValid = true @@ -67,7 +78,7 @@ export async function getEvents(filter: Filter): Promise { endDate: doc.data().endDate, postTime: doc.data().postTime, stars: doc.data().stars, - votes: doc.data().votes + votes: doc.data().votes || [] } if(!!filter && filter.likes > 0 && event.votes.length < filter.likes) isValid = false From 4e5559ec4792922931799119b850d37c63a12782 Mon Sep 17 00:00:00 2001 From: rafal Date: Sun, 12 Jun 2022 02:49:43 +0200 Subject: [PATCH 5/5] Hell yea --- assets/image.png | Bin 0 -> 792 bytes components/eventComponent.tsx | 20 ++++----- screens/eventCreationScreen.tsx | 75 ++++++++++++++++++++++++++------ screens/mapScreen.tsx | 11 ++--- services/dbService.tsx | 5 --- 5 files changed, 76 insertions(+), 35 deletions(-) create mode 100644 assets/image.png diff --git a/assets/image.png b/assets/image.png new file mode 100644 index 0000000000000000000000000000000000000000..096b6dbe35f59307377c66f07ff119d0915db158 GIT binary patch literal 792 zcmeAS@N?(olHy`uVBq!ia0y~yU}Ofe4{?CVsx#p+K*}k=C&cyt|NjdYE}S=S-mF=( zzJLFI{P^*6=gvKT{P@qGKkL`8zkB!Y(W6Jdefzd+*RB~eX1sax=E{{TOP4O)x^?T? zwQHY0f4+bJeqnE)gA5Ez6FprVLn`LHz5TkV$v~hj(MKdOknh#s`&q10lbdd&9J@L9 z`_JoQGoKmvzESfP0$Pt91mw@oS3b2lzW=%WIdSQ!nsv5|)~A*UPrv!M$|L@^lu<=W z!X}k&70=!qJc|^WjWQ-Q{^9wwW!?Mj8*X!+U$Eub!E272oyyprzD_(TB@)4HyL}J+va&NN9?!5*-eRJb`~w^6J+?0h3q~W`JrZlk@|bqOU6IGY`>>3 zRrY?jQyts7CZ{{a)p4 z%TKzstc(p`c`m{JcK@c8kB!bs?%1|?&Ew9XV7BcifAFo--I?{z$yV~oRN3!g!Ozz% znHlb%WprYdXKKmk9KZ9?{aHp8-=>`T`?vI&--4ZKyHqkxKDe8@{rGkBtoQ%^tmz4x z z+kYoszB~6|hUbL|j&_oTPwR{%S`B2jwDGLFthnA{lj)l^nkN#XWY#5byUY6|-9Vr3 zdg_JpYe&*Qyx-ilOndRs^anb8;V-SSfnoATaKnP#?Jsz0jy}|Se{R+rogTe~DWM4f+OB&` literal 0 HcmV?d00001 diff --git a/components/eventComponent.tsx b/components/eventComponent.tsx index 4b0cfff..092c22e 100644 --- a/components/eventComponent.tsx +++ b/components/eventComponent.tsx @@ -37,21 +37,17 @@ function EventComponent(event: Event) { } const likeEvent = async () => { - - addVote(userId, event.id).then(() => { - if(!votes || votes == null) - setVotes([]) - votes.push(userId) - setUserFollowedEvent(true) - }) + if(!votes || votes == null) + setVotes([]) + votes.push(userId) + setUserFollowedEvent(true) + addVote(userId, event.id) } const unlikeEvent = async () => { - removeVote(userId, event.id).then(() => { - setVotes(votes.filter(id => userId !== id)) - setUserFollowedEvent(false) - }) - + setVotes(votes.filter(id => userId !== id)) + setUserFollowedEvent(false) + removeVote(userId, event.id) } return ( diff --git a/screens/eventCreationScreen.tsx b/screens/eventCreationScreen.tsx index c6d088f..35a0dd8 100644 --- a/screens/eventCreationScreen.tsx +++ b/screens/eventCreationScreen.tsx @@ -52,6 +52,7 @@ export default function EventCreationScreen({navigation}: DefaultScreenProps) { const mapRef = useRef(null); const [location, setLocation] = useState(undefined); const [initialRegion, setinitialRegion] = useState(undefined); + const now = new Date() useEffect(() => { (async () => { @@ -81,6 +82,36 @@ export default function EventCreationScreen({navigation}: DefaultScreenProps) { })(); }, []); + function validateInput(input: string, alerts: boolean = false, inputName: string) : boolean { + if(input == ""){ + if(alerts) Alert.alert(inputName + " cannot be empty"); + return false; + } + if(input.length < 3){ + if(alerts)Alert.alert(inputName + " cannot be less than 3 characters"); + return false; + } + return true; +} + + +function CheckCurrentEventIsValid() : boolean { + if( + validateInput(name, true, "Name") && + startDate != null && + endDate != null && + validateInput(address, true, "Address") && + location != null && + location.latitude != null && + location.longitude != null) return true + else { + if (location == null || + location.latitude == null || + location.longitude == null) + Alert.alert("Event must have set location"); + return false; + } +} function Cancel() { setName(""); @@ -129,8 +160,8 @@ export default function EventCreationScreen({navigation}: DefaultScreenProps) { try{ //TODO: input validation - if (location?.latitude == null || location?.latitude == null) throw assertionError("location is null"); - const imageUrl = await uploadImageAsync(uploadedImageUrl); + if (CheckCurrentEventIsValid()){ + const imageUrl = uploadedImageUrl ? await uploadImageAsync(uploadedImageUrl) : ""; const event = { id: uuid.v4(), @@ -160,11 +191,13 @@ export default function EventCreationScreen({navigation}: DefaultScreenProps) { setLocation(undefined); navigation.navigate("MapScreen"); } + } //TODO: error handling catch(error: any) { return error.message } + } function onMapPress(e: MapEvent) { @@ -324,12 +357,21 @@ export default function EventCreationScreen({navigation}: DefaultScreenProps) { ); - + async function setMyLocation(){ + await Location.getCurrentPositionAsync({}).then((location_corrds) => {; + setLocation(location_corrds.coords)}).then(() => { + mapRef.current.animateToRegion({ + latitude: location?.latitude, + longitude: location?.longitude, + latitudeDelta: 0.003, + longitudeDelta: 0.003, + })}); + } return ( - + setName(txt)} + status={validateInput(name) ? "basic" : "danger"} + maxLength={25} /> {uploadedImageUrl ? null : ( - - Image placeholder - + + )} {_maybeRenderImage()} {_maybeRenderUploadingOverlay()} @@ -551,10 +596,14 @@ const styles = StyleSheet.create({ padding: 15, borderRadius: 10, marginTop: 20, + marginLeft: 20, width: 320, height: 180, }, label: { marginTop: 20, + }, + setLocationButton: { + margin: 5, } }); diff --git a/screens/mapScreen.tsx b/screens/mapScreen.tsx index 8382220..1535815 100644 --- a/screens/mapScreen.tsx +++ b/screens/mapScreen.tsx @@ -45,6 +45,7 @@ export default function MapScreen({navigation}: DefaultScreenProps) { function prepareEventMarker(eventDocs: Event[]) { const docs = eventDocs.filter(doc => doc.location).map(eventDoc => { + console.log(eventDoc) return { id: eventDoc.id, title: eventDoc.name, @@ -70,14 +71,14 @@ export default function MapScreen({navigation}: DefaultScreenProps) { ); async function handleFilter(newFilter) { - LogBox.ignoreAllLogs(); setFilter(newFilter) + const newEvents: Event[] = [] const eventDocs = await getEvents(newFilter); eventDocs.forEach(doc => { - events.push(doc) + newEvents.push(doc) }) - setEvents(events) - setEventMarkers(prepareEventMarker(events)) + setEvents(newEvents) + setEventMarkers(prepareEventMarker(eventDocs)) } const bs = React.createRef(); @@ -96,7 +97,7 @@ export default function MapScreen({navigation}: DefaultScreenProps) { > {eventMarkers.map((marker, index) => ( { const distance = parseInt(filter.distance) let location_corrds = await Location.getCurrentPositionAsync({}); - console.log("?????") const box = boundingBoxCoordinates(location_corrds.coords, distance); const lesserGeopoint = new GeoPoint(box.swCorner.latitude, box.swCorner.longitude); const greaterGeopoint = new GeoPoint(box.neCorner.latitude, box.neCorner.longitude); - console.log("im pushin") queryConstraints.push(where("location", ">", lesserGeopoint)) queryConstraints.push(where("location", "<", greaterGeopoint)) } - console.log(queryConstraints) - events = await getDocs(query(collection(db, "events"), ...queryConstraints)) let arr: Event[] = []; - // console.log(events) if (events.size > 0) { events.forEach(doc => { let isValid = true