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

Live location sharing - render users own beacons in timeline (#8296)

Browse source 
* extract location markers into generic Marker

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

* wrap marker in smartmarker

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

* test smartmarker

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

* working map in location body

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

* remove skinned sdk

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

* use new ZoomButtons in MLocationBody

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

* test LocationViewDialog

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

* update commentt

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

* lint

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

* lint

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

* extract livetimeremaining into own component

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

* extract more beacon state utils

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

* update tests for roomlivesharewarning

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

* add beacon map and status chin

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

* add handling for bubbles

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

* tests for BeaconBody

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

* move displaystatus check up to mbeaconbody

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

* test BeaconStatus

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

* rename BeaconStatusChin -> BeaconStatus

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

* make BeaconStatus generic

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

* lint

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

* adjust spinner size

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

* lint

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

* add static time remaining option to beacon status

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

* render time differently for own beacon

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

* use children to add actions to BeaconStatus

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

* add OwnBeaconStatus wrapper with stop button

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

* add error states for own beacon

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

* test OwnBeaconStatus

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

* move ownbeaconstatus to write dir

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

* improve button styling

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

* i18n

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

* lint

Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
Kerry 2022-04-14 14:41:28 +02:00 • committed by GitHub
parent 7a1a2c41d2
commit 1c215e2b71
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 443 additions and 117 deletions
Download patch file Download diff file Expand all files Collapse all files

53
src/components/views/beacon/BeaconStatus.tsx
View file

@ -20,20 +20,33 @@ import { Beacon } from 'matrix-js-sdk/src/matrix';
import StyledLiveBeaconIcon from './StyledLiveBeaconIcon';
import { _t } from '../../../languageHandler';
import AccessibleButton from '../elements/AccessibleButton';
import LiveTimeRemaining from './LiveTimeRemaining';
import { BeaconDisplayStatus } from './displayStatus';
import { getBeaconExpiryTimestamp } from '../../../utils/beacon';
import { formatTime } from '../../../DateUtils';
interface Props {
displayStatus: BeaconDisplayStatus;
displayLiveTimeRemaining?: boolean;
beacon?: Beacon;
label?: string;
// assumes permission to stop was checked by parent
stopBeacon?: () => void;
}
const BeaconExpiryTime: React.FC<{ beacon: Beacon }> = ({ beacon }) => {
const expiryTime = formatTime(new Date(getBeaconExpiryTimestamp(beacon)));
return <span className='mx_BeaconStatus_expiryTime'>{ _t('Live until %(expiryTime)s', { expiryTime }) }</span>;
};
const BeaconStatus: React.FC<Props & HTMLProps<HTMLDivElement>> =
({ beacon, displayStatus, label, stopBeacon, className, ...rest }) => {
({
beacon,
displayStatus,
displayLiveTimeRemaining,
label,
className,
children,
...rest
}) => {
const isIdle = displayStatus === BeaconDisplayStatus.Loading ||
displayStatus === BeaconDisplayStatus.Stopped;
@ -46,25 +59,25 @@ const BeaconStatus: React.FC<Props & HTMLProps<HTMLDivElement>> =
withError={displayStatus === BeaconDisplayStatus.Error}
isIdle={isIdle}
/>
{ displayStatus === BeaconDisplayStatus.Loading && <span>{ _t('Loading live location...') }</span> }
{ displayStatus === BeaconDisplayStatus.Stopped && <span>{ _t('Live location ended') }</span> }
<div className='mx_BeaconStatus_description'>
{ /* TODO error */ }
{ displayStatus === BeaconDisplayStatus.Loading && <span>{ _t('Loading live location...') }</span> }
{ displayStatus === BeaconDisplayStatus.Stopped && <span>{ _t('Live location ended') }</span> }
{ displayStatus === BeaconDisplayStatus.Active && beacon && <>
<div className='mx_BeaconStatus_activeDescription'>
{ label }
<LiveTimeRemaining beacon={beacon} />
</div>
{ stopBeacon && <AccessibleButton
data-test-id='beacon-status-stop-beacon'
kind='link'
onClick={stopBeacon}
className='mx_BeaconStatus_stopButton'
>{ _t('Stop') }</AccessibleButton>
{ displayStatus === BeaconDisplayStatus.Error && <span>{ _t('Live location error') }</span> }
{ displayStatus === BeaconDisplayStatus.Active && beacon && <>
<>
{ label }
{ displayLiveTimeRemaining ?
<LiveTimeRemaining beacon={beacon} /> :
<BeaconExpiryTime beacon={beacon} />
}
</>
</>
}
</>
}
</div>
{ children }
</div>;
};