Merge branch 'develop' into psf-768/send-beacon-location-events

Signed-off-by: Kerry Archibald <[email protected]>

src/components/views/context_menus/MessageContextMenu.tsx

@@ -47,8 +47,8 @@ import { ComposerInsertPayload } from "../../../dispatcher/payloads/ComposerInse
 import { WidgetLayoutStore } from '../../../stores/widgets/WidgetLayoutStore';
 import EndPollDialog from '../dialogs/EndPollDialog';
 import { isPollEnded } from '../messages/MPollBody';
-import { createMapSiteLink } from "../messages/MLocationBody";
 import { ViewRoomPayload } from "../../../dispatcher/payloads/ViewRoomPayload";
+import { createMapSiteLink } from '../../../utils/location';
 
 export function canCancel(status: EventStatus): boolean {
     return status === EventStatus.QUEUED || status === EventStatus.NOT_SENT || status === EventStatus.ENCRYPTING;

src/components/views/location/LocationPicker.tsx

@@ -24,20 +24,20 @@ import classNames from 'classnames';
 import { Icon as LocationIcon } from '../../../../res/img/element-icons/location.svg';
 import { _t } from '../../../languageHandler';
 import { replaceableComponent } from "../../../utils/replaceableComponent";
-import MemberAvatar from '../avatars/MemberAvatar';
 import MatrixClientContext from '../../../contexts/MatrixClientContext';
 import Modal from '../../../Modal';
+import SdkConfig from '../../../SdkConfig';
 import { tileServerFromWellKnown } from '../../../utils/WellKnownUtils';
 import { getUserNameColorClass } from '../../../utils/FormattingUtils';
 import { GenericPosition, genericPositionFromGeolocation, getGeoUri } from '../../../utils/beacon';
-import SdkConfig from '../../../SdkConfig';
+import { LocationShareError, findMapStyleUrl } from '../../../utils/location';
+import MemberAvatar from '../avatars/MemberAvatar';
 import ErrorDialog from '../dialogs/ErrorDialog';
 import AccessibleButton from '../elements/AccessibleButton';
-import { findMapStyleUrl } from './findMapStyleUrl';
-import LiveDurationDropdown, { DEFAULT_DURATION_MS } from './LiveDurationDropdown';
-import { LocationShareError } from './LocationShareErrors';
 import { MapError } from './MapError';
+import LiveDurationDropdown, { DEFAULT_DURATION_MS } from './LiveDurationDropdown';
 import { LocationShareType, ShareLocationFn } from './shareLocation';
+
 export interface ILocationPickerProps {
     sender: RoomMember;
     shareType: LocationShareType;
@@ -232,15 +232,15 @@ class LocationPicker extends React.Component<ILocationPickerProps, IState> {
         return (
             <div className="mx_LocationPicker">
                 <div id="mx_LocationPicker_map" />
-                { this.props.shareType === LocationShareType.Pin && <div className="mx_LocationPicker_pinText">
+                {this.props.shareType === LocationShareType.Pin && <div className="mx_LocationPicker_pinText">
                     <span>
-                        { this.state.position ? _t("Click to move the pin") : _t("Click to drop a pin") }
+                        {this.state.position ? _t("Click to move the pin") : _t("Click to drop a pin")}
                     </span>
                 </div>
                 }
                 <div className="mx_LocationPicker_footer">
                     <form onSubmit={this.onOk}>
-                        { this.props.shareType === LocationShareType.Live &&
+                        {this.props.shareType === LocationShareType.Live &&
                             <LiveDurationDropdown
                                 onChange={this.onTimeoutChange}
                                 timeout={this.state.timeout}
@@ -254,7 +254,7 @@ class LocationPicker extends React.Component<ILocationPickerProps, IState> {
                             className='mx_LocationPicker_submitButton'
                             disabled={!this.state.position}
                             onClick={this.onOk}>
-                            { _t('Share location') }
+                            {_t('Share location')}
                         </AccessibleButton>
                     </form>
                 </div>
@@ -263,7 +263,7 @@ class LocationPicker extends React.Component<ILocationPickerProps, IState> {
                     `mx_MLocationBody_marker-${this.props.shareType}`,
                     userColorClass,
                 )}
-                id={this.getMarkerId()}
+                    id={this.getMarkerId()}
                 >
                     { /*
                     maplibregl hijacks the div above to style the marker
@@ -273,9 +273,9 @@ class LocationPicker extends React.Component<ILocationPickerProps, IState> {
                     so hide the internal visible elements
                     */ }
 
-                    { !!this.marker && <>
+                    {!!this.marker && <>
                         <div className="mx_MLocationBody_markerBorder">
-                            { isSharingOwnLocation(this.props.shareType) ?
+                            {isSharingOwnLocation(this.props.shareType) ?
                                 <MemberAvatar
                                     member={this.props.sender}
                                     width={27}
@@ -288,7 +288,7 @@ class LocationPicker extends React.Component<ILocationPickerProps, IState> {
                         <div
                             className="mx_MLocationBody_pointer"
                         />
-                    </> }
+                    </>}
                 </div>
             </div>
         );

src/components/views/location/LocationViewDialog.tsx

@@ -21,8 +21,9 @@ import { ClientEvent, IClientWellKnown, MatrixClient } from 'matrix-js-sdk/src/c
 import { replaceableComponent } from "../../../utils/replaceableComponent";
 import BaseDialog from "../dialogs/BaseDialog";
 import { IDialogProps } from "../dialogs/IDialogProps";
-import { createMap, LocationBodyContent, locationEventGeoUri, parseGeoUri } from '../messages/MLocationBody';
+import { LocationBodyContent } from '../messages/MLocationBody';
 import { tileServerFromWellKnown } from '../../../utils/WellKnownUtils';
+import { parseGeoUri, locationEventGeoUri, createMap } from '../../../utils/location';
 
 interface IProps extends IDialogProps {
     matrixClient: MatrixClient;

src/components/views/location/MapError.tsx

@@ -18,9 +18,9 @@ import React from 'react';
 
 import { Icon as WarningBadge } from '../../../../res/img/element-icons/warning-badge.svg';
 import { _t } from '../../../languageHandler';
+import { getLocationShareErrorMessage, LocationShareError } from '../../../utils/location';
 import AccessibleButton from '../elements/AccessibleButton';
 import Heading from '../typography/Heading';
-import { getLocationShareErrorMessage, LocationShareError } from './LocationShareErrors';
 
 interface Props {
     onFinished: () => void;

src/components/views/messages/MLocationBody.tsx

@@ -16,13 +16,11 @@ limitations under the License.
 
 import React from 'react';
 import maplibregl from 'maplibre-gl';
-import { logger } from "matrix-js-sdk/src/logger";
 import { MatrixEvent } from 'matrix-js-sdk/src/models/event';
 import {
     M_ASSET,
     LocationAssetType,
     ILocationContent,
-    M_LOCATION,
 } from 'matrix-js-sdk/src/@types/location';
 import { ClientEvent, IClientWellKnown } from 'matrix-js-sdk/src/client';
 
@@ -31,14 +29,19 @@ import { IBodyProps } from "./IBodyProps";
 import { _t } from '../../../languageHandler';
 import MemberAvatar from '../avatars/MemberAvatar';
 import Modal from '../../../Modal';
+import {
+    parseGeoUri,
+    locationEventGeoUri,
+    createMap,
+    getLocationShareErrorMessage,
+    LocationShareError,
+} from '../../../utils/location';
 import LocationViewDialog from '../location/LocationViewDialog';
 import TooltipTarget from '../elements/TooltipTarget';
 import { Alignment } from '../elements/Tooltip';
 import AccessibleButton from '../elements/AccessibleButton';
 import { tileServerFromWellKnown } from '../../../utils/WellKnownUtils';
 import MatrixClientContext from '../../../contexts/MatrixClientContext';
-import { findMapStyleUrl } from '../location/findMapStyleUrl';
-import { getLocationShareErrorMessage, LocationShareError } from '../location/LocationShareErrors';
 
 interface IState {
     error: Error;
@@ -238,114 +241,3 @@ function ZoomButtons(props: IZoomButtonsProps): React.ReactElement<HTMLDivElemen
     </div>;
 }
 
-export function createMap(
-    coords: GeolocationCoordinates,
-    interactive: boolean,
-    bodyId: string,
-    markerId: string,
-    onError: (error: Error) => void,
-): maplibregl.Map {
-    try {
-        const styleUrl = findMapStyleUrl();
-        const coordinates = new maplibregl.LngLat(coords.longitude, coords.latitude);
-
-        const map = new maplibregl.Map({
-            container: bodyId,
-            style: styleUrl,
-            center: coordinates,
-            zoom: 15,
-            interactive,
-        });
-
-        new maplibregl.Marker({
-            element: document.getElementById(markerId),
-            anchor: 'bottom',
-            offset: [0, -1],
-        })
-            .setLngLat(coordinates)
-            .addTo(map);
-
-        map.on('error', (e) => {
-            logger.error(
-                "Failed to load map: check map_style_url in config.json has a "
-                + "valid URL and API key",
-                e.error,
-            );
-            onError(new Error(LocationShareError.MapStyleUrlNotReachable));
-        });
-
-        return map;
-    } catch (e) {
-        logger.error("Failed to render map", e);
-        onError(e);
-    }
-}
-
-/**
- * Find the geo-URI contained within a location event.
- */
-export function locationEventGeoUri(mxEvent: MatrixEvent): string {
-    // unfortunately we're stuck supporting legacy `content.geo_uri`
-    // events until the end of days, or until we figure out mutable
-    // events - so folks can read their old chat history correctly.
-    // https://github.com/matrix-org/matrix-doc/issues/3516
-    const content = mxEvent.getContent();
-    const loc = M_LOCATION.findIn(content) as { uri?: string };
-    return loc ? loc.uri : content['geo_uri'];
-}
-
-export function parseGeoUri(uri: string): GeolocationCoordinates {
-    function parse(s: string): number {
-        const ret = parseFloat(s);
-        if (Number.isNaN(ret)) {
-            return undefined;
-        } else {
-            return ret;
-        }
-    }
-
-    const m = uri.match(/^\s*geo:(.*?)\s*$/);
-    if (!m) return;
-    const parts = m[1].split(';');
-    const coords = parts[0].split(',');
-    let uncertainty: number;
-    for (const param of parts.slice(1)) {
-        const m = param.match(/u=(.*)/);
-        if (m) uncertainty = parse(m[1]);
-    }
-    return {
-        latitude: parse(coords[0]),
-        longitude: parse(coords[1]),
-        altitude: parse(coords[2]),
-        accuracy: uncertainty,
-        altitudeAccuracy: undefined,
-        heading: undefined,
-        speed: undefined,
-    };
-}
-
-function makeLink(coords: GeolocationCoordinates): string {
-    return (
-        "https://www.openstreetmap.org/" +
-        `?mlat=${coords.latitude}` +
-        `&mlon=${coords.longitude}` +
-        `#map=16/${coords.latitude}/${coords.longitude}`
-    );
-}
-
-export function createMapSiteLink(event: MatrixEvent): string {
-    const content: Object = event.getContent();
-    const mLocation = content[M_LOCATION.name];
-    if (mLocation !== undefined) {
-        const uri = mLocation["uri"];
-        if (uri !== undefined) {
-            return makeLink(parseGeoUri(uri));
-        }
-    } else {
-        const geoUri = content["geo_uri"];
-        if (geoUri) {
-            return makeLink(parseGeoUri(geoUri));
-        }
-    }
-    return null;
-}

src/i18n/strings/en_EN.json

@@ -734,6 +734,8 @@
     "Invite to %(spaceName)s": "Invite to %(spaceName)s",
     "Share your public space": "Share your public space",
     "Unknown App": "Unknown App",
+    "This homeserver is not configured to display maps.": "This homeserver is not configured to display maps.",
+    "This homeserver is not configured correctly to display maps, or the configured map server may be unreachable.": "This homeserver is not configured correctly to display maps, or the configured map server may be unreachable.",
     "Are you sure you want to exit during this export?": "Are you sure you want to exit during this export?",
     "Generating a ZIP": "Generating a ZIP",
     "Fetched %(count)s events out of %(total)s|other": "Fetched %(count)s events out of %(total)s",
@@ -2144,8 +2146,6 @@
     "Failed to fetch your location. Please try again later.": "Failed to fetch your location. Please try again later.",
     "Timed out trying to fetch your location. Please try again later.": "Timed out trying to fetch your location. Please try again later.",
     "Unknown error fetching location. Please try again later.": "Unknown error fetching location. Please try again later.",
-    "This homeserver is not configured to display maps.": "This homeserver is not configured to display maps.",
-    "This homeserver is not configured correctly to display maps, or the configured map server may be unreachable.": "This homeserver is not configured correctly to display maps, or the configured map server may be unreachable.",
     "We couldn't send your location": "We couldn't send your location",
     "%(brand)s could not send your location. Please try again later.": "%(brand)s could not send your location. Please try again later.",
     "%(displayName)s's live location": "%(displayName)s's live location",

src/components/views/location/LocationShareErrors.ts → src/utils/location/LocationShareErrors.ts

@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import { _t } from "../../../languageHandler";
+import { _t } from "../../languageHandler";
 
 export enum LocationShareError {
     MapStyleUrlNotConfigured = 'MapStyleUrlNotConfigured',

src/components/views/location/findMapStyleUrl.ts → src/utils/location/findMapStyleUrl.ts

@@ -16,8 +16,8 @@ limitations under the License.
 
 import { logger } from "matrix-js-sdk/src/logger";
 
-import SdkConfig from "../../../SdkConfig";
-import { getTileServerWellKnown } from "../../../utils/WellKnownUtils";
+import SdkConfig from "../../SdkConfig";
+import { getTileServerWellKnown } from "../WellKnownUtils";
 import { LocationShareError } from "./LocationShareErrors";
 
 /**

src/utils/location/index.ts

@@ -0,0 +1,21 @@
+/*
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+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.
+*/
+
+export * from './findMapStyleUrl';
+export * from './locationEventGeoUri';
+export * from './LocationShareErrors';
+export * from './map';
+export * from './parseGeoUri';

src/utils/location/locationEventGeoUri.ts

@@ -0,0 +1,31 @@
+/*
+Copyright 2022 The Matrix.org Foundation C.I.C.
+
+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 { MatrixEvent } from "matrix-js-sdk/src/matrix";
+import { M_LOCATION } from "matrix-js-sdk/src/@types/location";
+
+/**
+ * Find the geo-URI contained within a location event.
+ */
+export const locationEventGeoUri = (mxEvent: MatrixEvent): string => {
+    // unfortunately we're stuck supporting legacy `content.geo_uri`
+    // events until the end of days, or until we figure out mutable
+    // events - so folks can read their old chat history correctly.
+    // https://github.com/matrix-org/matrix-doc/issues/3516
+    const content = mxEvent.getContent();
+    const loc = M_LOCATION.findIn(content) as { uri?: string };
+    return loc ? loc.uri : content['geo_uri'];
+};