diff --git a/renderer/components/RequestPane/RequestHeaders/index.js b/renderer/components/RequestPane/RequestHeaders/index.js
index 560dacf01..aaa12199c 100644
--- a/renderer/components/RequestPane/RequestHeaders/index.js
+++ b/renderer/components/RequestPane/RequestHeaders/index.js
@@ -4,7 +4,7 @@ import cloneDeep from 'lodash/cloneDeep';
import { IconTrash } from '@tabler/icons';
import { useDispatch } from 'react-redux';
import { requestChanged } from 'providers/ReduxStore/slices/tabs';
-import { addRequestHeader, updateRequestHeader } from 'providers/ReduxStore/slices/collections';
+import { addRequestHeader, updateRequestHeader, deleteRequestHeader } from 'providers/ReduxStore/slices/collections';
import StyledWrapper from './StyledWrapper';
const RequestHeaders = ({item, collection}) => {
@@ -45,11 +45,20 @@ const RequestHeaders = ({item, collection}) => {
dispatch(updateRequestHeader({
header: header,
itemUid: item.uid,
- collectionUid: collection.uid,
+ collectionUid: collection.uid
}));
};
- const handleRemoveHeader = (index) => {
+ const handleRemoveHeader = (header) => {
+ dispatch(requestChanged({
+ itemUid: item.uid,
+ collectionUid: collection.uid
+ }));
+ dispatch(deleteRequestHeader({
+ headerUid: header.uid,
+ itemUid: item.uid,
+ collectionUid: collection.uid
+ }));
};
return (
@@ -98,12 +107,11 @@ const RequestHeaders = ({item, collection}) => {
handleHeaderValueChange(e, header, 'enabled')}
/>
-
diff --git a/renderer/providers/ReduxStore/slices/collections.js b/renderer/providers/ReduxStore/slices/collections.js
index 9f198e2c2..632bd989c 100644
--- a/renderer/providers/ReduxStore/slices/collections.js
+++ b/renderer/providers/ReduxStore/slices/collections.js
@@ -1,5 +1,6 @@
import { nanoid } from 'nanoid';
import find from 'lodash/find';
+import filter from 'lodash/filter';
import each from 'lodash/each';
import cloneDeep from 'lodash/cloneDeep';
import { createSlice } from '@reduxjs/toolkit'
@@ -11,7 +12,8 @@ import {
cloneItem,
transformCollectionToSaveToIdb,
addDepth,
- deleteItemInCollection
+ deleteItemInCollection,
+ isItemARequest
} from 'utils/collections';
// todo: errors should be tracked in each slice and displayed as toasts
@@ -123,7 +125,7 @@ export const collectionsSlice = createSlice({
if(collection) {
const item = findItemInCollection(collection, action.payload.itemUid);
- if(item) {
+ if(item && isItemARequest(item)) {
if(!item.draft) {
item.draft = cloneItem(item);
}
@@ -137,7 +139,7 @@ export const collectionsSlice = createSlice({
if(collection) {
const item = findItemInCollection(collection, action.payload.itemUid);
- if(item) {
+ if(item && isItemARequest(item)) {
if(!item.draft) {
item.draft = cloneItem(item);
}
@@ -158,7 +160,7 @@ export const collectionsSlice = createSlice({
if(collection) {
const item = findItemInCollection(collection, action.payload.itemUid);
- if(item) {
+ if(item && isItemARequest(item)) {
if(!item.draft) {
item.draft = cloneItem(item);
}
@@ -171,6 +173,20 @@ export const collectionsSlice = createSlice({
}
}
}
+ },
+ deleteRequestHeader: (state, action) => {
+ const collection = findCollectionByUid(state.collections, action.payload.collectionUid);
+
+ if(collection) {
+ const item = findItemInCollection(collection, action.payload.itemUid);
+
+ if(item && isItemARequest(item)) {
+ if(!item.draft) {
+ item.draft = cloneItem(item);
+ }
+ item.draft.request.headers = filter(item.draft.request.headers, (h) => h.uid !== action.payload.headerUid);
+ }
+ }
}
}
});
@@ -188,7 +204,8 @@ export const {
collectionFolderClicked,
requestUrlChanged,
addRequestHeader,
- updateRequestHeader
+ updateRequestHeader,
+ deleteRequestHeader
} = collectionsSlice.actions;
export const loadCollectionsFromIdb = () => (dispatch) => {
diff --git a/renderer/utils/collections/index.js b/renderer/utils/collections/index.js
index a8e7e3b02..472ae2b86 100644
--- a/renderer/utils/collections/index.js
+++ b/renderer/utils/collections/index.js
@@ -130,3 +130,11 @@ export const deleteItemInCollection = (itemUid, collection) => {
}
});
};
+
+export const isItemARequest = (item) => {
+ return item.hasOwnProperty('request') && ['http-request', 'graphql-request'].includes(item.type);
+};
+
+export const isItemAFolder = (item) => {
+ return !item.hasOwnProperty('request') && item.type === 'folder';
+};