feat: add derp only text to proxies list in dashboard (#8932)

deansheather · web-flow · commit 67ff2077a63e · 2023-08-08T01:52:06.000+10:00
diff --git a/site/src/components/DeploySettingsLayout/Badges.tsx b/site/src/components/DeploySettingsLayout/Badges.tsx
@@ -23,11 +23,15 @@ export const EntitledBadge: FC = () => {
   )
 }
 
-export const HealthyBadge: FC = () => {
+export const HealthyBadge: FC<{ derpOnly: boolean }> = ({ derpOnly }) => {
   const styles = useStyles()
+  let text = "Healthy"
+  if (derpOnly) {
+    text = "Healthy (DERP Only)"
+  }
   return (
     <span className={combineClasses([styles.badge, styles.enabledBadge])}>
-      Healthy
+      {text}
     </span>
   )
 }
diff --git a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyRow.tsx b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyRow.tsx
@@ -169,9 +169,14 @@ const DetailedProxyStatus: FC<{
     return <ProxyStatus proxy={proxy} />
   }
 
+  let derpOnly = false
+  if ("derp_only" in proxy) {
+    derpOnly = proxy.derp_only
+  }
+
   switch (proxy.status.status) {
     case "ok":
-      return <HealthyBadge />
+      return <HealthyBadge derpOnly={derpOnly} />
     case "unhealthy":
       return <NotHealthyBadge />
     case "unreachable":
@@ -189,7 +194,7 @@ const ProxyStatus: FC<{
 }> = ({ proxy }) => {
   let icon = <NotHealthyBadge />
   if (proxy.healthy) {
-    icon = <HealthyBadge />
+    icon = <HealthyBadge derpOnly={false} />
   }
 
   return icon

Original file line number	Diff line number	Diff line change
`@@ -23,11 +23,15 @@ export const EntitledBadge: FC = () => {`
`23`	`23`	`)`
`24`	`24`	`}`
`25`	`25`
`26`		`-export const HealthyBadge: FC = () => {`
	`26`	`+export const HealthyBadge: FC<{ derpOnly: boolean }> = ({ derpOnly }) => {`
`27`	`27`	`const styles = useStyles()`
	`28`	`+ let text = "Healthy"`
	`29`	`+ if (derpOnly) {`
	`30`	`+ text = "Healthy (DERP Only)"`
	`31`	`+ }`
`28`	`32`	`return (`
`29`	`33`	`<span className={combineClasses([styles.badge, styles.enabledBadge])}>`
`30`		`- Healthy`
	`34`	`+ {text}`
`31`	`35`	`</span>`
`32`	`36`	`)`
`33`	`37`	`}`