From 9aa47c5736588f9d4cf769fa099b3a524b346c27 Mon Sep 17 00:00:00 2001
From: Lukas Harbarth <lukas.harbarth@sap.com>
Date: Wed, 24 Sep 2025 16:07:32 +0200
Subject: [PATCH 1/2] fix: fix React18 ref types

---
 .../AnalyticalTable/TableBody/VirtualTableBody.tsx          | 4 ++--
 .../src/components/AnalyticalTable/hooks/useScrollToRef.ts  | 4 ++--
 packages/main/src/components/AnalyticalTable/util/index.ts  | 4 ++--
 packages/main/src/components/MessageView/MessageItem.tsx    | 1 -
 .../main/src/components/ObjectPage/useHandleTabSelect.ts    | 6 +++---
 5 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/packages/main/src/components/AnalyticalTable/TableBody/VirtualTableBody.tsx b/packages/main/src/components/AnalyticalTable/TableBody/VirtualTableBody.tsx
index ec29d314b7c..63ab201a115 100644
--- a/packages/main/src/components/AnalyticalTable/TableBody/VirtualTableBody.tsx
+++ b/packages/main/src/components/AnalyticalTable/TableBody/VirtualTableBody.tsx
@@ -1,6 +1,6 @@
 import type { Virtualizer } from '@tanstack/react-virtual';
 import { clsx } from 'clsx';
