chore: upgrade eslint and prettier (#2376)

* chore: upgrade eslint and prettier

* chore: add restrict-template-expressions

packages/web/src/javascripts/Components/Abstract/PureComponent.tsx

@@ -4,14 +4,17 @@ import { ViewControllerManager } from '@/Controllers/ViewControllerManager'
 import { autorun, IReactionDisposer, IReactionPublic } from 'mobx'
 import { Component } from 'react'
 
-export type PureComponentState = Partial<Record<string, any>>
-export type PureComponentProps = Partial<Record<string, any>>
+export type PureComponentState = Partial<Record<string, unknown>>
+export type PureComponentProps = Partial<Record<string, unknown>>
 
 export abstract class AbstractComponent<P = PureComponentProps, S = PureComponentState> extends Component<P, S> {
   private unsubApp!: () => void
   private reactionDisposers: IReactionDisposer[] = []
 
-  constructor(props: P, protected application: WebApplication) {
+  constructor(
+    props: P,
+    protected application: WebApplication,
+  ) {
     super(props)
   }
 

packages/web/src/javascripts/Components/ContentListView/Header/ContentListHeader.tsx

@@ -108,7 +108,7 @@ const ContentListHeader = ({
       <div className="flex">
         <div className="relative" ref={displayOptionsContainerRef}>
           <RoundIconButton
-            className={classNames(showDisplayOptionsMenu && 'bg-contrast')}
+            className={classNames(showDisplayOptionsMenu ? 'bg-contrast' : undefined)}
             onClick={toggleDisplayOptionsMenu}
             ref={displayOptionsButtonRef}
             icon="sort-descending"

packages/web/src/javascripts/Components/ContentListView/InfiniteScroller/InfiniteScroller.tsx

@@ -136,9 +136,9 @@ export const InfinteScroller = forwardRef<InfiniteScrollerInterface, Props>(
 
     const _paginateFront = useCallback(() => {
       if (direction === 'vertical') {
-        setScrollSize(scrollArea!.current!.scrollHeight)
+        setScrollSize(scrollArea.current!.scrollHeight)
       } else {
-        setScrollSize(scrollArea!.current!.scrollWidth)
+        setScrollSize(scrollArea.current!.scrollWidth)
       }
       setDidPaginateFront(true)
       paginateFront()

packages/web/src/javascripts/Components/Footer/Footer.tsx

@@ -77,6 +77,7 @@ class Footer extends AbstractComponent<Props, State> {
           this.onNewUpdateAvailable()
           break
         case WebAppEvent.EditorFocused:
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
           if ((data as any).eventSource === EditorEventSource.UserInteraction) {
             this.closeAccountMenu()
           }
@@ -87,6 +88,7 @@ class Footer extends AbstractComponent<Props, State> {
         case WebAppEvent.EndedBackupDownload: {
           const successMessage = 'Successfully saved backup.'
           const errorMessage = 'Unable to save local backup.'
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
           statusService.setMessage((data as any).success ? successMessage : errorMessage)
 
           const twoSeconds = 2000

packages/web/src/javascripts/Components/Icon/IconPicker.tsx

@@ -28,7 +28,7 @@ const IconPicker = ({ selectedValue, onIconChange, platform, className, useIconG
             label: value,
             value: value,
             icon: value,
-          } as DropdownItem),
+          }) as DropdownItem,
       ),
     [iconKeys],
   )

packages/web/src/javascripts/Components/ImportModal/ImportModalFileItem.tsx

@@ -99,7 +99,7 @@ const ImportModalFileItem = ({
             {file.status === 'pending' && 'Could not auto-detect service. Please select manually.'}
             {file.status === 'parsing' && 'Parsing...'}
             {file.status === 'importing' && 'Importing...'}
-            {file.status === 'error' && `${file.error}`}
+            {file.status === 'error' && JSON.stringify(file.error)}
             {file.status === 'success' && file.successMessage}
           </div>
         </div>

packages/web/src/javascripts/Components/NoteView/Controller/FileViewController.ts

@@ -8,7 +8,10 @@ export class FileViewController implements ItemViewControllerInterface {
   private removeStreamObserver?: () => void
   public runtimeId = `${Math.random()}`
 
-  constructor(private application: SNApplication, public item: FileItem) {}
+  constructor(
+    private application: SNApplication,
+    public item: FileItem,
+  ) {}
 
   deinit() {
     this.dealloced = true

packages/web/src/javascripts/Components/Preferences/Controller/PreferencesSessionController.ts

@@ -18,7 +18,10 @@ export class PreferencesSessionController {
   private _menu: PreferencesMenuItem[]
   private _extensionLatestVersions: PackageProvider = new PackageProvider(new Map())
 
-  constructor(private application: WebApplication, private readonly _enableUnfinishedFeatures: boolean) {
+  constructor(
+    private application: WebApplication,
+    private readonly _enableUnfinishedFeatures: boolean,
+  ) {
     const menuItems = this._enableUnfinishedFeatures
       ? PREFERENCES_MENU_ITEMS.slice()
       : READY_PREFERENCES_MENU_ITEMS.slice()

packages/web/src/javascripts/Components/Preferences/Panes/Backups/DataBackups.tsx

@@ -86,6 +86,7 @@ const DataBackups = ({ application, viewControllerManager }: Props) => {
     }
   }
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const readFile = async (file: File): Promise<any> => {
     if (file.type === 'application/zip') {
       application.alerts.alert(STRING_IMPORTING_ZIP_FILE).catch(console.error)

packages/web/src/javascripts/Components/Preferences/Panes/Security/TwoFactorAuth/TwoFactorAuth.ts

@@ -16,7 +16,10 @@ export class TwoFactorAuth {
   private _status: TwoFactorStatus | 'fetching' = 'fetching'
   private _errorMessage: string | null
 
-  constructor(private readonly mfaProvider: MfaProvider, private readonly userProvider: UserProvider) {
+  constructor(
+    private readonly mfaProvider: MfaProvider,
+    private readonly userProvider: UserProvider,
+  ) {
     this._errorMessage = null
 
     makeAutoObservable<TwoFactorAuth, '_status' | '_errorMessage' | 'deactivateMfa' | 'startActivation'>(

packages/web/src/javascripts/Components/SuperEditor/SuperNoteConverter.tsx

@@ -156,7 +156,7 @@ const SuperNoteConverter = ({
 
   return (
     <Modal
-      title={`Convert to ${name}`}
+      title={`Convert to ${uiFeature.displayName}`}
       close={closeDialog}
       actions={modalActions}
       className={{

packages/web/src/javascripts/Components/SuperEditor/Utils.ts

@@ -31,7 +31,9 @@ export function handleEditorChange(
     onChange?.(stringifiedEditorState, previewText)
   } catch (error) {
     window.alert(
-      `An invalid change was made inside the Super editor. Your change was not saved. Please report this error to the team: ${error}`,
+      `An invalid change was made inside the Super editor. Your change was not saved. Please report this error to the team: ${JSON.stringify(
+        error,
+      )}`,
     )
   }
 }