Replace ontouch with onclick (#729)

* 1.16.0

* replace ontouch with onclick

Author: fairlighteth

package.json

@@ -24,7 +24,7 @@
   },
   "types": "./dist/widgets.d.ts",
   "private": true,
-  "version": "1.15.5",
+  "version": "1.16.0",
   "engines": {
     "node": ">=14.0.0"
   },

src/custom/components/Header/MobileMenuIcon/index.tsx

@@ -67,7 +67,6 @@ interface IconProps {
   width?: number
   height?: number
   lineSize?: number
-  onTouchStart?: () => void
   onClick?: () => void
 }
 

src/custom/components/Header/index.tsx

@@ -84,7 +84,6 @@ export default function Header() {
   const isUpToSmall = useMediaQuery(upToSmall)
   const isLargeAndUp = useMediaQuery(LargeAndUp)
 
-  const [isTouch, setIsTouch] = useState<boolean>(false)
   const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false)
   const handleMobileMenuOnClick = useCallback(() => {
     isUpToLarge && setIsMobileMenuOpen(!isMobileMenuOpen)
@@ -94,8 +93,6 @@ export default function Header() {
   // This removes the inner scrollbar on the page body, to prevent showing double scrollbars.
   useEffect(() => {
     isMobileMenuOpen ? addBodyClass('noScroll') : removeBodyClass('noScroll')
-    // Set if device has touch capabilities
-    setIsTouch('ontouchstart' in document.documentElement)
   }, [isOrdersPanelOpen, isMobileMenuOpen, isUpToLarge, isUpToMedium, isUpToSmall, isLargeAndUp])
 
   return (
@@ -137,13 +134,7 @@ export default function Header() {
           </HeaderElement>
         </HeaderControls>
 
-        {isUpToLarge && (
-          <MobileMenuIcon
-            isMobileMenuOpen={isMobileMenuOpen}
-            onTouchStart={handleMobileMenuOnClick}
-            onClick={isTouch ? undefined : handleMobileMenuOnClick} // Disable onClick on touch devices and use onTouchStart
-          />
-        )}
+        {isUpToLarge && <MobileMenuIcon isMobileMenuOpen={isMobileMenuOpen} onClick={handleMobileMenuOnClick} />}
         {isOrdersPanelOpen && <OrdersPanel handleCloseOrdersPanel={handleCloseOrdersPanel} />}
       </HeaderModWrapper>
     </Wrapper>