diff --git a/ui100/src/AccessEdge.tsx b/ui100/src/AccessEdge.tsx
index 48f16b1f..2c542fe2 100644
--- a/ui100/src/AccessEdge.tsx
+++ b/ui100/src/AccessEdge.tsx
@@ -2,7 +2,11 @@ import {BaseEdge, EdgeProps} from "@xyflow/react";
const AccessEdge = (props: EdgeProps) => {
const { sourceX, sourceY, targetX, targetY, id, markerEnd } = props;
- const edgePath = `M ${sourceX} ${sourceY} L ${sourceX} ${sourceY + 20} L ${targetX} ${targetY + 20} L ${targetX} ${targetY}`;
+ const edgePath = `M ${sourceX} ${sourceY} ` +
+ `L ${sourceX} ${sourceY + 20} ` +
+ `L ${sourceX + (targetX - sourceX) / 2} ${sourceY + 50 + ((sourceX - targetX) * .05) + (targetY - sourceY) / 2} ` +
+ `L ${targetX} ${targetY + 20} ` +
+ `L ${targetX} ${targetY}`;
return ;
}
diff --git a/ui100/src/AccessPanel.tsx b/ui100/src/AccessPanel.tsx
index 1c81f255..6fe7d5d2 100644
--- a/ui100/src/AccessPanel.tsx
+++ b/ui100/src/AccessPanel.tsx
@@ -124,10 +124,13 @@ const AccessPanel = ({ access }: AccessPanelProps) => {
-
+
{String(access.data.label)}
+
+ A private access frontend with the token {access.id}
+
diff --git a/ui100/src/AccountPanel.tsx b/ui100/src/AccountPanel.tsx
index e937b915..fab278c1 100644
--- a/ui100/src/AccountPanel.tsx
+++ b/ui100/src/AccountPanel.tsx
@@ -11,7 +11,7 @@ interface AccountPanelProps {
account: Node;
}
-const AccountPanel = ({ account}: AccountPanelProps) => {
+const AccountPanel = ({ account }: AccountPanelProps) => {
const user = useStore((state) => state.user);
const customProps = {
@@ -24,10 +24,13 @@ const AccountPanel = ({ account}: AccountPanelProps) => {
return (
-
+
{String(account.data.label)}
+
+ Your zrok account identified by the email {user.email}
+
diff --git a/ui100/src/EnvironmentPanel.tsx b/ui100/src/EnvironmentPanel.tsx
index fed12971..e5d7a662 100644
--- a/ui100/src/EnvironmentPanel.tsx
+++ b/ui100/src/EnvironmentPanel.tsx
@@ -128,10 +128,13 @@ const EnvironmentPanel = ({environment}: EnvironmentPanelProps) => {
return (
<>
-
+
{String(environment.data.label)}
+
+ An environment on a host with address {detail ? detail.address : ''}
+
diff --git a/ui100/src/SharePanel.tsx b/ui100/src/SharePanel.tsx
index 8970f177..88056902 100644
--- a/ui100/src/SharePanel.tsx
+++ b/ui100/src/SharePanel.tsx
@@ -130,12 +130,15 @@ const SharePanel = ({ share }: SharePanelProps) => {
return (
<>
-
+
- {String(share.data.label)}
+ {String(share.data.label)}
+
+
+ A {detail ? detail.shareMode : ''}{detail && detail.reserved ? ', reserved ' : ''} share with the token {share.id}
-
+
diff --git a/ui100/src/TabularView.tsx b/ui100/src/TabularView.tsx
index eea0c813..61901f10 100644
--- a/ui100/src/TabularView.tsx
+++ b/ui100/src/TabularView.tsx
@@ -162,6 +162,9 @@ const TabularView = () => {
}
},
positionToolbarAlertBanner: "bottom",
+ mrtTheme: (theme) => ({
+ matchHighlightColor: 'rgba(155, 243, 22, 1)'
+ }),
});
return (