🧹

coder · aslilac · Nov 6, 2023 · Nov 3, 2023 · Nov 3, 2023 · Nov 3, 2023
commit 18b7e83faa5662fc88d4d693d9b10414916e473c
diff --git a/site/src/components/Dashboard/Navbar/NavbarView.tsx b/site/src/components/Dashboard/Navbar/NavbarView.tsx
@@ -117,7 +117,7 @@ const styles = {
 
     ${theme.breakpoints.up("md")} {
       height: ${navHeight}px;
-      padding: 0 24;
+      padding: 0 24px;
     }
   `,
 } satisfies Record<string, Interpolation<Theme>>;
@@ -171,6 +171,7 @@ const NavItems: React.FC<NavItemsProps> = (props) => {
     </nav>
   );
 };
+
 export const NavbarView: FC<NavbarViewProps> = ({
   user,
   logo_url,

diff --git a/site/src/components/Dialogs/DeleteDialog/DeleteDialog.tsx b/site/src/components/Dialogs/DeleteDialog/DeleteDialog.tsx
@@ -75,7 +75,7 @@ export const DeleteDialog: FC<PropsWithChildren<DeleteDialogProps>> = ({
             <TextField
               fullWidth
               autoFocus
-              sx={{ marginTop: 24 }}
+              css={{ marginTop: 24 }}
               name="confirmation"
               autoComplete="off"
               id={`${hookId}-confirm`}

diff --git a/site/src/components/Resources/PortForwardButton.tsx b/site/src/components/Resources/PortForwardButton.tsx
@@ -90,14 +90,15 @@ export const PortForwardButton: React.FC<PortForwardButtonProps> = (props) => {
 export const PortForwardPopoverView: React.FC<
   PortForwardButtonProps & { ports?: WorkspaceAgentListeningPort[] }
 > = (props) => {
+  const theme = useTheme();
   const { host, workspaceName, agent, username, ports } = props;
 
   return (
     <>
       <Box
-        sx={{
+        css={{
           padding: 20,
-          borderBottom: (theme) => `1px solid ${theme.palette.divider}`,
+          borderBottom: `1px solid ${theme.palette.divider}`,
         }}
       >
         <HelpTooltipTitle>Forwarded ports</HelpTooltipTitle>
@@ -108,7 +109,7 @@ export const PortForwardPopoverView: React.FC<
             ? "No open ports were detected."
             : "The forwarded ports are exclusively accessible to you."}
         </HelpTooltipText>
-        <Box sx={{ marginTop: 12 }}>
+        <Box css={{ marginTop: 12 }}>
           {ports?.map((p) => {
             const url = portForwardURL(
               host,
@@ -154,7 +155,7 @@ export const PortForwardPopoverView: React.FC<
         </Box>
       </Box>
 
-      <Box sx={{ padding: 20 }}>
+      <Box css={{ padding: 20 }}>
         <HelpTooltipTitle>Forward port</HelpTooltipTitle>
         <HelpTooltipText
           sx={{ color: (theme) => theme.palette.text.secondary }}

diff --git a/site/src/components/Resources/ResourceCard.tsx b/site/src/components/Resources/ResourceCard.tsx
@@ -2,13 +2,12 @@ import { type FC, useState } from "react";
 import IconButton from "@mui/material/IconButton";
 import Tooltip from "@mui/material/Tooltip";
 import { type CSSObject, type Interpolation, type Theme } from "@emotion/react";
-import { WorkspaceAgent, WorkspaceResource } from "api/typesGenerated";
-import { DropdownArrow } from "components/DropdownArrow/DropdownArrow";
-import { CopyableValue } from "components/CopyableValue/CopyableValue";
+import type { WorkspaceAgent, WorkspaceResource } from "api/typesGenerated";
+import { DropdownArrow } from "../DropdownArrow/DropdownArrow";
+import { CopyableValue } from "../CopyableValue/CopyableValue";
 import { Stack } from "../Stack/Stack";
 import { ResourceAvatar } from "./ResourceAvatar";
 import { SensitiveValue } from "./SensitiveValue";
-import { MemoizedMarkdown } from "components/Markdown/Markdown";
 
 const styles = {
   resourceCard: (theme) => ({
@@ -138,7 +137,7 @@ export const ResourceCard: FC<ResourceCardProps> = ({ resource, agentRow }) => {
                     <SensitiveValue value={meta.value} />
                   ) : (
                     <CopyableValue value={meta.value}>
-                      <MemoizedMarkdown>{meta.value}</MemoizedMarkdown>
+                      {meta.value}
                     </CopyableValue>
                   )}
                 </div>

diff --git a/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx b/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx
@@ -175,7 +175,7 @@ export const TemplateInsightsPageView = ({
         {controls}
       </Box>
       <Box
-        sx={{
+        css={{
           display: "grid",
           gridTemplateColumns: "repeat(3, minmax(0, 1fr))",
           gridTemplateRows: "440px 440px auto",

diff --git a/site/src/pages/UsersPage/UsersTable/EditRolesButton.tsx b/site/src/pages/UsersPage/UsersTable/EditRolesButton.tsx
@@ -117,7 +117,7 @@ export const EditRolesButton: FC<EditRolesButtonProps> = ({
       <PopoverContent
         classes={{
           paper: css`
-            width: 360;
+            width: 360px;
             margin-top: 8px;
             background: ${theme.palette.background.paperLight};
           `,

diff --git a/site/src/pages/WorkspacesPage/WorkspacesTable.tsx b/site/src/pages/WorkspacesPage/WorkspacesTable.tsx
@@ -192,12 +192,7 @@ export const WorkspacesTable: FC<WorkspacesTableProps> = ({
                   </TableCell>
 
                   <TableCell>
-                    <Box
-                      sx={{
-                        display: "flex",
-                        paddingLeft: 16,
-                      }}
-                    >
+                    <Box css={{ display: "flex", paddingLeft: 16 }}>
                       <KeyboardArrowRight
                         sx={{
                           color: (theme) => theme.palette.text.secondary,