2020-03-07 11:49:32 +01:00
|
|
|
import * as React from 'react';
|
2020-03-09 22:02:09 +01:00
|
|
|
import {Badge, IconButton, withTheme} from 'react-native-paper';
|
2020-03-07 11:49:32 +01:00
|
|
|
import {View} from "react-native";
|
|
|
|
|
2020-03-29 14:46:44 +02:00
|
|
|
/**
|
|
|
|
* Component used to render a small dashboard item
|
|
|
|
*
|
|
|
|
* @param props Props to pass to the component
|
|
|
|
* @return {*}
|
|
|
|
*/
|
2020-04-04 13:52:16 +02:00
|
|
|
function SmallDashboardItem(props) {
|
2020-03-09 22:02:09 +01:00
|
|
|
const {colors} = props.theme;
|
2020-03-07 11:49:32 +01:00
|
|
|
return (
|
2020-03-09 22:02:09 +01:00
|
|
|
<View>
|
|
|
|
<IconButton
|
|
|
|
icon={props.icon}
|
|
|
|
color={
|
2020-03-29 14:46:44 +02:00
|
|
|
props.isAvailable
|
|
|
|
? props.color
|
|
|
|
: colors.textDisabled
|
2020-03-09 22:02:09 +01:00
|
|
|
}
|
|
|
|
size={35}
|
|
|
|
onPress={props.clickAction}
|
|
|
|
/>
|
|
|
|
{
|
|
|
|
props.badgeNumber > 0 ?
|
|
|
|
<Badge
|
|
|
|
style={{
|
|
|
|
position: 'absolute',
|
|
|
|
top: 5,
|
|
|
|
right: 5
|
2020-03-29 14:46:44 +02:00
|
|
|
}}>
|
|
|
|
{props.badgeNumber}
|
|
|
|
</Badge> : null
|
2020-03-09 22:02:09 +01:00
|
|
|
}
|
|
|
|
</View>
|
2020-03-07 11:49:32 +01:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2020-04-04 13:52:16 +02:00
|
|
|
export default withTheme(SmallDashboardItem);
|