Use new context

Emyrk · Emyrk · commit 0683412763b0 · 2023-04-26T09:59:18.000-05:00
diff --git a/site/src/app.tsx b/site/src/app.tsx
@@ -9,6 +9,7 @@ import { ErrorBoundary } from "./components/ErrorBoundary/ErrorBoundary"
 import { GlobalSnackbar } from "./components/GlobalSnackbar/GlobalSnackbar"
 import { dark } from "./theme"
 import "./theme/globalFonts"
+import { ProxyProvider } from "contexts/ProxyContext"
 
 const queryClient = new QueryClient({
   defaultOptions: {
@@ -29,8 +30,10 @@ export const AppProviders: FC<PropsWithChildren> = ({ children }) => {
         <ErrorBoundary>
           <QueryClientProvider client={queryClient}>
             <AuthProvider>
-              {children}
-              <GlobalSnackbar />
+              <ProxyProvider>
+                {children}
+                <GlobalSnackbar />
+              </ProxyProvider>
             </AuthProvider>
           </QueryClientProvider>
         </ErrorBoundary>
diff --git a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyPage.tsx b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyPage.tsx
@@ -6,6 +6,7 @@ import { Trans } from "react-i18next"
 import { useWorkspaceProxiesData } from "./hooks"
 import { Region } from "api/typesGenerated"
 import { displayError } from "components/GlobalSnackbar/utils"
+import { useProxy } from "contexts/ProxyContext"
 // import { ConfirmDeleteDialog } from "./components"
 // import { Stack } from "components/Stack/Stack"
 // import Button from "@material-ui/core/Button"
@@ -24,7 +25,7 @@ export const WorkspaceProxyPage: FC<PropsWithChildren<unknown>> = () => {
     </Trans>
   )
 
-  const [preferred, setPreferred] = useState(getPreferredProxy())
+  const { value, setValue } = useProxy()
 
   const {
     data: response,
@@ -46,21 +47,15 @@ export const WorkspaceProxyPage: FC<PropsWithChildren<unknown>> = () => {
           isLoading={isFetching}
           hasLoaded={isFetched}
           getWorkspaceProxiesError={getProxiesError}
-          preferredProxy={preferred}
+          preferredProxy={value.selectedRegion}
           onSelect={(proxy) => {
             if (!proxy.healthy) {
               displayError("Please select a healthy workspace proxy.")
               return
             }
-            // normProxy is a normalized proxy to
-            const normProxy = {
-              ...proxy,
-              // Trim trailing slashes to be consistent
-              path_app_url: proxy.path_app_url.replace(/\/$/, ""),
-            }
 
-            savePreferredProxy(normProxy)
-            setPreferred(normProxy)
+            // Set the fetched regions + the selected proxy 
+            setValue(response ? response.regions : [], proxy)
           }}
         />
       </Section>
@@ -81,24 +76,3 @@ const useStyles = makeStyles((theme) => ({
 }))
 
 export default WorkspaceProxyPage
-
-// Exporting to be used in the tests
-export const savePreferredProxy = (proxy: Region): void => {
-  window.localStorage.setItem("preferred-proxy", JSON.stringify(proxy))
-}
-
-export const getPreferredProxy = (): Region | undefined => {
-  const str = localStorage.getItem("preferred-proxy")
-  if (str === undefined || str === null) {
-    return undefined
-  }
-  const proxy = JSON.parse(str)
-  if (proxy.id === undefined || proxy.id === null) {
-    return undefined
-  }
-  return proxy
-}
-
-export const clearPreferredProxy = (): void => {
-  localStorage.removeItem("preferred-proxy")
-}
diff --git a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/hooks.ts b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/hooks.ts
@@ -1,10 +1,7 @@
 import {
   useQuery,
-  useMutation,
-  useQueryClient,
-  QueryKey,
 } from "@tanstack/react-query"
-import { deleteToken, getWorkspaceProxies } from "api/api"
+import { getWorkspaceProxies } from "api/api"
 
 // Loads all workspace proxies
 export const useWorkspaceProxiesData = () => {
@@ -16,16 +13,3 @@ export const useWorkspaceProxiesData = () => {
     ...result,
   }
 }
-
-// Delete a token
-export const useDeleteToken = (queryKey: QueryKey) => {
-  const queryClient = useQueryClient()
-
-  return useMutation({
-    mutationFn: deleteToken,
-    onSuccess: () => {
-      // Invalidate and refetch
-      void queryClient.invalidateQueries(queryKey)
-    },
-  })
-}
