import Button from '../UI/Button/Button';
import Box from '../UI/Box/Box';
import React from 'react';
import './UpgradeUI.css';

export default props => {
  return (
    <Box dxStyle={{width: '180px', height: 'auto', padding: '5px'}}>
      <div style={{width: '100%', height: 'auto'}}>
        <h1 style={{width: '100%', textAlign: 'center'}}>UI Upgrade Available</h1>
      </div>
      <table cellSpacing={5} width="100%">
        <tbody>
          <tr>
            <td width="50%">
              <Button buttonStyles={{width: '100%'}}
                      clicked={props.upgrade}>Install</Button>
            </td>
            <td width="50%">
              <Button buttonStyles={{width: '100%'}}
                      clicked={props.cancel}>Cancel</Button>
            </td>
          </tr>
        </tbody>
      </table>
    </Box>);
};