feat: Add deployment settings page (#4590)

* Add base components for the Settings Page

* WIP OIDC page

* Imrove layout

* Add table

* Abstract option

* Refactor badges

* Load settings from the API

* Update deployment page

* feat: Add deployment settings page

This allows deployment admins to view options
set on their deployments.

* Format

* Remove replicas table since it's not used

* Remove references to HA table

* Fix tests

* Improve language

Co-authored-by: Bruno Quaresma <bruno@coder.com>

site/src/components/DeploySettingsLayout/Header.tsx

@@ -0,0 +1,67 @@
+import Button from "@material-ui/core/Button"
+import { makeStyles } from "@material-ui/core/styles"
+import LaunchOutlined from "@material-ui/icons/LaunchOutlined"
+import { Stack } from "components/Stack/Stack"
+import React from "react"
+
+export const Header: React.FC<{
+  title: string | JSX.Element
+  description: string | JSX.Element
+  secondary?: boolean
+  docsHref?: string
+}> = ({ title, description, docsHref, secondary }) => {
+  const styles = useStyles()
+
+  return (
+    <Stack alignItems="baseline" direction="row" justifyContent="space-between">
+      <div className={styles.headingGroup}>
+        <h1 className={`${styles.title} ${secondary ? "secondary" : ""}`}>
+          {title}
+        </h1>
+        <span className={styles.description}>{description}</span>
+      </div>
+
+      {docsHref && (
+        <Button
+          size="small"
+          startIcon={<LaunchOutlined />}
+          component="a"
+          href={docsHref}
+          target="_blank"
+          variant="outlined"
+        >
+          Read the docs
+        </Button>
+      )}
+    </Stack>
+  )
+}
+
+const useStyles = makeStyles((theme) => ({
+  headingGroup: {
+    maxWidth: 420,
+    marginBottom: theme.spacing(3),
+  },
+
+  title: {
+    fontSize: 32,
+    fontWeight: 700,
+    display: "flex",
+    alignItems: "center",
+    lineHeight: "initial",
+    margin: 0,
+    marginBottom: theme.spacing(0.5),
+    gap: theme.spacing(1),
+
+    "&.secondary": {
+      fontSize: 24,
+      fontWeight: 500,
+    },
+  },
+
+  description: {
+    fontSize: 14,
+    color: theme.palette.text.secondary,
+    lineHeight: "160%",
+  },
+}))