import React from 'react'
import PropTypes from 'prop-types'
import $ from 'jquery'
import { translate } from 'react-i18next'
export class SidebarDropdown extends React.Component {
static propTypes = {
itemName: PropTypes.string.isRequired,
itemSubType: PropTypes.string.isRequired,
itemType: PropTypes.string.isRequired,
itemId: PropTypes.number.isRequired,
itemExported: PropTypes.bool,
parentId: PropTypes.number.isRequired,
parentAttrId: PropTypes.string.isRequired,
showDeletePopup: PropTypes.func.isRequired,
showRenamePopup: PropTypes.func.isRequired,
showAddCategoryPopup: PropTypes.func,
showAddClippingsPopup: PropTypes.func,
toggleExportFeed: PropTypes.func,
toggleExportCategory: PropTypes.func,
t: PropTypes.func.isRequired,
hideDropDown: PropTypes.func.isRequired
};
constructor (props) {
super(props)
this.state = {
dropdownTopPos: 'auto',
dropdownBottomPos: 'auto',
dropdownOpacity: 0
}
}
componentDidMount = () => {
const topPos = $('#' + this.props.parentAttrId).offset().top - $(document).scrollTop()
const dropdownHeight = $('#sidebar-category-dropdown').height()
if ($(window).height() - topPos >= dropdownHeight) {
this.setState({
dropdownTopPos: topPos,
dropdownOpacity: 1
})
} else {
this.setState({
dropdownBottomPos: 5,
dropdownOpacity: 1
})
}
};
onExportToggle = () => {
const {itemId, toggleExportFeed, itemExported, hideDropDown} = this.props
toggleExportFeed(itemId, !itemExported)
hideDropDown()
};
onExportCategoryToggle = () => {
const {itemId, toggleExportCategory, itemExported, hideDropDown} = this.props
toggleExportCategory(itemId, !itemExported)
hideDropDown()
};
onDelete = () => {
this.props.showDeletePopup(this.props.itemId, this.props.itemType, this.props.itemName, this.props.parentId)
};
onRename = () => {
this.props.showRenamePopup(this.props.itemId, this.props.itemType, this.props.itemName, this.props.parentId)
};
onAddCategory = () => {
// set this item id as parent of new category
this.props.showAddCategoryPopup(this.props.itemId)
};
onAddClippingsFeedPopup = () => {
this.props.showAddClippingsPopup(this.props.itemId)
};
render () {
const { itemSubType, t, itemExported } = this.props
let dropdown
switch (itemSubType) {
case 'my_content':
dropdown =
break
case 'shared_content':
dropdown =
break
case 'custom':
dropdown =
break
case 'query_feed':
dropdown =
break
case 'clip_feed':
dropdown =
break
}
return (
dropdown
)
}
}
export default translate(['common'], { wait: true })(SidebarDropdown)