From 063e599d22a1c5f3905ce5b7adbbd272c309ce93 Mon Sep 17 00:00:00 2001
From: Tiago Evangelista Pinto <tiago.evangelista@rocket.chat>
Date: Wed, 27 Apr 2022 20:17:44 -0300
Subject: [PATCH] fix

---
 packages/livechat/.storybook/main.js          |  2 +-
 packages/livechat/package.json                |  2 ++
 .../livechat/src/components/Menu/index.js     | 11 +++---
 .../livechat/src/components/Tooltip/index.js  |  4 +--
 yarn.lock                                     | 34 ++++++++++++++++++-
 5 files changed, 42 insertions(+), 11 deletions(-)

diff --git a/packages/livechat/.storybook/main.js b/packages/livechat/.storybook/main.js
index 983502a9ec57..dd5ca2c73ae3 100644
--- a/packages/livechat/.storybook/main.js
+++ b/packages/livechat/.storybook/main.js
@@ -6,7 +6,7 @@ module.exports = {
 				backgrounds: false,
 			}
 		},
-		'@storybook/addon-knobs/register',
+		'@storybook/addon-knobs',
   ],
   stories: [
 		'../src/**/stories.js',
diff --git a/packages/livechat/package.json b/packages/livechat/package.json
index 87aae83d3edc..358c0bd56867 100644
--- a/packages/livechat/package.json
+++ b/packages/livechat/package.json
@@ -36,6 +36,7 @@
 		"@storybook/react": "^6.0.12",
 		"@storybook/storybook-deployer": "^2.8.6",
 		"@storybook/theming": "^6.0.12",
+		"@types/react-dom": "^18",
 		"autoprefixer": "^9.8.6",
 		"babel-eslint": "^10.1.0",
 		"babel-loader": "^8.1.0",
@@ -65,6 +66,7 @@
 		"postcss-loader": "^3.0.0",
 		"postcss-logical": "^4.0.2",
 		"postcss-selector-not": "^4.0.0",
+		"react-dom": "^18.1.0",
 		"rimraf": "^3.0.2",
 		"sass": "^1.49.10",
 		"sass-loader": "^9.0.2",
diff --git a/packages/livechat/src/components/Menu/index.js b/packages/livechat/src/components/Menu/index.js
index fb189e35213c..457c6caa619f 100644
--- a/packages/livechat/src/components/Menu/index.js
+++ b/packages/livechat/src/components/Menu/index.js
@@ -1,4 +1,4 @@
-import { h, Component } from 'preact';
+import { Component } from 'preact';
 
 import { PopoverTrigger } from '../Popover';
 import { createClassName, normalizeDOMRect } from '../helpers';
@@ -20,7 +20,7 @@ export const Group = ({ children, title, ...props }) => (
 );
 
 
-export const Item = ({ children, primary, danger, disabled, icon, ...props }) => (
+export const Item = ({ children, primary, danger, disabled, icon, ...props }) =>
 	<button
 		className={createClassName(styles, 'menu__item', { primary, danger, disabled })}
 		disabled={disabled}
@@ -28,14 +28,11 @@ export const Item = ({ children, primary, danger, disabled, icon, ...props }) =>
 	>
 		{icon && (
 			<div className={createClassName(styles, 'menu__item__icon')}>
-				{h(icon)}
+				{icon()}
 			</div>
 		)}
 		{children}
-	</button>
-);
-
-
+	</button>;
 class PopoverMenuWrapper extends Component {
 	state = {}
 
diff --git a/packages/livechat/src/components/Tooltip/index.js b/packages/livechat/src/components/Tooltip/index.js
index 03e7b2450a19..0bf5e395c1e8 100644
--- a/packages/livechat/src/components/Tooltip/index.js
+++ b/packages/livechat/src/components/Tooltip/index.js
@@ -1,4 +1,4 @@
-import { h, cloneElement, Component, createContext, toChildArray } from 'preact';
+import { cloneElement, Component, createContext, toChildArray } from 'preact';
 
 import { createClassName } from '../helpers';
 import styles from './styles.scss';
@@ -107,7 +107,7 @@ export const TooltipTrigger = ({ children, content, placement }) => (
 export const withTooltip = (component) => {
 	const TooltipConnection = ({ tooltip, ...props }) => (
 		<Tooltip.Trigger content={tooltip}>
-			{h(component, props)}
+			{component(props)}
 		</Tooltip.Trigger>
 	);
 	TooltipConnection.displayName = `withTooltip(${ component.displayName })`;
diff --git a/yarn.lock b/yarn.lock
index 0f1f06db1526..cb61ef5e3240 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3825,6 +3825,7 @@ __metadata:
     "@storybook/react": ^6.0.12
     "@storybook/storybook-deployer": ^2.8.6
     "@storybook/theming": ^6.0.12
+    "@types/react-dom": ^18
     autoprefixer: ^9.8.6
     babel-eslint: ^10.1.0
     babel-loader: ^8.1.0
@@ -3867,6 +3868,7 @@ __metadata:
     preact: ^10.4.6
     preact-router: ^3.2.1
     query-string: ^6.13.1
+    react-dom: ^18.1.0
     react-i18next: ^11.13.0
     rimraf: ^3.0.2
     sass: ^1.49.10
@@ -6784,7 +6786,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/react-dom@npm:*, @types/react-dom@npm:~17.0.14":
+"@types/react-dom@npm:*, @types/react-dom@npm:^18":
+  version: 18.0.2
+  resolution: "@types/react-dom@npm:18.0.2"
+  dependencies:
+    "@types/react": "*"
+  checksum: 2b0b138d8634ccfd8a86b17cb5414b122ee0cb6f650377d772f6008761a27e4c2531c08e3cab71aaa19b6893af6a508c664aa314db3ebcff5b8179173c9c9307
+  languageName: node
+  linkType: hard
+
+"@types/react-dom@npm:~17.0.14":
   version: 17.0.14
   resolution: "@types/react-dom@npm:17.0.14"
   dependencies:
@@ -27371,6 +27382,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-dom@npm:^18.1.0":
+  version: 18.1.0
+  resolution: "react-dom@npm:18.1.0"
+  dependencies:
+    loose-envify: ^1.1.0
+    scheduler: ^0.22.0
+  peerDependencies:
+    react: ^18.1.0
+  checksum: bb0d48eeb0b297c79c2a03978baa29f5b3ff7ba3d070b21e34c9af1a6e7fdf0ca8b8d73e41f9214d91ad40eeb6d1f3559f884cbbc338713374a51320637c23df
+  languageName: node
+  linkType: hard
+
 "react-draggable@npm:^4.4.3":
   version: 4.4.4
   resolution: "react-draggable@npm:4.4.4"
@@ -29087,6 +29110,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"scheduler@npm:^0.22.0":
+  version: 0.22.0
+  resolution: "scheduler@npm:0.22.0"
+  dependencies:
+    loose-envify: ^1.1.0
+  checksum: a8ef5cab769c020cd6382ad9ecc3f72dbde56a50a36639b3a42ad9c11f7724f03700bcad373044059b8067d4a6365154dc7c0ca8027ef20ff4900cf58a0fc2c5
+  languageName: node
+  linkType: hard
+
 "schema-inspector@npm:^1.6.8":
   version: 1.7.0
   resolution: "schema-inspector@npm:1.7.0"