import React, { useState } from 'react';
import MainToolbar from '../MainToolbar';
import { TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton } from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
import t from '../common/localization';
import { useEffectAsync } from '../reactHelper';
import EditCollectionView from '../EditCollectionView';
import positionAttributes from '../attributes/positionAttributes';
import { formatDistance, formatSpeed } from '../common/formatter';
import { useAttributePreference } from '../common/preferences';
const useStyles = makeStyles(theme => ({
columnAction: {
width: theme.spacing(1),
padding: theme.spacing(0, 1),
},
}));
const MaintenancesView = ({ updateTimestamp, onMenuClick }) => {
const classes = useStyles();
const [items, setItems] = useState([]);
const speedUnit = useAttributePreference('speedUnit');
const distanceUnit = useAttributePreference('distanceUnit');
useEffectAsync(async () => {
const response = await fetch('/api/maintenance');
if (response.ok) {
setItems(await response.json());
}
}, [updateTimestamp]);
const convertAttribute = (key, value) => {
const attribute = positionAttributes[key];
if (attribute && attribute.dataType) {
switch (attribute.dataType) {
case 'speed':
return formatSpeed(value, speedUnit);
case 'distance':
return formatDistance(value, distanceUnit);
default:
return value;
}
}
return value;
}
return (
{t('sharedName')}
{t('sharedType')}
{t('maintenanceStart')}
{t('maintenancePeriod')}
{items.map(item => (
onMenuClick(event.currentTarget, item.id)}>
{item.name}
{item.type}
{convertAttribute(item.type, item.start)}
{convertAttribute(item.type, item.period)}
))}
);
}
const MaintenacesPage = () => {
return (
<>
>
);
}
export default MaintenacesPage;