emotion: WorkspaceProxyPage

coder · aslilac · Nov 2, 2023 · Oct 31, 2023 · Oct 31, 2023 · Oct 31, 2023
commit 13db92daa19d47d5cd51de0f54f61f462d6f8424
diff --git a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyPage.tsx b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyPage.tsx
@@ -1,12 +1,9 @@
-import { FC, PropsWithChildren } from "react";
+import { type FC, type PropsWithChildren } from "react";
 import { Section } from "components/SettingsLayout/Section";
 import { WorkspaceProxyView } from "./WorkspaceProxyView";
-import makeStyles from "@mui/styles/makeStyles";
 import { useProxy } from "contexts/ProxyContext";
 
 export const WorkspaceProxyPage: FC<PropsWithChildren<unknown>> = () => {
-  const styles = useStyles();
-
   const description =
     "Workspace proxies improve terminal and web app connections to workspaces.";
 
@@ -22,7 +19,15 @@ export const WorkspaceProxyPage: FC<PropsWithChildren<unknown>> = () => {
   return (
     <Section
       title="Workspace Proxies"
-      className={styles.section}
+      css={(theme) => ({
+        "& code": {
+          background: theme.palette.divider,
+          fontSize: 12,
+          padding: "2px 4px",
+          color: theme.palette.text.primary,
+          borderRadius: 2,
+        },
+      })}
       description={description}
       layout="fluid"
     >
@@ -38,16 +43,4 @@ export const WorkspaceProxyPage: FC<PropsWithChildren<unknown>> = () => {
   );
 };
 
-const useStyles = makeStyles((theme) => ({
-  section: {
-    "& code": {
-      background: theme.palette.divider,
-      fontSize: 12,
-      padding: "2px 4px",
-      color: theme.palette.text.primary,
-      borderRadius: 2,
-    },
-  },
-}));
-
 export default WorkspaceProxyPage;