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

Live location sharing: allow retry when stop sharing fails (#8193)

Browse source 
* allow retry when stop sharing fails

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

* tidy

Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
Kerry 2022-03-30 14:31:19 +02:00 • committed by GitHub
parent be8665af4d
commit e721c6b0c2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 68 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

23
src/components/views/beacon/RoomLiveShareWarning.tsx
View file

@ -73,9 +73,11 @@ type LiveBeaconsState = {
beacon?: Beacon;
onStopSharing?: () => void;
stoppingInProgress?: boolean;
hasStopSharingError?: boolean;
};
const useLiveBeacons = (roomId: Room['roomId']): LiveBeaconsState => {
const [stoppingInProgress, setStoppingInProgress] = useState(false);
const [error, setError] = useState<Error>();
// do we have an active geolocation.watchPosition
const isMonitoringLiveLocation = useEventEmitterState(
@ -93,6 +95,7 @@ const useLiveBeacons = (roomId: Room['roomId']): LiveBeaconsState => {
// reset stopping in progress on change in live ids
useEffect(() => {
setStoppingInProgress(false);
setError(undefined);
}, [liveBeaconIds]);
if (!isMonitoringLiveLocation || !liveBeaconIds?.length) {
@ -112,11 +115,12 @@ const useLiveBeacons = (roomId: Room['roomId']): LiveBeaconsState => {
// only clear loading in case of error
// to avoid flash of not-loading state
// after beacons have been stopped but we wait for sync
setError(error);
setStoppingInProgress(false);
}
};
return { onStopSharing, beacon, stoppingInProgress };
return { onStopSharing, beacon, stoppingInProgress, hasStopSharingError: !!error };
};
const LiveTimeRemaining: React.FC<{ beacon: Beacon }> = ({ beacon }) => {
@ -136,6 +140,7 @@ const RoomLiveShareWarning: React.FC<Props> = ({ roomId }) => {
onStopSharing,
beacon,
stoppingInProgress,
hasStopSharingError,
} = useLiveBeacons(roomId);
if (!beacon) {
@ -145,15 +150,19 @@ const RoomLiveShareWarning: React.FC<Props> = ({ roomId }) => {
return <div
className={classNames('mx_RoomLiveShareWarning')}
>
<StyledLiveBeaconIcon className="mx_RoomLiveShareWarning_icon" />
<StyledLiveBeaconIcon className="mx_RoomLiveShareWarning_icon" withError={hasStopSharingError} />
<span className="mx_RoomLiveShareWarning_label">
{ _t('You are sharing your live location') }
{ hasStopSharingError ?
_t('An error occurred while stopping your live location, please try again') :
_t('You are sharing your live location')
}
</span>
{ stoppingInProgress ?
<span className='mx_RoomLiveShareWarning_spinner'><Spinner h={16} w={16} /></span> :
<LiveTimeRemaining beacon={beacon} />
{ stoppingInProgress &&
<span className='mx_RoomLiveShareWarning_spinner'><Spinner h={16} w={16} /></span>
}
{ !stoppingInProgress && !hasStopSharingError && <LiveTimeRemaining beacon={beacon} /> }
<AccessibleButton
data-test-id='room-live-share-stop-sharing'
onClick={onStopSharing}
@ -161,7 +170,7 @@ const RoomLiveShareWarning: React.FC<Props> = ({ roomId }) => {
element='button'
disabled={stoppingInProgress}
>
{ _t('Stop sharing') }
{ hasStopSharingError ? _t('Retry') : _t('Stop sharing') }
</AccessibleButton>
</div>;
};

8
src/components/views/beacon/StyledLiveBeaconIcon.tsx
View file

@ -19,10 +19,14 @@ import classNames from 'classnames';
import { Icon as LiveLocationIcon } from '../../../../res/img/location/live-location.svg';
const StyledLiveBeaconIcon: React.FC<React.SVGProps<SVGSVGElement>> = ({ className, ...props }) =>
interface Props extends React.SVGProps<SVGSVGElement> {
// use error styling when true
withError?: boolean;
}
const StyledLiveBeaconIcon: React.FC<Props> = ({ className, withError, ...props }) =>
<LiveLocationIcon
{...props}
className={classNames('mx_StyledLiveBeaconIcon', className)}
className={classNames('mx_StyledLiveBeaconIcon', className, { 'mx_StyledLiveBeaconIcon_error': withError })}
/>;
export default StyledLiveBeaconIcon;