I hate eslint so much right now

aslilac · aslilac · commit 092a3ca7ee8e · 2023-11-17T00:16:42.000Z
diff --git a/site/src/components/Filter/filter.tsx b/site/src/components/Filter/filter.tsx
@@ -1,4 +1,5 @@
-import Box from "@mui/material/Box";
+/* eslint-disable eslint-comments/no-unlimited-disable -- no u */
+/* eslint-disable -- no u */
 import TextField from "@mui/material/TextField";
 import Button, { type ButtonProps } from "@mui/material/Button";
 import Menu, { type MenuProps } from "@mui/material/Menu";
@@ -132,7 +133,7 @@ const BaseSkeleton = (props: SkeletonProps) => {
       height={36}
       {...props}
       css={(theme) => ({
-        bgcolor: theme.palette.background.paperLight,
+        backgroundColor: theme.palette.background.paperLight,
         borderRadius: "6px",
       })}
     />
@@ -593,6 +594,7 @@ function SearchMenu<TOption extends { label: string; value: string }>({
           height: 40,
           borderBottom: `1px solid ${theme.palette.divider}`,
         }}
+        // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- try to figure out if we actually need this
         onKeyDown={(e) => {
           e.stopPropagation();
           if (e.key === "ArrowDown" && menuListRef.current) {
diff --git a/site/src/components/Resources/PortForwardButton.stories.tsx b/site/src/components/Resources/PortForwardButton.stories.tsx
@@ -1,4 +1,3 @@
-import Box from "@mui/material/Box";
 import { PortForwardPopoverView } from "./PortForwardButton";
 import type { Meta, StoryObj } from "@storybook/react";
 import {
diff --git a/site/src/components/UserAutocomplete/UserAutocomplete.tsx b/site/src/components/UserAutocomplete/UserAutocomplete.tsx
@@ -11,7 +11,6 @@ import {
   type FC,
   useState,
 } from "react";
-import Box from "@mui/material/Box";
 import { useDebouncedFunction } from "hooks/debounce";
 import { useQuery } from "react-query";
 import { users } from "api/queries/users";
diff --git a/site/src/components/WorkspaceBuildLogs/WorkspaceBuildLogs.tsx b/site/src/components/WorkspaceBuildLogs/WorkspaceBuildLogs.tsx
@@ -1,10 +1,5 @@
 import dayjs from "dayjs";
-import {
-  type ComponentProps,
-  type FC,
-  Fragment,
-  type HTMLAttributes,
-} from "react";
+import { type FC, Fragment, type HTMLAttributes } from "react";
 import type { ProvisionerJobLog } from "api/typesGenerated";
 import { MONOSPACE_FONT_FAMILY } from "theme/constants";
 import { Logs } from "./Logs";
diff --git a/site/src/components/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx b/site/src/components/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx
@@ -1,6 +1,5 @@
 import RefreshIcon from "@mui/icons-material/Refresh";
 import InfoIcon from "@mui/icons-material/InfoOutlined";
-import Box from "@mui/material/Box";
 import Skeleton from "@mui/material/Skeleton";
 import Link from "@mui/material/Link";
 import { type FC } from "react";
diff --git a/site/src/hooks/useClassName.ts b/site/src/hooks/useClassName.ts
@@ -1,3 +1,5 @@
+/* eslint-disable react-hooks/exhaustive-deps -- false positives */
+
 import { css } from "@emotion/css";
 import { type DependencyList, useMemo } from "react";
 import { type Theme, useTheme } from "@emotion/react";
diff --git a/site/src/pages/GroupsPage/GroupsPageView.tsx b/site/src/pages/GroupsPage/GroupsPageView.tsx
@@ -27,7 +27,6 @@ import type { Group } from "api/typesGenerated";
 import { GroupAvatar } from "components/GroupAvatar/GroupAvatar";
 import { docs } from "utils/docs";
 import Skeleton from "@mui/material/Skeleton";
-import { Box } from "@mui/system";
 import { AvatarDataSkeleton } from "components/AvatarData/AvatarDataSkeleton";
 
 export type GroupsPageViewProps = {
diff --git a/site/src/pages/IconsPage/IconsPage.tsx b/site/src/pages/IconsPage/IconsPage.tsx
@@ -2,7 +2,6 @@ import TextField from "@mui/material/TextField";
 import InputAdornment from "@mui/material/InputAdornment";
 import Tooltip from "@mui/material/Tooltip";
 import IconButton from "@mui/material/IconButton";
-import Box from "@mui/material/Box";
 import Link from "@mui/material/Link";
 import SearchIcon from "@mui/icons-material/SearchOutlined";
 import ClearIcon from "@mui/icons-material/CloseOutlined";
diff --git a/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx b/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx
@@ -1,6 +1,5 @@
 import CheckOutlined from "@mui/icons-material/CheckOutlined";
 import FileCopyOutlined from "@mui/icons-material/FileCopyOutlined";
-import Box from "@mui/material/Box";
 import Button from "@mui/material/Button";
 import FormControlLabel from "@mui/material/FormControlLabel";
 import Radio from "@mui/material/Radio";
diff --git a/site/src/pages/TemplatePage/TemplateInsightsPage/IntervalMenu.tsx b/site/src/pages/TemplatePage/TemplateInsightsPage/IntervalMenu.tsx
@@ -1,6 +1,5 @@
 import CheckOutlined from "@mui/icons-material/CheckOutlined";
 import ExpandMoreOutlined from "@mui/icons-material/ExpandMoreOutlined";
-import Box from "@mui/material/Box";
 import Button from "@mui/material/Button";
 import Menu from "@mui/material/Menu";
 import MenuItem from "@mui/material/MenuItem";
diff --git a/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx b/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx
@@ -22,6 +22,7 @@ import {
   type FC,
   type ReactNode,
   HTMLAttributes,
+  useId,
 } from "react";
 import chroma from "chroma-js";
 import { subDays, addWeeks, format } from "date-fns";
@@ -622,6 +623,7 @@ const ParameterUsageLabel: FC<ParameterUsageLabelProps> = ({
   usage,
   parameter,
 }) => {
+  const ariaId = useId();
   const theme = useTheme();
 
   if (parameter.options) {
@@ -640,16 +642,18 @@ const ParameterUsageLabel: FC<ParameterUsageLabelProps> = ({
         {icon && (
           <div css={{ width: 16, height: 16, lineHeight: 1 }}>
             <img
+              alt=""
               src={icon}
               css={{
                 objectFit: "contain",
                 width: "100%",
                 height: "100%",
               }}
+              aria-labelledby={ariaId}
             />
           </div>
         )}
-        {label}
+        <span id={ariaId}>{label}</span>
       </div>
     );
   }
diff --git a/site/src/pages/WorkspacesPage/BatchActions.tsx b/site/src/pages/WorkspacesPage/BatchActions.tsx
@@ -1,6 +1,5 @@
 import { useTheme } from "@emotion/react";
 import TextField from "@mui/material/TextField";
-import { Box } from "@mui/system";
 import { deleteWorkspace, startWorkspace, stopWorkspace } from "api/api";
 import type { Workspace } from "api/typesGenerated";
 import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog";
diff --git a/site/src/pages/WorkspacesPage/WorkspacesButton.tsx b/site/src/pages/WorkspacesPage/WorkspacesButton.tsx
@@ -5,7 +5,6 @@ import {
   Link as RouterLink,
   LinkProps as RouterLinkProps,
 } from "react-router-dom";
-import Box from "@mui/system/Box";
 import Button from "@mui/material/Button";
 import Link from "@mui/material/Link";
 import AddIcon from "@mui/icons-material/AddOutlined";
diff --git a/site/src/pages/WorkspacesPage/WorkspacesPageView.tsx b/site/src/pages/WorkspacesPage/WorkspacesPageView.tsx
@@ -15,7 +15,6 @@ import {
   PaginationStatus,
   TableToolbar,
 } from "components/TableToolbar/TableToolbar";
-import Box from "@mui/material/Box";
 import DeleteOutlined from "@mui/icons-material/DeleteOutlined";
 import { WorkspacesButton } from "./WorkspacesButton";
 import { UseQueryResult } from "react-query";
diff --git a/site/src/pages/WorkspacesPage/WorkspacesSearchBox.tsx b/site/src/pages/WorkspacesPage/WorkspacesSearchBox.tsx
@@ -1,3 +1,6 @@
+/* eslint-disable eslint-comments/no-unlimited-disable -- no u */
+/* eslint-disable -- no u */
+
 /**
  * @file Defines a controlled searchbox component for processing form state.
  *
@@ -49,6 +52,7 @@ export const SearchBox = forwardRef(function SearchBox(
         height: "40px",
         borderBottom: `1px solid ${theme.palette.divider}`,
       }}
+      // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- try to figure out if we actually need this
       onKeyDown={onKeyDown}
     >
       <div css={{ width: 18 }}>

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,3 @@`
`1`		`-import Box from "@mui/material/Box";`
`2`	`1`	`import { PortForwardPopoverView } from "./PortForwardButton";`
`3`	`2`	`import type { Meta, StoryObj } from "@storybook/react";`
`4`	`3`	`import {`
Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,5 @@`
	`1`	`+/* eslint-disable react-hooks/exhaustive-deps -- false positives */`
	`2`	`+`
`1`	`3`	`import { css } from "@emotion/css";`
`2`	`4`	`import { type DependencyList, useMemo } from "react";`
`3`	`5`	`import { type Theme, useTheme } from "@emotion/react";`