-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(migration ra-ui-2.8.5): updated ra-ui-maui and migrated auth/ and…
… button/
- Loading branch information
Alexander Janet
committed
Apr 9, 2019
1 parent
d5d7a3e
commit 1653816
Showing
12 changed files
with
527 additions
and
189 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,100 +1,28 @@ | ||
import React, { Component } from 'react'; | ||
import React from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import { connect } from 'react-redux'; | ||
import compose from 'recompose/compose'; | ||
import ActionDelete from '@material-ui/icons/Delete'; | ||
import { crudDeleteMany, startUndoable } from 'ra-core'; | ||
|
||
import Button from './Button'; | ||
|
||
const sanitizeRestProps = ({ | ||
basePath, | ||
dispatchCrudDeleteMany, | ||
filterValues, | ||
label, | ||
resource, | ||
selectedIds, | ||
startUndoable, | ||
undoable, | ||
...rest | ||
}) => rest; | ||
|
||
// const styles = theme => ({ | ||
// deleteButton: { | ||
// color: theme.palette.error.main, | ||
// '&:hover': { | ||
// backgroundColor: fade(theme.palette.error.main, 0.12), | ||
// // Reset on mouse devices | ||
// '@media (hover: none)': { | ||
// backgroundColor: 'transparent', | ||
// }, | ||
// }, | ||
// }, | ||
// }); | ||
|
||
class BulkDeleteButton extends Component { | ||
static propTypes = { | ||
basePath: PropTypes.string, | ||
dispatchCrudDeleteMany: PropTypes.func.isRequired, | ||
label: PropTypes.string, | ||
resource: PropTypes.string.isRequired, | ||
startUndoable: PropTypes.func, | ||
selectedIds: PropTypes.arrayOf(PropTypes.any).isRequired, | ||
undoable: PropTypes.bool, | ||
icon: PropTypes.element, | ||
}; | ||
|
||
static defaultProps = { | ||
label: 'ra.action.delete', | ||
undoable: true, | ||
icon: <ActionDelete />, | ||
}; | ||
|
||
handleClick = () => { | ||
const { | ||
basePath, | ||
dispatchCrudDeleteMany, | ||
resource, | ||
selectedIds, | ||
startUndoable, | ||
undoable, | ||
onClick, | ||
} = this.props; | ||
if (undoable) { | ||
startUndoable(crudDeleteMany(resource, selectedIds, basePath)); | ||
} else { | ||
dispatchCrudDeleteMany(resource, selectedIds, basePath); | ||
} | ||
|
||
if (typeof onClick === 'function') { | ||
onClick(); | ||
} | ||
}; | ||
|
||
render() { | ||
const { | ||
label, icon, ...rest | ||
} = this.props; | ||
return ( | ||
<Button | ||
onClick={this.handleClick} | ||
label={label} | ||
{...sanitizeRestProps(rest)} | ||
> | ||
{icon} | ||
</Button> | ||
); | ||
} | ||
} | ||
|
||
const EnhancedBulkDeleteButton = compose( | ||
connect( | ||
undefined, | ||
{ | ||
startUndoable, | ||
dispatchCrudDeleteMany: crudDeleteMany, | ||
} | ||
), | ||
)(BulkDeleteButton); | ||
|
||
export default EnhancedBulkDeleteButton; | ||
import BulkDeleteWithConfirmButton from './BulkDeleteWithConfirmButton'; | ||
import BulkDeleteWithUndoButton from './BulkDeleteWithUndoButton'; | ||
|
||
import Button from './Button'; // eslint-disable-line | ||
|
||
const BulkDeleteButton = ({ undoable, ...props }) => undoable ? ( | ||
<BulkDeleteWithUndoButton {...props} /> | ||
) : ( | ||
<BulkDeleteWithConfirmButton {...props} /> | ||
); | ||
|
||
BulkDeleteButton.propTypes = { | ||
basePath: PropTypes.string, | ||
label: PropTypes.string, | ||
resource: PropTypes.string.isRequired, | ||
selectedIds: PropTypes.arrayOf(PropTypes.any).isRequired, | ||
undoable: PropTypes.bool, | ||
icon: PropTypes.element, | ||
}; | ||
|
||
BulkDeleteButton.defaultProps = { | ||
undoable: true, | ||
}; | ||
|
||
/** @component */ | ||
export default BulkDeleteButton; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,127 @@ | ||
import React, { Fragment, Component } from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import { connect } from 'react-redux'; | ||
import compose from 'recompose/compose'; | ||
import ActionDelete from '@material-ui/icons/Delete'; | ||
import inflection from 'inflection'; | ||
import { translate, crudDeleteMany } from 'ra-core'; | ||
import styled from 'styled-components'; | ||
import Color from '@bootstrap-styled/color'; | ||
import Confirm from '../layout/Confirm'; | ||
import Button from './Button'; | ||
|
||
const sanitizeRestProps = ({ | ||
basePath, | ||
crudDeleteMany, | ||
filterValues, | ||
label, | ||
resource, | ||
selectedIds, | ||
...rest | ||
}) => rest; | ||
|
||
const StyledButton = styled(Button)` | ||
${props => ` | ||
color: ${props.theme.$red} | ||
&:hover { | ||
background-color: ${Color(props.theme.$red.fade(0.12).toString())} | ||
} | ||
`} | ||
`; | ||
|
||
class BulkDeleteWithConfirmButton extends Component { | ||
static propTypes = { | ||
basePath: PropTypes.string, | ||
crudDeleteMany: PropTypes.func.isRequired, | ||
label: PropTypes.string, | ||
resource: PropTypes.string.isRequired, | ||
selectedIds: PropTypes.arrayOf(PropTypes.any).isRequired, | ||
icon: PropTypes.element, | ||
}; | ||
|
||
static defaultProps = { | ||
label: 'ra.action.delete', | ||
icon: <ActionDelete />, | ||
}; | ||
|
||
state = { isOpen: false }; | ||
|
||
handleClick = e => { | ||
this.setState({ isOpen: true }); | ||
e.stopPropagation(); | ||
}; | ||
|
||
handleDialogClose = () => { | ||
this.setState({ isOpen: false }); | ||
}; | ||
|
||
handleDelete = () => { | ||
const { | ||
basePath, | ||
crudDeleteMany, | ||
resource, | ||
selectedIds, | ||
onClick, | ||
} = this.props; | ||
|
||
crudDeleteMany(resource, selectedIds, basePath); | ||
|
||
if (typeof onClick === 'function') { | ||
onClick(); | ||
} | ||
}; | ||
|
||
render() { | ||
const { | ||
classes, | ||
label, | ||
icon, | ||
onClick, | ||
resource, | ||
selectedIds, | ||
translate, | ||
...rest | ||
} = this.props; | ||
return ( | ||
<Fragment> | ||
<StyledButton | ||
onClick={this.handleClick} | ||
label={label} | ||
{...sanitizeRestProps(rest)} | ||
> | ||
{icon} | ||
</StyledButton> | ||
<Confirm | ||
isOpen={this.state.isOpen} | ||
title="ra.message.bulk_delete_title" | ||
content="ra.message.bulk_delete_content" | ||
translateOptions={{ | ||
smart_count: selectedIds.length, | ||
name: inflection.humanize( | ||
translate(`resources.${resource}.name`, { | ||
smart_count: selectedIds.length, | ||
_: inflection.inflect( | ||
resource, | ||
selectedIds.length | ||
), | ||
}), | ||
true | ||
), | ||
}} | ||
onConfirm={this.handleDelete} | ||
onClose={this.handleDialogClose} | ||
/> | ||
</Fragment> | ||
); | ||
} | ||
} | ||
|
||
const EnhancedBulkDeleteWithConfirmButton = compose( | ||
connect( | ||
undefined, | ||
{ crudDeleteMany } | ||
), | ||
translate, | ||
)(BulkDeleteWithConfirmButton); | ||
|
||
export default EnhancedBulkDeleteWithConfirmButton; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,89 @@ | ||
import React, { Component } from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import { connect } from 'react-redux'; | ||
import compose from 'recompose/compose'; | ||
import ActionDelete from '@material-ui/icons/Delete'; | ||
import { startUndoable, crudDeleteMany } from 'ra-core'; | ||
import styled from 'styled-components'; | ||
import Color from '@bootstrap-styled/color'; | ||
|
||
import Button from './Button'; | ||
|
||
const sanitizeRestProps = ({ | ||
basePath, | ||
dispatchCrudDeleteMany, | ||
filterValues, | ||
label, | ||
resource, | ||
selectedIds, | ||
startUndoable, | ||
undoable, | ||
...rest | ||
}) => rest; | ||
|
||
const StyledButton = styled(Button)` | ||
${props => ` | ||
color: ${props.theme.$red} | ||
&:hover { | ||
background-color: ${Color(props.theme.$red.fade(0.12).toString())} | ||
} | ||
`} | ||
`; | ||
|
||
class BulkDeleteWithUndoButton extends Component { | ||
static propTypes = { | ||
basePath: PropTypes.string, | ||
label: PropTypes.string, | ||
resource: PropTypes.string.isRequired, | ||
startUndoable: PropTypes.func, | ||
selectedIds: PropTypes.arrayOf(PropTypes.any).isRequired, | ||
icon: PropTypes.element, | ||
}; | ||
|
||
static defaultProps = { | ||
label: 'ra.action.delete', | ||
undoable: true, | ||
icon: <ActionDelete />, | ||
}; | ||
|
||
handleClick = () => { | ||
const { | ||
basePath, | ||
resource, | ||
selectedIds, | ||
startUndoable, | ||
onClick, | ||
} = this.props; | ||
|
||
startUndoable(crudDeleteMany(resource, selectedIds, basePath)); | ||
|
||
if (typeof onClick === 'function') { | ||
onClick(); | ||
} | ||
}; | ||
|
||
render() { | ||
const { | ||
classes, label, icon, onClick, ...rest | ||
} = this.props; | ||
return ( | ||
<StyledButton | ||
onClick={this.handleClick} | ||
label={label} | ||
className={classes.deleteButton} | ||
{...sanitizeRestProps(rest)} | ||
> | ||
{icon} | ||
</StyledButton> | ||
); | ||
} | ||
} | ||
|
||
const EnhancedBulkDeleteWithConfirmButton = compose( | ||
connect( | ||
undefined, | ||
{ startUndoable } | ||
), | ||
)(BulkDeleteWithUndoButton); | ||
|
||
export default EnhancedBulkDeleteWithConfirmButton; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.