add places without changing user type

src/components/Map/MainMapComponent/OutdoorMap.tsx

@@ -27,7 +27,7 @@ import { IconButton } from "../../Buttons";
 import NearbyLandmarksPanel from "../Panels/NearbyLandmarksPanel";
 import { VoicePanel } from "../Panels/VoicePanel";
 import mapStyles from "./Map.styles";
-import { useOutdoorMapState } from "./useMapState";
+import { useOutdoorMapState, useMapState } from "./useMapState";
 
 /**
  * An interface representing the user location retrieved from [expo-location]{@link https://docs.expo.dev/versions/latest/sdk/location/}.
@@ -70,7 +70,8 @@ interface OutdoorMapProps {
 const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
     const {locationPermissionsGranted, checkLocationPermissions, voicePermissionsGranted, checkVoicePermissions} = usePermissions();
     const {setAlert} = useAuth()
-    const mapState = useOutdoorMapState()
+    const mapStateOutdoor = useOutdoorMapState()
+    const mapState = useMapState()
 
     const mapNavIndex = useNavigationState(state => state)
 
@@ -89,17 +90,17 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
             props.setSelectedLandmarkId(props.route?.params?.selectedLandmark)
         }
         if (props.route?.params?.selectedLandmarks) {
-            mapState.toggleNearbyLmPanel(true)
+            mapStateOutdoor.toggleNearbyLmPanel(true)
         }
     }, [props.route])
 
     useEffect(() => {
         const toMap = mapNavIndex.index == 0 && props.authNavIndex == 0
 
-        if (toMap) mapState.setLoading(true)
+        if (toMap) mapStateOutdoor.setLoading(true)
 
         setTimeout(() => {
-            mapState.setLoading(false)
+            mapStateOutdoor.setLoading(false)
         }, 500);
 
     }, [mapNavIndex, props.authNavIndex])
@@ -111,7 +112,7 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
         console.log("[LandmarkDetails]: Landmark selected - " + props.selectedLandmarkId)
         if (props.selectedLandmarkId) {
             const landmark = props.landmarks.find(lm => lm.id == props.selectedLandmarkId)
-            mapState.mapRef.current.animateToRegion({ latitude: landmark.latitude, longitude: landmark.longitude, latitudeDelta: 0.01, longitudeDelta: 0.01 })
+            mapStateOutdoor.mapRef.current.animateToRegion({ latitude: landmark.latitude, longitude: landmark.longitude, latitudeDelta: 0.01, longitudeDelta: 0.01 })
             props.toggleLmDetails(true)
         }
     }, [props.selectedLandmarkId])
@@ -121,7 +122,7 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
      */
     useEffect(() => {
         if (props.selectedLandmarkId) {
-            mapState.mapRef.current.animateToRegion({ latitude: props.newLandmark?.latitude, longitude: props.newLandmark?.longitude, latitudeDelta: 0.01, longitudeDelta: 0.01 })
+            mapStateOutdoor.mapRef.current.animateToRegion({ latitude: props.newLandmark?.latitude, longitude: props.newLandmark?.longitude, latitudeDelta: 0.01, longitudeDelta: 0.01 })
         }
     }, [props.newLandmark])
     /**
@@ -130,8 +131,8 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
     const flyToUser = () => {
 
         console.log('[Map]: Centering on user')
-        if (mapState.userLocation) {
-            mapState.mapRef.current?.animateToRegion({ latitude: mapState.userLocation.latitude, longitude: mapState.userLocation.longitude, latitudeDelta: 0.01, longitudeDelta: 0.01 })
+        if (mapStateOutdoor.userLocation) {
+            mapStateOutdoor.mapRef.current?.animateToRegion({ latitude: mapStateOutdoor.userLocation.latitude, longitude: mapStateOutdoor.userLocation.longitude, latitudeDelta: 0.01, longitudeDelta: 0.01 })
         }
     }
 
@@ -156,7 +157,7 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
 
         if (spokestackInitialized) 
             if (spokestackStarted) {
-                mapState.toggleVoiceVisible(true)
+                mapStateOutdoor.toggleVoiceVisible(true)
                 Spokestack.activate()
             }
     }
@@ -165,8 +166,8 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
      * Gets initial region that map should zoom into from current user location
      */
     const getInitialRegion = () => {
-        if (mapState.userLocation) {
-            return { latitude: mapState.userLocation.latitude, longitude: mapState.userLocation.longitude, latitudeDelta: 0.01, longitudeDelta: 0.01 }
+        if (mapStateOutdoor.userLocation) {
+            return { latitude: mapStateOutdoor.userLocation.latitude, longitude: mapStateOutdoor.userLocation.longitude, latitudeDelta: 0.01, longitudeDelta: 0.01 }
         }
     }
 
@@ -175,7 +176,7 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
      */
     const updateLocation = async (coord: LatLng) => {
 
-        mapState.setUserLocation(coord)
+        mapStateOutdoor.setUserLocation(coord)
         // get 10m radius around user
         const userAlertRadius = circle([coord.longitude, coord.latitude], 10, { units: 'meters' })
 
@@ -187,10 +188,10 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
 
         // to prevent duplicate notifications make a list of landmarks that weren't previously near the user. 
         // these are the only ones that the user will be notified of
-        const newLandmarksNotPreviouslyNearUser = newLandmarksNearUser?.filter(lm => mapState.landmarksNearUser.some(origLm => lm == origLm.id))
+        const newLandmarksNotPreviouslyNearUser = newLandmarksNearUser?.filter(lm => mapStateOutdoor.landmarksNearUser.some(origLm => lm == origLm.id))
 
         // update list
-        mapState.setLandmarksNearUser(newLandmarksNearUser)
+        mapStateOutdoor.setLandmarksNearUser(newLandmarksNearUser)
 
         // if there are any new landmarks near user, create a notification for them and send it
         if (newLandmarksNotPreviouslyNearUser?.length > 0) {
@@ -209,11 +210,11 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
     }
 
     const focusNearbyLandmarks = () => {
-        if (mapState.landmarksNearUser?.length > 1) {
-            mapState.toggleNearbyLmPanel(true)
+        if (mapStateOutdoor.landmarksNearUser?.length > 1) {
+            mapStateOutdoor.toggleNearbyLmPanel(true)
         }
-        else if (mapState.landmarksNearUser?.length === 1) {
-            props.setSelectedLandmarkId(mapState.landmarksNearUser[0].id)
+        else if (mapStateOutdoor.landmarksNearUser?.length === 1) {
+            props.setSelectedLandmarkId(mapStateOutdoor.landmarksNearUser[0].id)
         }
     }
 
@@ -221,7 +222,7 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
         <TouchableWithoutFeedback>
             <>
                 {/*Main map component*/}
-                <Modal transparent={true} animationType="fade" visible={mapState.loading}>
+                <Modal transparent={true} animationType="fade" visible={mapStateOutdoor.loading}>
                     <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: 'rgba(0,0,0,0.3)' }}>
                         <View style={{ width: '60%', height: '30%', backgroundColor: colors.red, justifyContent: 'center', alignItems: 'center', borderRadius: 20 }}>
                             <ActivityIndicator size="large" color="white" style={{ marginBottom: 20 }} />
@@ -230,23 +231,23 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
                     </View>
                 </Modal>
                 <MapView
-                    key={mapState.refreshKey}
+                    key={mapStateOutdoor.refreshKey}
                     toolbarEnabled={false}
                     onPress={() => Keyboard.dismiss()}
                     testID="mapView"
-                    ref={mapState.mapRef}
+                    ref={mapStateOutdoor.mapRef}
                     style={{ width: '100%', height: '100%' }}
                     initialRegion={getInitialRegion()}
                     onLongPress={async (e) => await props.promptAddLandmark(e.nativeEvent.coordinate.longitude, e.nativeEvent.coordinate.latitude)}
                     showsUserLocation={locationPermissionsGranted}
                     onUserLocationChange={e => updateLocation(e.nativeEvent.coordinate)}
-                    followsUserLocation={mapState.followUser}
+                    followsUserLocation={mapStateOutdoor.followUser}
                     showsMyLocationButton={false}
                     
                     onRegionChangeComplete={async (Region) => {
                         if (props.selectedLandmarkId) {
 
-                            const {x, y} = await mapState.mapRef.current.pointForCoordinate({latitude: Region.latitude, longitude: Region.longitude})
+                            const {x, y} = await mapStateOutdoor.mapRef.current.pointForCoordinate({latitude: Region.latitude, longitude: Region.longitude})
                             props.setMarkerWindowPosition({x: x, y: y})
                         }
                         setSize(Region.latitudeDelta) 
@@ -262,7 +263,10 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
                         fillColor={`rgba(100,100,200,0.3)`}
                         strokeWidth={2.5}
                         tappable={true}
-                        onPress={() => props.mapNavigation.navigate("Indoor")}
+                        onPress={() => {
+                            mapState.setPlace("Cameron")
+                            props.mapNavigation.navigate("Indoor")}
+                        }
                     />
 
                     {props.applyFilters(props.landmarks)?.map((landmark) => {
@@ -344,30 +348,30 @@ const OutdoorMap: React.FC<OutdoorMapProps> = (props) => {
                     </Marker>
                 </MapView>
                 {/*Map buttons*/}
-                {mapState.landmarksNearUser?.length > 0 ?
+                {mapStateOutdoor.landmarksNearUser?.length > 0 ?
                     <TouchableOpacity style={[mapStyles.lowerMapButton, mapStyles.alertButton]} onPress={focusNearbyLandmarks}>
                         <FontAwesome name='exclamation-triangle' size={20} color='white' />
-                        <Badge positioning={{ bottom: 7, right: 4 }} value={mapState.landmarksNearUser.length} />
+                        <Badge positioning={{ bottom: 7, right: 4 }} value={mapStateOutdoor.landmarksNearUser.length} />
                     </TouchableOpacity> : null}
                 {locationPermissionsGranted && voicePermissionsGranted ?<IconButton size={20} color='white' style={[mapStyles.lowerMapButton, mapStyles.voiceButton]} icon="microphone" onPress={async () => await startSpeech()} /> : null}
-                <IconButton size={20} color='white' style={[mapStyles.lowerMapButton, mapStyles.addLandmarkButton]} icon="plus" onPress={async () => await props.promptAddLandmark(mapState.userLocation.longitude, mapState.userLocation.latitude)} />
+                <IconButton size={20} color='white' style={[mapStyles.lowerMapButton, mapStyles.addLandmarkButton]} icon="plus" onPress={async () => await props.promptAddLandmark(mapStateOutdoor.userLocation.longitude, mapStateOutdoor.userLocation.latitude)} />
                 <IconButton size={20} color='white' style={[mapStyles.lowerMapButton, mapStyles.userLocationButton]} icon="location-arrow" onPress={flyToUser} />
                 <NearbyLandmarksPanel
                     focusLandmark={props.focusLandmark}
-                    nearbyLmPanelVisible={mapState.nearbyLmPanelVisible}
-                    toggleAlertedLmPanel={mapState.toggleNearbyLmPanel}
-                    nearbyLandmarks={mapState.landmarksNearUser} />
+                    nearbyLmPanelVisible={mapStateOutdoor.nearbyLmPanelVisible}
+                    toggleAlertedLmPanel={mapStateOutdoor.toggleNearbyLmPanel}
+                    nearbyLandmarks={mapStateOutdoor.landmarksNearUser} />
                 {/*Map Panels*/}
                 {locationPermissionsGranted && voicePermissionsGranted ?
                     <VoicePanel
-                        landmarksNearby={mapState.landmarksNearUser?.length > 0}
-                        toggleAlertedLandmarksVisible={mapState.toggleNearbyLmPanel}
+                        landmarksNearby={mapStateOutdoor.landmarksNearUser?.length > 0}
+                        toggleAlertedLandmarksVisible={mapStateOutdoor.toggleNearbyLmPanel}
                         navigation={props.authNavigation}
-                        userCoords={{ longitude: mapState.userLocation?.longitude, latitude: mapState.userLocation?.latitude }}
-                        toggleVoiceVisible={mapState.toggleVoiceVisible}
+                        userCoords={{ longitude: mapStateOutdoor.userLocation?.longitude, latitude: mapStateOutdoor.userLocation?.latitude }}
+                        toggleVoiceVisible={mapStateOutdoor.toggleVoiceVisible}
                         toggleLmDetails={props.toggleLmDetails}
                         setSelectedLandmarkId={props.setSelectedLandmarkId}
-                        voiceVisible={mapState.voiceVisible}
+                        voiceVisible={mapStateOutdoor.voiceVisible}
                         newLandmark={props.newLandmark}
                         setNewLandmark={props.setNewLandmark}
                     /> : null}

src/components/Map/MainMapComponent/useMapState.ts

@@ -55,6 +55,8 @@ export const useMapState = () => {
     const [onlyOwned, toggleOnlyOwned] = useState<boolean>(false)
     const [markerWindowPosition, setMarkerWindowPosition] = useState<{ x: number, y: number }>()
 
+    const [place, setPlace] = useState<string>("Outdoor")
+
     return { 
         onlyOwned, toggleOnlyOwned,
         lmFilteredTypes, setLmTypeFilter,
@@ -65,6 +67,7 @@ export const useMapState = () => {
         selectedLandmarkId, setSelectedLandmarkId,
         newLandmark, setNewLandmark,
         lmAddVisible, toggleLmAdd,
+        place, setPlace
      }
 }
 

src/components/Map/Panels/LandmarkDetailsPanel/DetailsHeader.tsx

@@ -31,6 +31,7 @@ interface DetailsHeaderProps {
     ratedByUser: boolean
     authNavigation: MainTabsNavigationProp
     toggleLmDetails: (state: boolean) => void
+    place: string
 }
 
 /**
@@ -48,7 +49,7 @@ export const DetailsHeader: React.FC<DetailsHeaderProps> = (props) => {
 
     const HeaderContent: React.FC = () => {
         // landmark is owned by user
-        if (landmarkOwnedByUser(props.landmark)) {
+        if (landmarkOwnedByUser(props.landmark) || (props.profile?.places == props.place)) {
             // editing is enabled
             if (props.editingEnabled) {
                 return (

src/components/Map/Panels/LandmarkDetailsPanel/LandmarkDetails.tsx

@@ -47,6 +47,7 @@ export interface LandmarkDetailsProps {
     toggleLmDetails: (state: boolean) => void
     authNavigation: MainTabsNavigationProp
     markerWindowPosition: {x: number, y: number}
+    place: string;
 }
 
 /**
@@ -54,7 +55,7 @@ export interface LandmarkDetailsProps {
  * @component
  * @category Map
  */
-const LandmarkDetails: React.FC<LandmarkDetailsProps> = ({markerWindowPosition, authNavigation, landmarkId, setLandmark, toggleDetailsPanel, setEditing, editingEnabled, visible, toggleLmDetails}) => {
+const LandmarkDetails: React.FC<LandmarkDetailsProps> = ({markerWindowPosition, authNavigation, landmarkId, setLandmark, toggleDetailsPanel, setEditing, editingEnabled, visible, toggleLmDetails, place}) => {
     const {userId, landmarkOwnedByUser} = useAuth()
 
     // /**
@@ -89,6 +90,8 @@ const LandmarkDetails: React.FC<LandmarkDetailsProps> = ({markerWindowPosition,
      */
     const [selectedImage, setSelectedImage] = useState<number>(-1)
 
+    //const [place, setPlace] = useState<string>("")
+
     const [photosBusy, setPhotosBusy] = useState<boolean>(false)
     const [processingPhoto, setProcessingPhoto] = useState<boolean>(false)
 
@@ -389,7 +392,8 @@ const LandmarkDetails: React.FC<LandmarkDetailsProps> = ({markerWindowPosition,
                     rateLandmark={rateLandmark}
                     removeLandmark={removeLandmark}
                     updatedLandmark={updatedLandmark}
-                    profile={profile} />
+                    profile={profile}
+                    place={place} />
                 <DetailsBody
                     authNavigation={authNavigation} 
                     setProcessingPhoto={setProcessingPhoto}

src/components/Profile/Profile.tsx

@@ -12,7 +12,7 @@ import { observer } from "mobx-react";
 import React, { useEffect, useState } from "react";
 import { ActivityIndicator, Alert, AppState, Button, Image, ImageBackground, ScrollView, Text, TouchableOpacity, View } from 'react-native';
 import { renderers } from 'react-native-popup-menu';
-import { API_URL, reportAxiosError } from '../../utils/RequestUtils';
+import { API_URL } from '../../utils/RequestUtils';
 import { PhotoPicker } from '../PhotoPicker';
 import { ProfileHeader } from "./ProfileHeader";
 import { ProfileSections } from "./ProfileSections";
@@ -81,7 +81,7 @@ const Profile: React.FC = () => {
             }
             
         } catch (error) {
-            reportAxiosError("[ProfileData]: Something went wrong when changing a profile picture", error, true)
+            //reportAxiosError("[ProfileData]: Something went wrong when changing a profile picture", error, true)
             Alert.alert("Something went wrong when changing your profile picture.")
         }
     }

src/data/Auth/AuthContext.tsx

@@ -36,7 +36,7 @@ interface AuthState {
     sendApiRequestAsync: (config: RequestConfig) => Promise<any>,
     login: () => Promise<AuthenticationResult>,
     logout: () => Promise<void>,
-    landmarkOwnedByUser: (landmark: Landmark) => boolean,
+    landmarkOwnedByUser: (landmark: Landmark) => boolean
 }
 
 interface RequestConfig {
@@ -234,6 +234,7 @@ export const AuthContextProvider: React.FC = ({children}) => {
         await setStorageItem(SECURESTORE_ID, id)
     }
 
+
     const setNotificationTokenAsync = async (token: string) => {
         setNotificationToken(token)
         await setStorageItem(SECURESTORE_NOTIFTOKEN, token)

src/data/landmarks.ts

@@ -7,6 +7,7 @@
 
 import { AxiosRequestConfig } from "axios";
 import { useMutation, useQuery, useQueryClient } from "react-query";
+import { string } from "yup";
 import { useAuth } from "./Auth/AuthContext";
 import { LMComment } from "./comments";
 import { queryKeys } from "./query-keys";
@@ -234,12 +235,11 @@ export const useDeleteLandmark = () => {
         if (id) {
             const config: AxiosRequestConfig = {
                 method: 'DELETE',
-                url: `/api/landmark/${id}/`,
+                url: `/api/landmark/${id}/`
             }
 
             if (!accessToken) config.data = {...config.data, anonymous: anonUserId}
 
-
             const response = await sendApiRequestAsync({
                 axiosConfig: config,
                 authorized: true,

src/data/profiles.ts

@@ -19,6 +19,10 @@ export interface UserProfile {
      * The user's id
      */
     id?: string
+    /**
+     * The user's place(s)
+     */
+    places?: string
     /**
      * The user's username
      */
@@ -56,6 +60,7 @@ export const useOwnedProfile = () => {
             errorMessage: 'Something went wrong when retrieving user profile',
             loggingCategory: 'PROFILE',
         });   
+        console.log("[Profile] response data from profile = " + String(response.data.places))
         return response.data;
     }
 

src/navigation/MapNavigator.tsx

@@ -203,6 +203,7 @@ const MapNavigator: React.FC = ({ }) => {
                         <MenuItem onPress={() => {
                             setVisible(false)
                             navigate("Outdoor")
+                            mapState.setPlace("Outdoor")
                             // Alert.alert("Cameron Library")
                         }}>Go Back Outdoors</MenuItem>
 
@@ -235,6 +236,7 @@ const MapNavigator: React.FC = ({ }) => {
                         <MenuItem onPress={() => {
                             setVisible(false)
                             navigate("Indoor")
+                            mapState.setPlace("Cameron")
                             // Alert.alert("Cameron Library")
                         }}>Cameron</MenuItem>
 
@@ -278,7 +280,8 @@ const MapNavigator: React.FC = ({ }) => {
                 toggleDetailsPanel={mapState.toggleLmDetails}
                 setEditing={mapState.toggleLmDetailsEditing}
                 editingEnabled={mapState.lmDetailsEditing}
-                landmarkId={mapState.selectedLandmarkId} />
+                landmarkId={mapState.selectedLandmarkId}
+                place = {mapState.place} />
             <FilterPanel
                 visible={mapState.filterVisible}
                 toggleOnlyOwned={mapState.toggleOnlyOwned}

src/utils/RequestUtils.ts

@@ -11,8 +11,8 @@
 //export const API_URL = 'http://192.168.3.81:8000'
 // export const API_URL = 'https://staging.clicknpush.ca'
 
-export const API_URL = 'https://app.clicknpush.ca'
-//export const API_URL = 'http://192.168.1.100:8000' // Nathan
+//export const API_URL = 'https://app.clicknpush.ca'
+export const API_URL = 'http://192.168.1.106:8000' // Nathan
 //export const API_URL = 'http://192.168.1.64:8000'   // Chase
 //export const API_URL = 'http://192.168.0.22:8000'       // Eric