diff --git a/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/index.js b/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/index.js index 0d3b63df6..407d42a0d 100644 --- a/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/index.js +++ b/packages/bruno-app/src/components/RequestPane/RequestBody/RequestBodyMode/index.js @@ -6,12 +6,15 @@ import { useDispatch } from 'react-redux'; import { updateRequestBodyMode } from 'providers/ReduxStore/slices/collections'; import { humanizeRequestBodyMode } from 'utils/collections'; import StyledWrapper from './StyledWrapper'; +import { updateRequestBody } from 'providers/ReduxStore/slices/collections/index'; +import { toastError } from 'utils/common/error'; const RequestBodyMode = ({ item, collection }) => { const dispatch = useDispatch(); const dropdownTippyRef = useRef(); const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref); - const bodyMode = item.draft ? get(item, 'draft.request.body.mode') : get(item, 'request.body.mode'); + const body = item.draft ? get(item, 'draft.request.body') : get(item, 'request.body'); + const bodyMode = body?.mode; const Icon = forwardRef((props, ref) => { return ( @@ -31,6 +34,24 @@ const RequestBodyMode = ({ item, collection }) => { ); }; + const onPrettify = () => { + if (body?.json && bodyMode === 'json') { + try { + const bodyJson = JSON.parse(body.json); + const prettyBodyJson = JSON.stringify(bodyJson, null, 2); + dispatch( + updateRequestBody({ + content: prettyBodyJson, + itemUid: item.uid, + collectionUid: collection.uid + }) + ); + } catch (e) { + toastError(new Error('Unable to prettify. Invalid JSON format.')); + } + } + }; + return (
@@ -103,6 +124,11 @@ const RequestBodyMode = ({ item, collection }) => {
+ {bodyMode === 'json' && ( + + )}
); };