mirror of
https://github.com/usebruno/bruno.git
synced 2025-02-16 09:50:17 +01:00
feat: detect changes in request url
This commit is contained in:
parent
b4599b65b9
commit
c3dde749e3
@ -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;
|
||||
}
|
||||
}
|
||||
|
@ -60,9 +60,15 @@ const RequestTabs = ({actions, dispatch, activeRequestTabId, requestTabs}) => {
|
||||
<span className="text-gray-700 ml-1 tab-name">{rt.name}</span>
|
||||
</div>
|
||||
<div className="flex px-2 close-icon-container" onClick={(e) => handleCloseClick(e, rt)}>
|
||||
<svg focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" className="close-icon">
|
||||
<path fill="currentColor" d="M207.6 256l107.72-107.72c6.23-6.23 6.23-16.34 0-22.58l-25.03-25.03c-6.23-6.23-16.34-6.23-22.58 0L160 208.4 52.28 100.68c-6.23-6.23-16.34-6.23-22.58 0L4.68 125.7c-6.23 6.23-6.23 16.34 0 22.58L112.4 256 4.68 363.72c-6.23 6.23-6.23 16.34 0 22.58l25.03 25.03c6.23 6.23 16.34 6.23 22.58 0L160 303.6l107.72 107.72c6.23 6.23 16.34 6.23 22.58 0l25.03-25.03c6.23-6.23 6.23-16.34 0-22.58L207.6 256z"></path>
|
||||
</svg>
|
||||
{!rt.hasChanges ? (
|
||||
<svg focusable="false"xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" className="close-icon">
|
||||
<path fill="currentColor" d="M207.6 256l107.72-107.72c6.23-6.23 6.23-16.34 0-22.58l-25.03-25.03c-6.23-6.23-16.34-6.23-22.58 0L160 208.4 52.28 100.68c-6.23-6.23-16.34-6.23-22.58 0L4.68 125.7c-6.23 6.23-6.23 16.34 0 22.58L112.4 256 4.68 363.72c-6.23 6.23-6.23 16.34 0 22.58l25.03 25.03c6.23 6.23 16.34 6.23 22.58 0L160 303.6l107.72 107.72c6.23 6.23 16.34 6.23 22.58 0l25.03-25.03c6.23-6.23 6.23-16.34 0-22.58L207.6 256z"></path>
|
||||
</svg>
|
||||
) : (
|
||||
<svg focusable="false" xmlns="http://www.w3.org/2000/svg" width="8" height="16" fill="#cc7b1b" class="has-changes-icon" viewBox="0 0 8 8">
|
||||
<circle cx="4" cy="4" r="3"/>
|
||||
</svg>
|
||||
) }
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
@ -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);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
@ -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;
|
||||
}
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user