Format

kylecarbs · kylecarbs · commit bf8c49e6ccaf · 2022-10-17T16:38:48.000Z
diff --git a/site/src/api/api.ts b/site/src/api/api.ts
@@ -648,8 +648,7 @@ export const getDeploymentFlags =
     return response.data
   }
 
-export const getReplicas =
-  async (): Promise<TypesGen.Replica[]> => {
-    const response = await axios.get(`/api/v2/replicas`)
-    return response.data
-  }
+export const getReplicas = async (): Promise<TypesGen.Replica[]> => {
+  const response = await axios.get(`/api/v2/replicas`)
+  return response.data
+}
diff --git a/site/src/components/DeploySettingsLayout/Option.tsx b/site/src/components/DeploySettingsLayout/Option.tsx
@@ -32,7 +32,7 @@ const useStyles = makeStyles((theme) => ({
   optionValue: {
     fontSize: 14,
     fontFamily: MONOSPACE_FONT_FAMILY,
-  
+
     "& ul": {
       padding: theme.spacing(2),
     },
diff --git a/site/src/pages/DeploySettingsPage/NetworkSettingsPage.tsx b/site/src/pages/DeploySettingsPage/NetworkSettingsPage.tsx
@@ -4,22 +4,28 @@ import TableCell from "@material-ui/core/TableCell"
 import TableContainer from "@material-ui/core/TableContainer"
 import TableHead from "@material-ui/core/TableHead"
 import TableRow from "@material-ui/core/TableRow"
+import { useMachine } from "@xstate/react"
 import {
+  Badges,
   DisabledBadge,
-  EnabledBadge
+  EnabledBadge,
+  EnterpriseBadge,
 } from "components/DeploySettingsLayout/Badges"
 import { useDeploySettings } from "components/DeploySettingsLayout/DeploySettingsLayout"
 import { Header } from "components/DeploySettingsLayout/Header"
 import {
   OptionDescription,
   OptionName,
-  OptionValue
+  OptionValue,
 } from "components/DeploySettingsLayout/Option"
+import { ReplicasTable } from "components/ReplicasTable/ReplicasTable"
 import { Stack } from "components/Stack/Stack"
 import React from "react"
+import { highAvailabilityMachine } from "xServices/deploymentFlags/highAvailabilityMachine"
 
 const NetworkSettingsPage: React.FC = () => {
   const { deploymentFlags } = useDeploySettings()
+  const [state] = useMachine(highAvailabilityMachine)
 
   return (
     <Stack direction="column" spacing={6}>
@@ -114,6 +120,26 @@ const NetworkSettingsPage: React.FC = () => {
           </Table>
         </TableContainer>
       </div>
+
+      <div>
+        <Header
+          title="High Availability"
+          secondary
+          description="Deploy Coder multi regionally for high availability. Only active if more than one replica exists."
+          docsHref="https://coder.com/docs/coder-oss/latest/admin/auth#openid-connect-with-google"
+        />
+
+        <Badges>
+          {deploymentFlags.derp_server_relay_address.value ? (
+            <EnabledBadge />
+          ) : (
+            <DisabledBadge />
+          )}
+          <EnterpriseBadge />
+        </Badges>
+
+        <ReplicasTable replicas={state.context.replicas || []} />
+      </div>
     </Stack>
   )
 }
diff --git a/site/src/pages/DeploySettingsPage/SecuritySettingsPage.tsx b/site/src/pages/DeploySettingsPage/SecuritySettingsPage.tsx
@@ -5,14 +5,17 @@ import TableContainer from "@material-ui/core/TableContainer"
 import TableHead from "@material-ui/core/TableHead"
 import TableRow from "@material-ui/core/TableRow"
 import {
-  Badges, DisabledBadge, EnabledBadge, EnterpriseBadge
+  Badges,
+  DisabledBadge,
+  EnabledBadge,
+  EnterpriseBadge,
 } from "components/DeploySettingsLayout/Badges"
 import { useDeploySettings } from "components/DeploySettingsLayout/DeploySettingsLayout"
 import { Header } from "components/DeploySettingsLayout/Header"
 import {
   OptionDescription,
   OptionName,
-  OptionValue
+  OptionValue,
 } from "components/DeploySettingsLayout/Option"
 import { Stack } from "components/Stack/Stack"
 import React from "react"
@@ -56,7 +59,9 @@ const SecuritySettingsPage: React.FC = () => {
               </TableRow>
               <TableRow>
                 <TableCell>
-                  <OptionName>{deploymentFlags.secure_auth_cookie.name}</OptionName>
+                  <OptionName>
+                    {deploymentFlags.secure_auth_cookie.name}
+                  </OptionName>
                   <OptionDescription>
                     {deploymentFlags.secure_auth_cookie.description}
                   </OptionDescription>
@@ -192,7 +197,9 @@ const SecuritySettingsPage: React.FC = () => {
 
               <TableRow>
                 <TableCell>
-                  <OptionName>{deploymentFlags.tls_min_version.name}</OptionName>
+                  <OptionName>
+                    {deploymentFlags.tls_min_version.name}
+                  </OptionName>
                   <OptionDescription>
                     {deploymentFlags.tls_min_version.description}
                   </OptionDescription>
diff --git a/site/src/xServices/auth/authXService.ts b/site/src/xServices/auth/authXService.ts
@@ -354,8 +354,8 @@ export const authMachine =
                 idle: {
                   on: {
                     GET_AUTH_METHODS: {
-                      target: "gettingMethods"
-                    }, 
+                      target: "gettingMethods",
+                    },
                   },
                 },
                 gettingMethods: {
