From c8eb9c17860925871085b8c56975544c91c04c2b Mon Sep 17 00:00:00 2001
From: Stefan Schneider <stefan.schneider@gmx.net>
Date: Sun, 3 Dec 2023 16:17:40 +0100
Subject: [PATCH 1/2] Update typescript-vue-apollo.mdx

`useResult` is deprecated
---
 .../typescript/typescript-vue-apollo.mdx      | 22 ++++++++-----------
 1 file changed, 9 insertions(+), 13 deletions(-)

diff --git a/website/src/pages/plugins/typescript/typescript-vue-apollo.mdx b/website/src/pages/plugins/typescript/typescript-vue-apollo.mdx
index a5294925cb5..da932247ba9 100644
--- a/website/src/pages/plugins/typescript/typescript-vue-apollo.mdx
+++ b/website/src/pages/plugins/typescript/typescript-vue-apollo.mdx
@@ -77,7 +77,7 @@ query allAccounts {
 }
 ```
 
-We can use the generated code with `useResult` like this:
+We can use the generated code with a watcher like this:
 
 ```vue
 <template>
@@ -91,20 +91,16 @@ We can use the generated code with `useResult` like this:
     </div>
   </div>
 </template>
-
-<script lang="ts">
+ 
+<script setup lang="ts">
 import { defineComponent } from '@vue/composition-api'
-import { useResult } from '@vue/apollo-composable'
 import { useAllAccountsQuery } from '../generated/graphqlOperations'
-
-export default defineComponent({
-  setup() {
-    const { result, loading, error } = useAllAccountsQuery()
-    // Only select the property 'accounts' for use in the template
-    const allAccounts = useResult(result, null, data => data.accounts)
-    return { allAccounts, loading, error }
-  }
-})
+import { ref, watch } from 'vue'
+ 
+const { result, loading, error } = useAllAccountsQuery()
+const allAccounts = ref();
+// Only select the property 'accounts' for use in the template
+watch(result, data => allAccounts.value = data.accounts)
 </script>
 ```
 

From fff0b748f816571ed0b8d761b2577eee2d3aabdb Mon Sep 17 00:00:00 2001
From: Stefan Schneider <stefan.schneider@gmx.net>
Date: Sun, 3 Dec 2023 16:18:47 +0100
Subject: [PATCH 2/2] Update
 website/src/pages/plugins/typescript/typescript-vue-apollo.mdx

---
 website/src/pages/plugins/typescript/typescript-vue-apollo.mdx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/website/src/pages/plugins/typescript/typescript-vue-apollo.mdx b/website/src/pages/plugins/typescript/typescript-vue-apollo.mdx
index da932247ba9..bd3efd43d1c 100644
--- a/website/src/pages/plugins/typescript/typescript-vue-apollo.mdx
+++ b/website/src/pages/plugins/typescript/typescript-vue-apollo.mdx
@@ -93,7 +93,6 @@ We can use the generated code with a watcher like this:
 </template>
  
 <script setup lang="ts">
-import { defineComponent } from '@vue/composition-api'
 import { useAllAccountsQuery } from '../generated/graphqlOperations'
 import { ref, watch } from 'vue'