bigbluebutton-Github/bigbluebutton-html5/imports/ui/components/locales-dropdown/component.jsx
2021-02-02 15:44:58 -03:00

81 lines
2.3 KiB
JavaScript
Executable File

import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
const DEFAULT_VALUE = 'select';
const DEFAULT_KEY = -1;
const propTypes = {
allLocales: PropTypes.arrayOf(PropTypes.object).isRequired,
value: PropTypes.string,
handleChange: PropTypes.func.isRequired,
elementId: PropTypes.string.isRequired,
selectMessage: PropTypes.string.isRequired,
elementClass: PropTypes.string.isRequired,
};
const defaultProps = {
value: null,
};
class LocalesDropdown extends PureComponent {
// returns an array with the base language list + variations of currently selected language
filterLocaleVariations(value) {
const { allLocales } = this.props;
if (allLocales) {
if (Meteor.settings.public.app.showAllAvailableLocales) {
return allLocales;
}
// splits value if not empty
const splitValue = (value) ? value.split('-')[0] : '';
const allLocaleCodes = [];
allLocales.map(item => allLocaleCodes.push(item.locale));
/*
locales show if:
1. it is a general version of a locale with no specific locales
2. it is a specific version of a selected locale with many specific versions
3. it is a specific version of a locale with no general locale
*/
return allLocales.filter(
locale => (!locale.locale.includes('-') || locale.locale.split('-')[0] === splitValue || !allLocaleCodes.includes(locale.locale.split('-')[0])),
);
}
return [];
}
render() {
const {
value, handleChange, elementId, selectMessage, elementClass,
} = this.props;
const defaultLocale = value || DEFAULT_VALUE;
const availableLocales = this.filterLocaleVariations(value);
return (
<select
id={elementId}
onChange={handleChange}
value={defaultLocale}
className={elementClass}
>
<option disabled key={DEFAULT_KEY} value={DEFAULT_VALUE}>
{selectMessage}
</option>
{availableLocales.map(localeItem => (
<option key={localeItem.locale} value={localeItem.locale}>
{localeItem.name}
</option>
))}
</select>
);
}
}
LocalesDropdown.propTypes = propTypes;
LocalesDropdown.defaultProps = defaultProps;
export default LocalesDropdown;