Rename LocationSharing screen folder to StartLocationSharing.

2026-04-27 19:56:57 +02:00 · 2022-08-03 10:40:23 +02:00
parent a6b8d3e411
commit 00b68b8a49
26 changed files with 0 additions and 0 deletions
@@ -0,0 +1,210 @@
+//
+// Copyright 2021 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import SwiftUI
+import Combine
+import Mapbox
+
+struct LocationSharingMapView: UIViewRepresentable {
+    
+    // MARK: - Constants
+    
+    private struct Constants {
+        static let mapZoomLevel = 15.0
+    }
+    
+    // MARK: - Properties
+    
+    /// Map style URL (https://docs.mapbox.com/api/maps/styles/)
+    let tileServerMapURL: URL
+    
+    /// Map annotations
+    let annotations: [LocationAnnotation]
+    
+    /// Map annotation to focus on
+    let highlightedAnnotation: LocationAnnotation?
+    
+    /// Current user avatar data, used to replace current location annotation view with the user avatar
+    let userAvatarData: AvatarInputProtocol?
+    
+    /// True to indicate to show and follow current user location
+    var showsUserLocation: Bool = false
+    
+    /// True to indicate that a touch on user annotation can show a callout
+    var userAnnotationCanShowCallout: Bool = false
+
+    /// Last user location if `showsUserLocation` has been enabled
+    @Binding var userLocation: CLLocationCoordinate2D?
+    
+    /// Coordinate of the center of the map
+    @Binding var mapCenterCoordinate: CLLocationCoordinate2D?
+    
+    /// Called when an annotation callout view is tapped
+    var onCalloutTap: ((MGLAnnotation) -> Void)?
+    
+    /// Publish view errors if any
+    let errorSubject: PassthroughSubject<LocationSharingViewError, Never>
+    
+    /// Called when the user pan on the map
+    var userDidPan: (() -> Void)?
+
+    // MARK: - UIViewRepresentable
+    
+    func makeUIView(context: Context) -> MGLMapView {
+        
+        let mapView = self.makeMapView()
+        mapView.delegate = context.coordinator
+        let panGesture = UIPanGestureRecognizer(target: context.coordinator, action: #selector(context.coordinator.didPan))
+        panGesture.delegate = context.coordinator
+        mapView.addGestureRecognizer(panGesture)
+        return mapView
+    }
+    
+    func updateUIView(_ mapView: MGLMapView, context: Context) {
+        
+        mapView.vc_removeAllAnnotations()
+        mapView.addAnnotations(self.annotations)
+        
+        if let highlightedAnnotation = self.highlightedAnnotation {
+            mapView.setCenter(highlightedAnnotation.coordinate, zoomLevel: Constants.mapZoomLevel, animated: false)
+        }
+        
+        if self.showsUserLocation {
+            mapView.showsUserLocation = true
+            mapView.userTrackingMode = .follow
+        } else {
+            mapView.showsUserLocation = false
+            mapView.userTrackingMode = .none
+        }
+    }
+    
+    func makeCoordinator() -> Coordinator {
+        Coordinator(self)
+    }
+    
+    // MARK: - Private
+    
+    private func makeMapView() -> MGLMapView {
+        let mapView = MGLMapView(frame: .zero, styleURL: tileServerMapURL)
+
+        mapView.logoView.isHidden = true
+        mapView.attributionButton.isHidden = true
+        
+        return mapView
+    }
+}
+
+// MARK: - Coordinator
+extension LocationSharingMapView {
+    
+    class Coordinator: NSObject, MGLMapViewDelegate, UIGestureRecognizerDelegate {
+        
+        // MARK: - Properties
+
+        var locationSharingMapView: LocationSharingMapView
+        
+        // MARK: - Setup
+
+         init(_ locationSharingMapView: LocationSharingMapView) {
+             self.locationSharingMapView = locationSharingMapView
+         }
+        
+        // MARK: - MGLMapViewDelegate
+        
+        func mapView(_ mapView: MGLMapView, viewFor annotation: MGLAnnotation) -> MGLAnnotationView? {
+            
+            if let userLocationAnnotation = annotation as? UserLocationAnnotation {
+                return LocationAnnotationView(userLocationAnnotation: userLocationAnnotation)
+            } else if let pinLocationAnnotation = annotation as? PinLocationAnnotation {
+                return LocationAnnotationView(pinLocationAnnotation: pinLocationAnnotation)
+            } else if annotation is MGLUserLocation, let currentUserAvatarData = locationSharingMapView.userAvatarData {
+                // Replace default current location annotation view with a UserLocationAnnotatonView when the map is center on user location
+                return LocationAnnotationView(avatarData: currentUserAvatarData)
+            }
+
+            return nil
+        }
+        
+        func mapViewDidFailLoadingMap(_ mapView: MGLMapView, withError error: Error) {
+            locationSharingMapView.errorSubject.send(.failedLoadingMap)
+        }
+        
+        func mapView(_ mapView: MGLMapView, didUpdate userLocation: MGLUserLocation?) {
+            locationSharingMapView.userLocation = userLocation?.coordinate
+        }
+        
+        func mapView(_ mapView: MGLMapView, didChangeLocationManagerAuthorization manager: MGLLocationManager) {
+            guard mapView.showsUserLocation else {
+                return
+            }
+            
+            switch manager.authorizationStatus {
+            case .restricted:
+                fallthrough
+            case .denied:
+                locationSharingMapView.errorSubject.send(.invalidLocationAuthorization)
+            default:
+                break
+            }
+        }
+        
+        func mapView(_ mapView: MGLMapView, regionDidChangeAnimated animated: Bool) {
+            locationSharingMapView.mapCenterCoordinate = mapView.centerCoordinate
+        }
+        
+        // MARK: Callout
+                
+        func mapView(_ mapView: MGLMapView, annotationCanShowCallout annotation: MGLAnnotation) -> Bool {
+            return annotation is UserLocationAnnotation && locationSharingMapView.userAnnotationCanShowCallout
+        }
+        
+        func mapView(_ mapView: MGLMapView, calloutViewFor annotation: MGLAnnotation) -> MGLCalloutView? {
+            if let userLocationAnnotation = annotation as? UserLocationAnnotation {
+                return UserAnnotationCalloutView(userLocationAnnotation: userLocationAnnotation)
+            }
+            
+            return nil
+        }
+         
+        func mapView(_ mapView: MGLMapView, tapOnCalloutFor annotation: MGLAnnotation) {
+            locationSharingMapView.onCalloutTap?(annotation)
+            // Hide the callout
+            mapView.deselectAnnotation(annotation, animated: true)
+        }
+        
+        // MARK: UIGestureRecognizer
+        
+        func gestureRecognizer(_ gestureRecognizer: UIGestureRecognizer, shouldRecognizeSimultaneouslyWith otherGestureRecognizer: UIGestureRecognizer) -> Bool {
+            return gestureRecognizer is UIPanGestureRecognizer
+        }
+        
+        @objc
+        func didPan() {
+            locationSharingMapView.userDidPan?()
+        }
+    }
+}
+
+// MARK: - MGLMapView convenient methods
+extension MGLMapView {
+    
+    func vc_removeAllAnnotations() {
+        guard let annotations = self.annotations else {
+            return
+        }
+        self.removeAnnotations(annotations)
+    }
+}
@@ -0,0 +1,63 @@
+// 
+// Copyright 2021 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import SwiftUI
+
+struct LocationSharingMarkerView<Content: View>: View {
+    
+    // MARK: - Properties
+    
+    // MARK: Private
+    
+    @Environment(\.theme) private var theme: ThemeSwiftUI
+    
+    // MARK: Public
+    
+    let backgroundColor: Color
+    @ViewBuilder var markerImage: Content
+    
+    var body: some View {
+        ZStack {
+            Rectangle()
+                .rotation(Angle(degrees: 45))
+                .fill(backgroundColor)
+                .frame(width: 7, height: 7)
+                .offset(x: 0, y: 21)
+            markerImage
+                .frame(width: 40, height: 40)
+        }
+    }
+}
+
+// MARK: - Previews
+
+struct LocationSharingUserMarkerView_Previews: PreviewProvider {
+    static var previews: some View {
+        let avatarData = AvatarInput(mxContentUri: "",
+                                     matrixItemId: "test",
+                                     displayName: "Alice")
+        VStack(alignment: .center, spacing: 15) {
+            LocationSharingMarkerView(backgroundColor: .green) {
+                AvatarImage(avatarData: avatarData, size: .medium)
+                    .border()
+            }
+            LocationSharingMarkerView(backgroundColor: .green) {
+                AvatarImage(avatarData: avatarData, size: .medium)
+                    .border()
+            }
+        }
+    }
+}
@@ -0,0 +1,67 @@
+// 
+// Copyright 2022 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import SwiftUI
+
+struct LocationSharingOptionButton<Content: View>: View {
+    
+    // MARK: - Properties
+    
+    // MARK: Private
+    
+    @Environment(\.theme) private var theme: ThemeSwiftUI
+    
+    let text: String
+    let action: () -> (Void)
+    @ViewBuilder var buttonIcon: Content
+    
+    var body: some View {
+        Button(action: action) {
+            HStack(spacing: 18) {
+                buttonIcon
+                    .frame(width: 40, height: 40)
+                Text(text)
+                    .font(theme.fonts.body)
+                    .foregroundColor(theme.colors.primaryContent)
+            }
+        }
+    }
+}
+
+struct LocationSharingOptionButton_Previews: PreviewProvider {
+    static var previews: some View {
+        VStack(alignment: .leading) {
+            LocationSharingOptionButton(text: VectorL10n.locationSharingStaticShareTitle) {
+                
+            } buttonIcon: {
+                AvatarImage(avatarData: AvatarInput(mxContentUri: nil, matrixItemId: "Alice", displayName: "Alice"), size: .medium)
+                    .border()
+            }
+            LocationSharingOptionButton(text: VectorL10n.locationSharingLiveShareTitle) {
+                
+            } buttonIcon: {
+                Image(uiImage: Asset.Images.locationLiveIcon.image)
+                    .resizable()
+            }
+            LocationSharingOptionButton(text: VectorL10n.locationSharingPinDropShareTitle) {
+                
+            } buttonIcon: {
+                Image(uiImage: Asset.Images.locationPinIcon.image)
+                    .resizable()
+            }
+        }
+    }
+}
@@ -0,0 +1,196 @@
+//
+// Copyright 2021 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import SwiftUI
+import CoreLocation
+
+struct LocationSharingView: View {
+    
+    // MARK: - Properties
+    
+    // MARK: Private
+    
+    @Environment(\.theme) private var theme: ThemeSwiftUI
+    
+    @Environment(\.openURL) var openURL
+    
+    // MARK: Public
+    
+    @ObservedObject var context: LocationSharingViewModel.Context
+    
+    var body: some View {
+        NavigationView {
+            ZStack(alignment: .bottom) {
+                if !context.viewState.showMapLoadingError {
+                    mapView
+                }
+                
+                VStack(spacing: 0) {
+                    
+                    if context.viewState.showMapLoadingError {
+                        MapLoadingErrorView()
+                    } else {
+                        // Show map credits only if map is visible
+                        
+                        MapCreditsView(action: {
+                            context.send(viewAction: .mapCreditsDidTap)
+                        })
+                        .padding(.bottom, 10.0)
+                        .actionSheet(isPresented: $context.showMapCreditsSheet) {
+                            return MapCreditsActionSheet(openURL: { url in
+                                openURL(url)
+                            }).sheet
+                        }
+                    }
+                    
+                    buttonsView
+                        .background(theme.colors.background)
+                        .clipShape(RoundedCornerShape(radius: 8, corners: [.topLeft, .topRight]))
+                }
+            }
+            .background(theme.colors.background.ignoresSafeArea())
+            .toolbar {
+                ToolbarItem(placement: .navigationBarLeading) {
+                    Button(VectorL10n.cancel, action: {
+                        context.send(viewAction: .cancel)
+                    })
+                }
+                ToolbarItem(placement: .principal) {
+                    Text(VectorL10n.locationSharingTitle)
+                        .font(.headline)
+                        .foregroundColor(theme.colors.primaryContent)
+                }
+            }
+            .navigationBarTitleDisplayMode(.inline)
+            .introspectNavigationController { navigationController in
+                ThemeService.shared().theme.applyStyle(onNavigationBar: navigationController.navigationBar)
+            }
+            .alert(item: $context.alertInfo) { info in
+                info.alert
+            }
+        }
+        .accentColor(theme.colors.accent)
+        .activityIndicator(show: context.viewState.showLoadingIndicator)
+        .navigationViewStyle(StackNavigationViewStyle())
+    }
+    
+    var mapView: some View {
+        ZStack(alignment: .topTrailing) {
+            ZStack(alignment: .center) {
+                LocationSharingMapView(tileServerMapURL: context.viewState.mapStyleURL,
+                                       annotations: context.viewState.annotations,
+                                       highlightedAnnotation: context.viewState.highlightedAnnotation,
+                                       userAvatarData: context.viewState.userAvatarData,
+                                       showsUserLocation: context.viewState.showsUserLocation,
+                                       userLocation: $context.userLocation,
+                                       mapCenterCoordinate: $context.pinLocation,
+                                       errorSubject: context.viewState.errorSubject,
+                                       userDidPan: {
+                    context.send(viewAction: .userDidPan)
+                })
+                if context.viewState.isPinDropSharing {
+                    LocationSharingMarkerView(backgroundColor: theme.colors.accent) {
+                        Image(uiImage: Asset.Images.locationPinIcon.image)
+                            .resizable()
+                            .shapedBorder(color: theme.colors.accent, borderWidth: 3, shape: Circle())
+                    }
+                }
+            }
+            Button {
+                context.send(viewAction: .goToUserLocation)
+            } label: {
+                Image(uiImage: Asset.Images.locationCenterMapIcon.image)
+                    .foregroundColor(theme.colors.accent)
+            }
+            .padding(6.0)
+            .background(theme.colors.background)
+            .clipShape(RoundedCornerShape(radius: 4, corners: [.allCorners]))
+            .shadow(radius: 2.0)
+            .offset(x: -11.0, y: 52)
+        }
+    }
+    
+    var buttonsView: some View {
+        VStack(alignment: .leading, spacing: 15) {
+            if !context.viewState.isPinDropSharing {
+                LocationSharingOptionButton(text: VectorL10n.locationSharingStaticShareTitle) {
+                    context.send(viewAction: .share)
+                } buttonIcon: {
+                    AvatarImage(avatarData: context.viewState.userAvatarData, size: .medium)
+                        .border()
+                }
+                .disabled(!context.viewState.shareButtonEnabled)
+                // Hide for now until live location sharing is finished
+                if context.viewState.isLiveLocationSharingEnabled {
+                    LocationSharingOptionButton(text: VectorL10n.locationSharingLiveShareTitle) {
+                        context.send(viewAction: .startLiveSharing)
+                    } buttonIcon: {
+                        Image(uiImage: Asset.Images.locationLiveIcon.image)
+                            .resizable()
+                    }
+                    .disabled(!context.viewState.shareButtonEnabled)
+                }
+            } else {
+                LocationSharingOptionButton(text: VectorL10n.locationSharingPinDropShareTitle) {
+                    context.send(viewAction: .sharePinLocation)
+                } buttonIcon: {
+                    Image(uiImage: Asset.Images.locationPinIcon.image)
+                        .resizable()
+                }
+                .disabled(!context.viewState.shareButtonEnabled)
+            }
+        }
+        .actionSheet(isPresented: $context.showingTimerSelector) {
+            ActionSheet(title: Text(VectorL10n.locationSharingLiveTimerSelectorTitle),
+                        buttons: [
+                            .default(Text(VectorL10n.locationSharingLiveTimerSelectorShort)) {
+                                context.send(viewAction: .shareLiveLocation(timeout: .short))
+                                
+                            },
+                            .default(Text(VectorL10n.locationSharingLiveTimerSelectorMedium)) {
+                                context.send(viewAction: .shareLiveLocation(timeout: .medium))
+                                
+                            },
+                            .default(Text(VectorL10n.locationSharingLiveTimerSelectorLong)) {
+                                context.send(viewAction: .shareLiveLocation(timeout: .long))
+                                
+                            },
+                            .cancel()
+                        ])
+        }
+        .frame(maxWidth: .infinity, alignment: .leading)
+        .padding()
+    }
+    
+    @ViewBuilder
+    private var activityIndicator: some View {
+        if context.viewState.showLoadingIndicator {
+            ActivityIndicator()
+        }
+    }
+}
+
+// MARK: - Previews
+
+struct LocationSharingView_Previews: PreviewProvider {
+    static let stateRenderer = MockLocationSharingScreenState.stateRenderer
+    static var previews: some View {
+        Group {
+            stateRenderer.screenGroup().theme(.light).preferredColorScheme(.light)
+            stateRenderer.screenGroup().theme(.dark).preferredColorScheme(.dark)
+        }
+    }
+}
@@ -0,0 +1,50 @@
+// 
+// Copyright 2021 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import SwiftUI
+
+struct MapCreditsView: View {
+    
+    // MARK: - Properties
+    
+    // MARK: Private
+    
+    @Environment(\.theme) private var theme: ThemeSwiftUI
+    
+    // MARK: Public
+    
+    var action: (() -> Void)?
+    
+    var body: some View {
+        HStack {
+            Spacer()
+            Button {
+                action?()
+            } label: {
+                Text(VectorL10n.locationSharingMapCreditsTitle)
+                    .font(theme.fonts.footnote)
+                    .foregroundColor(theme.colors.accent)
+            }
+            .padding(.horizontal)
+        }
+    }
+}
+
+struct MapCreditsView_Previews: PreviewProvider {
+    static var previews: some View {
+        MapCreditsView()
+    }
+}
@@ -0,0 +1,52 @@
+// 
+// Copyright 2022 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import SwiftUI
+
+struct MapLoadingErrorView: View {
+    
+    // MARK: - Properties
+    
+    // MARK: Private
+    
+    @Environment(\.theme) private var theme: ThemeSwiftUI
+    
+    // MARK: Public
+    
+    var action: (() -> Void)?
+    
+    var body: some View {
+        VStack {
+            VStack {
+                Image(uiImage: Asset.Images.locationMapError.image)
+                    .frame(width: 40, height: 40)
+                Text(VectorL10n.locationSharingMapLoadingError)
+                    .multilineTextAlignment(.center)
+                    .font(theme.fonts.caption1)
+                    .foregroundColor(theme.colors.primaryContent)
+            }
+            .padding()
+        }
+        .frame(maxWidth: .infinity, maxHeight: .infinity)
+        .background(theme.colors.system.ignoresSafeArea())
+    }
+}
+
+struct MapLoadingErrorView_Previews: PreviewProvider {
+    static var previews: some View {
+        MapLoadingErrorView()
+    }
+}
@@ -0,0 +1,85 @@
+// 
+// Copyright 2022 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Foundation
+import Reusable
+
+class UserAnnotationCalloutContentView: UIView, Themable, NibLoadable {
+    
+    // MARK: - Constants
+    
+    private static let sizingView = UserAnnotationCalloutContentView.instantiate()
+    
+    private enum Constants {
+        static let height: CGFloat = 44.0
+        static let cornerRadius: CGFloat = 8.0
+    }
+    
+    // MARK: - Properties
+    
+    // MARK: Outlets
+    
+    @IBOutlet var backgroundView: UIView!
+    @IBOutlet var titleLabel: UILabel!
+    @IBOutlet var shareButton: UIButton!
+    
+    // MARK: - Setup
+    
+    static func instantiate() -> UserAnnotationCalloutContentView {
+        return UserAnnotationCalloutContentView.loadFromNib()
+    }
+    
+    // MARK: - Public
+    
+    func update(theme: Theme) {
+        self.backgroundView.backgroundColor = theme.colors.background
+        self.titleLabel.textColor = theme.colors.secondaryContent
+        self.titleLabel.font = theme.fonts.callout
+        self.shareButton.tintColor = theme.colors.secondaryContent
+    }
+
+    // MARK: - Life cycle
+    
+    override func awakeFromNib() {
+        super.awakeFromNib()
+        
+        self.titleLabel.text = VectorL10n.locationSharingLiveMapCalloutTitle
+        self.backgroundView.layer.masksToBounds = true
+    }
+    
+    override func layoutSubviews() {
+        super.layoutSubviews()
+        
+        self.backgroundView.layer.cornerRadius = Constants.cornerRadius
+    }
+    
+    static func contentViewSize() -> CGSize {
+        let sizingView = self.sizingView
+
+        sizingView.frame = CGRect(x: 0, y: 0, width: 1, height: Constants.height)
+
+        sizingView.setNeedsLayout()
+        sizingView.layoutIfNeeded()
+
+        let fittingSize = CGSize(width: UIView.layoutFittingCompressedSize.width, height: Constants.height)
+
+        let size = sizingView.systemLayoutSizeFitting(fittingSize,
+                                                             withHorizontalFittingPriority: .fittingSizeLevel,
+                                                             verticalFittingPriority: .required)
+
+        return size
+    }
+}
@@ -0,0 +1,65 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="20037" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES">
+    <device id="retina6_1" orientation="portrait" appearance="light"/>
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="20020"/>
+        <capability name="System colors in document resources" minToolsVersion="11.0"/>
+        <capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
+    </dependencies>
+    <objects>
+        <placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
+        <placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
+        <view contentMode="scaleToFill" id="iN0-l3-epB" customClass="UserAnnotationCalloutContentView" customModule="Riot" customModuleProvider="target">
+            <rect key="frame" x="0.0" y="0.0" width="222" height="62"/>
+            <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
+            <subviews>
+                <view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="WEX-LH-zYE">
+                    <rect key="frame" x="0.0" y="0.0" width="222" height="62"/>
+                    <color key="backgroundColor" systemColor="systemBackgroundColor"/>
+                </view>
+                <label opaque="NO" userInteractionEnabled="NO" contentMode="left" horizontalHuggingPriority="251" verticalHuggingPriority="251" text="Label" textAlignment="natural" lineBreakMode="tailTruncation" baselineAdjustment="alignBaselines" adjustsFontSizeToFit="NO" translatesAutoresizingMaskIntoConstraints="NO" id="8qV-yr-fDH">
+                    <rect key="frame" x="10" y="0.0" width="173" height="62"/>
+                    <fontDescription key="fontDescription" type="system" pointSize="17"/>
+                    <nil key="textColor"/>
+                    <nil key="highlightedColor"/>
+                </label>
+                <button opaque="NO" contentMode="scaleToFill" horizontalHuggingPriority="252" contentHorizontalAlignment="center" contentVerticalAlignment="center" lineBreakMode="middleTruncation" translatesAutoresizingMaskIntoConstraints="NO" id="Htx-uD-cf2">
+                    <rect key="frame" x="188" y="0.0" width="24" height="62"/>
+                    <inset key="imageEdgeInsets" minX="0.0" minY="0.0" maxX="2.2250738585072014e-308" maxY="0.0"/>
+                    <state key="normal" image="share_action_button"/>
+                </button>
+            </subviews>
+            <color key="backgroundColor" white="0.0" alpha="0.0" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+            <constraints>
+                <constraint firstAttribute="trailing" secondItem="WEX-LH-zYE" secondAttribute="trailing" id="3Rb-Vi-QNG"/>
+                <constraint firstItem="Htx-uD-cf2" firstAttribute="bottom" relation="greaterThanOrEqual" secondItem="WEX-LH-zYE" secondAttribute="bottom" id="8oX-y9-FA8"/>
+                <constraint firstItem="8qV-yr-fDH" firstAttribute="top" secondItem="WEX-LH-zYE" secondAttribute="top" id="Cqh-a4-3xH"/>
+                <constraint firstItem="WEX-LH-zYE" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" id="Glo-Kv-b9P"/>
+                <constraint firstAttribute="bottom" secondItem="WEX-LH-zYE" secondAttribute="bottom" id="TVK-pw-MQi"/>
+                <constraint firstItem="Htx-uD-cf2" firstAttribute="centerY" secondItem="8qV-yr-fDH" secondAttribute="centerY" id="VLm-I1-Xa5"/>
+                <constraint firstItem="Htx-uD-cf2" firstAttribute="leading" secondItem="8qV-yr-fDH" secondAttribute="trailing" constant="5" id="aNO-Wu-hrO"/>
+                <constraint firstItem="Htx-uD-cf2" firstAttribute="trailing" secondItem="WEX-LH-zYE" secondAttribute="trailing" constant="-10" id="eB7-OT-FSZ"/>
+                <constraint firstItem="Htx-uD-cf2" firstAttribute="top" relation="greaterThanOrEqual" secondItem="WEX-LH-zYE" secondAttribute="top" id="gsk-Ld-Ahq"/>
+                <constraint firstItem="WEX-LH-zYE" firstAttribute="top" secondItem="iN0-l3-epB" secondAttribute="top" id="kVf-HO-jBq"/>
+                <constraint firstItem="8qV-yr-fDH" firstAttribute="leading" secondItem="WEX-LH-zYE" secondAttribute="leading" constant="10" id="nDk-Sm-zM4"/>
+                <constraint firstItem="8qV-yr-fDH" firstAttribute="bottom" secondItem="WEX-LH-zYE" secondAttribute="bottom" id="ypH-Wk-ly7"/>
+            </constraints>
+            <nil key="simulatedTopBarMetrics"/>
+            <nil key="simulatedBottomBarMetrics"/>
+            <freeformSimulatedSizeMetrics key="simulatedDestinationMetrics"/>
+            <connections>
+                <outlet property="backgroundView" destination="WEX-LH-zYE" id="G7V-Kl-xz0"/>
+                <outlet property="shareButton" destination="Htx-uD-cf2" id="crB-EP-vHO"/>
+                <outlet property="titleLabel" destination="8qV-yr-fDH" id="9o1-jU-nR6"/>
+            </connections>
+            <point key="canvasLocation" x="-7.2463768115942031" y="-193.52678571428569"/>
+        </view>
+    </objects>
+    <resources>
+        <image name="share_action_button" width="24" height="24"/>
+        <systemColor name="systemBackgroundColor">
+            <color white="1" alpha="1" colorSpace="custom" customColorSpace="genericGamma22GrayColorSpace"/>
+        </systemColor>
+    </resources>
+</document>
@@ -0,0 +1,156 @@
+// 
+// Copyright 2022 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Mapbox
+
+class UserAnnotationCalloutView: UIView, MGLCalloutView, Themable {
+    
+    // MARK: - Constants
+    
+    private enum Constants {
+        static let animationDuration: TimeInterval = 0.2
+        static let bottomMargin: CGFloat = 3.0
+    }
+ 
+    // MARK: - Properties
+    
+    // MARK: Overrides
+    
+    var representedObject: MGLAnnotation
+    
+    lazy var leftAccessoryView: UIView = UIView()
+    
+    lazy var rightAccessoryView: UIView = UIView()
+    
+    var delegate: MGLCalloutViewDelegate?
+    
+    // Allow the callout to remain open during panning.
+    let dismissesAutomatically: Bool = false
+    
+    let isAnchoredToAnnotation: Bool = true
+    
+    // https://github.com/mapbox/mapbox-gl-native/issues/9228
+    override var center: CGPoint {
+        set {
+            var newCenter = newValue
+            newCenter.y -= bounds.midY + Constants.bottomMargin
+            super.center = newCenter
+        }
+        get {
+            return super.center
+        }
+    }
+    
+    // MARK: Private
+    
+    lazy var contentView: UserAnnotationCalloutContentView = {
+        return UserAnnotationCalloutContentView.instantiate()
+    }()
+    
+    // MARK: - Setup
+    
+    required init(userLocationAnnotation: UserLocationAnnotation) {
+        
+        self.representedObject = userLocationAnnotation
+        
+        super.init(frame: .zero)
+                        
+        self.vc_addSubViewMatchingParent(self.contentView)
+        
+        self.update(theme: ThemeService.shared().theme)
+        
+        let size = UserAnnotationCalloutContentView.contentViewSize()
+
+        self.frame = CGRect(origin: .zero, size: size)
+    }
+    
+    required init?(coder decoder: NSCoder) {
+        fatalError("init(coder:) has not been implemented")
+    }
+    
+    // MARK: - Public
+    
+    func update(theme: Theme) {
+        self.contentView.update(theme: theme)
+    }
+    
+    // MARK: - Overrides
+
+    func presentCallout(from rect: CGRect, in view: UIView, constrainedTo constrainedRect: CGRect, animated: Bool) {
+        
+        // Set callout above the marker view
+        
+        self.center = view.center.applying(CGAffineTransform(translationX: 0, y: view.bounds.height/2 + self.bounds.height))
+        
+        delegate?.calloutViewWillAppear?(self)
+        
+        view.addSubview(self)
+        
+        if isCalloutTappable() {
+            // Handle taps and eventually try to send them to the delegate (usually the map view).
+            self.contentView.shareButton.addTarget(self, action: #selector(UserAnnotationCalloutView.calloutTapped), for: .touchUpInside)
+        } else {
+            // Disable tapping and highlighting.
+            self.contentView.shareButton.isUserInteractionEnabled = false
+        }
+        
+        if animated {
+            alpha = 0
+            
+            UIView.animate(withDuration: Constants.animationDuration) { [weak self] in
+                guard let strongSelf = self else {
+                    return
+                }
+                
+                strongSelf.alpha = 1
+                strongSelf.delegate?.calloutViewDidAppear?(strongSelf)
+            }
+        } else {
+            delegate?.calloutViewDidAppear?(self)
+        }
+    }
+    
+    func dismissCallout(animated: Bool) {
+        if (superview != nil) {
+            if animated {
+                UIView.animate(withDuration: Constants.animationDuration, animations: { [weak self] in
+                    self?.alpha = 0
+                }, completion: { [weak self] _ in
+                    self?.removeFromSuperview()
+                })
+            } else {
+                removeFromSuperview()
+            }
+        }
+    }
+
+    // MARK: - Callout interaction handlers
+
+    func isCalloutTappable() -> Bool {
+        if let delegate = delegate {
+            if delegate.responds(to: #selector(MGLCalloutViewDelegate.calloutViewShouldHighlight)) {
+                return delegate.calloutViewShouldHighlight!(self)
+            }
+        }
+        return false
+    }
+
+    @objc func calloutTapped() {
+        if isCalloutTappable() && delegate!.responds(to: #selector(MGLCalloutViewDelegate.calloutViewTapped)) {
+            delegate!.calloutViewTapped!(self)
+        }
+    }
+}
@@ -0,0 +1,100 @@
+// 
+// Copyright 2021 New Vector Ltd
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import Foundation
+import SwiftUI
+import Mapbox
+
+class LocationAnnotationView: MGLUserLocationAnnotationView {
+    
+    // MARK: - Constants
+    
+    private enum Constants {
+        static let defaultFrame = CGRect(x: 0, y: 0, width: 46, height: 46)
+    }
+    
+    // MARK: Private
+    
+    @Environment(\.theme) private var theme: ThemeSwiftUI
+    
+    // MARK: - Setup
+    
+    override init(annotation: MGLAnnotation?, reuseIdentifier: String?) {
+        super.init(annotation: annotation, reuseIdentifier:
+                    reuseIdentifier)
+        self.frame = Constants.defaultFrame
+    }
+    
+    convenience init(avatarData: AvatarInputProtocol) {
+        self.init(annotation: nil, reuseIdentifier: nil)
+        self.addUserMarkerView(with: avatarData)
+    }
+    
+    convenience init(userLocationAnnotation: UserLocationAnnotation) {
+        
+        // TODO: Use a reuseIdentifier
+        self.init(annotation: userLocationAnnotation, reuseIdentifier: nil)
+        
+        self.addUserMarkerView(with: userLocationAnnotation.avatarData)
+    }
+    
+    convenience init(pinLocationAnnotation: PinLocationAnnotation) {
+        
+        // TODO: Use a reuseIdentifier
+        self.init(annotation: pinLocationAnnotation, reuseIdentifier: nil)
+        
+        self.addPinMarkerView()
+    }
+    
+    required init?(coder: NSCoder) {
+        fatalError()
+    }
+    
+    // MARK: - Private
+    
+    private func addUserMarkerView(with avatarData: AvatarInputProtocol) {
+        
+        guard let avatarMarkerView = UIHostingController(rootView: LocationSharingMarkerView(backgroundColor: theme.userColor(for: avatarData.matrixItemId)) {
+            AvatarImage(avatarData: avatarData, size: .medium)
+                .border()
+        }).view else {
+            return
+        }
+        
+        addMarkerView(avatarMarkerView)
+    }
+    
+    private func addPinMarkerView() {
+        guard let pinMarkerView = UIHostingController(rootView: LocationSharingMarkerView(backgroundColor: theme.colors.accent) {
+            Image(uiImage: Asset.Images.locationPinIcon.image)
+                .resizable()
+                .shapedBorder(color: theme.colors.accent, borderWidth: 3, shape: Circle())
+        }).view else {
+            return
+        }
+        
+        addMarkerView(pinMarkerView)
+    }
+    
+    private func addMarkerView(_ markerView: UIView) {
+        
+        markerView.backgroundColor = .clear
+        
+        addSubview(markerView)
+        
+        markerView.frame = self.bounds
+    }
+}