From 18af9426c055249c50b2c521edde9df3277910d8 Mon Sep 17 00:00:00 2001
From: Joe Previte <jjprevite@gmail.com>
Date: Tue, 6 Sep 2022 14:27:10 -0700
Subject: [PATCH] chore: add no implicit coercion eslint rule (#3909)

* chore: add no-implicit-coercion ESLint rule

This adds a new ESLint rule to prevent us from using implicit coercion
in the codebase. See https://eslint.org/docs/latest/rules/no-implicit-coercion

* chore: fix implicit coercion errors

* fixup: formatting
---
 site/.eslintrc.yaml                                       | 1 +
 site/src/AppRouter.tsx                                    | 2 +-
 site/src/components/ErrorSummary/ErrorSummary.tsx         | 2 +-
 site/src/components/LoadingButton/LoadingButton.tsx       | 4 ++--
 site/src/components/Navbar/Navbar.tsx                     | 3 ++-
 .../SearchBarWithFilter/SearchBarWithFilter.tsx           | 4 ++--
 site/src/components/Tooltips/HelpTooltip/HelpTooltip.tsx  | 2 +-
 site/src/components/UserDropdown/UsersDropdown.tsx        | 2 +-
 site/src/components/Workspace/Workspace.tsx               | 2 +-
 .../WorkspaceActionButton/WorkspaceActionButton.tsx       | 2 +-
 .../WorkspaceScheduleForm/WorkspaceScheduleForm.tsx       | 2 +-
 .../TemplateSettingsPage/TemplateSettingsPageView.tsx     | 2 +-
 site/src/pages/WorkspacePage/WorkspacePage.tsx            | 8 ++++----
 site/src/util/events.ts                                   | 2 +-
 14 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/site/.eslintrc.yaml b/site/.eslintrc.yaml
index bbdd563aac..b7aa5bd97d 100644
--- a/site/.eslintrc.yaml
+++ b/site/.eslintrc.yaml
@@ -78,6 +78,7 @@ rules:
         - info
         - debug
   no-dupe-class-members: "off"
+  no-implicit-coercion: "error"
   no-restricted-imports:
     - error
     - paths:
diff --git a/site/src/AppRouter.tsx b/site/src/AppRouter.tsx
index 5f2955eb3a..1b9eb9a67a 100644
--- a/site/src/AppRouter.tsx
+++ b/site/src/AppRouter.tsx
@@ -145,7 +145,7 @@ export const AppRouter: FC = () => {
                 <AuthAndFrame>
                   <RequirePermission
                     isFeatureVisible={
-                      featureVisibility[FeatureNames.AuditLog] && !!permissions?.viewAuditLog
+                      featureVisibility[FeatureNames.AuditLog] && Boolean(permissions?.viewAuditLog)
                     }
                   >
                     <AuditPage />
diff --git a/site/src/components/ErrorSummary/ErrorSummary.tsx b/site/src/components/ErrorSummary/ErrorSummary.tsx
index 6e8352a8e9..5ac024e8d9 100644
--- a/site/src/components/ErrorSummary/ErrorSummary.tsx
+++ b/site/src/components/ErrorSummary/ErrorSummary.tsx
@@ -49,7 +49,7 @@ export const ErrorSummary: FC<React.PropsWithChildren<ErrorSummaryProps>> = ({
       <Stack direction="row" alignItems="center" className={styles.messageBox}>
         <Stack direction="row" spacing={0}>
           <span className={styles.errorMessage}>{message}</span>
-          {!!detail && <Expander expanded={showDetails} setExpanded={setShowDetails} />}
+          {Boolean(detail) && <Expander expanded={showDetails} setExpanded={setShowDetails} />}
         </Stack>
         {dismissible && (
           <IconButton onClick={closeError} className={styles.iconButton}>
diff --git a/site/src/components/LoadingButton/LoadingButton.tsx b/site/src/components/LoadingButton/LoadingButton.tsx
index f667ecbe0b..4e9fe0f57b 100644
--- a/site/src/components/LoadingButton/LoadingButton.tsx
+++ b/site/src/components/LoadingButton/LoadingButton.tsx
@@ -23,7 +23,7 @@ export const LoadingButton: FC<React.PropsWithChildren<LoadingButtonProps>> = ({
   children,
   ...rest
 }) => {
-  const styles = useStyles({ hasLoadingLabel: !!loadingLabel })
+  const styles = useStyles({ hasLoadingLabel: Boolean(loadingLabel) })
   const hidden = loading ? { opacity: 0 } : undefined
 
   return (
@@ -34,7 +34,7 @@ export const LoadingButton: FC<React.PropsWithChildren<LoadingButtonProps>> = ({
           <CircularProgress size={18} className={styles.spinner} />
         </div>
       )}
-      {!!loadingLabel && loadingLabel}
+      {Boolean(loadingLabel) && loadingLabel}
     </Button>
   )
 }
diff --git a/site/src/components/Navbar/Navbar.tsx b/site/src/components/Navbar/Navbar.tsx
index 608e8697e4..09690c876e 100644
--- a/site/src/components/Navbar/Navbar.tsx
+++ b/site/src/components/Navbar/Navbar.tsx
@@ -14,7 +14,8 @@ export const Navbar: React.FC = () => {
     selectFeatureVisibility,
     shallowEqual,
   )
-  const canViewAuditLog = featureVisibility[FeatureNames.AuditLog] && !!permissions?.viewAuditLog
+  const canViewAuditLog =
+    featureVisibility[FeatureNames.AuditLog] && Boolean(permissions?.viewAuditLog)
   const onSignOut = () => authSend("SIGN_OUT")
 
   return <NavbarView user={me} onSignOut={onSignOut} canViewAuditLog={canViewAuditLog} />
diff --git a/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx b/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
index b4caf55f69..927eb495c8 100644
--- a/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
+++ b/site/src/components/SearchBarWithFilter/SearchBarWithFilter.tsx
@@ -42,7 +42,7 @@ export const SearchBarWithFilter: React.FC<React.PropsWithChildren<SearchBarWith
   presetFilters,
   error,
 }) => {
-  const styles = useStyles({ error: !!error })
+  const styles = useStyles({ error: Boolean(error) })
 
   const form = useFormik<FilterFormValues>({
     enableReinitialize: true,
@@ -108,7 +108,7 @@ export const SearchBarWithFilter: React.FC<React.PropsWithChildren<SearchBarWith
             id="query"
             name="query"
             value={form.values.query}
-            error={!!error}
+            error={Boolean(error)}
             className={styles.inputStyles}
             onChange={form.handleChange}
             startAdornment={
diff --git a/site/src/components/Tooltips/HelpTooltip/HelpTooltip.tsx b/site/src/components/Tooltips/HelpTooltip/HelpTooltip.tsx
index 25f8ea0cfb..87b90aafef 100644
--- a/site/src/components/Tooltips/HelpTooltip/HelpTooltip.tsx
+++ b/site/src/components/Tooltips/HelpTooltip/HelpTooltip.tsx
@@ -40,7 +40,7 @@ export const HelpTooltip: React.FC<React.PropsWithChildren<HelpTooltipProps>> =
 }) => {
   const styles = useStyles({ size })
   const anchorRef = useRef<HTMLButtonElement>(null)
-  const [isOpen, setIsOpen] = useState(!!open)
+  const [isOpen, setIsOpen] = useState(Boolean(open))
   const id = isOpen ? "help-popover" : undefined
 
   const onClose = () => {
diff --git a/site/src/components/UserDropdown/UsersDropdown.tsx b/site/src/components/UserDropdown/UsersDropdown.tsx
index fd63ba015d..a391951196 100644
--- a/site/src/components/UserDropdown/UsersDropdown.tsx
+++ b/site/src/components/UserDropdown/UsersDropdown.tsx
@@ -51,7 +51,7 @@ export const UserDropdown: React.FC<React.PropsWithChildren<UserDropdownProps>>
       <BorderedMenu
         anchorEl={anchorEl}
         getContentAnchorEl={null}
-        open={!!anchorEl}
+        open={Boolean(anchorEl)}
         anchorOrigin={{
           vertical: "bottom",
           horizontal: "right",
diff --git a/site/src/components/Workspace/Workspace.tsx b/site/src/components/Workspace/Workspace.tsx
index a5897cd277..cacd157862 100644
--- a/site/src/components/Workspace/Workspace.tsx
+++ b/site/src/components/Workspace/Workspace.tsx
@@ -131,7 +131,7 @@ export const Workspace: FC<React.PropsWithChildren<WorkspaceProps>> = ({
 
         <WorkspaceStats workspace={workspace} handleUpdate={handleUpdate} />
 
-        {!!resources && !!resources.length && (
+        {typeof resources !== "undefined" && resources.length > 0 && (
           <Resources
             resources={resources}
             getResourcesError={workspaceErrors[WorkspaceErrors.GET_RESOURCES_ERROR]}
diff --git a/site/src/components/WorkspaceActionButton/WorkspaceActionButton.tsx b/site/src/components/WorkspaceActionButton/WorkspaceActionButton.tsx
index 2d46e01640..10a9a9c77c 100644
--- a/site/src/components/WorkspaceActionButton/WorkspaceActionButton.tsx
+++ b/site/src/components/WorkspaceActionButton/WorkspaceActionButton.tsx
@@ -18,7 +18,7 @@ export const WorkspaceActionButton: FC<React.PropsWithChildren<WorkspaceActionBu
 }) => {
   return (
     <Button className={className} startIcon={icon} onClick={onClick} aria-label={ariaLabel}>
-      {!!label && label}
+      {Boolean(label) && label}
     </Button>
   )
 }
diff --git a/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx
index aad9ff2f92..ee439cbefe 100644
--- a/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx
+++ b/site/src/components/WorkspaceScheduleForm/WorkspaceScheduleForm.tsx
@@ -164,7 +164,7 @@ export const validationSchema = Yup.object({
     .test("positive-if-auto-stop", Language.errorNoStop, function (value) {
       const parent = this.parent as WorkspaceScheduleFormValues
       if (parent.autoStopEnabled) {
-        return !!value
+        return Boolean(value)
       } else {
         return true
       }
diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsPageView.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsPageView.tsx
index 4a37119881..a4c2515f27 100644
--- a/site/src/pages/TemplateSettingsPage/TemplateSettingsPageView.tsx
+++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsPageView.tsx
@@ -33,7 +33,7 @@ export const TemplateSettingsPageView: FC<TemplateSettingsPageViewProps> = ({
 
   return (
     <FullPageForm title={Language.title} onCancel={onCancel}>
-      {!!errors.getTemplateError && <ErrorSummary error={errors.getTemplateError} />}
+      {Boolean(errors.getTemplateError) && <ErrorSummary error={errors.getTemplateError} />}
       {isLoading && <Loader />}
       {template && (
         <TemplateSettingsForm
diff --git a/site/src/pages/WorkspacePage/WorkspacePage.tsx b/site/src/pages/WorkspacePage/WorkspacePage.tsx
index f7209d6831..c1daaaef17 100644
--- a/site/src/pages/WorkspacePage/WorkspacePage.tsx
+++ b/site/src/pages/WorkspacePage/WorkspacePage.tsx
@@ -48,7 +48,7 @@ export const WorkspacePage: FC = () => {
     cancellationError,
   } = workspaceState.context
 
-  const canUpdateWorkspace = !!permissions?.updateWorkspace
+  const canUpdateWorkspace = Boolean(permissions?.updateWorkspace)
 
   const [bannerState, bannerSend] = useMachine(workspaceScheduleBannerMachine)
   const [buildInfoState] = useActor(xServices.buildInfoXService)
@@ -66,9 +66,9 @@ export const WorkspacePage: FC = () => {
   if (workspaceState.matches("error")) {
     return (
       <div className={styles.error}>
-        {!!getWorkspaceError && <ErrorSummary error={getWorkspaceError} />}
-        {!!refreshTemplateError && <ErrorSummary error={refreshTemplateError} />}
-        {!!checkPermissionsError && <ErrorSummary error={checkPermissionsError} />}
+        {Boolean(getWorkspaceError) && <ErrorSummary error={getWorkspaceError} />}
+        {Boolean(refreshTemplateError) && <ErrorSummary error={refreshTemplateError} />}
+        {Boolean(checkPermissionsError) && <ErrorSummary error={checkPermissionsError} />}
       </div>
     )
   } else if (!workspace || !permissions) {
diff --git a/site/src/util/events.ts b/site/src/util/events.ts
index d8cc5d0c4d..e0d03ecef1 100644
--- a/site/src/util/events.ts
+++ b/site/src/util/events.ts
@@ -45,5 +45,5 @@ export type AnnotatedEventListener<E extends Event> = (event: E) => void
 export const isCustomEvent = <D = unknown>(
   event: CustomEvent<D> | Event,
 ): event is CustomEvent<D> => {
-  return !!(event as CustomEvent).detail
+  return Boolean((event as CustomEvent).detail)
 }