aboutsummaryrefslogtreecommitdiff
path: root/modern/src/map/StatusView.js
diff options
context:
space:
mode:
Diffstat (limited to 'modern/src/map/StatusView.js')
-rw-r--r--modern/src/map/StatusView.js65
1 files changed, 53 insertions, 12 deletions
diff --git a/modern/src/map/StatusView.js b/modern/src/map/StatusView.js
index ae049af1..20e5b749 100644
--- a/modern/src/map/StatusView.js
+++ b/modern/src/map/StatusView.js
@@ -1,27 +1,68 @@
-import t from '../common/localization'
import React from 'react';
import { useSelector } from 'react-redux';
+import t from '../common/localization';
import { formatPosition } from '../common/formatter';
const StatusView = ({ deviceId, onShowDetails }) => {
- const device = useSelector(state => state.devices.items[deviceId]);
- const position = useSelector(state => state.positions.items[deviceId]);
+ const device = useSelector((state) => state.devices.items[deviceId]);
+ const position = useSelector((state) => state.positions.items[deviceId]);
- const handleClick = e => {
+ const handleClick = (e) => {
e.preventDefault();
onShowDetails(position.id);
};
return (
<>
- <b>{t('deviceStatus')}:</b> {formatPosition(device.status, 'status')}<br />
- <b>{t('sharedLocation')}:</b> {formatPosition(position, 'latitude')} {formatPosition(position, 'longitude')}<br />
- <b>{t('positionSpeed')}:</b> {formatPosition(position.speed, 'speed')}<br />
- <b>{t('positionCourse')}:</b> {formatPosition(position.course, 'course')}<br />
- <b>{t('positionDistance')}:</b> {formatPosition(position.attributes.totalDistance, 'distance')}<br />
- {position.attributes.batteryLevel &&
- <><b>{t('positionBattery')}:</b> {formatPosition(position.attributes.batteryLevel, 'batteryLevel')}<br /></>
- }
+ <b>
+ {t('deviceStatus')}
+ :
+ </b>
+ {' '}
+ {formatPosition(device.status, 'status')}
+ <br />
+ <b>
+ {t('sharedLocation')}
+ :
+ </b>
+ {' '}
+ {formatPosition(position, 'latitude')}
+ {' '}
+ {formatPosition(position, 'longitude')}
+ <br />
+ <b>
+ {t('positionSpeed')}
+ :
+ </b>
+ {' '}
+ {formatPosition(position.speed, 'speed')}
+ <br />
+ <b>
+ {t('positionCourse')}
+ :
+ </b>
+ {' '}
+ {formatPosition(position.course, 'course')}
+ <br />
+ <b>
+ {t('positionDistance')}
+ :
+ </b>
+ {' '}
+ {formatPosition(position.attributes.totalDistance, 'distance')}
+ <br />
+ {position.attributes.batteryLevel
+ && (
+ <>
+ <b>
+ {t('positionBattery')}
+ :
+ </b>
+ {' '}
+ {formatPosition(position.attributes.batteryLevel, 'batteryLevel')}
+ <br />
+ </>
+ )}
<a href="/" onClick={handleClick}>{t('sharedShowDetails')}</a>
</>
);