84 lines
2.2 KiB
JavaScript
84 lines
2.2 KiB
JavaScript
|
import React, { memo, useState, useEffect } from 'react';
|
||
|
import {
|
||
|
View, Text, StyleSheet, Switch
|
||
|
} from 'react-native';
|
||
|
import PropTypes from 'prop-types';
|
||
|
|
||
|
import Touch from '../../../utils/touch';
|
||
|
import { CustomIcon } from '../../../lib/Icons';
|
||
|
import I18n from '../../../i18n';
|
||
|
import styles from '../styles';
|
||
|
import { themes, SWITCH_TRACK_COLOR } from '../../../constants/colors';
|
||
|
import { withTheme } from '../../../theme';
|
||
|
import UnreadBadge from '../../../presentation/UnreadBadge';
|
||
|
import RocketChat from '../../../lib/rocketchat';
|
||
|
|
||
|
const OmnichannelStatus = memo(({
|
||
|
searching, goQueue, theme, queueSize, inquiryEnabled, user
|
||
|
}) => {
|
||
|
if (searching > 0 || !(RocketChat.isOmnichannelModuleAvailable() && user?.roles?.includes('livechat-agent'))) {
|
||
|
return null;
|
||
|
}
|
||
|
const [status, setStatus] = useState(user?.statusLivechat === 'available');
|
||
|
|
||
|
useEffect(() => {
|
||
|
setStatus(user.statusLivechat === 'available');
|
||
|
}, [user.statusLivechat]);
|
||
|
|
||
|
const toggleLivechat = async() => {
|
||
|
try {
|
||
|
setStatus(v => !v);
|
||
|
await RocketChat.changeLivechatStatus();
|
||
|
} catch {
|
||
|
setStatus(v => !v);
|
||
|
}
|
||
|
};
|
||
|
|
||
|
return (
|
||
|
<Touch
|
||
|
onPress={goQueue}
|
||
|
theme={theme}
|
||
|
style={{ backgroundColor: themes[theme].headerSecondaryBackground }}
|
||
|
>
|
||
|
<View
|
||
|
style={[
|
||
|
styles.dropdownContainerHeader,
|
||
|
{ borderBottomWidth: StyleSheet.hairlineWidth, borderColor: themes[theme].separatorColor }
|
||
|
]}
|
||
|
>
|
||
|
<CustomIcon style={[styles.queueIcon, { color: themes[theme].auxiliaryText }]} size={22} name='omnichannel' />
|
||
|
<Text style={[styles.queueToggleText, { color: themes[theme].auxiliaryText }]}>{I18n.t('Omnichannel')}</Text>
|
||
|
{inquiryEnabled
|
||
|
? (
|
||
|
<UnreadBadge
|
||
|
style={styles.queueIcon}
|
||
|
unread={queueSize}
|
||
|
theme={theme}
|
||
|
/>
|
||
|
)
|
||
|
: null}
|
||
|
<Switch
|
||
|
style={styles.omnichannelToggle}
|
||
|
value={status}
|
||
|
trackColor={SWITCH_TRACK_COLOR}
|
||
|
onValueChange={toggleLivechat}
|
||
|
/>
|
||
|
</View>
|
||
|
</Touch>
|
||
|
);
|
||
|
});
|
||
|
|
||
|
OmnichannelStatus.propTypes = {
|
||
|
searching: PropTypes.bool,
|
||
|
goQueue: PropTypes.func,
|
||
|
queueSize: PropTypes.number,
|
||
|
inquiryEnabled: PropTypes.bool,
|
||
|
theme: PropTypes.string,
|
||
|
user: PropTypes.shape({
|
||
|
roles: PropTypes.array,
|
||
|
statusLivechat: PropTypes.string
|
||
|
})
|
||
|
};
|
||
|
|
||
|
export default withTheme(OmnichannelStatus);
|