-import type { MutableRefObject, RefObject } from 'react';
+import type { MutableRefObject } from 'react';
 import { useEffect, useMemo, useRef } from 'react';
 import type {
   AnalyticalTablePropTypes,
@@ -35,7 +35,7 @@ interface VirtualTableBodyProps {
   subRowsKey: string;
   scrollContainerRef?: MutableRefObject<HTMLDivElement>;
   triggerScroll?: TriggerScrollState;
-  scrollToRef: RefObject<ReactVirtualScrollToMethods>;
+  scrollToRef: MutableRefObject<ReactVirtualScrollToMethods>;
   rowVirtualizer: Virtualizer<DivWithCustomScrollProp, HTMLElement>;
 }
 
diff --git a/packages/main/src/components/AnalyticalTable/hooks/useScrollToRef.ts b/packages/main/src/components/AnalyticalTable/hooks/useScrollToRef.ts
index 735a8897c18..6614b1d2db0 100644
--- a/packages/main/src/components/AnalyticalTable/hooks/useScrollToRef.ts
+++ b/packages/main/src/components/AnalyticalTable/hooks/useScrollToRef.ts
@@ -1,4 +1,4 @@
-import type { RefCallback, RefObject } from 'react';
+import type { RefCallback, MutableRefObject } from 'react';
 import { useCallback, useRef } from 'react';
 import type { AnalyticalTableScrollMode } from '../../../enums/AnalyticalTableScrollMode.js';
 import type { AnalyticalTableDomRef, ScrollToRefType, TableInstance } from '../types/index.js';
@@ -6,7 +6,7 @@ import type { AnalyticalTableDomRef, ScrollToRefType, TableInstance } from '../t
 export function useScrollToRef(
   componentRef: (node: AnalyticalTableDomRef) => void,
   dispatch: TableInstance['dispatch'],
-): [RefCallback<AnalyticalTableDomRef>, RefObject<ScrollToRefType | null>] {
+): [RefCallback<AnalyticalTableDomRef>, MutableRefObject<ScrollToRefType | null>] {
   const scrollToRef = useRef<ScrollToRefType | null>(null);
 
   const cbRef: RefCallback<AnalyticalTableDomRef> = useCallback(
diff --git a/packages/main/src/components/AnalyticalTable/util/index.ts b/packages/main/src/components/AnalyticalTable/util/index.ts
index c9843c54006..601671a02d5 100644
--- a/packages/main/src/components/AnalyticalTable/util/index.ts
+++ b/packages/main/src/components/AnalyticalTable/util/index.ts
@@ -1,4 +1,4 @@
-import type { CSSProperties, RefObject } from 'react';
+import type { CSSProperties, MutableRefObject, RefObject } from 'react';
 import { TextAlign } from '../../../enums/TextAlign.js';
 import { VerticalAlign } from '../../../enums/VerticalAlign.js';
 
@@ -191,7 +191,7 @@ export function getLeafHeaders(header) {
 }
 
 export const getCombinedElementsHeight = (
-  prevHeightRef: RefObject<number>,
+  prevHeightRef: MutableRefObject<number>,
   ...refs: RefObject<HTMLElement>[]
 ): number => {
   const prevHeight = prevHeightRef.current;
diff --git a/packages/main/src/components/MessageView/MessageItem.tsx b/packages/main/src/components/MessageView/MessageItem.tsx
index 22e8a84876d..8e692b0d0b9 100644
--- a/packages/main/src/components/MessageView/MessageItem.tsx
+++ b/packages/main/src/components/MessageView/MessageItem.tsx
@@ -129,7 +129,6 @@ const MessageItem = forwardRef<ListItemCustomDomRef, MessageItemPropTypes>((prop
     if (typeof titleText === 'string') {
       setTitleTextStr(titleText);
     } else if (isValidElement(titleText) && typeof (titleText.props as LinkPropTypes)?.children === 'string') {
-      // @ts-expect-error: props.children is available and a string
       setTitleTextStr(titleText.props.children);
     }
   }, [titleText]);
diff --git a/packages/main/src/components/ObjectPage/useHandleTabSelect.ts b/packages/main/src/components/ObjectPage/useHandleTabSelect.ts
index ae882b04db0..5a910ea7661 100644
--- a/packages/main/src/components/ObjectPage/useHandleTabSelect.ts
+++ b/packages/main/src/components/ObjectPage/useHandleTabSelect.ts
@@ -1,6 +1,6 @@
 import type { debounce } from '@ui5/webcomponents-react-base';
 import { enrichEventWithDetails } from '@ui5/webcomponents-react-base';
-import type { Dispatch, JSXElementConstructor, ReactElement, RefObject, SetStateAction } from 'react';
+import type { Dispatch, JSXElementConstructor, MutableRefObject, ReactElement, RefObject, SetStateAction } from 'react';
 import { isValidElement, useEffect, useState } from 'react';
 import { ObjectPageMode } from '../../enums/ObjectPageMode.js';
 import type { TabContainerPropTypes } from '../../webComponents/TabContainer/index.js';
@@ -16,11 +16,11 @@ interface UseHandleTabSelectProps {
   childrenArray: ReactElement<ObjectPageSectionPropTypes, string | JSXElementConstructor<any>>[];
   handleOnSectionSelected: any;
 
-  isProgrammaticallyScrolled: RefObject<boolean>;
+  isProgrammaticallyScrolled: MutableRefObject<boolean>;
   setInternalSelectedSectionId: Dispatch<SetStateAction<string>>;
   objectPageRef: RefObject<ObjectPageDomRef>;
   debouncedOnSectionChange: ReturnType<typeof debounce>;
-  scrollTimeout: RefObject<number>;
+  scrollTimeout: MutableRefObject<number>;
   setSelectedSubSectionId: Dispatch<SetStateAction<string>>;
   setTabSelectId: Dispatch<SetStateAction<string | null>>;
   setWasUserSectionChange: Dispatch<SetStateAction<boolean>>;

From 02358a5a0bb4e536af15491ca9b00d6a702e7dab Mon Sep 17 00:00:00 2001
From: Lukas Harbarth <lukas.harbarth@sap.com>
Date: Thu, 25 Sep 2025 08:41:51 +0200
Subject: [PATCH 2/2] Update MessageItem.tsx

---
 packages/main/src/components/MessageView/MessageItem.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/main/src/components/MessageView/MessageItem.tsx b/packages/main/src/components/MessageView/MessageItem.tsx
index 8e692b0d0b9..0383de590b4 100644
--- a/packages/main/src/components/MessageView/MessageItem.tsx
+++ b/packages/main/src/components/MessageView/MessageItem.tsx
@@ -128,7 +128,7 @@ const MessageItem = forwardRef<ListItemCustomDomRef, MessageItemPropTypes>((prop
   useEffect(() => {
     if (typeof titleText === 'string') {
       setTitleTextStr(titleText);
-    } else if (isValidElement(titleText) && typeof (titleText.props as LinkPropTypes)?.children === 'string') {
+    } else if (isValidElement<LinkPropTypes>(titleText) && typeof titleText.props.children === 'string') {
       setTitleTextStr(titleText.props.children);
     }
   }, [titleText]);