From 265d1076bd54ae70cf44db8af5d353bd28749667 Mon Sep 17 00:00:00 2001
From: Alex Andreev <alex.andreev.email@gmail.com>
Date: Mon, 14 Mar 2022 13:00:27 +0300
Subject: [PATCH] Add useResizeObserver hook

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
---
 src/renderer/hooks/index.ts             |  1 +
 src/renderer/hooks/useResizeObserver.ts | 26 +++++++++++++++++++++++++
 2 files changed, 27 insertions(+)
 create mode 100644 src/renderer/hooks/useResizeObserver.ts

diff --git a/src/renderer/hooks/index.ts b/src/renderer/hooks/index.ts
index d790ddf145..852f4d64d0 100644
--- a/src/renderer/hooks/index.ts
+++ b/src/renderer/hooks/index.ts
@@ -8,4 +8,5 @@
 export * from "./useOnUnmount";
 export * from "./useInterval";
 export * from "./useMutationObserver";
+export * from "./useResizeObserver";
 export * from "./use-toggle";
diff --git a/src/renderer/hooks/useResizeObserver.ts b/src/renderer/hooks/useResizeObserver.ts
new file mode 100644
index 0000000000..26dfd046b8
--- /dev/null
+++ b/src/renderer/hooks/useResizeObserver.ts
@@ -0,0 +1,26 @@
+/**
+ * Copyright (c) OpenLens Authors. All rights reserved.
+ * Licensed under MIT License. See LICENSE in root directory for more information.
+ */
+
+import { useEffect } from "react";
+
+export function useResizeObserver(
+  element: Element,
+  callback: ResizeObserverCallback,
+) {
+
+  useEffect(() => {
+    if (element) {
+      const observer = new ResizeObserver(callback);
+
+      observer.observe(element);
+
+      return () => {
+        observer.disconnect();
+      };
+    }
+
+    return undefined;
+  }, [callback]);
+}