From b560f21a78f75cc78e2f85b125cf85f1e414aa87 Mon Sep 17 00:00:00 2001
From: Jean-Louis Leysens <jloleysens@gmail.com>
Date: Mon, 19 Oct 2020 12:06:16 +0200
Subject: [PATCH] do not use form.subscribe

---
 .../edit_policy/components/policy_json_flyout.tsx | 15 ++++++++-------
 1 file changed, 8 insertions(+), 7 deletions(-)

diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/policy_json_flyout.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/policy_json_flyout.tsx
index a316ca66bac6c..e9ce193118b35 100644
--- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/policy_json_flyout.tsx
+++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/policy_json_flyout.tsx
@@ -24,7 +24,7 @@ import {
 
 import { SerializedPolicy } from '../../../../../common/types';
 
-import { useFormContext } from '../../../../shared_imports';
+import { useFormContext, useFormData } from '../../../../shared_imports';
 
 interface Props {
   legacyPolicy: SerializedPolicy;
@@ -45,12 +45,13 @@ export const PolicyJsonFlyout: React.FunctionComponent<Props> = ({
   const [policy, setPolicy] = useState<undefined | null | SerializedPolicy>(undefined);
 
   const form = useFormContext();
+  const [formData, getFormData] = useFormData();
 
   useEffect(() => {
-    const subscription = form.subscribe(async (formUpdate) => {
+    (async function checkPolicy() {
       setPolicy(undefined);
-      if (await formUpdate.validate()) {
-        const p = formUpdate.data.format() as SerializedPolicy;
+      if (await form.validate()) {
+        const p = getFormData() as SerializedPolicy;
         setPolicy({
           ...legacyPolicy,
           phases: {
@@ -61,9 +62,9 @@ export const PolicyJsonFlyout: React.FunctionComponent<Props> = ({
       } else {
         setPolicy(null);
       }
-    });
-    return subscription.unsubscribe;
-  }, [form, legacyPolicy]);
+    })();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [form, legacyPolicy, formData]);
 
   let content: React.ReactNode;
   switch (policy) {