Improve code-splitting of highlight.js and maplibre-gs libs (#12349)

* Dynamic import anything that touches maplibre-gs

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Dynamic import anything that touches highlight.js

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix types

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

src/utils/location/index.ts

@@ -18,6 +18,6 @@ export * from "./findMapStyleUrl";
 export * from "./isSelfLocation";
 export * from "./locationEventGeoUri";
 export * from "./LocationShareErrors";
-export * from "./map";
+export * from "./links";
 export * from "./parseGeoUri";
 export * from "./positionFailureMessage";

src/utils/location/links.ts

@@ -0,0 +1,47 @@
+/*
+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, M_LOCATION } from "matrix-js-sdk/src/matrix";
+
+import { parseGeoUri } from "./parseGeoUri";
+
+export const makeMapSiteLink = (coords: GeolocationCoordinates): string => {
+    return (
+        "https://www.openstreetmap.org/" +
+        `?mlat=${coords.latitude}` +
+        `&mlon=${coords.longitude}` +
+        `#map=16/${coords.latitude}/${coords.longitude}`
+    );
+};
+
+export const createMapSiteLinkFromEvent = (event: MatrixEvent): string | null => {
+    const content = event.getContent();
+    const mLocation = content[M_LOCATION.name];
+    if (mLocation !== undefined) {
+        const uri = mLocation["uri"];
+        if (uri !== undefined) {
+            const geoCoords = parseGeoUri(uri);
+            return geoCoords ? makeMapSiteLink(geoCoords) : null;
+        }
+    } else {
+        const geoUri = content["geo_uri"];
+        if (geoUri) {
+            const geoCoords = parseGeoUri(geoUri);
+            return geoCoords ? makeMapSiteLink(geoCoords) : null;
+        }
+    }
+    return null;
+};

src/utils/location/map.ts

@@ -15,11 +15,10 @@ limitations under the License.
 */
 
 import * as maplibregl from "maplibre-gl";
-import { MatrixClient, MatrixEvent, M_LOCATION } from "matrix-js-sdk/src/matrix";
+import { MatrixClient } from "matrix-js-sdk/src/matrix";
 import { logger } from "matrix-js-sdk/src/logger";
 
 import { _t } from "../../languageHandler";
-import { parseGeoUri } from "./parseGeoUri";
 import { findMapStyleUrl } from "./findMapStyleUrl";
 import { LocationShareError } from "./LocationShareErrors";
 
@@ -75,31 +74,3 @@ export const createMarker = (coords: GeolocationCoordinates, element: HTMLElemen
     }).setLngLat({ lon: coords.longitude, lat: coords.latitude });
     return marker;
 };
-
-export const makeMapSiteLink = (coords: GeolocationCoordinates): string => {
-    return (
-        "https://www.openstreetmap.org/" +
-        `?mlat=${coords.latitude}` +
-        `&mlon=${coords.longitude}` +
-        `#map=16/${coords.latitude}/${coords.longitude}`
-    );
-};
-
-export const createMapSiteLinkFromEvent = (event: MatrixEvent): string | null => {
-    const content = event.getContent();
-    const mLocation = content[M_LOCATION.name];
-    if (mLocation !== undefined) {
-        const uri = mLocation["uri"];
-        if (uri !== undefined) {
-            const geoCoords = parseGeoUri(uri);
-            return geoCoords ? makeMapSiteLink(geoCoords) : null;
-        }
-    } else {
-        const geoUri = content["geo_uri"];
-        if (geoUri) {
-            const geoCoords = parseGeoUri(geoUri);
-            return geoCoords ? makeMapSiteLink(geoCoords) : null;
-        }
-    }
-    return null;
-};

src/utils/location/useMap.ts

@@ -15,8 +15,8 @@ limitations under the License.
 */
 
 import { useEffect, useState } from "react";
-import { Map as MapLibreMap } from "maplibre-gl";
 
+import type { Map as MapLibreMap } from "maplibre-gl";
 import { createMap } from "./map";
 import { useMatrixClientContext } from "../../contexts/MatrixClientContext";