From 1ca874b1befc667f230005c26f9b1dc04b45ae31 Mon Sep 17 00:00:00 2001
From: Fiodor <12481352+FiodorGherasimenco@users.noreply.github.com>
Date: Mon, 16 Jan 2023 19:48:01 +0200
Subject: [PATCH] fix: update state when calling mutate (#9)

---
 .../run-mutation/renders.expected/step-0.0.html        | 10 ++++++++++
 .../run-mutation/renders.expected/step-0.1.html        | 10 ++++++++++
 src/components/gql-mutation/index.marko                |  8 +++++---
 3 files changed, 25 insertions(+), 3 deletions(-)
 create mode 100644 src/components/gql-mutation/__tests__/__snapshots__/run-mutation/renders.expected/step-0.0.html
 create mode 100644 src/components/gql-mutation/__tests__/__snapshots__/run-mutation/renders.expected/step-0.1.html

diff --git a/src/components/gql-mutation/__tests__/__snapshots__/run-mutation/renders.expected/step-0.0.html b/src/components/gql-mutation/__tests__/__snapshots__/run-mutation/renders.expected/step-0.0.html
new file mode 100644
index 0000000..0d539aa
--- /dev/null
+++ b/src/components/gql-mutation/__tests__/__snapshots__/run-mutation/renders.expected/step-0.0.html
@@ -0,0 +1,10 @@
+<h1>
+  Messages
+</h1>
+<span />
+<span>
+  executing
+</span>
+<button>
+  Add
+</button>
\ No newline at end of file
diff --git a/src/components/gql-mutation/__tests__/__snapshots__/run-mutation/renders.expected/step-0.1.html b/src/components/gql-mutation/__tests__/__snapshots__/run-mutation/renders.expected/step-0.1.html
new file mode 100644
index 0000000..55c3e6f
--- /dev/null
+++ b/src/components/gql-mutation/__tests__/__snapshots__/run-mutation/renders.expected/step-0.1.html
@@ -0,0 +1,10 @@
+<h1>
+  Messages
+</h1>
+<span>
+  Hello
+</span>
+<span />
+<button>
+  Add
+</button>
\ No newline at end of file
diff --git a/src/components/gql-mutation/index.marko b/src/components/gql-mutation/index.marko
index 6f1d21e..f87c682 100644
--- a/src/components/gql-mutation/index.marko
+++ b/src/components/gql-mutation/index.marko
@@ -9,13 +9,15 @@ $ const { renderBody, mutation, requestPolicy } = input;
 <${renderBody}(
   (variables, options) => {
     const { client } = window.$$GQL || (window.$$GQL = createClient({}));
-    state.fetching = true;
+    component.setState("fetching", true);
     return client
       .mutation(mutation, variables, { requestPolicy, ...options })
       .toPromise()
       .then((results) => {
-        state.results = results;
-        state.fetching = false;
+        component.setState({
+          results,
+          fetching: false,
+        });
         return results;
       });
   },