🏷️(frontend) adapt types to typescript v6

We updated typescript to v6, which includes some breaking changes. This commit adapts our code to be compatible with the new version of typescript.
2026-08-17 21:25:43 +02:00 · 2026-05-05 10:53:38 +02:00
parent 9231730bf0
commit 0e8094c733
19 changed files with 43 additions and 45 deletions
@@ -1,6 +1,6 @@
 {
  "compilerOptions": {
-    "target": "es5",
+    "target": "es2020",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
@@ -1,12 +1,13 @@
-import { Ref, forwardRef } from 'react';
+import { ComponentPropsWithRef, Ref, forwardRef } from 'react';
 import { css } from 'styled-components';

-import { Box, BoxType } from './Box';
+import { Box, BoxProps } from './Box';

-export type BoxButtonType = Omit<BoxType, 'ref'> & {
-  disabled?: boolean;
-  ref?: Ref<HTMLButtonElement>;
-};
+export type BoxButtonType = BoxProps &
+  Omit<ComponentPropsWithRef<'button'>, keyof BoxProps | 'ref'> & {
+    disabled?: boolean;
+    ref?: Ref<HTMLButtonElement>;
+  };

 /**
 * Styleless button that extends the Box component.
@@ -59,7 +60,7 @@ const BoxButton = forwardRef<HTMLButtonElement, BoxButtonType>(
          if (disabled) {
            return;
          }
-          props.onClick?.(event as unknown as React.MouseEvent<HTMLDivElement>);
+          props.onClick?.(event);
        }}
      />
    );
@@ -34,9 +34,7 @@ export const TextStyled = styled(Box)<TextProps>`

 const Text = forwardRef<HTMLElement, ComponentPropsWithRef<typeof TextStyled>>(
  (props, ref) => {
-    return (
-      <TextStyled ref={ref as React.Ref<HTMLDivElement>} as="span" {...props} />
-    );
+    return <TextStyled ref={ref} as="span" {...props} />;
  },
 );

@@ -35,7 +35,7 @@ const initialState: ThemeStore = {
  colorsTokens: defaultTokens.globals.colors,
  componentTokens: defaultTokens.components,
  contextualTokens: defaultTokens.contextuals,
-  currentTokens: tokens.themes[DEFAULT_THEME] as Partial<Tokens>,
+  currentTokens: tokens.themes[DEFAULT_THEME],
  fontSizesTokens: defaultTokens.globals.font.sizes,
  setTheme: () => {},
  spacingsTokens: defaultTokens.globals.spacings,
@@ -1,12 +1,13 @@
-import React from 'react';
+import React, { ComponentPropsWithRef } from 'react';

-import { Box, BoxType } from '@/components';
+import { Box, BoxProps } from '@/components';

-type AvatarSvgProps = {
-  initials: string;
-  background: string;
-  fontFamily?: string;
-} & BoxType;
+type AvatarSvgProps = BoxProps &
+  Omit<ComponentPropsWithRef<'svg'>, keyof BoxProps> & {
+    initials: string;
+    background: string;
+    fontFamily?: string;
+  };

 export const AvatarSvg: React.FC<AvatarSvgProps> = ({
  initials,
@@ -67,7 +67,7 @@ export class DocsThreadStore extends ThreadStore {
        continue;
      }

-      const state = states.get(clientId) as
+      const state:
        | {
            [DocsThreadStore.COMMENTS_PING]?: {
              at: number;
@@ -76,7 +76,7 @@ export class DocsThreadStore extends ThreadStore {
              threadId: string;
            };
          }
-        | undefined;
+        | undefined = states.get(clientId);

      const ping = state?.commentsPing;

@@ -41,7 +41,7 @@ export const LinkSelected = ({
  const router = useRouter();
  const href = `/docs/${docId}/`;

-  const handleClick = (e: React.MouseEvent<HTMLDivElement>) => {
+  const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {
    e.preventDefault();

    // If ctrl or command is pressed, it opens a new tab. If shift is pressed, it opens a new window
@@ -53,7 +53,7 @@ export const LinkSelected = ({
  };

  // This triggers on middle-mouse click
-  const handleAuxClick = (e: React.MouseEvent<HTMLDivElement>) => {
+  const handleAuxClick = (e: React.MouseEvent<HTMLButtonElement>) => {
    if (e.button !== 1) {
      return;
    }
@@ -39,7 +39,13 @@ const withMultiColumnNoDropHandler = <
  });
 };

-let modulesXL = undefined;
+type ModulesXL =
+  | (Omit<typeof XLMultiColumn, 'withMultiColumn'> & {
+      withMultiColumn: typeof withMultiColumnNoDropHandler;
+    })
+  | undefined;
+
+let modulesXL: ModulesXL = undefined;
 if (process.env.NEXT_PUBLIC_PUBLISH_AS_MIT === 'false') {
  modulesXL = {
    ...XLMultiColumn,
@@ -47,10 +53,4 @@ if (process.env.NEXT_PUBLIC_PUBLISH_AS_MIT === 'false') {
  };
 }

-type ModulesXL =
-  | (Omit<typeof XLMultiColumn, 'withMultiColumn'> & {
-      withMultiColumn: typeof withMultiColumnNoDropHandler;
-    })
-  | undefined;
-
-export default modulesXL as ModulesXL;
+export default modulesXL;
@@ -11,7 +11,7 @@ import {
  useToastProvider,
 } from '@gouvfr-lasuite/cunningham-react';
 import { DocumentProps, pdf } from '@react-pdf/renderer';
-import jsonemoji from 'emoji-datasource-apple' assert { type: 'json' };
+import jsonemoji from 'emoji-datasource-apple' with { type: 'json' };
 import i18next from 'i18next';
 import JSZip from 'jszip';
 import { cloneElement, isValidElement, useState } from 'react';
@@ -16,6 +16,4 @@ if (process.env.NEXT_PUBLIC_PUBLISH_AS_MIT === 'false') {
  };
 }

-type ModulesExport = typeof modulesExport;
-
-export default modulesExport as ModulesExport;
+export default modulesExport;
@@ -68,7 +68,7 @@ export const BoutonShare = ({
            />
          }
          onClick={(e) => {
-            addLastFocus(e.currentTarget as HTMLElement);
+            addLastFocus(e.currentTarget);
            open();
          }}
          size="medium"
@@ -85,7 +85,7 @@ export const BoutonShare = ({
      color="brand"
      variant="tertiary"
      onClick={(e) => {
-        addLastFocus(e.currentTarget as HTMLElement);
+        addLastFocus(e.currentTarget);
        open();
      }}
      size="medium"
@@ -244,7 +244,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
              <Icon iconName="download" $color="inherit" aria-hidden={true} />
            }
            onClick={(e) => {
-              addLastFocus(e.currentTarget as HTMLElement);
+              addLastFocus(e.currentTarget);
              setIsModalExportOpen(true);
            }}
            size={isSmallMobile ? 'small' : 'medium'}
@@ -50,7 +50,7 @@ export const DocsGridItemSharedButton = ({ doc, disabled }: Props) => {
          onClick={(event) => {
            event.preventDefault();
            event.stopPropagation();
-            addLastFocus(event.currentTarget as HTMLElement);
+            addLastFocus(event.currentTarget);
            shareModal.open();
          }}
          color="brand"
@@ -50,7 +50,7 @@ export class RequestSerializer {

  public static arrayBufferToString(buffer: ArrayBufferLike) {
    const decoder = new TextDecoder();
-    return decoder.decode(buffer as ArrayBuffer);
+    return decoder.decode(buffer);
  }

  public static arrayBufferToJson<T>(buffer: ArrayBufferLike) {
@@ -15,7 +15,7 @@ const mockServiceWorkerScope = {
 (global as any).self = {
  ...global,
  clients: mockServiceWorkerScope.clients,
-} as unknown as ServiceWorkerGlobalScope;
+};

 describe('OfflinePlugin', () => {
  afterEach(() => vi.clearAllMocks());
@@ -1,6 +1,6 @@
 {
  "compilerOptions": {
-    "target": "es5",
+    "target": "es2020",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
@@ -1,6 +1,6 @@
 {
  "compilerOptions": {
-    "target": "es5",
+    "target": "es2020",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
@@ -62,7 +62,7 @@ const readers: InputReader[] = [
      const ydoc = new Y.Doc();
      try {
        Y.applyUpdate(ydoc, data);
-        return editor.yDocToBlocks(ydoc, 'document-store') as PartialBlock[];
+        return editor.yDocToBlocks(ydoc, 'document-store');
      } finally {
        ydoc.destroy();
      }
@@ -1,6 +1,6 @@
 {
  "compilerOptions": {
-    "target": "es5",
+    "target": "es2020",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,