diff --git a/packages/bruno-app/src/components/CollectionSettings/Headers/index.js b/packages/bruno-app/src/components/CollectionSettings/Headers/index.js index 9ae6e1e07..d0968c425 100644 --- a/packages/bruno-app/src/components/CollectionSettings/Headers/index.js +++ b/packages/bruno-app/src/components/CollectionSettings/Headers/index.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useState } from 'react'; import get from 'lodash/get'; import cloneDeep from 'lodash/cloneDeep'; import { IconTrash } from '@tabler/icons'; @@ -7,19 +7,30 @@ import { useTheme } from 'providers/Theme'; import { addCollectionHeader, updateCollectionHeader, - deleteCollectionHeader + deleteCollectionHeader, + setCollectionHeaders } from 'providers/ReduxStore/slices/collections'; import { saveCollectionRoot } from 'providers/ReduxStore/slices/collections/actions'; import SingleLineEditor from 'components/SingleLineEditor'; import StyledWrapper from './StyledWrapper'; import { headers as StandardHTTPHeaders } from 'know-your-http-well'; import { MimeTypes } from 'utils/codemirror/autocompleteConstants'; +import BulkEditor from 'components/BulkEditor/index'; const headerAutoCompleteList = StandardHTTPHeaders.map((e) => e.header); const Headers = ({ collection }) => { const dispatch = useDispatch(); const { storedTheme } = useTheme(); const headers = get(collection, 'root.request.headers', []); + const [isBulkEditMode, setIsBulkEditMode] = useState(false); + + const toggleBulkEditMode = () => { + setIsBulkEditMode(!isBulkEditMode); + }; + + const handleBulkHeadersChange = (newHeaders) => { + dispatch(setCollectionHeaders({ collectionUid: collection.uid, headers: newHeaders })); + }; const addHeader = () => { dispatch( @@ -63,6 +74,22 @@ const Headers = ({ collection }) => { ); }; + if (isBulkEditMode) { + return ( + + + Add request headers that will be sent with every request in this collection. + + + + ); + } + return ( @@ -141,9 +168,14 @@ const Headers = ({ collection }) => { : null} - - + Add Header - + + + + Add Header + + + Bulk Edit + + diff --git a/packages/bruno-app/src/components/FolderSettings/Headers/index.js b/packages/bruno-app/src/components/FolderSettings/Headers/index.js index 4ee0002a2..79f22a0b8 100644 --- a/packages/bruno-app/src/components/FolderSettings/Headers/index.js +++ b/packages/bruno-app/src/components/FolderSettings/Headers/index.js @@ -1,21 +1,31 @@ -import React from 'react'; +import React, { useState } from 'react'; import get from 'lodash/get'; import cloneDeep from 'lodash/cloneDeep'; import { IconTrash } from '@tabler/icons'; import { useDispatch } from 'react-redux'; import { useTheme } from 'providers/Theme'; -import { addFolderHeader, updateFolderHeader, deleteFolderHeader } from 'providers/ReduxStore/slices/collections'; +import { addFolderHeader, updateFolderHeader, deleteFolderHeader, setFolderHeaders } from 'providers/ReduxStore/slices/collections'; import { saveFolderRoot } from 'providers/ReduxStore/slices/collections/actions'; import SingleLineEditor from 'components/SingleLineEditor'; import StyledWrapper from './StyledWrapper'; import { headers as StandardHTTPHeaders } from 'know-your-http-well'; import { MimeTypes } from 'utils/codemirror/autocompleteConstants'; +import BulkEditor from 'components/BulkEditor/index'; const headerAutoCompleteList = StandardHTTPHeaders.map((e) => e.header); const Headers = ({ collection, folder }) => { const dispatch = useDispatch(); const { storedTheme } = useTheme(); const headers = get(folder, 'root.request.headers', []); + const [isBulkEditMode, setIsBulkEditMode] = useState(false); + + const toggleBulkEditMode = () => { + setIsBulkEditMode(!isBulkEditMode); + }; + + const handleBulkHeadersChange = (newHeaders) => { + dispatch(setFolderHeaders({ collectionUid: collection.uid, folderUid: folder.uid, headers: newHeaders })); + }; const addHeader = () => { dispatch( @@ -62,6 +72,22 @@ const Headers = ({ collection, folder }) => { ); }; + if (isBulkEditMode) { + return ( + + + Request headers that will be sent with every request inside this folder. + + + + ); + } + return ( @@ -141,9 +167,14 @@ const Headers = ({ collection, folder }) => { : null} - - + Add Header - + + + + Add Header + + + Bulk Edit + + diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js b/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js index 4e30b7366..3cd033124 100644 --- a/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js +++ b/packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js @@ -873,6 +873,43 @@ export const collectionsSlice = createSlice({ enabled: enabled })); }, + setCollectionHeaders: (state, action) => { + const { collectionUid, headers } = action.payload; + + const collection = findCollectionByUid(state.collections, collectionUid); + if (!collection) { + return; + } + + collection.root.request.headers = map(headers, ({name = '', value = '', enabled = true}) => ({ + uid: uuid(), + name: name, + value: value, + description: '', + enabled: enabled + })); + }, + setFolderHeaders: (state, action) => { + const { collectionUid, folderUid, headers } = action.payload; + + const collection = findCollectionByUid(state.collections, collectionUid); + if (!collection) { + return; + } + + const folder = findItemInCollection(collection, folderUid); + if (!folder || !isItemAFolder(folder)) { + return; + } + + folder.root.request.headers = map(headers, ({name = '', value = '', enabled = true}) => ({ + uid: uuid(), + name: name, + value: value, + description: '', + enabled: enabled + })); + }, addFormUrlEncodedParam: (state, action) => { const collection = findCollectionByUid(state.collections, action.payload.collectionUid); @@ -2472,6 +2509,8 @@ export const { deleteRequestHeader, moveRequestHeader, setRequestHeaders, + setCollectionHeaders, + setFolderHeaders, addFormUrlEncodedParam, updateFormUrlEncodedParam, deleteFormUrlEncodedParam,