Live location share - beacon tooltip in maximised view (#8572) PSF-926

* pass optional tooltip prop down through markers

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add beaconstatustooltip, handle overflow on beacon status label

Signed-off-by: Kerry Archibald <kerrya@element.io>

* remove debug, fix mouseout

Signed-off-by: Kerry Archibald <kerrya@element.io>

* tidy comments

Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
Kerry 2022-05-13 10:30:53 +02:00 committed by GitHub
parent fdd5494402
commit fbbb9c27ba
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 271 additions and 118 deletions

View file

@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React, { useCallback, useEffect, useState } from 'react';
import React, { ReactNode, useCallback, useEffect, useState } from 'react';
import maplibregl from 'maplibre-gl';
import { RoomMember } from 'matrix-js-sdk/src/matrix';
@ -64,12 +64,13 @@ interface SmartMarkerProps {
roomMember?: RoomMember;
// use member text color as background
useMemberColor?: boolean;
tooltip?: ReactNode;
}
/**
* Generic location marker
*/
const SmartMarker: React.FC<SmartMarkerProps> = ({ id, map, geoUri, roomMember, useMemberColor }) => {
const SmartMarker: React.FC<SmartMarkerProps> = ({ id, map, geoUri, roomMember, useMemberColor, tooltip }) => {
const { onElementRef } = useMapMarker(map, geoUri);
return (
@ -84,6 +85,7 @@ const SmartMarker: React.FC<SmartMarkerProps> = ({ id, map, geoUri, roomMember,
id={id}
roomMember={roomMember}
useMemberColor={useMemberColor}
tooltip={tooltip}
/>
</span>
);