From baec28ed6ef5a9b045bcdb3e5f0f7eb8e9911a7a Mon Sep 17 00:00:00 2001
From: Darya Umrikhina <darya.umrihina@onlyoffice.com>
Date: Thu, 13 Jun 2024 15:16:05 +0700
Subject: [PATCH] Shared:Components:Tabs: remove as from type declaration

---
 packages/shared/components/tabs/Tabs.tsx            | 6 ++++--
 packages/shared/components/tabs/hooks/useViewTab.ts | 4 ++--
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/packages/shared/components/tabs/Tabs.tsx b/packages/shared/components/tabs/Tabs.tsx
index 2804bc59d0..5fb6bbd022 100644
--- a/packages/shared/components/tabs/Tabs.tsx
+++ b/packages/shared/components/tabs/Tabs.tsx
@@ -24,7 +24,7 @@
 // content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
 // International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
 
-import { useState, useRef, MutableRefObject, useEffect } from "react";
+import React, { useState, useRef, useEffect } from "react";
 import { useTheme } from "styled-components";
 
 import { useViewTab } from "./hooks/useViewTab";
@@ -50,7 +50,7 @@ const Tabs = (props: TabsProps) => {
   }
 
   const globalTheme = useTheme();
-  const tabsRef = useRef() as MutableRefObject<HTMLDivElement>;
+  const tabsRef = useRef<HTMLDivElement>(null);
 
   const [currentItem, setCurrentItem] = useState<TTabItem>(
     items[selectedItemIndex],
@@ -64,6 +64,8 @@ const Tabs = (props: TabsProps) => {
   }, [selectedItemIndex, items]);
 
   const scrollToTab = (index: number): void => {
+    if (!tabsRef.current) return;
+
     const tabElement = tabsRef.current.children[index] as HTMLElement;
     const containerWidth = tabsRef.current.offsetWidth;
     const tabWidth = tabElement.offsetWidth;
diff --git a/packages/shared/components/tabs/hooks/useViewTab.ts b/packages/shared/components/tabs/hooks/useViewTab.ts
index dd36df8249..9488eed14e 100644
--- a/packages/shared/components/tabs/hooks/useViewTab.ts
+++ b/packages/shared/components/tabs/hooks/useViewTab.ts
@@ -18,7 +18,7 @@
 //
 // Pursuant to Section 7(b) of the License you must retain the original Product logo when
 // distributing the program. Pursuant to Section 7(e) we decline to grant you any rights under
-// trademark law for use of our trademarks.
+// trademark law for use of our trademarks.s
 //
 // All the Product's GUI elements, including illustrations and icon sets, as well as technical writing
 // content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
@@ -27,7 +27,7 @@
 import { useEffect, useState, useRef, RefObject } from "react";
 
 export const useViewTab = (
-  containerRef: RefObject<HTMLElement>,
+  containerRef: RefObject<HTMLDivElement>,
   index: number,
 ) => {
   const [isViewTab, setIsViewTab] = useState<boolean>(true);