Bump the typescript-eslint group with 2 updates (#13862)

dependabot[bot] · swissspidy · web-flow · commit f061663c0dfd · 2024-12-02T21:07:56.000+01:00
Co-authored-by: dependabot[bot] &lt;49699333+dependabot[bot]@users.noreply.github.com&gt;
Co-authored-by: Pascal Birchler &lt;pascalb@google.com&gt;
diff --git a/.eslintrc b/.eslintrc
@@ -333,11 +333,8 @@
       ],
       "parser": "@typescript-eslint/parser",
       "parserOptions": {
-        "EXPERIMENTAL_useProjectService": true,
-        "warnOnUnsupportedTypeScriptVersion": false,
-        "project": [
-          ".tsconfig.json"
-        ]
+        "projectService": true,
+        "warnOnUnsupportedTypeScriptVersion": false
       },
       "rules": {
         "@typescript-eslint/no-shadow": ["error",
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -84,8 +84,8 @@
     "@types/node": "^22.9.3",
     "@types/styled-components": "^5.1.26",
     "@types/uuid": "^10.0.0",
-    "@typescript-eslint/eslint-plugin": "^6.19.1",
-    "@typescript-eslint/parser": "^6.19.1",
+    "@typescript-eslint/eslint-plugin": "^8.16.0",
+    "@typescript-eslint/parser": "^8.16.0",
     "@web-stories-wp/e2e-tests": "*",
     "@web-stories-wp/eslint-import-resolver": "*",
     "@web-stories-wp/jest-amp": "*",
diff --git a/packages/animation/src/components/test/animationProvider.tsx b/packages/animation/src/components/test/animationProvider.tsx
@@ -24,9 +24,9 @@ import type { PropsWithChildren } from 'react';
 /**
  * Internal dependencies
  */
-import { AnimationProvider, useStoryAnimationContext } from '..';
 import { createAnimationPart } from '../../parts';
-import { AnimationType, type Element } from '../../types';
+import { AnimationType, type Element, type StoryAnimation } from '../../types';
+import { AnimationProvider, useStoryAnimationContext } from '..';
 
 jest.mock('flagged');
 jest.mock('../../parts', () => ({
@@ -187,13 +187,13 @@ describe('AnimationProvider', () => {
         rotationAngle: 0,
       };
       const elements = [element1, element2];
-      const animType = AnimationType.Move as const;
+      const animType = AnimationType.Move;
       const args = [
         { bounces: 3, duration: 1000 },
         { blinks: 2, offset: 20, blarks: 6, duration: 1000 },
         { columns: 4, duration: 400 },
       ];
-      const animations = [
+      const animations: StoryAnimation[] = [
         { id: '1', targets: [target], type: animType, ...args[0] },
         { id: '2', targets: [target], type: animType, ...args[1] },
         { id: '3', targets: [target2], type: animType, ...args[2] },
diff --git a/packages/animation/src/utils/getOffPageOffset.ts b/packages/animation/src/utils/getOffPageOffset.ts
@@ -24,27 +24,27 @@ import {
   type DimensionableElement,
 } from '@googleforcreators/units';
 
-function calcTopOffset(box: ElementBox, dangerZoneOffset: number) {
+function calcTopOffset(box: ElementBox, dangerZoneOffset: number): number {
   const { y, height } = box;
   const toTop = dangerZoneOffset + y;
-  return -Number((toTop / height) * 100.0 + 100.0).toFixed(5);
+  return -Number(Number((toTop / height) * 100.0 + 100.0).toFixed(5));
 }
 
-function calcBottomOffset(box: ElementBox, dangerZoneOffset: number) {
+function calcBottomOffset(box: ElementBox, dangerZoneOffset: number): number {
   const { y, height } = box;
   const toBottom = 100 - y + dangerZoneOffset;
-  return Number((toBottom / height) * 100.0).toFixed(5);
+  return Number(Number((toBottom / height) * 100.0).toFixed(5));
 }
 
-function calcLeftOffset(box: ElementBox) {
+function calcLeftOffset(box: ElementBox): number {
   const { x, width } = box;
-  return -Number((x / width) * 100.0 + 100.0).toFixed(5);
+  return -Number(Number((x / width) * 100.0 + 100.0).toFixed(5));
 }
 
-function calcRightOffset(box: ElementBox) {
+function calcRightOffset(box: ElementBox): number {
   const { x, width } = box;
   const toRight = 100 - x;
-  return Number((toRight / width) * 100.0).toFixed(5);
+  return Number(Number((toRight / width) * 100.0).toFixed(5));
 }
 
 function getOffPageOffset(element: DimensionableElement) {
diff --git a/packages/animation/src/utils/test/getTotalDuration.ts b/packages/animation/src/utils/test/getTotalDuration.ts
@@ -24,7 +24,7 @@ const BASE_ANIMATION = {
   id: '1',
   targets: [],
 };
-const type = AnimationType.BlinkOn as const;
+const type = AnimationType.BlinkOn;
 
 describe('getTotalDuration', () => {
   it('returns 0 if no animations supplied', () => {
diff --git a/packages/design-system/src/components/contextMenu/components/button.tsx b/packages/design-system/src/components/contextMenu/components/button.tsx
@@ -123,7 +123,9 @@ const Button = forwardRef(function Button(
 
   const handleClick = (evt: MouseEvent<HTMLButtonElement>) => {
     onClick(evt);
-    dismissOnClick && onDismiss(evt.nativeEvent);
+    if (dismissOnClick) {
+      onDismiss(evt.nativeEvent);
+    }
   };
 
   const handleFocus = (evt: FocusEvent<HTMLButtonElement>) => {
diff --git a/packages/design-system/src/components/snackbar/snackbarMessage.tsx b/packages/design-system/src/components/snackbar/snackbarMessage.tsx
@@ -230,7 +230,9 @@ function SnackbarMessage({
   const handleAction = useCallback(
     (evt: MouseEvent<HTMLButtonElement>) => {
       onAction(evt);
-      !isPreventActionDismiss && onDismiss();
+      if (!isPreventActionDismiss) {
+        onDismiss();
+      }
     },
     [onAction, onDismiss, isPreventActionDismiss]
   );
diff --git a/packages/design-system/src/typings/styled.d.ts b/packages/design-system/src/typings/styled.d.ts
@@ -25,5 +25,6 @@ import 'styled-components';
 import type { Theme } from '../theme';
 
 declare module 'styled-components' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-object-type -- On purpose.
   export interface DefaultTheme extends Theme {}
 }
diff --git a/packages/element-library/src/text/display.tsx b/packages/element-library/src/text/display.tsx
@@ -257,7 +257,7 @@ function TextDisplay({
     target.style.fontSize = updatedFontSize
       ? `${dataToEditorY(updatedFontSize)}px`
       : '';
-    const updatedMargin = transform?.updates?.marginOffset;
+    const updatedMargin = transform?.updates?.marginOffset as number;
     target.style.margin = updatedMargin
       ? `${dataToEditorY(-updatedMargin) / 2}px 0`
       : '';
diff --git a/packages/element-library/src/text/edit.tsx b/packages/element-library/src/text/edit.tsx
@@ -337,7 +337,9 @@ function TextEdit({
         editWrapper.style.left = `${boxRef.current.x + dx}px`;
         editWrapper.style.top = `${boxRef.current.y + dy}px`;
       }
-      onResize && onResize();
+      if (onResize) {
+        onResize();
+      }
     }
   }, [dataToEditorY, editWrapper, element, onResize, top, bottom]);
   // Invoke on each content update.
diff --git a/packages/element-library/src/typings/styled.d.ts b/packages/element-library/src/typings/styled.d.ts
@@ -21,5 +21,6 @@ import 'styled-components';
 import type { Theme } from '@googleforcreators/design-system';
 
 declare module 'styled-components' {
+  // eslint-disable-next-line @typescript-eslint/no-empty-object-type -- On purpose.
   export interface DefaultTheme extends Theme {}
 }
diff --git a/packages/media/src/seekVideo.ts b/packages/media/src/seekVideo.ts
@@ -32,7 +32,7 @@ function seekVideo(video: HTMLVideoElement, offset = 0.99): Promise<void> {
     video.addEventListener('seeking', (evt) => {
       const wait = setTimeout(() => {
         clearTimeout(wait);
-        reject(evt);
+        reject(evt as unknown as Error);
       }, THREE_SECONDS);
     });
     video.addEventListener('error', reject);
diff --git a/packages/rich-text/src/fauxSelection.ts b/packages/rich-text/src/fauxSelection.ts
@@ -116,7 +116,7 @@ export function useFauxSelection(
 
           // Save that as the next editor state
           return selectedState;
-        } catch (e) {
+        } catch {
           // If the component has unmounted/remounted, some of the above might throw
           // if so, just ignore it and return old state
           return oldEditorState;
diff --git a/packages/rich-text/src/formatters/color.ts b/packages/rich-text/src/formatters/color.ts
@@ -57,7 +57,7 @@ function stylesToCSS(styles: DraftInlineStyle): null | CSSProperties {
   let color: Pattern;
   try {
     color = styleToColor(style);
-  } catch (e) {
+  } catch {
     return null;
   }
 
diff --git a/packages/rich-text/src/formatters/gradientColor.ts b/packages/rich-text/src/formatters/gradientColor.ts
@@ -68,7 +68,7 @@ function stylesToCSS(styles: DraftInlineStyle): null | CSSProperties {
   let color: Pattern;
   try {
     color = styleToColor(colorStyle);
-  } catch (e) {
+  } catch {
     return null;
   }
 
diff --git a/packages/rich-text/src/formatters/italic.ts b/packages/rich-text/src/formatters/italic.ts
@@ -51,10 +51,7 @@ function isItalic(editorState: EditorState) {
   return !styles.includes(NONE);
 }
 
-function toggleItalic(
-  editorState: EditorState,
-  flag?: undefined | boolean
-): EditorState {
+function toggleItalic(editorState: EditorState, flag?: boolean): EditorState {
   if (typeof flag === 'boolean') {
     return togglePrefixStyle(editorState, ITALIC, () => flag);
   }
diff --git a/packages/rich-text/src/formatters/underline.ts b/packages/rich-text/src/formatters/underline.ts
@@ -51,7 +51,7 @@ function isUnderline(editorState: EditorState) {
   return !styles.includes(NONE);
 }
 
-function toggleUnderline(editorState: EditorState, flag?: undefined | boolean) {
+function toggleUnderline(editorState: EditorState, flag?: boolean) {
   if (typeof flag === 'boolean') {
     return togglePrefixStyle(editorState, UNDERLINE, () => flag);
   }
diff --git a/packages/rich-text/src/formatters/uppercase.ts b/packages/rich-text/src/formatters/uppercase.ts
@@ -51,7 +51,7 @@ function isUppercase(editorState: EditorState) {
   return !styles.includes(NONE);
 }
 
-function toggleUppercase(editorState: EditorState, flag?: undefined | boolean) {
+function toggleUppercase(editorState: EditorState, flag?: boolean) {
   if (typeof flag === 'boolean') {
     return togglePrefixStyle(editorState, UPPERCASE, () => flag);
   }
diff --git a/packages/rich-text/src/formatters/weight.ts b/packages/rich-text/src/formatters/weight.ts
@@ -73,7 +73,7 @@ function isBold(editorState: EditorState) {
   return weights.every((w) => w >= SMALLEST_BOLD);
 }
 
-function toggleBold(editorState: EditorState, flag?: undefined | boolean) {
+function toggleBold(editorState: EditorState, flag?: boolean) {
   if (typeof flag === 'boolean') {
     if (flag) {
       const getDefault = () => weightToStyle(DEFAULT_BOLD);
diff --git a/packages/story-editor/src/app/canvas/useCanvasCopyPaste.ts b/packages/story-editor/src/app/canvas/useCanvasCopyPaste.ts
@@ -238,7 +238,7 @@ function useCanvasGlobalKeys() {
         if (files.length > 0) {
           uploadWithPreview(files);
         }
-      } catch (e) {
+      } catch {
         // Ignore.
       }
     },
diff --git a/packages/story-editor/src/app/media/utils/useDetectBaseColor.ts b/packages/story-editor/src/app/media/utils/useDetectBaseColor.ts
@@ -130,7 +130,7 @@ function useDetectBaseColor({
             });
           }
         }
-      } catch (error) {
+      } catch {
         // This might happen as an author when trying to updateMedia() that
         // was uploaded by someone else.
         // Do nothing with the error for now.
@@ -163,7 +163,7 @@ function useDetectBaseColor({
           if (posterResource) {
             imageSrc = getSmallestUrlForWidth(0, posterResource);
           }
-        } catch (error) {
+        } catch {
           // The user might not have the permission to access the video with context=edit.
           // This might happen as an author when the video
           // was uploaded by someone else.
@@ -181,7 +181,7 @@ function useDetectBaseColor({
       try {
         const color = await getMediaBaseColor(imageSrcProxied);
         await saveBaseColor(resource, color);
-      } catch (error) {
+      } catch {
         // Do nothing for now.
       }
     },
diff --git a/packages/story-editor/src/app/media/utils/useDetectVideoHasAudio.ts b/packages/story-editor/src/app/media/utils/useDetectVideoHasAudio.ts
@@ -86,7 +86,7 @@ function useDetectVideoHasAudio({
             isMuted: !hasAudio,
           });
         }
-      } catch (error) {
+      } catch {
         // Do nothing for now.
       }
     },
diff --git a/packages/story-editor/src/app/media/utils/useFFmpeg.ts b/packages/story-editor/src/app/media/utils/useFFmpeg.ts
@@ -619,7 +619,7 @@ function useFFmpeg() {
         try {
           ffmpeg?.exit();
           // eslint-disable-next-line no-empty -- no-op
-        } catch (e) {}
+        } catch {}
 
         trackTiming();
       }
@@ -674,7 +674,7 @@ function useFFmpeg() {
         try {
           ffmpeg?.exit();
           // eslint-disable-next-line no-empty -- no-op
-        } catch (e) {}
+        } catch {}
 
         trackTiming();
       }
diff --git a/packages/story-editor/src/app/media/utils/useProcessMedia.ts b/packages/story-editor/src/app/media/utils/useProcessMedia.ts
@@ -236,7 +236,7 @@ function useProcessMedia({
         let file = null;
         try {
           file = await fetchRemoteFile(url, mimeType);
-        } catch (e) {
+        } catch {
           // Ignore for now.
           return;
         }
@@ -352,14 +352,14 @@ function useProcessMedia({
         let posterFile = null;
         try {
           file = await fetchRemoteFile(url, mimeType);
-        } catch (e) {
+        } catch {
           // Ignore for now.
           return;
         }
         if (poster) {
           try {
             posterFile = await fetchRemoteBlob(poster);
-          } catch (e) {
+          } catch {
             // Ignore for now.
           }
         }
@@ -451,14 +451,14 @@ function useProcessMedia({
         let posterFile = null;
         try {
           file = await fetchRemoteFile(url, mimeType);
-        } catch (e) {
+        } catch {
           // Ignore for now.
           return;
         }
         if (poster) {
           try {
             posterFile = await fetchRemoteBlob(poster);
-          } catch (e) {
+          } catch {
             // Ignore for now.
           }
         }
@@ -530,7 +530,7 @@ function useProcessMedia({
         let file = null;
         try {
           file = await fetchRemoteFile(url, mimeType);
-        } catch (e) {
+        } catch {
           // Ignore for now.
           return;
         }
diff --git a/packages/story-editor/src/app/story/effects/useHashState.ts b/packages/story-editor/src/app/story/effects/useHashState.ts
@@ -63,7 +63,7 @@ function useHashState(
         }
         _value = JSON.parse(decodeURI(paramValue)) as string;
       }
-    } catch (e) {
+    } catch {
       // @TODO Add some error handling
     }
     return _value;
diff --git a/packages/story-editor/src/components/canvas/utils/getElementProperties.ts b/packages/story-editor/src/components/canvas/utils/getElementProperties.ts
@@ -46,7 +46,7 @@ function getElementProperties(type: ElementType, element: Element) {
   let resource, scale, focalX, focalY, sticker;
   if (elementIs.sticker(element)) {
     sticker = element.sticker;
-    ratio = STICKERS?.[sticker.type as keyof typeof STICKERS]?.aspectRatio;
+    ratio = STICKERS?.[sticker.type]?.aspectRatio;
   } else if (elementIs.media(element)) {
     resource = element.resource;
     ratio =
diff --git a/packages/story-editor/src/components/mediaRecording/provider.js b/packages/story-editor/src/components/mediaRecording/provider.js
@@ -249,7 +249,7 @@ function MediaRecordingProvider({ children }) {
           // remove these devices from the list.
           .filter((device) => device.label)
       );
-    } catch (err) {
+    } catch {
       // Do nothing for now.
     }
   }, []);
diff --git a/packages/story-editor/src/components/panels/design/link/link.js b/packages/story-editor/src/components/panels/design/link/link.js
@@ -177,7 +177,7 @@ function LinkPanel({ selectedElements, pushUpdateForObject }) {
             newIcon,
             needsProxy,
           });
-        } catch (e) {
+        } catch {
           setIsInvalidUrl(true);
         } finally {
           setFetchingMetadata(false);
diff --git a/packages/story-editor/src/utils/getMediaBaseColor.ts b/packages/story-editor/src/utils/getMediaBaseColor.ts
@@ -41,7 +41,7 @@ async function extractColorFromImage(img: HTMLImageElement): Promise<string> {
       if (err instanceof Error) {
         void trackError('image_base_color', err.message);
       }
-      reject(err);
+      reject(err as Error);
     }
   });
 }
diff --git a/packages/story-editor/src/utils/useCORSProxy.ts b/packages/story-editor/src/utils/useCORSProxy.ts
@@ -50,7 +50,7 @@ function useCORSProxy() {
       await fetch(link, {
         method: 'HEAD',
       });
-    } catch (err) {
+    } catch {
       shouldProxy = true;
     }
 
diff --git a/packages/story-editor/src/utils/useRefreshPostEditURL.ts b/packages/story-editor/src/utils/useRefreshPostEditURL.ts
diff --git a/packages/url/src/safeDecodeUriComponent.ts b/packages/url/src/safeDecodeUriComponent.ts
diff --git a/packages/url/src/url.ts b/packages/url/src/url.ts

Original file line number	Diff line number	Diff line change
`@@ -25,5 +25,6 @@ import 'styled-components';`
`25`	`25`	`import type { Theme } from '../theme';`
`26`	`26`
`27`	`27`	`declare module 'styled-components' {`
	`28`	`+ // eslint-disable-next-line @typescript-eslint/no-empty-object-type -- On purpose.`
`28`	`29`	`export interface DefaultTheme extends Theme {}`
`29`	`30`	`}`
Original file line number	Diff line number	Diff line change
`@@ -337,7 +337,9 @@ function TextEdit({`
`337`	`337`	editWrapper.style.left = `${boxRef.current.x + dx}px`;
`338`	`338`	editWrapper.style.top = `${boxRef.current.y + dy}px`;
`339`	`339`	`}`
`340`		`- onResize && onResize();`
	`340`	`+ if (onResize) {`
	`341`	`+ onResize();`
	`342`	`+ }`
`341`	`343`	`}`
`342`	`344`	`}, [dataToEditorY, editWrapper, element, onResize, top, bottom]);`
`343`	`345`	`// Invoke on each content update.`
Original file line number	Diff line number	Diff line change
`@@ -21,5 +21,6 @@ import 'styled-components';`
`21`	`21`	`import type { Theme } from '@googleforcreators/design-system';`
`22`	`22`
`23`	`23`	`declare module 'styled-components' {`
	`24`	`+ // eslint-disable-next-line @typescript-eslint/no-empty-object-type -- On purpose.`
`24`	`25`	`export interface DefaultTheme extends Theme {}`
`25`	`26`	`}`
Original file line number	Diff line number	Diff line change
`@@ -57,7 +57,7 @@ function stylesToCSS(styles: DraftInlineStyle): null \| CSSProperties {`
`57`	`57`	`let color: Pattern;`
`58`	`58`	`try {`
`59`	`59`	`color = styleToColor(style);`
`60`		`- } catch (e) {`
	`60`	`+ } catch {`
`61`	`61`	`return null;`
`62`	`62`	`}`
`63`	`63`
Original file line number	Diff line number	Diff line change
`@@ -68,7 +68,7 @@ function stylesToCSS(styles: DraftInlineStyle): null \| CSSProperties {`
`68`	`68`	`let color: Pattern;`
`69`	`69`	`try {`
`70`	`70`	`color = styleToColor(colorStyle);`
`71`		`- } catch (e) {`
	`71`	`+ } catch {`
`72`	`72`	`return null;`
`73`	`73`	`}`
`74`	`74`
Original file line number	Diff line number	Diff line change
`@@ -51,10 +51,7 @@ function isItalic(editorState: EditorState) {`
`51`	`51`	`return !styles.includes(NONE);`
`52`	`52`	`}`
`53`	`53`
`54`		`-function toggleItalic(`
`55`		`- editorState: EditorState,`
`56`		`- flag?: undefined \| boolean`
`57`		`-): EditorState {`
	`54`	`+function toggleItalic(editorState: EditorState, flag?: boolean): EditorState {`
`58`	`55`	`if (typeof flag === 'boolean') {`
`59`	`56`	`return togglePrefixStyle(editorState, ITALIC, () => flag);`
`60`	`57`	`}`
Original file line number	Diff line number	Diff line change
`@@ -51,7 +51,7 @@ function isUnderline(editorState: EditorState) {`
`51`	`51`	`return !styles.includes(NONE);`
`52`	`52`	`}`
`53`	`53`
`54`		`-function toggleUnderline(editorState: EditorState, flag?: undefined \| boolean) {`
	`54`	`+function toggleUnderline(editorState: EditorState, flag?: boolean) {`
`55`	`55`	`if (typeof flag === 'boolean') {`
`56`	`56`	`return togglePrefixStyle(editorState, UNDERLINE, () => flag);`
`57`	`57`	`}`
Original file line number	Diff line number	Diff line change
`@@ -51,7 +51,7 @@ function isUppercase(editorState: EditorState) {`
`51`	`51`	`return !styles.includes(NONE);`
`52`	`52`	`}`
`53`	`53`
`54`		`-function toggleUppercase(editorState: EditorState, flag?: undefined \| boolean) {`
	`54`	`+function toggleUppercase(editorState: EditorState, flag?: boolean) {`
`55`	`55`	`if (typeof flag === 'boolean') {`
`56`	`56`	`return togglePrefixStyle(editorState, UPPERCASE, () => flag);`
`57`	`57`	`}`
Original file line number	Diff line number	Diff line change
`@@ -73,7 +73,7 @@ function isBold(editorState: EditorState) {`
`73`	`73`	`return weights.every((w) => w >= SMALLEST_BOLD);`
`74`	`74`	`}`
`75`	`75`
`76`		`-function toggleBold(editorState: EditorState, flag?: undefined \| boolean) {`
	`76`	`+function toggleBold(editorState: EditorState, flag?: boolean) {`
`77`	`77`	`if (typeof flag === 'boolean') {`
`78`	`78`	`if (flag) {`
`79`	`79`	`const getDefault = () => weightToStyle(DEFAULT_BOLD);`
Original file line number	Diff line number	Diff line change
`@@ -238,7 +238,7 @@ function useCanvasGlobalKeys() {`
`238`	`238`	`if (files.length > 0) {`
`239`	`239`	`uploadWithPreview(files);`
`240`	`240`	`}`
`241`		`- } catch (e) {`
	`241`	`+ } catch {`
`242`	`242`	`// Ignore.`
`243`	`243`	`}`
`244`	`244`	`},`