Rocket.Chat.ReactNative/app/views/PushTroubleshootView/components/CommunityEditionPushQuota.tsx

57 lines
1.8 KiB
TypeScript

import React from 'react';
import { Alert, StyleSheet, Text } from 'react-native';
import * as List from '../../../containers/List';
import i18n from '../../../i18n';
import { useAppSelector } from '../../../lib/hooks';
import { useTheme } from '../../../theme';
import sharedStyles from '../../Styles';
const WARNING_MINIMUM_VALUE = 70;
const WARNING_MAXIMUM_VALUE = 90;
export default function CommunityEditionPushQuota(): React.ReactElement | null {
const { colors } = useTheme();
const { consumptionPercentage, isCommunityEdition } = useAppSelector(state => ({
isCommunityEdition: state.troubleshootingNotification.isCommunityEdition,
consumptionPercentage: state.troubleshootingNotification.consumptionPercentage
}));
if (!isCommunityEdition) return null;
const percentage = `${Math.floor(consumptionPercentage)}%`;
let percentageColor = colors.statusFontSuccess;
if (consumptionPercentage > WARNING_MINIMUM_VALUE && consumptionPercentage < WARNING_MAXIMUM_VALUE) {
percentageColor = colors.statusFontWarning;
}
if (consumptionPercentage >= WARNING_MAXIMUM_VALUE) {
percentageColor = colors.statusFontDanger;
}
const alertWorkspaceConsumption = () => {
Alert.alert(i18n.t('Push_consumption_alert_title'), i18n.t('Push_consumption_alert_description'));
};
return (
<List.Section title='Community_edition_push_quota'>
<List.Separator />
<List.Item
title='Workspace_consumption'
testID='push-troubleshoot-view-workspace-consumption'
onPress={alertWorkspaceConsumption}
right={() => <Text style={[styles.pickerText, { color: percentageColor }]}>{percentage}</Text>}
/>
<List.Separator />
<List.Info info='Workspace_consumption_description' />
</List.Section>
);
}
const styles = StyleSheet.create({
pickerText: {
...sharedStyles.textRegular,
fontSize: 16
}
});