From 876591a8c8eddadbbbce8ddf3cb3c597ce1df83a Mon Sep 17 00:00:00 2001
From: Krzysztof Wolski <krzysztof.wolski@saleor.io>
Date: Tue, 7 Mar 2023 19:58:02 +0100
Subject: [PATCH] Use memo on Editor

---
 .../src/modules/ui/code-editor.tsx                 | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/apps/emails-and-messages/src/modules/ui/code-editor.tsx b/apps/emails-and-messages/src/modules/ui/code-editor.tsx
index e9e76a0..4ec35d4 100644
--- a/apps/emails-and-messages/src/modules/ui/code-editor.tsx
+++ b/apps/emails-and-messages/src/modules/ui/code-editor.tsx
@@ -1,4 +1,4 @@
-import React, { useRef } from "react";
+import React, { useCallback, useRef } from "react";
 
 import Editor from "@monaco-editor/react";
 import { useTheme } from "@saleor/macaw-ui";
@@ -19,6 +19,14 @@ export const CodeEditor = ({ initialTemplate, onChange, value, language }: Props
     editorRef.current = editor;
   }
 
+  const handleOnChange = useCallback(
+    (value?: string) => {
+      console.log("ON CHANGE");
+      onChange(value ?? "");
+    },
+    [value]
+  );
+
   return (
     <>
       <Editor
@@ -29,9 +37,7 @@ export const CodeEditor = ({ initialTemplate, onChange, value, language }: Props
         defaultLanguage={language}
         defaultValue={initialTemplate}
         onMount={handleEditorDidMount}
-        onChange={(value) => {
-          onChange(value ?? "");
-        }}
+        onChange={handleOnChange}
       />
     </>
   );