pull/10616/head
Andrew Watkins 2018-05-08 10:08:02 -07:00
parent 36235d1506
commit 317a7cbf59
2 changed files with 19 additions and 13 deletions

View File

@ -61,6 +61,7 @@ export default class AllUsersTableRow extends PureComponent<Props> {
<td style={{width: colOrganizations}}>
<Tags
tags={this.userOrganizationTags}
confirmText="Remove user from organization"
onDeleteTag={onRemoveFromOrganization(user)}
addMenuItems={this.dropdownOrganizationsItems}
addMenuChoose={onAddToOrganization(user)}

View File

@ -11,6 +11,7 @@ interface Item {
interface TagsProps {
tags: Item[]
confirmText?: string
onDeleteTag?: (item: Item) => void
addMenuItems?: Item[]
addMenuChoose?: (item: Item) => void
@ -21,11 +22,19 @@ const Tags: SFC<TagsProps> = ({
onDeleteTag,
addMenuItems,
addMenuChoose,
confirmText,
}) => {
return (
<div className="input-tag-list">
{tags.map(item => {
return <Tag key={uuid.v4()} item={item} onDelete={onDeleteTag} />
return (
<Tag
key={uuid.v4()}
item={item}
onDelete={onDeleteTag}
confirmText={confirmText}
/>
)
})}
{addMenuItems && addMenuItems.length && addMenuChoose ? (
<TagsAddButton items={addMenuItems} onChoose={addMenuChoose} />
@ -35,38 +44,34 @@ const Tags: SFC<TagsProps> = ({
}
interface TagProps {
confirmText?: string
item: Item
onDelete: (item: Item) => void
}
@ErrorHandling
class Tag extends PureComponent<TagProps> {
public static defaultProps: Partial<TagProps> = {
confirmText: 'Delete',
}
public render() {
const {item} = this.props
const {item, confirmText} = this.props
return (
<span key={uuid.v4()} className="input-tag--item">
<span>{item.text || item.name || item}</span>
<ConfirmButton
icon="remove"
size="btn-xs"
customClass="input-tag--remove"
square={true}
confirmText={this.confirmText}
confirmText={confirmText}
customClass="input-tag--remove"
confirmAction={this.handleClickDelete(item)}
/>
</span>
)
}
private get confirmText(): string {
const {item} = this.props
if (item.name || item.text) {
return `Delete ${item.name || item.text}?`
}
return 'Delete?'
}
private handleClickDelete = item => () => {
this.props.onDelete(item)
}