From 2a737481f458af238ba0993a08d0d08550fe3397 Mon Sep 17 00:00:00 2001
From: Patrick Roza <contact@patrickroza.com>
Date: Tue, 7 Feb 2023 09:26:51 +0100
Subject: [PATCH] Leverage graph

---
 _project/frontend-nuxt/pages/blog/index.vue | 22 +++++++++++++++++----
 1 file changed, 18 insertions(+), 4 deletions(-)

diff --git a/_project/frontend-nuxt/pages/blog/index.vue b/_project/frontend-nuxt/pages/blog/index.vue
index a51480877..142c31d6f 100644
--- a/_project/frontend-nuxt/pages/blog/index.vue
+++ b/_project/frontend-nuxt/pages/blog/index.vue
@@ -1,12 +1,26 @@
 <script setup lang="ts">
-import { BlogRsc } from "@effect-app-boilerplate/resources"
+import { BlogRsc, GraphRsc } from "@effect-app-boilerplate/resources"
 
 const blogClient = clientFor(BlogRsc)
+const graphClient = clientFor(GraphRsc)
 
-const [, createPost_] = useMutation(blogClient.createPost)
-const [, latestPosts, reloadPosts] = useSafeQuery(blogClient.getPosts)
+const [, mutate] = useMutation(graphClient.mutation)
+const [, latestPosts, reloadPosts, { mutate: mutatePosts }] = useSafeQuery(
+  blogClient.getPosts
+)
 
-const createPost = flow(createPost_, _ => _.then(_ => reloadPosts()))
+const createPost = (input: BlogRsc.CreatePost.CreatePostRequest) =>
+  pipe(mutate({ CreatePost: { input, query: { result: true } } }), _ =>
+    _.then(_ => {
+      const r = _["|>"](Either.flatMap(_ => _.body.CreatePost!))["|>"](
+        Either.map(_ => _.query!.result!)
+      )
+      if (r._tag === "Right") {
+        const items = latestPosts.value!.items
+        mutatePosts(() => Promise.resolve({ items: [...items, r.right] }))
+      }
+    })
+  )
 </script>
 
 <template>