46 lines
1.6 KiB
JavaScript
46 lines
1.6 KiB
JavaScript
import { n__ } from '~/locale';
|
||
|
||
/**
|
||
* Accepts an array of options and an array of selected option IDs
|
||
* and optionally a placeholder and maximum number of options to show.
|
||
*
|
||
* Returns a string with the text of the selected options:
|
||
* - If no options are selected, returns the placeholder or an empty string.
|
||
* - If less than maxOptionsShown is selected, returns the text of those options comma-separated.
|
||
* - If more than maxOptionsShown is selected, returns the text of those options comma-separated
|
||
* followed by the text "+X more", where X is the number of additional selected options
|
||
*
|
||
* @param {Object} opts
|
||
* @param {Array<{ id: number | string, value: string }>} opts.options
|
||
* @param {Array<{ id: number | string }>} opts.selected
|
||
* @param {String} opts.placeholder - Placeholder when no option is selected
|
||
* @param {Integer} opts.maxOptionsShown – Max number of options to show
|
||
* @returns {String}
|
||
*/
|
||
export const getSelectedOptionsText = ({
|
||
options,
|
||
selected,
|
||
placeholder = '',
|
||
maxOptionsShown = 1,
|
||
}) => {
|
||
const selectedOptions = options.filter(({ id, value }) => selected.includes(id || value));
|
||
|
||
if (selectedOptions.length === 0) {
|
||
return placeholder;
|
||
}
|
||
|
||
const optionTexts = selectedOptions.map((option) => option.text);
|
||
|
||
if (selectedOptions.length <= maxOptionsShown) {
|
||
return optionTexts.join(', ');
|
||
}
|
||
|
||
// Prevent showing "+-1 more" when the array is empty.
|
||
const additionalItemsCount = selectedOptions.length - maxOptionsShown;
|
||
return `${optionTexts.slice(0, maxOptionsShown).join(', ')} ${n__(
|
||
'+%d more',
|
||
'+%d more',
|
||
additionalItemsCount,
|
||
)}`;
|
||
};
|