feat: Workspace Proxy picker show latency to each proxy (#7486)

* chore: Add cors to workspace proxies to allow for latency checks
* Add latency check to wsproxy

Use performance API timings.
- Fix cors and timing headers
- Accept custom headers

site/src/utils/colors.ts

@@ -1,3 +1,5 @@
+import { Theme } from "@mui/material/styles"
+
 // Used to convert our theme colors to Hex since monaco theme only support hex colors
 // From https://www.jameslmilner.com/posts/converting-rgb-hex-hsl-colors/
 export function hslToHex(hsl: string): string {
@@ -21,3 +23,15 @@ export function hslToHex(hsl: string): string {
   }
   return `#${f(0)}${f(8)}${f(4)}`
 }
+
+// getLatencyColor is the text color to use for a given latency
+// in milliseconds.
+export const getLatencyColor = (theme: Theme, latency: number) => {
+  let color = theme.palette.success.light
+  if (latency >= 150 && latency < 300) {
+    color = theme.palette.warning.light
+  } else if (latency >= 300) {
+    color = theme.palette.error.light
+  }
+  return color
+}