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

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>
   )
 }

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