From 086d208ee50ae1f9ecb30196e758fdc7687714ae Mon Sep 17 00:00:00 2001
From: Thomas Citharel <tcit@tcit.fr>
Date: Thu, 10 Aug 2023 11:55:50 +0200
Subject: [PATCH] fix(front): properly handle error when approving app

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
---
 .../components/OAuth/AuthorizeApplication.vue | 48 ++++++++++++-------
 1 file changed, 30 insertions(+), 18 deletions(-)

diff --git a/js/src/components/OAuth/AuthorizeApplication.vue b/js/src/components/OAuth/AuthorizeApplication.vue
index d0409a269..2232ee33e 100644
--- a/js/src/components/OAuth/AuthorizeApplication.vue
+++ b/js/src/components/OAuth/AuthorizeApplication.vue
@@ -91,7 +91,7 @@
 
 <script lang="ts" setup>
 import { useHead } from "@vueuse/head";
-import { computed, ref } from "vue";
+import { computed, inject, ref } from "vue";
 import { useI18n } from "vue-i18n";
 import { useMutation } from "@vue/apollo-composable";
 import {
@@ -102,6 +102,7 @@ import RouteName from "@/router/name";
 import { IApplication } from "@/types/application.model";
 import { scope as oAuthScopes } from "./scopes";
 import AlertCircle from "vue-material-design-icons/AlertCircle.vue";
+import { Notifier } from "@/plugins/notifier";
 
 const { t } = useI18n({ useScope: "global" });
 
@@ -123,23 +124,26 @@ const collapses = computed(() =>
     .filter((localScope) => localScope)
 );
 
-const { mutate: authorizeMutation, onDone: onAuthorizeMutationDone } =
-  useMutation<
-    {
-      authorizeApplication: {
-        code: string;
-        state: string;
-        clientId: string;
-        scope: string;
-      };
-    },
-    {
-      applicationClientId: string;
-      redirectURI: string;
-      state?: string | null;
-      scope?: string | null;
-    }
-  >(AUTORIZE_APPLICATION);
+const {
+  mutate: authorizeMutation,
+  onDone: onAuthorizeMutationDone,
+  onError: onAuthorizeMutationError,
+} = useMutation<
+  {
+    authorizeApplication: {
+      code: string;
+      state: string;
+      clientId: string;
+      scope: string;
+    };
+  },
+  {
+    applicationClientId: string;
+    redirectURI: string;
+    state?: string | null;
+    scope?: string | null;
+  }
+>(AUTORIZE_APPLICATION);
 
 const authorize = () => {
   authorizeMutation({
@@ -209,6 +213,14 @@ onAuthorizeMutationDone(({ data }) => {
   }
 });
 
+const notifier = inject<Notifier>("notifier");
+
+onAuthorizeMutationError(({ graphQLErrors }) => {
+  graphQLErrors.forEach(({ message }) => {
+    notifier?.error(message);
+  });
+});
+
 useHead({
   title: computed(() => t("Authorize application")),
 });