import React                         from 'react';
import { Icon }                      from '@geenee/ui/src/lib/component/icon/icon.component';
import { TableActionName }           from '@geenee/ui/src/lib/component/styled-table';
import { ActionColumn, IconWrapper } from '@geenee/ui/src/lib/component/styled-table/styles';

type Props<T> = {
    rowActions?: { id: TableActionName; onClick: (item: T) => void }[];
    row: T;
}

export const RowActions = <T, >({ rowActions, row }: Props<T>) => (rowActions?.length ? (
    <ActionColumn
        row
    >
        { rowActions.map((action, actionIndex) => (
            <IconWrapper
                hasMarginLeft={ !!actionIndex }
                maxWidth="fit-content"
                frame="solid-white"
                key={ `action_${ actionIndex }` }
                onClick={ () => action.onClick(row) }
            >
                <Icon name={ action.id } />
            </IconWrapper>
        )) }
    </ActionColumn>
) : <></>);