import * as React from 'react' ; import { IconButtonWithTooltip } from '../../button' ; import ArrowUpwardIcon from '@material-ui/icons/ArrowUpward' ; import ArrowDownwardIcon from '@material-ui/icons/ArrowDownward' ; import { useSimpleFormIteratorItem } from './useSimpleFormIteratorItem' ; export const ReOrderButtons = ( { className } ) => { const { index , total , reOrder } = useSimpleFormIteratorItem ( ) ; return ( < div className = { className } > < IconButtonWithTooltip label = "ra.action.move_up" size = "small" onClick = { ( ) => reOrder ( index - 1 ) } disabled = { index <= 0 } > < ArrowUpwardIcon /> < /IconButtonWithTooltip> < IconButtonWithTooltip label = "ra.action.move_down" size = "small" onClick = { ( ) => reOrder ( index + 1 ) } disabled = { total == null || index >= total - 1 } > < ArrowDownwardIcon /> < /IconButtonWithTooltip> < /div>); } ;