emotion: LicensesSettingsPageView

aslilac · aslilac · commit f132aee08512 · 2023-11-01T18:51:16.000Z
diff --git a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx
@@ -1,13 +1,14 @@
+import { type Interpolation, type Theme } from "@emotion/react";
 import Button from "@mui/material/Button";
-import { makeStyles, useTheme } from "@mui/styles";
+import { useTheme } from "@mui/styles";
 import Skeleton from "@mui/material/Skeleton";
 import AddIcon from "@mui/icons-material/AddOutlined";
 import RefreshIcon from "@mui/icons-material/Refresh";
-import { GetLicensesResponse } from "api/api";
+import type { GetLicensesResponse } from "api/api";
 import { Header } from "components/DeploySettingsLayout/Header";
 import { LicenseCard } from "./LicenseCard";
 import { Stack } from "components/Stack/Stack";
-import { FC } from "react";
+import { type FC } from "react";
 import Confetti from "react-confetti";
 import { Link } from "react-router-dom";
 import useWindowSize from "react-use/lib/useWindowSize";
@@ -38,10 +39,8 @@ const LicensesSettingsPageView: FC<Props> = ({
   removeLicense,
   refreshEntitlements,
 }) => {
-  const styles = useStyles();
-  const { width, height } = useWindowSize();
-
   const theme = useTheme();
+  const { width, height } = useWindowSize();
 
   return (
     <>
@@ -130,27 +129,27 @@ const LicensesSettingsPageView: FC<Props> = ({
   );
 };
 
-const useStyles = makeStyles((theme) => ({
-  title: {
+const styles = {
+  title: (theme) => ({
     fontSize: theme.spacing(2),
-  },
+  }),
 
-  root: {
+  root: (theme) => ({
     minHeight: theme.spacing(30),
     display: "flex",
     alignItems: "center",
     justifyContent: "center",
     borderRadius: theme.shape.borderRadius,
     border: `1px solid ${theme.palette.divider}`,
     padding: theme.spacing(6),
-  },
+  }),
 
-  description: {
+  description: (theme) => ({
     color: theme.palette.text.secondary,
     textAlign: "center",
     maxWidth: theme.spacing(58),
     marginTop: theme.spacing(1),
-  },
-}));
+  }),
+} satisfies Record<string, Interpolation<Theme>>;
 
 export default LicensesSettingsPageView;
