diff --git a/src/actions/index.js b/src/actions/index.js index 82cbfe8..98e41fc 100644 --- a/src/actions/index.js +++ b/src/actions/index.js @@ -220,6 +220,13 @@ export function rejectUpdateValue(namespace, key, value, error) { } } +export function rejectFormat(error) { + return { + type: actions.FORMAT_VALUE_REJECTED, + error, + } +} + /** * requestDeleteKey - Request deleteion of a key * diff --git a/src/components/display/edit/EditDisplay.js b/src/components/display/edit/EditDisplay.js index 67deaf8..fecbfba 100644 --- a/src/components/display/edit/EditDisplay.js +++ b/src/components/display/edit/EditDisplay.js @@ -8,8 +8,13 @@ import { fetchAndToggleNamespace, updateValue, valueChange, + rejectFormat, rejectUpdateValue, } from '../../../actions/index.js' +import { + jsonEditorCompact, + jsonEditorFormat, +} from '../../../actions/jsonEditorActions.js' import ConfirmNavigationDialog from '../../dialog/ConfirmNavigationDialog.js' import styles from '../Display.module.css' import EditArea from './EditArea.js' @@ -25,6 +30,10 @@ export class EditDisplay extends Component { this.state = { valueError: null, } + this.handleChangeValue = this.handleChangeValue.bind(this) + this.handleFormatValue = this.handleFormatValue.bind(this) + this.handleFormatValueCompact = this.handleFormatValueCompact.bind(this) + this.handleSaveValue = this.handleSaveValue.bind(this) } componentDidMount() { @@ -96,6 +105,22 @@ export class EditDisplay extends Component { } } + handleFormatValue() { + if (this.state.valueError) { + this.props.rejectFormat('Failed to format value: Not valid JSON') + } else { + this.props.jsonFormat() + } + } + + handleFormatValueCompact() { + if (this.state.valueError) { + this.props.rejectFormat('Failed to format value: Not valid JSON') + } else { + this.props.jsonCompact() + } + } + render() { const { namespace, selectedKey } = this.props let path = '' @@ -117,13 +142,15 @@ export class EditDisplay extends Component { /> ) @@ -168,6 +195,15 @@ const mapDispatchToProps = (dispatch) => ({ rejectUpdateValue(namespace, key, value, err) { dispatch(rejectUpdateValue(namespace, key, value, err)) }, + rejectFormat(err) { + dispatch(rejectFormat(err)) + }, + jsonFormat() { + dispatch(jsonEditorFormat()) + }, + jsonCompact() { + dispatch(jsonEditorCompact()) + }, }) export default withRouter( diff --git a/src/components/display/edit/EditToolbar.js b/src/components/display/edit/EditToolbar.js index cb890c2..d23b7da 100644 --- a/src/components/display/edit/EditToolbar.js +++ b/src/components/display/edit/EditToolbar.js @@ -20,8 +20,6 @@ import { jsonEditorUndo, jsonEditorRedo, jsonEditorChangeMode, - jsonEditorCompact, - jsonEditorFormat, } from '../../../actions/jsonEditorActions.js' import { debounce } from '../../../utils/utils.js' import JSONSearchBar from '../../utils/JSONSearchBar.js' @@ -167,13 +165,13 @@ export class EditToolbar extends React.Component { @@ -199,14 +197,14 @@ export class EditToolbar extends React.Component { } EditToolbar.propTypes = { + handleFormat: PropTypes.func, + handleFormatCompact: PropTypes.func, handleSave: PropTypes.func, path: PropTypes.string, mode: PropTypes.string, - jsonCompact: PropTypes.func, jsonSearchAction: PropTypes.func, jsonCollapse: PropTypes.func, jsonExpand: PropTypes.func, - jsonFormat: PropTypes.func, jsonUndo: PropTypes.func, jsonRedo: PropTypes.func, jsonChangeMode: PropTypes.func, @@ -228,12 +226,6 @@ const mapDispatchToProps = (dispatch) => ({ jsonExpand() { dispatch(jsonEditorExpand()) }, - jsonCompact() { - dispatch(jsonEditorCompact()) - }, - jsonFormat() { - dispatch(jsonEditorFormat()) - }, jsonUndo() { dispatch(jsonEditorUndo()) }, diff --git a/src/constants/actionTypes.js b/src/constants/actionTypes.js index 8c33b07..a26067a 100644 --- a/src/constants/actionTypes.js +++ b/src/constants/actionTypes.js @@ -39,6 +39,8 @@ export const UPDATE_VALUE_FULFILLED = 'UPDATE_VALUE_FULFILLED' export const UPDATE_VALUE_PENDING = 'UPDATE_VALUE_PENDING' export const UPDATE_VALUE_REJECTED = 'UPDATE_VALUE_REJECTED' +export const FORMAT_VALUE_REJECTED = 'FORMAT_VALUE_REJECTED' + export const CREATE_VALUE_FULFILLED = 'CREATE_VALUE_FULFILLED' export const CREATE_VALUE_PENDING = 'CREATE_VALUE_PENDING' export const CREATE_VALUE_REJECTED = 'CREATE_VALUE_REJECTED' diff --git a/src/reducers/snackbarReducer.js b/src/reducers/snackbarReducer.js index b9d6fc5..bcb7933 100644 --- a/src/reducers/snackbarReducer.js +++ b/src/reducers/snackbarReducer.js @@ -33,6 +33,15 @@ const snackbar = (state = initialState, action) => { } } + case actions.FORMAT_VALUE_REJECTED: { + const msg = action.error || 'Failed to format' + + return { + ...state, + message: msg, + } + } + case actions.FETCH_KEYS_REJECTED: { return { ...state,