diff --git a/eslint.config.mjs b/eslint.config.mjs
index 201eeeda8..946b0f7a8 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -49,7 +49,6 @@ export default tseslint.config(
       'jest.config.ts',
       'notices.template.html',
       'tools',
-      'typings',
       'vite.config.mts',
     ],
     extends: [
diff --git a/src/Frontend/Components/Autocomplete/Listbox/Listbox.tsx b/src/Frontend/Components/Autocomplete/Listbox/Listbox.tsx
index 276667302..6dfaf3246 100644
--- a/src/Frontend/Components/Autocomplete/Listbox/Listbox.tsx
+++ b/src/Frontend/Components/Autocomplete/Listbox/Listbox.tsx
@@ -12,7 +12,7 @@ import {
 } from '@mui/material/useAutocomplete';
 import { SxProps } from '@mui/system';
 import { groupBy as _groupBy } from 'lodash';
-import { forwardRef, useMemo, useState } from 'react';
+import { useMemo, useState } from 'react';
 import { GroupedVirtuoso, Virtuoso, VirtuosoHandle } from 'react-virtuoso';
 
 import { GroupContainer, styles } from './Listbox.style';
@@ -21,6 +21,7 @@ export type ListboxProps<
   Value,
   FreeSolo extends boolean | undefined,
 > = React.HTMLAttributes<HTMLElement> & {
+  ref?: React.RefObject<HTMLDivElement>;
   virtuosoRef: React.RefObject<VirtuosoHandle | null>;
   options: Array<Value>;
   groupProps?: {
@@ -61,147 +62,134 @@ interface Groups<Value> {
   firstSelectedIndex: number;
 }
 
-export const Listbox = forwardRef(
-  <Value, FreeSolo extends boolean | undefined>(
-    {
-      virtuosoRef,
-      closePopper,
-      getOptionKey,
-      getOptionProps,
-      groupBy,
-      groupProps,
-      optionText,
-      options,
-      renderOptionEndIcon,
-      renderOptionStartIcon,
-      ...listboxProps
-    }: ListboxProps<Value, FreeSolo>,
-    forwardedRef: React.ForwardedRef<HTMLDivElement>,
-  ) => {
-    const [height, setHeight] = useState<number>(Number.MAX_SAFE_INTEGER); // will result in max-height
+export const Listbox = <Value, FreeSolo extends boolean | undefined>({
+  virtuosoRef,
+  closePopper,
+  getOptionKey,
+  getOptionProps,
+  groupBy,
+  groupProps,
+  optionText,
+  options,
+  renderOptionEndIcon,
+  renderOptionStartIcon,
+  ref,
+  ...listboxProps
+}: ListboxProps<Value, FreeSolo>) => {
+  const [height, setHeight] = useState<number>(Number.MAX_SAFE_INTEGER); // will result in max-height
 
-    const groups = useMemo((): Groups<Value> | undefined => {
-      if (!groupBy) {
-        return undefined;
-      }
+  const groups = useMemo((): Groups<Value> | undefined => {
+    if (!groupBy) {
+      return undefined;
+    }
 
-      const grouped = _groupBy(options, groupBy);
-      const flattened = Object.values(grouped).flat();
+    const grouped = _groupBy(options, groupBy);
+    const flattened = Object.values(grouped).flat();
 
-      return {
-        options: flattened,
-        groupNames: Object.keys(grouped),
-        groupCounts: Object.values(grouped).map((group) => group.length),
-        firstSelectedIndex: flattened.findIndex(
-          (option, index) =>
-            !!getOptionProps({ option, index })['aria-selected'],
-        ),
-      };
-    }, [getOptionProps, groupBy, options]);
+    return {
+      options: flattened,
+      groupNames: Object.keys(grouped),
+      groupCounts: Object.values(grouped).map((group) => group.length),
+      firstSelectedIndex: flattened.findIndex(
+        (option, index) => !!getOptionProps({ option, index })['aria-selected'],
+      ),
+    };
+  }, [getOptionProps, groupBy, options]);
 
-    return (
-      <MuiPaper
-        {...listboxProps}
-        ref={forwardedRef}
-        elevation={4}
-        square
-        role={'listbox'}
-      >
-        {groups ? renderGroupedList(groups) : renderList(options)}
-      </MuiPaper>
-    );
+  return (
+    <MuiPaper {...listboxProps} ref={ref} elevation={4} square role={'listbox'}>
+      {groups ? renderGroupedList(groups) : renderList(options)}
+    </MuiPaper>
+  );
 
-    function renderGroupedList({
-      groupCounts,
-      groupNames,
-      options,
-      firstSelectedIndex,
-    }: Groups<Value>) {
-      return (
-        <GroupedVirtuoso
-          ref={virtuosoRef}
-          style={{ ...styles.virtuoso, height }}
-          increaseViewportBy={20}
-          initialTopMostItemIndex={
-            ~firstSelectedIndex && {
-              index: firstSelectedIndex,
-              align: 'center',
-            }
+  function renderGroupedList({
+    groupCounts,
+    groupNames,
+    options,
+    firstSelectedIndex,
+  }: Groups<Value>) {
+    return (
+      <GroupedVirtuoso
+        ref={virtuosoRef}
+        style={{ ...styles.virtuoso, height }}
+        increaseViewportBy={20}
+        initialTopMostItemIndex={
+          ~firstSelectedIndex && {
+            index: firstSelectedIndex,
+            align: 'center',
           }
-          totalListHeightChanged={setHeight}
-          groupCounts={groupCounts}
-          groupContent={(index) => {
-            const IconComp = groupProps?.icon || (() => null);
-            const ActionComp = groupProps?.action || (() => null);
+        }
+        totalListHeightChanged={setHeight}
+        groupCounts={groupCounts}
+        groupContent={(index) => {
+          const IconComp = groupProps?.icon || (() => null);
+          const ActionComp = groupProps?.action || (() => null);
 
-            return (
-              <GroupContainer role={'group'}>
-                <IconComp name={groupNames[index]} />
-                <MuiTypography
-                  sx={{ ...styles.overflowEllipsis, paddingTop: '2px' }}
-                >
-                  {groupNames[index]}
-                </MuiTypography>
-                <ActionComp name={groupNames[index]} />
-              </GroupContainer>
-            );
-          }}
-          itemContent={(index) =>
-            renderOption({ index, option: options[index] })
-          }
-        />
-      );
-    }
+          return (
+            <GroupContainer role={'group'}>
+              <IconComp name={groupNames[index]} />
+              <MuiTypography
+                sx={{ ...styles.overflowEllipsis, paddingTop: '2px' }}
+              >
+                {groupNames[index]}
+              </MuiTypography>
+              <ActionComp name={groupNames[index]} />
+            </GroupContainer>
+          );
+        }}
+        itemContent={(index) => renderOption({ index, option: options[index] })}
+      />
+    );
+  }
 
-    function renderList(options: Array<Value>) {
-      return (
-        <Virtuoso
-          ref={virtuosoRef}
-          style={{
-            ...styles.virtuoso,
-            height,
-          }}
-          data={options}
-          itemContent={(index, option) => renderOption({ option, index })}
-          increaseViewportBy={20}
-          totalListHeightChanged={setHeight}
-        />
-      );
-    }
+  function renderList(options: Array<Value>) {
+    return (
+      <Virtuoso
+        ref={virtuosoRef}
+        style={{
+          ...styles.virtuoso,
+          height,
+        }}
+        data={options}
+        itemContent={(index, option) => renderOption({ option, index })}
+        increaseViewportBy={20}
+        totalListHeightChanged={setHeight}
+      />
+    );
+  }
 
-    function renderOption({
-      index,
+  function renderOption({
+    index,
+    option,
+  }: UseAutocompleteRenderedOption<Value>) {
+    const { key, ...optionProps } = getOptionProps({
       option,
-    }: UseAutocompleteRenderedOption<Value>) {
-      const { key, ...optionProps } = getOptionProps({
-        option,
-        index,
-      });
+      index,
+    });
 
-      return (
-        <MuiListItemButton
-          {...optionProps}
-          selected={optionProps['aria-selected'] as boolean}
-          disabled={optionProps['aria-disabled'] as boolean}
-          key={getOptionKey?.(option) ?? key}
-          sx={{ gap: '12px', ...optionText.sx }}
-          dense
-        >
-          {renderOptionStartIcon?.(option, { closePopper })}
-          <MuiListItemText
-            primary={optionText.primary(option)}
-            primaryTypographyProps={{
-              sx: { ...styles.overflowEllipsis },
-            }}
-            secondary={optionText.secondary?.(option)}
-            secondaryTypographyProps={{
-              variant: 'caption',
-              sx: styles.overflowEllipsis,
-            }}
-          />
-          {renderOptionEndIcon?.(option, { closePopper })}
-        </MuiListItemButton>
-      );
-    }
-  },
-);
+    return (
+      <MuiListItemButton
+        {...optionProps}
+        selected={optionProps['aria-selected'] as boolean}
+        disabled={optionProps['aria-disabled'] as boolean}
+        key={getOptionKey?.(option) ?? key}
+        sx={{ gap: '12px', ...optionText.sx }}
+        dense
+      >
+        {renderOptionStartIcon?.(option, { closePopper })}
+        <MuiListItemText
+          primary={optionText.primary(option)}
+          primaryTypographyProps={{
+            sx: { ...styles.overflowEllipsis },
+          }}
+          secondary={optionText.secondary?.(option)}
+          secondaryTypographyProps={{
+            variant: 'caption',
+            sx: styles.overflowEllipsis,
+          }}
+        />
+        {renderOptionEndIcon?.(option, { closePopper })}
+      </MuiListItemButton>
+    );
+  }
+};
diff --git a/src/Frontend/Components/Checkbox/Checkbox.tsx b/src/Frontend/Components/Checkbox/Checkbox.tsx
index 38b331cad..8cfb7b0a8 100644
--- a/src/Frontend/Components/Checkbox/Checkbox.tsx
+++ b/src/Frontend/Components/Checkbox/Checkbox.tsx
@@ -8,7 +8,6 @@ import {
   SxProps,
 } from '@mui/material';
 import MuiCheckbox from '@mui/material/Checkbox';
-import { forwardRef } from 'react';
 
 interface CheckboxProps extends Pick<FormControlLabelProps, 'labelPlacement'> {
   checked: boolean;
@@ -17,51 +16,48 @@ interface CheckboxProps extends Pick<FormControlLabelProps, 'labelPlacement'> {
   indeterminate?: boolean;
   label?: string;
   onChange(event: React.ChangeEvent<HTMLInputElement>): void;
+  ref?: React.RefObject<HTMLButtonElement>;
   sx?: SxProps;
 }
 
-export const Checkbox = forwardRef<HTMLButtonElement, CheckboxProps>(
-  (
-    {
-      checked,
-      disableRipple,
-      disabled,
-      indeterminate,
-      label,
-      labelPlacement,
-      onChange,
-      sx,
-      ...props
-    },
-    ref,
-  ) => {
-    return (
-      <FormControlLabel
-        sx={{
-          ...sx,
-          marginLeft: 'unset',
-          marginRight: !label ? 'unset' : undefined,
-        }}
-        label={label}
-        disabled={disabled}
-        labelPlacement={labelPlacement}
-        control={
-          <MuiCheckbox
-            {...props}
-            ref={ref}
-            disabled={disabled}
-            indeterminate={indeterminate}
-            checked={checked}
-            onChange={onChange}
-            inputProps={{
-              style: { zIndex: 'unset' },
-            }}
-            disableRipple={disableRipple}
-            size={'small'}
-            sx={{ padding: '7px' }}
-          />
-        }
-      />
-    );
-  },
-);
+export const Checkbox: React.FC<CheckboxProps> = ({
+  checked,
+  disableRipple,
+  disabled,
+  indeterminate,
+  label,
+  labelPlacement,
+  onChange,
+  ref,
+  sx,
+  ...props
+}) => {
+  return (
+    <FormControlLabel
+      sx={{
+        ...sx,
+        marginLeft: 'unset',
+        marginRight: !label ? 'unset' : undefined,
+      }}
+      label={label}
+      disabled={disabled}
+      labelPlacement={labelPlacement}
+      control={
+        <MuiCheckbox
+          {...props}
+          ref={ref}
+          disabled={disabled}
+          indeterminate={indeterminate}
+          checked={checked}
+          onChange={onChange}
+          inputProps={{
+            style: { zIndex: 'unset' },
+          }}
+          disableRipple={disableRipple}
+          size={'small'}
+          sx={{ padding: '7px' }}
+        />
+      }
+    />
+  );
+};
diff --git a/src/Frontend/Components/ConfirmationDialog/ConfirmationDialog.tsx b/src/Frontend/Components/ConfirmationDialog/ConfirmationDialog.tsx
index 684b3b34d..c8cb1b92b 100644
--- a/src/Frontend/Components/ConfirmationDialog/ConfirmationDialog.tsx
+++ b/src/Frontend/Components/ConfirmationDialog/ConfirmationDialog.tsx
@@ -2,13 +2,7 @@
 // SPDX-FileCopyrightText: TNG Technology Consulting GmbH <https://www.tngtech.com>
 //
 // SPDX-License-Identifier: Apache-2.0
-import {
-  forwardRef,
-  useCallback,
-  useImperativeHandle,
-  useRef,
-  useState,
-} from 'react';
+import { useCallback, useImperativeHandle, useRef, useState } from 'react';
 
 import { text } from '../../../shared/text';
 import { NotificationPopup } from '../NotificationPopup/NotificationPopup';
@@ -62,6 +56,7 @@ export function useConfirmationDialog(
 }
 
 export interface ConfirmationDialogProps {
+  ref: React.RefObject<Confirm | null>;
   title: string;
   message: React.ReactNode;
 }
@@ -79,55 +74,57 @@ export interface ConfirmationDialogProps {
  * // ...
  * <ConfirmationDialog ref={confirmRef} title="Confirm" message="Are you sure?" />
  */
-export const ConfirmationDialog = forwardRef<Confirm, ConfirmationDialogProps>(
-  ({ message, title }, ref) => {
-    const [open, setOpen] = useState(false);
-    const resolveRef = useRef<(value: boolean) => void>(undefined);
-
-    useImperativeHandle(
-      ref,
-      () =>
-        async (onConfirm, { onCancel, skip } = {}) => {
-          if (skip) {
-            void onConfirm?.();
-            return true;
-          }
-
-          setOpen(true);
-
-          const result = await new Promise<boolean>((resolve) => {
-            resolveRef.current = resolve;
-          });
-
-          if (result) {
-            void onConfirm?.();
-          } else {
-            void onCancel?.();
-          }
-
-          setOpen(false);
-
-          return result;
-        },
-      [],
-    );
-
-    return (
-      <NotificationPopup
-        content={message}
-        header={title}
-        isOpen={open}
-        rightButtonConfig={{
-          buttonText: text.buttons.cancel,
-          color: 'secondary',
-          onClick: () => resolveRef.current?.(false),
-        }}
-        centerLeftButtonConfig={{
-          buttonText: text.buttons.ok,
-          onClick: () => resolveRef.current?.(true),
-        }}
-        aria-label={'confirmation dialog'}
-      />
-    );
-  },
-);
+export const ConfirmationDialog: React.FC<ConfirmationDialogProps> = ({
+  ref,
+  message,
+  title,
+}) => {
+  const [open, setOpen] = useState(false);
+  const resolveRef = useRef<(value: boolean) => void>(undefined);
+
+  useImperativeHandle(
+    ref,
+    () =>
+      async (onConfirm, { onCancel, skip } = {}) => {
+        if (skip) {
+          void onConfirm?.();
+          return true;
+        }
+
+        setOpen(true);
+
+        const result = await new Promise<boolean>((resolve) => {
+          resolveRef.current = resolve;
+        });
+
+        if (result) {
+          void onConfirm?.();
+        } else {
+          void onCancel?.();
+        }
+
+        setOpen(false);
+
+        return result;
+      },
+    [],
+  );
+
+  return (
+    <NotificationPopup
+      content={message}
+      header={title}
+      isOpen={open}
+      rightButtonConfig={{
+        buttonText: text.buttons.cancel,
+        color: 'secondary',
+        onClick: () => resolveRef.current?.(false),
+      }}
+      centerLeftButtonConfig={{
+        buttonText: text.buttons.ok,
+        onClick: () => resolveRef.current?.(true),
+      }}
+      aria-label={'confirmation dialog'}
+    />
+  );
+};
diff --git a/src/Frontend/Components/GroupedList/GroupedList.tsx b/src/Frontend/Components/GroupedList/GroupedList.tsx
index 98cf151ad..6221ecb2c 100644
--- a/src/Frontend/Components/GroupedList/GroupedList.tsx
+++ b/src/Frontend/Components/GroupedList/GroupedList.tsx
@@ -98,9 +98,7 @@ export function GroupedList({
       {loading && <StyledLinearProgress data-testid={'loading'} />}
       {groups && (
         // Virtuoso components must not be inlined: https://github.com/petyosi/react-virtuoso/issues/566
-        <VirtuosoComponentContext.Provider
-          value={{ isVirtuosoFocused, loading }}
-        >
+        <VirtuosoComponentContext value={{ isVirtuosoFocused, loading }}>
           <GroupedVirtuoso
             ref={ref}
             onFocus={() => setIsVirtuosoFocused(true)}
@@ -133,7 +131,7 @@ export function GroupedList({
             }
             {...props}
           />
-        </VirtuosoComponentContext.Provider>
+        </VirtuosoComponentContext>
       )}
     </LoadingMask>
   );
diff --git a/src/Frontend/Components/List/List.tsx b/src/Frontend/Components/List/List.tsx
index 316bcb13e..d7f17fdbe 100644
--- a/src/Frontend/Components/List/List.tsx
+++ b/src/Frontend/Components/List/List.tsx
@@ -63,9 +63,7 @@ export function List({
       {loading && <StyledLinearProgress data-testid={'loading'} />}
       {data && (
         // Virtuoso components must not be inlined: https://github.com/petyosi/react-virtuoso/issues/566
-        <VirtuosoComponentContext.Provider
-          value={{ isVirtuosoFocused, loading }}
-        >
+        <VirtuosoComponentContext value={{ isVirtuosoFocused, loading }}>
           <Virtuoso
             ref={ref}
             onFocus={() => setIsVirtuosoFocused(true)}
@@ -86,7 +84,7 @@ export function List({
             }
             {...props}
           />
-        </VirtuosoComponentContext.Provider>
+        </VirtuosoComponentContext>
       )}
     </LoadingMask>
   );
diff --git a/src/Frontend/Components/ReportView/TableConfig.tsx b/src/Frontend/Components/ReportView/TableConfig.tsx
index ec940a2f1..fb67a5dd4 100644
--- a/src/Frontend/Components/ReportView/TableConfig.tsx
+++ b/src/Frontend/Components/ReportView/TableConfig.tsx
@@ -7,7 +7,6 @@ import TableBody from '@mui/material/TableBody';
 import TableContainer from '@mui/material/TableContainer';
 import TableHead from '@mui/material/TableHead';
 import TableRow from '@mui/material/TableRow';
-import { forwardRef } from 'react';
 import { TableComponents } from 'react-virtuoso';
 
 import { PackageInfo } from '../../../shared/shared-types';
@@ -86,7 +85,7 @@ export const tableConfigs: Array<TableConfig> = [
 
 // Virtuoso components must not be inlined: https://github.com/petyosi/react-virtuoso/issues/566
 export const TABLE_COMPONENTS: TableComponents<PackageInfo> = {
-  Scroller: forwardRef((props, ref) => <TableContainer {...props} ref={ref} />),
+  Scroller: (props) => <TableContainer {...props} />,
   Table: (props) => (
     <Table
       size={'small'}
@@ -95,7 +94,7 @@ export const TABLE_COMPONENTS: TableComponents<PackageInfo> = {
       style={{ borderCollapse: 'separate' }}
     />
   ),
-  TableHead: forwardRef((props, ref) => <TableHead {...props} ref={ref} />),
+  TableHead: (props) => <TableHead {...props} />,
   TableRow: (props) => {
     const selectedAttributionId = useAppSelector(getSelectedAttributionId);
 
@@ -107,5 +106,5 @@ export const TABLE_COMPONENTS: TableComponents<PackageInfo> = {
       />
     );
   },
-  TableBody: forwardRef((props, ref) => <TableBody {...props} ref={ref} />),
+  TableBody: (props) => <TableBody {...props} />,
 };
diff --git a/src/Frontend/Components/ResizableBox/ResizableBox.tsx b/src/Frontend/Components/ResizableBox/ResizableBox.tsx
index e1ad74a95..b0b3287c2 100644
--- a/src/Frontend/Components/ResizableBox/ResizableBox.tsx
+++ b/src/Frontend/Components/ResizableBox/ResizableBox.tsx
@@ -4,41 +4,45 @@
 // SPDX-License-Identifier: Apache-2.0
 import { SxProps } from '@mui/system';
 import { Resizable, ResizableProps } from 're-resizable';
-import { forwardRef } from 'react';
 
 interface Props extends Omit<ResizableProps, 'sx' | 'style'> {
   children: React.ReactNode;
+  ref?: React.RefObject<Resizable | null>;
   sx?: SxProps;
 }
 
-export const ResizableBox = forwardRef<Resizable, Props>(
-  ({ children, enable, sx, ...props }, ref) => {
-    return (
-      <Resizable
-        style={{ ...(sx as React.CSSProperties) }}
-        handleWrapperStyle={{ zIndex: 4 }}
-        handleStyles={{
-          right: { width: '6px', right: '-6px' }, // move outside of potential scrollbars
-          left: { width: '6px', left: '-3px' },
-          top: { height: '6px', top: 0 }, // move outside of potential scrollbars
-          bottom: { height: '6px', bottom: '-3px' },
-        }}
-        ref={ref}
-        enable={{
-          top: false,
-          right: false,
-          bottom: false,
-          left: false,
-          topRight: false,
-          bottomRight: false,
-          bottomLeft: false,
-          topLeft: false,
-          ...enable,
-        }}
-        {...props}
-      >
-        {children}
-      </Resizable>
-    );
-  },
-);
+export const ResizableBox: React.FC<Props> = ({
+  children,
+  enable,
+  ref,
+  sx,
+  ...props
+}) => {
+  return (
+    <Resizable
+      style={{ ...(sx as React.CSSProperties) }}
+      handleWrapperStyle={{ zIndex: 4 }}
+      handleStyles={{
+        right: { width: '6px', right: '-6px' }, // move outside of potential scrollbars
+        left: { width: '6px', left: '-3px' },
+        top: { height: '6px', top: 0 }, // move outside of potential scrollbars
+        bottom: { height: '6px', bottom: '-3px' },
+      }}
+      ref={ref}
+      enable={{
+        top: false,
+        right: false,
+        bottom: false,
+        left: false,
+        topRight: false,
+        bottomRight: false,
+        bottomLeft: false,
+        topLeft: false,
+        ...enable,
+      }}
+      {...props}
+    >
+      {children}
+    </Resizable>
+  );
+};
diff --git a/src/Frontend/Components/ResizePanels/ResizePanels.tsx b/src/Frontend/Components/ResizePanels/ResizePanels.tsx
index e442f60bc..5195a4401 100644
--- a/src/Frontend/Components/ResizePanels/ResizePanels.tsx
+++ b/src/Frontend/Components/ResizePanels/ResizePanels.tsx
@@ -148,9 +148,9 @@ export const ResizePanels: React.FC<ResizePanelsProps> = ({
           showSearch: !isUpperCollapsed,
           searchRef: upperSearchRef,
         })}
-        <SearchRefContext.Provider value={upperSearchRef}>
+        <SearchRefContext value={upperSearchRef}>
           {upperPanel.component}
-        </SearchRefContext.Provider>
+        </SearchRefContext>
       </>
     );
   }
@@ -187,9 +187,9 @@ export const ResizePanels: React.FC<ResizePanelsProps> = ({
           showSearch: !isLowerCollapsed,
           searchRef: lowerSearchRef,
         })}
-        <SearchRefContext.Provider value={lowerSearchRef}>
+        <SearchRefContext value={lowerSearchRef}>
           {lowerPanel.component}
-        </SearchRefContext.Provider>
+        </SearchRefContext>
       </ResizableBox>
     );
   }
diff --git a/src/Frontend/Components/SearchList/SearchList.tsx b/src/Frontend/Components/SearchList/SearchList.tsx
index b11c3e335..3006d85f2 100644
--- a/src/Frontend/Components/SearchList/SearchList.tsx
+++ b/src/Frontend/Components/SearchList/SearchList.tsx
@@ -2,14 +2,13 @@
 // SPDX-FileCopyrightText: TNG Technology Consulting GmbH <https://www.tngtech.com>
 //
 // SPDX-License-Identifier: Apache-2.0
-import { forwardRef } from 'react';
 import { useHotkeys } from 'react-hotkeys-hook';
 import { ListProps } from 'react-virtuoso';
 
 import { useSearchRef } from '../SearchRefContext/SearchRefContext';
 import { useVirtuosoComponent } from '../VirtuosoComponentContext/VirtuosoComponentContext';
 
-export const SearchList: React.FC<ListProps> = forwardRef((props, ref) => {
+export const SearchList: React.FC<ListProps> = (props) => {
   const searchRef = useSearchRef();
   const { isVirtuosoFocused } = useVirtuosoComponent();
   useHotkeys(
@@ -21,5 +20,5 @@ export const SearchList: React.FC<ListProps> = forwardRef((props, ref) => {
     [isVirtuosoFocused],
   );
 
-  return <div {...props} ref={ref} />;
-});
+  return <div {...props} />;
+};
diff --git a/src/Frontend/test-helpers/render.tsx b/src/Frontend/test-helpers/render.tsx
index 79bb7b1b7..3006c7e16 100644
--- a/src/Frontend/test-helpers/render.tsx
+++ b/src/Frontend/test-helpers/render.tsx
@@ -36,11 +36,11 @@ export function renderComponent(
       wrapper: ({ children }) => (
         <Provider store={store}>
           <QueryClientProvider client={makeReactQueryClient()}>
-            <VirtuosoMockContext.Provider
+            <VirtuosoMockContext
               value={{ itemHeight: 40, viewportHeight: 1200 }}
             >
               {children}
-            </VirtuosoMockContext.Provider>
+            </VirtuosoMockContext>
           </QueryClientProvider>
         </Provider>
       ),
diff --git a/tsconfig.json b/tsconfig.json
index 4708d4778..49b031e72 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -28,6 +28,6 @@
       "@testing-library/jest-dom"
     ]
   },
-  "include": ["src/**/*", "typings"],
+  "include": ["src/**/*"],
   "exclude": ["src/ElectronBackend/**/*"]
 }
diff --git a/typings/react.d.ts b/typings/react.d.ts
deleted file mode 100644
index 2dd988532..000000000
--- a/typings/react.d.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-// SPDX-FileCopyrightText: Meta Platforms, Inc. and its affiliates
-// SPDX-FileCopyrightText: TNG Technology Consulting GmbH <https://www.tngtech.com>
-//
-// SPDX-License-Identifier: Apache-2.0
-import { ReactNode, Ref, RefAttributes } from 'react';
-
-declare module 'react' {
-  // Overwrite type definition of forwardRef to allow forwarding generic components.
-  // See https://fettblog.eu/typescript-react-generic-forward-refs/
-  function forwardRef<T, P>(
-    render: (props: P, ref: Ref<T>) => React.ReactElement<unknown> | null,
-  ): (props: P & RefAttributes<T>) => React.ReactElement<unknown> | null;
-}