1
0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00

Add change icon to tabs

This commit is contained in:
Nick O'Leary 2023-02-23 22:48:08 +00:00
parent 196a9ae43a
commit 363a8b8588
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
11 changed files with 231 additions and 31 deletions

View File

@ -421,6 +421,9 @@ RED.history = (function() {
ev.node[i] = ev.changes[i]; ev.node[i] = ev.changes[i];
} }
} }
ev.node.dirty = true;
ev.node.changed = ev.changed;
var eventType; var eventType;
switch(ev.node.type) { switch(ev.node.type) {
case 'tab': eventType = "flows"; break; case 'tab': eventType = "flows"; break;
@ -511,8 +514,6 @@ RED.history = (function() {
inverseEv.links.push(ev.createdLinks[i]); inverseEv.links.push(ev.createdLinks[i]);
} }
} }
ev.node.dirty = true;
ev.node.changed = ev.changed;
} else if (ev.t == "createSubflow") { } else if (ev.t == "createSubflow") {
inverseEv = { inverseEv = {
t: "deleteSubflow", t: "deleteSubflow",

View File

@ -46,6 +46,9 @@ RED.nodes = (function() {
function setDirty(d) { function setDirty(d) {
dirty = d; dirty = d;
if (!d) {
allNodes.clearState()
}
RED.events.emit("workspace:dirty",{dirty:dirty}); RED.events.emit("workspace:dirty",{dirty:dirty});
} }
@ -238,22 +241,36 @@ RED.nodes = (function() {
// allNodes holds information about the Flow nodes. // allNodes holds information about the Flow nodes.
var allNodes = (function() { var allNodes = (function() {
// Map node.id -> node
var nodes = {}; var nodes = {};
// Map tab.id -> Array of nodes on that tab
var tabMap = {}; var tabMap = {};
// Map tab.id -> Set of dirty object ids on that tab
var tabDirtyMap = {};
// Map tab.id -> Set of object ids of things deleted from the tab that weren't otherwise dirty
var tabDeletedNodesMap = {};
// Set of object ids of things added to a tab after initial import
var addedDirtyObjects = new Set()
var api = { var api = {
addTab: function(id) { addTab: function(id) {
tabMap[id] = []; tabMap[id] = [];
tabDirtyMap[id] = new Set();
tabDeletedNodesMap[id] = new Set();
}, },
hasTab: function(z) { hasTab: function(z) {
return tabMap.hasOwnProperty(z) return tabMap.hasOwnProperty(z)
}, },
removeTab: function(id) { removeTab: function(id) {
delete tabMap[id]; delete tabMap[id];
delete tabDirtyMap[id];
delete tabDeletedNodesMap[id];
}, },
addNode: function(n) { addNode: function(n) {
nodes[n.id] = n; nodes[n.id] = n;
if (tabMap.hasOwnProperty(n.z)) { if (tabMap.hasOwnProperty(n.z)) {
tabMap[n.z].push(n); tabMap[n.z].push(n);
api.addObjectToWorkspace(n.z, n.id, n.changed || n.moved)
} else { } else {
console.warn("Node added to unknown tab/subflow:",n); console.warn("Node added to unknown tab/subflow:",n);
tabMap["_"] = tabMap["_"] || []; tabMap["_"] = tabMap["_"] || [];
@ -267,8 +284,37 @@ RED.nodes = (function() {
if (i > -1) { if (i > -1) {
tabMap[n.z].splice(i,1); tabMap[n.z].splice(i,1);
} }
api.removeObjectFromWorkspace(n.z, n.id)
} }
}, },
/**
* Add an object to our dirty/clean tracking state
* @param {String} z
* @param {String} id
* @param {Boolean} isDirty
*/
addObjectToWorkspace: function (z, id, isDirty) {
if (isDirty) {
addedDirtyObjects.add(id)
}
if (tabDeletedNodesMap[z].has(id)) {
tabDeletedNodesMap[z].delete(id)
}
api.markNodeDirty(z, id, isDirty)
},
/**
* Remove an object from our dirty/clean tracking state
* @param {String} z
* @param {String} id
*/
removeObjectFromWorkspace: function (z, id) {
if (!addedDirtyObjects.has(id)) {
tabDeletedNodesMap[z].add(id)
} else {
addedDirtyObjects.delete(id)
}
api.markNodeDirty(z, id, false)
},
hasNode: function(id) { hasNode: function(id) {
return nodes.hasOwnProperty(id); return nodes.hasOwnProperty(id);
}, },
@ -433,6 +479,33 @@ RED.nodes = (function() {
clear: function() { clear: function() {
nodes = {}; nodes = {};
tabMap = {}; tabMap = {};
tabDirtyMap = {};
tabDeletedNodesMap = {};
addedDirtyObjects = new Set();
},
/**
* Clear all internal state on what is dirty.
*/
clearState: function () {
// Called when a deploy happens, we can forget about added/remove
// items as they have now been deployed.
addedDirtyObjects = new Set()
const flowsToCheck = new Set()
for (const [z, set] of Object.entries(tabDeletedNodesMap)) {
if (set.size > 0) {
set.clear()
flowsToCheck.add(z)
}
}
for (const [z, set] of Object.entries(tabDirtyMap)) {
if (set.size > 0) {
set.clear()
flowsToCheck.add(z)
}
}
for (const z of flowsToCheck) {
api.checkTabState(z)
}
}, },
eachNode: function(cb) { eachNode: function(cb) {
var nodeList,i,j; var nodeList,i,j;
@ -510,6 +583,36 @@ RED.nodes = (function() {
B._reordered = true; B._reordered = true;
return orderMap[A.id] - orderMap[B.id]; return orderMap[A.id] - orderMap[B.id];
}) })
},
/**
* Update our records if an object is dirty or not
* @param {String} z tab id
* @param {String} id object id
* @param {Boolean} dirty whether the object is dirty or not
*/
markNodeDirty: function(z, id, dirty) {
if (tabDirtyMap[z]) {
if (dirty) {
tabDirtyMap[z].add(id)
} else {
tabDirtyMap[z].delete(id)
}
api.checkTabState(z)
}
},
/**
* Check if a tab should update its contentsChange flag
* @param {String} z tab id
*/
checkTabState: function (z) {
const ws = workspaces[z]
if (ws) {
const contentsChanged = tabDirtyMap[z].size > 0 || tabDeletedNodesMap[z].size > 0
if (!!ws.contentsChanged !== contentsChanged) {
ws.contentsChanged = contentsChanged
RED.events.emit("flows:change", ws);
}
}
} }
} }
return api; return api;
@ -597,6 +700,11 @@ RED.nodes = (function() {
throw new Error(`Cannot modified property '${prop}' of locked object '${node.type}:${node.id}'`) throw new Error(`Cannot modified property '${prop}' of locked object '${node.type}:${node.id}'`)
} }
} }
if (node.z && (prop === 'changed' || prop === 'moved')) {
setTimeout(() => {
allNodes.markNodeDirty(node.z, node.id, node.changed || node.moved)
}, 0)
}
node[prop] = value; node[prop] = value;
return true return true
} }
@ -666,10 +774,16 @@ RED.nodes = (function() {
} }
if (l.source.z === l.target.z && linkTabMap[l.source.z]) { if (l.source.z === l.target.z && linkTabMap[l.source.z]) {
linkTabMap[l.source.z].push(l); linkTabMap[l.source.z].push(l);
allNodes.addObjectToWorkspace(l.source.z, getLinkId(l), true)
} }
RED.events.emit("links:add",l); RED.events.emit("links:add",l);
} }
function getLinkId(link) {
return link.source.id + ':' + link.sourcePort + ':' + link.target.id
}
function getNode(id) { function getNode(id) {
if (id in configNodes) { if (id in configNodes) {
return configNodes[id]; return configNodes[id];
@ -864,6 +978,7 @@ RED.nodes = (function() {
if (index !== -1) { if (index !== -1) {
linkTabMap[l.source.z].splice(index,1) linkTabMap[l.source.z].splice(index,1)
} }
allNodes.removeObjectFromWorkspace(l.source.z, getLinkId(l))
} }
} }
RED.events.emit("links:remove",l); RED.events.emit("links:remove",l);
@ -1688,6 +1803,7 @@ RED.nodes = (function() {
* Options: * Options:
* - generateIds - whether to replace all node ids * - generateIds - whether to replace all node ids
* - addFlow - whether to import nodes to a new tab * - addFlow - whether to import nodes to a new tab
* - markChanged - whether to set changed=true on all newly imported objects
* - reimport - if node has a .z property, dont overwrite it * - reimport - if node has a .z property, dont overwrite it
* Only applicible when `generateIds` is false * Only applicible when `generateIds` is false
* - importMap - how to resolve any conflicts. * - importMap - how to resolve any conflicts.
@ -1696,7 +1812,7 @@ RED.nodes = (function() {
* - id:replace - import over the top of existing * - id:replace - import over the top of existing
*/ */
function importNodes(newNodesObj,options) { // createNewIds,createMissingWorkspace) { function importNodes(newNodesObj,options) { // createNewIds,createMissingWorkspace) {
const defOpts = { generateIds: false, addFlow: false, reimport: false, importMap: {} } const defOpts = { generateIds: false, addFlow: false, markChanged: false, reimport: false, importMap: {} }
options = Object.assign({}, defOpts, options) options = Object.assign({}, defOpts, options)
options.importMap = options.importMap || {} options.importMap = options.importMap || {}
const createNewIds = options.generateIds; const createNewIds = options.generateIds;
@ -1722,7 +1838,7 @@ RED.nodes = (function() {
newNodes = newNodesObj; newNodes = newNodesObj;
} }
if (!$.isArray(newNodes)) { if (!Array.isArray(newNodes)) {
newNodes = [newNodes]; newNodes = [newNodes];
} }
@ -2020,6 +2136,9 @@ RED.nodes = (function() {
if (!n.z) { if (!n.z) {
delete configNode.z; delete configNode.z;
} }
if (options.markChanged) {
configNode.changed = true
}
if (n.hasOwnProperty('d')) { if (n.hasOwnProperty('d')) {
configNode.d = n.d; configNode.d = n.d;
} }
@ -2082,6 +2201,9 @@ RED.nodes = (function() {
if (n.hasOwnProperty('g')) { if (n.hasOwnProperty('g')) {
node.g = n.g; node.g = n.g;
} }
if (options.markChanged) {
node.changed = true
}
if (createNewIds || options.importMap[n.id] === "copy") { if (createNewIds || options.importMap[n.id] === "copy") {
if (subflow_denylist[n.z]) { if (subflow_denylist[n.z]) {
continue; continue;
@ -2595,6 +2717,7 @@ RED.nodes = (function() {
groupsByZ[group.z] = groupsByZ[group.z] || []; groupsByZ[group.z] = groupsByZ[group.z] || [];
groupsByZ[group.z].push(group); groupsByZ[group.z].push(group);
groups[group.id] = group; groups[group.id] = group;
allNodes.addObjectToWorkspace(group.z, group.id, group.changed || group.moved)
RED.events.emit("groups:add",group); RED.events.emit("groups:add",group);
return group return group
} }
@ -2611,7 +2734,7 @@ RED.nodes = (function() {
} }
} }
RED.group.markDirty(group); RED.group.markDirty(group);
allNodes.removeObjectFromWorkspace(group.z, group.id)
delete groups[group.id]; delete groups[group.id];
RED.events.emit("groups:remove",group); RED.events.emit("groups:remove",group);
} }
@ -2626,6 +2749,7 @@ RED.nodes = (function() {
if (!nodeLinks[junction.id]) { if (!nodeLinks[junction.id]) {
nodeLinks[junction.id] = {in:[],out:[]}; nodeLinks[junction.id] = {in:[],out:[]};
} }
allNodes.addObjectToWorkspace(junction.z, junction.id, junction.changed || junction.moved)
RED.events.emit("junctions:add", junction) RED.events.emit("junctions:add", junction)
return junction return junction
} }
@ -2637,6 +2761,7 @@ RED.nodes = (function() {
} }
delete junctions[junction.id] delete junctions[junction.id]
delete nodeLinks[junction.id]; delete nodeLinks[junction.id];
allNodes.removeObjectFromWorkspace(junction.z, junction.id)
RED.events.emit("junctions:remove", junction) RED.events.emit("junctions:remove", junction)
var removedLinks = links.filter(function(l) { return (l.source === junction) || (l.target === junction); }); var removedLinks = links.filter(function(l) { return (l.source === junction) || (l.target === junction); });
@ -2874,6 +2999,9 @@ RED.nodes = (function() {
RED.view.redraw(true); RED.view.redraw(true);
} }
}); });
RED.events.on('deploy', function () {
allNodes.clearState()
})
}, },
registry:registry, registry:registry,
setNodeList: registry.setNodeList, setNodeList: registry.setNodeList,
@ -2976,6 +3104,20 @@ RED.nodes = (function() {
} }
} }
}, },
eachGroup: function(cb) {
for (var group of Object.values(groups)) {
if (cb(group) === false) {
break
}
}
},
eachJunction: function(cb) {
for (var junction of Object.values(junctions)) {
if (cb(junction) === false) {
break
}
}
},
node: getNode, node: getNode,

View File

@ -845,7 +845,6 @@ RED.tabs = (function() {
var badges = $('<span class="red-ui-tabs-badges"></span>').appendTo(li); var badges = $('<span class="red-ui-tabs-badges"></span>').appendTo(li);
if (options.onselect) { if (options.onselect) {
$('<i class="red-ui-tabs-badge-changed fa fa-circle"></i>').appendTo(badges);
$('<i class="red-ui-tabs-badge-selected fa fa-check-circle"></i>').appendTo(badges); $('<i class="red-ui-tabs-badge-selected fa fa-check-circle"></i>').appendTo(badges);
} }

View File

@ -79,7 +79,8 @@ RED.contextMenu = (function () {
w: 0, h: 0, w: 0, h: 0,
outputs: 1, outputs: 1,
inputs: 1, inputs: 1,
dirty: true dirty: true,
moved: true
} }
const historyEvent = { const historyEvent = {
dirty: RED.nodes.dirty(), dirty: RED.nodes.dirty(),

View File

@ -557,12 +557,17 @@ RED.deploy = (function() {
} else { } else {
RED.notify('<p>' + RED._("deploy.successfulDeploy") + '</p>', "success"); RED.notify('<p>' + RED._("deploy.successfulDeploy") + '</p>', "success");
} }
RED.nodes.eachNode(function (node) { const flowsToLock = new Set()
const flow = node.z && (RED.nodes.workspace(node.z) || RED.nodes.subflow(node.z) || null); function ensureUnlocked(id) {
const flow = id && (RED.nodes.workspace(id) || RED.nodes.subflow(id) || null);
const isLocked = flow ? flow.locked : false; const isLocked = flow ? flow.locked : false;
if (flow && isLocked) { if (flow && isLocked) {
flow.locked = false; flow.locked = false;
flowsToLock.add(flow)
} }
}
RED.nodes.eachNode(function (node) {
ensureUnlocked(node.z)
if (node.changed) { if (node.changed) {
node.dirty = true; node.dirty = true;
node.changed = false; node.changed = false;
@ -574,10 +579,32 @@ RED.deploy = (function() {
if (node.credentials) { if (node.credentials) {
delete node.credentials; delete node.credentials;
} }
if (flow && isLocked) {
flow.locked = isLocked;
}
}); });
RED.nodes.eachGroup(function (node) {
ensureUnlocked(node.z)
if (node.changed) {
node.dirty = true;
node.changed = false;
}
if (node.moved) {
node.dirty = true;
node.moved = false;
}
})
RED.nodes.eachJunction(function (node) {
ensureUnlocked(node.z)
if (node.changed) {
node.dirty = true;
node.changed = false;
}
if (node.moved) {
node.dirty = true;
node.moved = false;
}
})
flowsToLock.forEach(flow => {
flow.locked = true
})
RED.nodes.eachConfig(function (confNode) { RED.nodes.eachConfig(function (confNode) {
confNode.changed = false; confNode.changed = false;
if (confNode.credentials) { if (confNode.credentials) {

View File

@ -488,7 +488,8 @@ RED.group = (function() {
y: Number.POSITIVE_INFINITY, y: Number.POSITIVE_INFINITY,
w: 0, w: 0,
h: 0, h: 0,
_def: RED.group.def _def: RED.group.def,
changed: true
} }
group.z = nodes[0].z; group.z = nodes[0].z;

View File

@ -145,17 +145,19 @@ RED.sidebar.config = (function() {
} else { } else {
var currentType = ""; var currentType = "";
nodes.forEach(function(node) { nodes.forEach(function(node) {
var label = RED.utils.getNodeLabel(node,node.id); var labelText = RED.utils.getNodeLabel(node,node.id);
if (node.type != currentType) { if (node.type != currentType) {
$('<li class="red-ui-palette-node-config-type">'+node.type+'</li>').appendTo(list); $('<li class="red-ui-palette-node-config-type">'+node.type+'</li>').appendTo(list);
currentType = node.type; currentType = node.type;
} }
if (node.changed) {
labelText += "!!"
}
var entry = $('<li class="red-ui-palette-node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list); var entry = $('<li class="red-ui-palette-node_id_'+node.id.replace(/\./g,"-")+'"></li>').appendTo(list);
var nodeDiv = $('<div class="red-ui-palette-node-config red-ui-palette-node"></div>').appendTo(entry); var nodeDiv = $('<div class="red-ui-palette-node-config red-ui-palette-node"></div>').appendTo(entry);
entry.data('node',node.id); entry.data('node',node.id);
nodeDiv.data('node',node.id); nodeDiv.data('node',node.id);
var label = $('<div class="red-ui-palette-label"></div>').text(label).appendTo(nodeDiv); var label = $('<div class="red-ui-palette-label"></div>').text(labelText).appendTo(nodeDiv);
if (node.d) { if (node.d) {
nodeDiv.addClass("red-ui-palette-node-config-disabled"); nodeDiv.addClass("red-ui-palette-node-config-disabled");
$('<i class="fa fa-ban"></i>').prependTo(label); $('<i class="fa fa-ban"></i>').prependTo(label);

View File

@ -1191,7 +1191,8 @@ RED.view.tools = (function() {
w: 0, h: 0, w: 0, h: 0,
outputs: 1, outputs: 1,
inputs: 1, inputs: 1,
dirty: true dirty: true,
moved: true
} }
links = links.filter(function(l) { return !removedLinks.has(l) }) links = links.filter(function(l) { return !removedLinks.has(l) })
if (links.length === 0) { if (links.length === 0) {

View File

@ -1267,7 +1267,8 @@ RED.view = (function() {
w: 0, h: 0, w: 0, h: 0,
outputs: 1, outputs: 1,
inputs: 1, inputs: 1,
dirty: true dirty: true,
moved: true
} }
historyEvent = { historyEvent = {
t:'add', t:'add',
@ -3307,7 +3308,7 @@ RED.view = (function() {
console.log("Definition error: "+node.type+"."+((portType === PORT_TYPE_INPUT)?"inputLabels":"outputLabels"),err); console.log("Definition error: "+node.type+"."+((portType === PORT_TYPE_INPUT)?"inputLabels":"outputLabels"),err);
result = null; result = null;
} }
} else if ($.isArray(portLabels)) { } else if (Array.isArray(portLabels)) {
result = portLabels[portIndex]; result = portLabels[portIndex];
} }
return result; return result;
@ -5699,7 +5700,7 @@ RED.view = (function() {
if (mouse_mode === RED.state.SELECTING_NODE) { if (mouse_mode === RED.state.SELECTING_NODE) {
return; return;
} }
const wasDirty = RED.nodes.dirty()
var nodesToImport; var nodesToImport;
if (typeof newNodesObj === "string") { if (typeof newNodesObj === "string") {
if (newNodesObj === "") { if (newNodesObj === "") {
@ -5716,7 +5717,7 @@ RED.view = (function() {
nodesToImport = newNodesObj; nodesToImport = newNodesObj;
} }
if (!$.isArray(nodesToImport)) { if (!Array.isArray(nodesToImport)) {
nodesToImport = [nodesToImport]; nodesToImport = [nodesToImport];
} }
if (options.generateDefaultNames) { if (options.generateDefaultNames) {
@ -5749,7 +5750,12 @@ RED.view = (function() {
return (n.type === "global-config"); return (n.type === "global-config");
}); });
} }
var result = RED.nodes.import(filteredNodesToImport,{generateIds:options.generateIds, addFlow: addNewFlow, importMap: options.importMap}); var result = RED.nodes.import(filteredNodesToImport,{
generateIds: options.generateIds,
addFlow: addNewFlow,
importMap: options.importMap,
markChanged: true
});
if (result) { if (result) {
var new_nodes = result.nodes; var new_nodes = result.nodes;
var new_links = result.links; var new_links = result.links;
@ -5765,7 +5771,7 @@ RED.view = (function() {
var new_ms = new_nodes.filter(function(n) { return n.hasOwnProperty("x") && n.hasOwnProperty("y") && n.z == RED.workspaces.active() }); var new_ms = new_nodes.filter(function(n) { return n.hasOwnProperty("x") && n.hasOwnProperty("y") && n.z == RED.workspaces.active() });
new_ms = new_ms.concat(new_groups.filter(function(g) { return g.z === RED.workspaces.active()})) new_ms = new_ms.concat(new_groups.filter(function(g) { return g.z === RED.workspaces.active()}))
new_ms = new_ms.concat(new_junctions.filter(function(j) { return j.z === RED.workspaces.active()})) new_ms = new_ms.concat(new_junctions.filter(function(j) { return j.z === RED.workspaces.active()}))
var new_node_ids = new_nodes.map(function(n){ n.changed = true; return n.id; }); var new_node_ids = new_nodes.map(function(n){ return n.id; });
clearSelection(); clearSelection();
movingSet.clear(); movingSet.clear();
@ -5845,14 +5851,14 @@ RED.view = (function() {
} }
var historyEvent = { var historyEvent = {
t:"add", t: "add",
nodes:new_node_ids, nodes: new_node_ids,
links:new_links, links: new_links,
groups:new_groups, groups: new_groups,
junctions: new_junctions, junctions: new_junctions,
workspaces:new_workspaces, workspaces: new_workspaces,
subflows:new_subflows, subflows: new_subflows,
dirty:RED.nodes.dirty() dirty: wasDirty
}; };
if (movingSet.length() === 0) { if (movingSet.length() === 0) {
RED.nodes.dirty(true); RED.nodes.dirty(true);
@ -5861,7 +5867,7 @@ RED.view = (function() {
var subflowRefresh = RED.subflow.refresh(true); var subflowRefresh = RED.subflow.refresh(true);
if (subflowRefresh) { if (subflowRefresh) {
historyEvent.subflow = { historyEvent.subflow = {
id:activeSubflow.id, id: activeSubflow.id,
changed: activeSubflowChanged, changed: activeSubflowChanged,
instances: subflowRefresh.instances instances: subflowRefresh.instances
} }

View File

@ -375,6 +375,12 @@ RED.workspaces = (function() {
$("#red-ui-tab-"+(tab.id.replace(".","-"))).addClass('red-ui-workspace-locked'); $("#red-ui-tab-"+(tab.id.replace(".","-"))).addClass('red-ui-workspace-locked');
} }
const changeBadgeContainer = $('<svg class="red-ui-flow-tab-changed red-ui-flow-node-changed" width="10" height="10" viewBox="-1 -1 12 12"></svg>').appendTo("#red-ui-tab-"+(tab.id.replace(".","-")))
const changeBadge = document.createElementNS("http://www.w3.org/2000/svg","circle");
changeBadge.setAttribute("cx",5);
changeBadge.setAttribute("cy",5);
changeBadge.setAttribute("r",5);
changeBadgeContainer.append(changeBadge)
RED.menu.setDisabled("menu-item-workspace-delete",activeWorkspace === 0 || workspaceTabCount <= 1); RED.menu.setDisabled("menu-item-workspace-delete",activeWorkspace === 0 || workspaceTabCount <= 1);
if (workspaceTabCount === 1) { if (workspaceTabCount === 1) {
@ -637,6 +643,11 @@ RED.workspaces = (function() {
RED.workspaces.show(viewStack[++viewStackPos],true); RED.workspaces.show(viewStack[++viewStackPos],true);
} }
}) })
RED.events.on("flows:change", (ws) => {
$("#red-ui-tab-"+(ws.id.replace(".","-"))).toggleClass('red-ui-workspace-changed',!!(ws.contentsChanged || ws.changed));
})
hideWorkspace(); hideWorkspace();
} }

View File

@ -105,6 +105,15 @@
} }
} }
} }
.red-ui-tab:not(.red-ui-workspace-changed) .red-ui-flow-tab-changed {
display: none;
}
.red-ui-tab.red-ui-workspace-changed .red-ui-flow-tab-changed {
display: inline-block;
position: absolute;
top: 1px;
right: 1px;
}
.red-ui-workspace-locked-icon { .red-ui-workspace-locked-icon {
display: none; display: none;