import React, { useState } from "react";
import PropTypes from "prop-types";
import ComboBox from "../combobox/index.js";
import DropDownItem from "../drop-down-item/index.js";
import Badge from "../badge/index.js";
import {
StyledAccessRightWrapper,
StyledAccessRightIcon,
StyledAccessRightDescriptionItem,
StyledAccessRightItem,
StyledAccessRightItemIcon,
StyledAccessRightItemContent,
StyledAccessRightItemTitleAndBadge,
} from "./styled-accessright.js";
import { ReactSVG } from "react-svg";
const AccessRightSelect = ({
options,
onSelect,
advancedOptions,
selectedOption,
isExternalLink,
isPersonal,
...props
}) => {
const [currentItem, setCurrentItem] = useState(selectedOption);
function onSelectCurrentItem(e) {
const key = +e.currentTarget.dataset.key;
const item = options.find((el) => {
return el.key === key;
});
if (item) {
setCurrentItem(item);
onSelect && onSelect(item);
}
}
React.useEffect(() => {
setCurrentItem(selectedOption);
}, [selectedOption]);
const formatToAccessRightItem = (data) => {
return (
<>
{data.map((it) => {
return it.isSeparator ? (
) : (
{it.title}
{it.quota && (
)}
{it.description}
);
})}
>
);
};
return (
);
};
AccessRightSelect.propTypes = {
/** List of rights */
options: PropTypes.arrayOf(PropTypes.object).isRequired,
/** Will be triggered whenever an AccessRightSelect is selected option */
onSelect: PropTypes.func,
/** List of advanced options */
advancedOptions: PropTypes.oneOfType([PropTypes.array, PropTypes.object]),
/** The option that is selected by default */
selectedOption: PropTypes.object,
isExternalLink: PropTypes.bool,
isPersonal: PropTypes.bool,
};
export default React.memo(AccessRightSelect);