Live location sharing: beacon list view tiles (#8363)
* add basic sidebar container Signed-off-by: Kerry Archibald <kerrya@element.io> * optionally show icon in beaconstatus Signed-off-by: Kerry Archibald <kerrya@element.io> * add avatar and style list item Signed-off-by: Kerry Archibald <kerrya@element.io> * formatted last update time Signed-off-by: Kerry Archibald <kerrya@element.io> * test beacon list item Signed-off-by: Kerry Archibald <kerrya@element.io> * move makeRoomWithState events to test utils Signed-off-by: Kerry Archibald <kerrya@element.io> * move beacon test helpers into utils Signed-off-by: Kerry Archibald <kerrya@element.io> * newline Signed-off-by: Kerry Archibald <kerrya@element.io> * add copyable text to beacon list item Signed-off-by: Kerry Archibald <kerrya@element.io> * add copyable geo uri to list item Signed-off-by: Kerry Archibald <kerrya@element.io> * improve spacing Signed-off-by: Kerry Archibald <kerrya@element.io> * overflow scroll on list Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
parent
2f6b76755c
commit
4a38cbd550
18 changed files with 355 additions and 10 deletions
|
@ -28,6 +28,7 @@ import { formatTime } from '../../../DateUtils';
|
|||
interface Props {
|
||||
displayStatus: BeaconDisplayStatus;
|
||||
displayLiveTimeRemaining?: boolean;
|
||||
withIcon?: boolean;
|
||||
beacon?: Beacon;
|
||||
label?: string;
|
||||
}
|
||||
|
@ -45,6 +46,7 @@ const BeaconStatus: React.FC<Props & HTMLProps<HTMLDivElement>> =
|
|||
label,
|
||||
className,
|
||||
children,
|
||||
withIcon,
|
||||
...rest
|
||||
}) => {
|
||||
const isIdle = displayStatus === BeaconDisplayStatus.Loading ||
|
||||
|
@ -54,11 +56,11 @@ const BeaconStatus: React.FC<Props & HTMLProps<HTMLDivElement>> =
|
|||
{...rest}
|
||||
className={classNames('mx_BeaconStatus', `mx_BeaconStatus_${displayStatus}`, className)}
|
||||
>
|
||||
<StyledLiveBeaconIcon
|
||||
{ withIcon && <StyledLiveBeaconIcon
|
||||
className='mx_BeaconStatus_icon'
|
||||
withError={displayStatus === BeaconDisplayStatus.Error}
|
||||
isIdle={isIdle}
|
||||
/>
|
||||
/> }
|
||||
<div className='mx_BeaconStatus_description'>
|
||||
|
||||
{ displayStatus === BeaconDisplayStatus.Loading && <span>{ _t('Loading live location...') }</span> }
|
||||
|
@ -68,7 +70,7 @@ const BeaconStatus: React.FC<Props & HTMLProps<HTMLDivElement>> =
|
|||
|
||||
{ displayStatus === BeaconDisplayStatus.Active && beacon && <>
|
||||
<>
|
||||
{ label }
|
||||
<span className='mx_BeaconStatus_label'>{ label }</span>
|
||||
{ displayLiveTimeRemaining ?
|
||||
<LiveTimeRemaining beacon={beacon} /> :
|
||||
<BeaconExpiryTime beacon={beacon} />
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue