Skip to content

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

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 23 commits into from
May 11, 2023
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
WIP, this is a broken axios
  • Loading branch information
Emyrk committed May 10, 2023
commit 40ec420bc8e5bc63fcd0d3be641ac68ccc41cd1e
60 changes: 60 additions & 0 deletions site/src/contexts/ProxyContext.tsx
Original file line number Diff line number Diff line change
@@ -1,18 +1,22 @@
import { useQuery } from "@tanstack/react-query"
import { getWorkspaceProxies } from "api/api"
import { Region } from "api/typesGenerated"
import axios from "axios"
import { useDashboard } from "components/Dashboard/DashboardProvider"
import {
createContext,
FC,
PropsWithChildren,
useContext,
useEffect,
useState,
} from "react"

interface ProxyContextValue {
proxy: PreferredProxy
proxies?: Region[]
// proxyLatenciesMS are recorded in milliseconds.
proxyLatenciesMS?: Record<string, number>
// isfetched is true when the proxy api call is complete.
isFetched: boolean
// isLoading is true if the proxy is in the process of being fetched.
Expand Down Expand Up @@ -52,6 +56,9 @@ export const ProxyProvider: FC<PropsWithChildren> = ({ children }) => {
}

const [proxy, setProxy] = useState<PreferredProxy>(savedProxy)
const [proxyLatenciesMS, setProxyLatenciesMS] = useState<
Record<string, number>
>({})

const dashboard = useDashboard()
const experimentEnabled = dashboard?.experiments.includes("moons")
Expand All @@ -72,6 +79,58 @@ export const ProxyProvider: FC<PropsWithChildren> = ({ children }) => {
},
})

// Everytime we get a new proxiesResponse, update the latency check
// to each workspace proxy.
useEffect(() => {
const latencyAxios = axios.create()
latencyAxios.interceptors.request.use((config) => {
config.data = config.data || {}
config.data.startTime = new Date()
console.log("Hey kira", config, config.data)
return config
})

latencyAxios.interceptors.response.use(
// Success 200
(x) => {
// Get elapsed time (in milliseconds)
const end = new Date()
x.config.data = {
...x.config.data,
...{
endTime: end,
responseTime: end.getTime() - x.config.data.requestStartedAt,
},
}
return x
},
// Handle 4xx & 5xx responses
(x) => {
// Get elapsed time (in milliseconds)
const end = new Date()
x.config.data = x.config.data || {
...x.config.data,
...{
endTime: end,
responseTime: end.getTime() - x.config.data.requestStartedAt,
},
}
return x
},
)

// AgentLatency.tsx for colors
console.log("update workspace proxies", proxiesResp)
latencyAxios
.get<any>("/api/v2/users/authmethods")
.then((resp) => {
console.log("latency", resp)
})
.catch((err) => {
console.log("latency error", err)
})
}, [proxiesResp])

const setAndSaveProxy = (
selectedProxy?: Region,
// By default the proxies come from the api call above.
Expand All @@ -95,6 +154,7 @@ export const ProxyProvider: FC<PropsWithChildren> = ({ children }) => {
return (
<ProxyContext.Provider
value={{
proxyLatenciesMS: proxyLatenciesMS,
proxy: experimentEnabled
? proxy
: {
Expand Down