Files
jitsi-meet/react/features/visitors/components/web/VisitorsCountLabel.tsx
Дамян Минков f0fc63f573 feat(visitors): Handles live conference and queue service. (#14869)
* feat(visitors): Handling of live conference and queue service.

* squash: Small refactor mobile code.

* squash: Drop debug log.

* chore(deps) lib-jitsi-meet@latest

https://github.com/jitsi/lib-jitsi-meet/compare/v1836.0.0+d05325f3...v1839.0.0+ea523fc6

* squash: Adds a count function.

* squash: Drop debug print.

* squash: Skip if queueService is not enabled.

* squash: Avoids double subscribing for visitorsWaiting.

* squash: Fixes lint error.

* squash: Fixes showing dialog.
2024-06-28 07:29:41 -05:00

40 lines
1.4 KiB
TypeScript

import React from 'react';
import { useTranslation } from 'react-i18next';
import { useSelector } from 'react-redux';
import { makeStyles } from 'tss-react/mui';
import { IReduxState } from '../../../app/types';
import { IconUsers } from '../../../base/icons/svg';
import Label from '../../../base/label/components/web/Label';
import Tooltip from '../../../base/tooltip/components/Tooltip';
import { getVisitorsCount, getVisitorsShortText, iAmVisitor } from '../../functions';
const useStyles = makeStyles()(theme => {
return {
label: {
backgroundColor: theme.palette.warning02,
color: theme.palette.uiBackground
}
};
});
const VisitorsCountLabel = () => {
const { classes: styles, theme } = useStyles();
const visitorsMode = useSelector((state: IReduxState) => iAmVisitor(state));
const visitorsCount = useSelector(getVisitorsCount);
const { t } = useTranslation();
return !visitorsMode && visitorsCount > 0 ? (<Tooltip
content = { t('visitors.labelTooltip', { count: visitorsCount }) }
position = { 'bottom' }>
<Label
className = { styles.label }
icon = { IconUsers }
iconColor = { theme.palette.icon04 }
id = 'visitorsCountLabel'
text = { `${getVisitorsShortText(visitorsCount)}` } />
</Tooltip>) : null;
};
export default VisitorsCountLabel;