diff --git a/packages/grafnode-components/src/components/RequestTabs/StyledWrapper.js b/packages/grafnode-components/src/components/RequestTabs/StyledWrapper.js
index af29e3a7..a9cf5d38 100644
--- a/packages/grafnode-components/src/components/RequestTabs/StyledWrapper.js
+++ b/packages/grafnode-components/src/components/RequestTabs/StyledWrapper.js
@@ -27,6 +27,7 @@ const Wrapper = styled.div`
.tab-container {
width: 100%;
border-left: 1px solid #dcdcdc;
+ border-right: 1px solid transparent;
}
&.active {
@@ -52,9 +53,9 @@ const Wrapper = styled.div`
.close-icon-container {
min-height: 20px;
border-radius: 3px;
- display: none;
.close-icon {
+ display: none;
color: #9f9f9f;
width: 8px;
padding-bottom: 6px;
@@ -65,16 +66,20 @@ const Wrapper = styled.div`
background-color: #eaeaea;
color: rgb(76 76 76);
}
+
+ .has-changes-icon {
+ height: 24px;
+ }
}
&.active {
- .close-icon-container {
+ .close-icon-container .close-icon {
display: block;
}
}
&:hover{
- .close-icon-container {
+ .close-icon-container .close-icon {
display: block;
}
}
diff --git a/packages/grafnode-components/src/components/RequestTabs/index.js b/packages/grafnode-components/src/components/RequestTabs/index.js
index e5c8efc0..fd0bf597 100644
--- a/packages/grafnode-components/src/components/RequestTabs/index.js
+++ b/packages/grafnode-components/src/components/RequestTabs/index.js
@@ -60,9 +60,15 @@ const RequestTabs = ({actions, dispatch, activeRequestTabId, requestTabs}) => {
{rt.name}
handleCloseClick(e, rt)}>
-
+ {!rt.hasChanges ? (
+
+ ) : (
+
+ ) }
diff --git a/packages/grafnode-run/src/providers/Store/reducer.js b/packages/grafnode-run/src/providers/Store/reducer.js
index cc9afbde..a520dfbb 100644
--- a/packages/grafnode-run/src/providers/Store/reducer.js
+++ b/packages/grafnode-run/src/providers/Store/reducer.js
@@ -8,7 +8,9 @@ import {
flattenItems,
findItem,
isItemARequest,
- itemIsOpenedInTabs
+ itemIsOpenedInTabs,
+ cloneItem,
+ updateRequestTabAsChanged
} from './utils';
const reducer = (state, action) => {
@@ -42,7 +44,8 @@ const reducer = (state, action) => {
id: item.id,
name: item.name,
method: item.request.method,
- collectionId: collection.id
+ collectionId: collection.id,
+ hasChanges: false
});
draft.activeRequestTabId = item.id;
}
@@ -79,7 +82,11 @@ const reducer = (state, action) => {
let item = findItem(flattenedItems, action.requestTab.id);
if(item) {
- item.request.url = action.url;
+ if(!item.draft) {
+ item.draft = cloneItem(item);
+ }
+ item.draft.request.url = action.url;
+ updateRequestTabAsChanged(draft.requestTabs, item.id);
}
}
});
diff --git a/packages/grafnode-run/src/providers/Store/utils.js b/packages/grafnode-run/src/providers/Store/utils.js
index 72ebc4e9..33541ddc 100644
--- a/packages/grafnode-run/src/providers/Store/utils.js
+++ b/packages/grafnode-run/src/providers/Store/utils.js
@@ -1,5 +1,6 @@
import each from 'lodash/each';
import find from 'lodash/find';
+import cloneDeep from 'lodash/cloneDeep';
export const flattenItems = (items = []) => {
const flattenedItems = [];
@@ -30,3 +31,14 @@ export const isItemARequest = (item) => {
export const itemIsOpenedInTabs = (item, tabs) => {
return find(tabs, (t) => t.id === item.id);
};
+
+export const cloneItem = (item) => {
+ return cloneDeep(item);
+};
+
+export const updateRequestTabAsChanged = (requestTabs, itemId) => {
+ let currentTab = find(requestTabs, (rt) => rt.id == itemId);
+ if(currentTab) {
+ currentTab.hasChanges = true;
+ }
+};