jiti-meet/react/features/participants-pane/functions.js

83 lines
2.3 KiB
JavaScript
Raw Normal View History

import { getFeatureFlag, INVITE_ENABLED } from '../base/flags';
import { toState } from '../base/redux';
import { REDUCER_KEY } from './constants';
/**
* Generates a class attribute value.
*
* @param {Iterable<string>} args - String iterable.
* @returns {string} Class attribute value.
*/
export const classList = (...args) => args.filter(Boolean).join(' ');
/**
* Find the first styled ancestor component of an element.
*
* @param {Element} target - Element to look up.
* @param {StyledComponentClass} component - Styled component reference.
* @returns {Element|null} Ancestor.
*/
export const findStyledAncestor = (target, component) => {
if (!target || target.matches(`.${component.styledComponentId}`)) {
return target;
}
return findStyledAncestor(target.parentElement, component);
};
/**
* Get a style property from a style declaration as a float.
*
* @param {CSSStyleDeclaration} styles - Style declaration.
* @param {string} name - Property name.
* @returns {number} Float value.
*/
export const getFloatStyleProperty = (styles, name) =>
parseFloat(styles.getPropertyValue(name));
/**
* Gets the outer height of an element, including margins.
*
* @param {Element} element - Target element.
* @returns {number} Computed height.
*/
export const getComputedOuterHeight = element => {
const computedStyle = getComputedStyle(element);
return element.offsetHeight
+ getFloatStyleProperty(computedStyle, 'margin-top')
+ getFloatStyleProperty(computedStyle, 'margin-bottom');
};
/**
* Returns this feature's root state.
*
* @param {Object} state - Global state.
* @returns {Object} Feature state.
*/
const getState = state => state[REDUCER_KEY];
/**
* Is the participants pane open.
*
* @param {Object} state - Global state.
* @returns {boolean} Is the participants pane open.
*/
export const getParticipantsPaneOpen = state => Boolean(getState(state)?.isOpen);
/**
* Returns true if the invite button should be rendered.
*
* @param {Object} state - Global state.
* @returns {boolean}
*/
export const shouldRenderInviteButton = state => {
const { disableInviteFunctions } = toState(state)['features/base/config'];
const flagEnabled = getFeatureFlag(state, INVITE_ENABLED, true);
return flagEnabled && !disableInviteFunctions;
};