Use new tooltip in MLocationBody.tsx

src/components/views/messages/MLocationBody.tsx

@@ -17,6 +17,7 @@ limitations under the License.
 import React from "react";
 import { MatrixEvent, ClientEvent, ClientEventHandlerMap } from "matrix-js-sdk/src/matrix";
 import { randomString } from "matrix-js-sdk/src/randomstring";
+import { Tooltip } from "@vector-im/compound-web";
 
 import { _t } from "../../../languageHandler";
 import Modal from "../../../Modal";
@@ -27,8 +28,6 @@ import {
     isSelfLocation,
 } from "../../../utils/location";
 import MatrixClientContext from "../../../contexts/MatrixClientContext";
-import TooltipTarget from "../elements/TooltipTarget";
-import { Alignment } from "../elements/Tooltip";
 import { SmartMarker, Map, LocationViewDialog } from "../location";
 import { IBodyProps } from "./IBodyProps";
 import { createReconnectedListener } from "../../../utils/connection";
@@ -126,7 +125,7 @@ export const LocationBodyFallbackContent: React.FC<{ event: MatrixEvent; error:
 interface LocationBodyContentProps {
     mxEvent: MatrixEvent;
     mapId: string;
-    tooltip?: string;
+    tooltip: string;
     onError: (error: Error) => void;
     onClick?: () => void;
 }
@@ -156,13 +155,9 @@ export const LocationBodyContent: React.FC<LocationBodyContentProps> = ({
 
     return (
         <div className="mx_MLocationBody">
-            {tooltip ? (
-                <TooltipTarget label={tooltip} alignment={Alignment.InnerBottom} maxParentWidth={450}>
-                    {mapElement}
-                </TooltipTarget>
-            ) : (
-                mapElement
-            )}
+            <Tooltip label={tooltip}>
+                <div className="mx_MLocationBody_map">{mapElement}</div>
+            </Tooltip>
         </div>
     );
 };

test/components/views/messages/__snapshots__/MLocationBody-test.tsx.snap

@@ -34,8 +34,7 @@ exports[`MLocationBody <MLocationBody> without error renders map correctly 1`] =
     class="mx_MLocationBody"
   >
     <div
-      aria-describedby="mx_TooltipTarget_9K38QgU2"
-      tabindex="0"
+      class="mx_MLocationBody_map"
     >
       <div
         class="mx_Map mx_MLocationBody_map"
@@ -67,8 +66,7 @@ exports[`MLocationBody <MLocationBody> without error renders marker correctly fo
     class="mx_MLocationBody"
   >
     <div
-      aria-describedby="mx_TooltipTarget_9K38QgU2"
-      tabindex="0"
+      class="mx_MLocationBody_map"
     >
       <div
         class="mx_Map mx_MLocationBody_map"