import React, { Component } from 'react'
import { Divider } from 'antd'

function renderActions() {
    const { children } = this.props
    const actions = []

    Array.isArray(children)
        ? children
              .filter(action => action)
              .forEach((action, i) => {
                  actions.push(action, <Divider type="vertical" key={i} />)
              })
        : actions.push(children)

    return actions
}

export default class QueryTableActions extends Component {
    componentDidMount() {
        // 删除多余的间隔线
        const className = 'ant-divider ant-divider-vertical'
        let series = false
        for (const node of this.refs.inner.childNodes) {
            if (
                (series && node.className == className) ||
                (!node.nextElementSibling && node.className == className)
            ) {
                node.style.display = 'none'
                series = false
            } else if (node.className == className) {
                series = true
            } else {
                series = false
            }
        }
    }

    render() {
        return (
            <div className="yo-table-actions">
                <div className="yo-table-actions--inner" ref="inner">
                    {renderActions.call(this)}
                </div>
            </div>
        )
    }
}