@@ -107,11 +111,12 @@ export class Workspaces extends React.Component {
- {this.workspaces.map(({ id: workspaceId, name, description }) => {
+ {this.workspaces.map(({ id: workspaceId, name, description, ownerRef }) => {
const isActive = workspaceStore.currentWorkspaceId === workspaceId;
const isDefault = workspaceStore.isDefault(workspaceId);
const isEditing = this.editingWorkspaces.has(workspaceId);
const editingWorkspace = this.editingWorkspaces.get(workspaceId);
+ const managed = !!ownerRef
const className = cssNames("workspace flex gaps", {
active: isActive,
editing: isEditing,
@@ -130,7 +135,7 @@ export class Workspaces extends React.Component {
{isActive &&
(current)}
{description}
- {!isDefault && (
+ {!isDefault && !managed && (
{
- static VISIBILITY_DELAY_MS = 100;
+ static VISIBILITY_DELAY_MS = 0;
static defaultProps: AnimateProps = {
name: "opacity",
diff --git a/src/renderer/components/cluster-manager/bottom-bar.scss b/src/renderer/components/cluster-manager/bottom-bar.scss
index 021ac7e8d7..833e7b9bfc 100644
--- a/src/renderer/components/cluster-manager/bottom-bar.scss
+++ b/src/renderer/components/cluster-manager/bottom-bar.scss
@@ -4,8 +4,9 @@
font-size: $font-size-small;
background-color: #3d90ce;
- padding: 0 $padding;
+ padding: 0 2px;
color: white;
+ height: 22px;
#current-workspace {
padding: $padding / 4 $padding / 2;
diff --git a/src/renderer/components/cluster-manager/bottom-bar.tsx b/src/renderer/components/cluster-manager/bottom-bar.tsx
index e29ea3bc56..fe7876f397 100644
--- a/src/renderer/components/cluster-manager/bottom-bar.tsx
+++ b/src/renderer/components/cluster-manager/bottom-bar.tsx
@@ -14,7 +14,7 @@ export class BottomBar extends React.Component {
return (
-
+
{currentWorkspace.name}
{
}
render() {
- const { className } = this.props;
- const { newContexts } = userStore;
- const clusters = clusterStore.getByWorkspaceId(workspaceStore.currentWorkspaceId);
+ const { className } = this.props
+ const { newContexts } = userStore
+ const workspace = workspaceStore.getById(workspaceStore.currentWorkspaceId)
+ const clusters = clusterStore.getByWorkspaceId(workspace.id)
+ const activeClusterId = clusterStore.activeCluster
return (
@@ -112,7 +114,7 @@ export class ClustersMenu extends React.Component
{
{({ innerRef, droppableProps, placeholder }: DroppableProvided) => (
{clusters.map((cluster, index) => {
- const isActive = cluster.id === clusterStore.activeClusterId;
+ const isActive = cluster.id === activeClusterId;
return (
{({ draggableProps, dragHandleProps, innerRef }: DraggableProvided) => (
@@ -136,11 +138,11 @@ export class ClustersMenu extends React.Component {
+
Add Cluster
-
+
{newContexts.size > 0 && (
new}/>
)}
diff --git a/src/renderer/components/icon/icon.scss b/src/renderer/components/icon/icon.scss
index 529a8d8551..253423bd4c 100644
--- a/src/renderer/components/icon/icon.scss
+++ b/src/renderer/components/icon/icon.scss
@@ -1,6 +1,7 @@
.Icon {
--size: 21px;
--small-size: 18px;
+ --smallest-size: 16px;
--big-size: 32px;
--color-active: #{$iconActiveColor};
--bgc-active: #{$iconActiveBackground};
@@ -21,6 +22,12 @@
width: var(--size);
height: var(--size);
+ &.smallest {
+ font-size: var(--smallest-size);
+ width: var(--smallest-size);
+ height: var(--smallest-size);
+ }
+
&.small {
font-size: var(--small-size);
width: var(--small-size);
diff --git a/src/renderer/components/icon/icon.tsx b/src/renderer/components/icon/icon.tsx
index 81635faae1..8fc86e6301 100644
--- a/src/renderer/components/icon/icon.tsx
+++ b/src/renderer/components/icon/icon.tsx
@@ -15,6 +15,7 @@ export interface IconProps extends React.HTMLAttributes, TooltipDecoratorPr
href?: string; // render icon as hyperlink
size?: string | number; // icon-size
small?: boolean; // pre-defined icon-size
+ smallest?: boolean; // pre-defined icon-size
big?: boolean; // pre-defined icon-size
active?: boolean; // apply active-state styles
interactive?: boolean; // indicates that icon is interactive and highlight it on focus/hover
@@ -63,7 +64,7 @@ export class Icon extends React.PureComponent {
const { isInteractive } = this;
const {
// skip passing props to icon's html element
- className, href, link, material, svg, size, small, big,
+ className, href, link, material, svg, size, smallest, small, big,
disabled, sticker, active, focusable, children,
interactive: _interactive,
onClick: _onClick,
@@ -75,7 +76,7 @@ export class Icon extends React.PureComponent {
const iconProps: Partial = {
className: cssNames("Icon", className,
{ svg, material, interactive: isInteractive, disabled, sticker, active, focusable },
- !size ? { small, big } : {}
+ !size ? { smallest, small, big } : {}
),
onClick: isInteractive ? this.onClick : undefined,
onKeyDown: isInteractive ? this.onKeyDown : undefined,