imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Live location sharing: set map bounds to include all locations (#8324)

Browse source 
* open a dialog with map centered around first beacon

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

* test dialog opening from beacon body

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

* test beaconmarker

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

* add bounds to Map comp

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

* add focusBeacon to beaconviewdialog, use bounds

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

* lint

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

* use membercolor on beacon view markers

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

* add lnglatbounds to maplibre mock

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

* update snapshots for expanded maplibre Map mock

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

* test map bounds

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

* tidy copy paste comment

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

* add fallback when no more live locations

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

* accurate signature for getBoundsCenter

Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
Kerry 2022-04-19 13:35:39 +02:00 • committed by GitHub
parent 6b13988eaa
commit f70186ea9b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 246 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

34
test/components/views/beacon/BeaconViewDialog-test.tsx
View file

@ -26,6 +26,7 @@ import {
import BeaconViewDialog from '../../../../src/components/views/beacon/BeaconViewDialog';
import {
findByTestId,
getMockClientWithEventEmitter,
makeBeaconEvent,
makeBeaconInfoEvent,
@ -118,4 +119,37 @@ describe('<BeaconViewDialog />', () => {
// two markers now!
expect(component.find('BeaconMarker').length).toEqual(2);
});
it('renders a fallback when no live beacons remain', () => {
const onFinished = jest.fn();
const room = makeRoomWithStateEvents([defaultEvent]);
const beacon = room.currentState.beacons.get(getBeaconInfoIdentifier(defaultEvent));
beacon.addLocations([location1]);
const component = getComponent({ onFinished });
expect(component.find('BeaconMarker').length).toEqual(1);
// this will replace the defaultEvent
// leading to no more live beacons
const anotherBeaconEvent = makeBeaconInfoEvent(aliceId,
roomId,
{ isLive: false },
'$bob-room1-1',
);
act(() => {
// emits RoomStateEvent.BeaconLiveness
room.currentState.setStateEvents([anotherBeaconEvent]);
});
component.setProps({});
// map placeholder
expect(findByTestId(component, 'beacon-view-dialog-map-fallback')).toMatchSnapshot();
act(() => {
findByTestId(component, 'beacon-view-dialog-fallback-close').at(0).simulate('click');
});
expect(onFinished).toHaveBeenCalled();
});
});

6
test/components/views/beacon/__snapshots__/BeaconMarker-test.tsx.snap
View file

@ -61,6 +61,7 @@ exports[`<BeaconMarker /> renders marker when beacon has location 1`] = `
"_eventsCount": 0,
"_maxListeners": undefined,
"addControl": [MockFunction],
"fitBounds": [MockFunction],
"removeControl": [MockFunction],
"setCenter": [MockFunction],
"setStyle": [MockFunction],
@ -79,6 +80,7 @@ exports[`<BeaconMarker /> renders marker when beacon has location 1`] = `
"_eventsCount": 0,
"_maxListeners": undefined,
"addControl": [MockFunction],
"fitBounds": [MockFunction],
"removeControl": [MockFunction],
"setCenter": [MockFunction],
"setStyle": [MockFunction],
@ -111,6 +113,7 @@ exports[`<BeaconMarker /> renders marker when beacon has location 1`] = `
Symbol(kCapture): false,
}
}
useMemberColor={true}
>
<span>
<ForwardRef
@ -139,9 +142,10 @@ exports[`<BeaconMarker /> renders marker when beacon has location 1`] = `
Symbol(kCapture): false,
}
}
useMemberColor={true}
>
<div
className="mx_Marker mx_Marker_defaultColor"
className="mx_Marker mx_Username_color4"
id="!room:server_@alice:server"
>
<div

37
test/components/views/beacon/__snapshots__/BeaconViewDialog-test.tsx.snap Normal file
View file

@ -0,0 +1,37 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<BeaconViewDialog /> renders a fallback when no live beacons remain 1`] = `
<div
className="mx_BeaconViewDialog_map mx_BeaconViewDialog_mapFallback"
data-test-id="beacon-view-dialog-map-fallback"
>
<div
className="mx_BeaconViewDialog_mapFallbackIcon"
/>
<span
className="mx_BeaconViewDialog_mapFallbackMessage"
>
No live locations
</span>
<AccessibleButton
data-test-id="beacon-view-dialog-fallback-close"
element="div"
kind="primary"
onClick={[MockFunction]}
role="button"
tabIndex={0}
>
<div
className="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
data-test-id="beacon-view-dialog-fallback-close"
onClick={[MockFunction]}
onKeyDown={[Function]}
onKeyUp={[Function]}
role="button"
tabIndex={0}
>
Close
</div>
</AccessibleButton>
</div>
`;