From ed262f913d41576fdb48e9ecb67a64e74b6ae61c Mon Sep 17 00:00:00 2001
From: Wojciech Mista <wojciech.mista@saleor.io>
Date: Tue, 11 Jan 2022 13:34:48 +0100
Subject: [PATCH] Add error handling to non-existent apps (#1723)

---
 src/apps/views/AppDetails/AppDetails.tsx      | 36 ++++++++++++-------
 .../AppDetailsSettings/AppDetailsSettings.tsx |  8 +++++
 2 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/src/apps/views/AppDetails/AppDetails.tsx b/src/apps/views/AppDetails/AppDetails.tsx
index 6ab1138ec..edfb00ffd 100644
--- a/src/apps/views/AppDetails/AppDetails.tsx
+++ b/src/apps/views/AppDetails/AppDetails.tsx
@@ -1,3 +1,4 @@
+import NotFoundPage from "@saleor/components/NotFoundPage";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
 import getAppErrorMessage from "@saleor/utils/errors/app";
@@ -31,6 +32,9 @@ export const AppDetails: React.FC<AppDetailsProps> = ({ id, params }) => {
     displayLoader: true,
     variables: { id }
   });
+
+  const appExists = data?.app !== null;
+
   const navigate = useNavigator();
   const notify = useNotifier();
   const intl = useIntl();
@@ -49,12 +53,14 @@ export const AppDetails: React.FC<AppDetailsProps> = ({ id, params }) => {
         refetch();
         closeModal();
       } else {
-        errors.forEach(error =>
-          notify({
-            status: "error",
-            text: getAppErrorMessage(error, intl)
-          })
-        );
+        if (appExists) {
+          errors.forEach(error =>
+            notify({
+              status: "error",
+              text: getAppErrorMessage(error, intl)
+            })
+          );
+        }
       }
     }
   });
@@ -72,12 +78,14 @@ export const AppDetails: React.FC<AppDetailsProps> = ({ id, params }) => {
         refetch();
         closeModal();
       } else {
-        errors.forEach(error =>
-          notify({
-            status: "error",
-            text: getAppErrorMessage(error, intl)
-          })
-        );
+        if (appExists) {
+          errors.forEach(error =>
+            notify({
+              status: "error",
+              text: getAppErrorMessage(error, intl)
+            })
+          );
+        }
       }
     }
   });
@@ -94,6 +102,10 @@ export const AppDetails: React.FC<AppDetailsProps> = ({ id, params }) => {
     deactivateApp(mutationOpts);
   };
 
+  if (!appExists) {
+    return <NotFoundPage onBack={() => navigate(appsListPath)} />;
+  }
+
   return (
     <>
       <AppActivateDialog
diff --git a/src/apps/views/AppDetailsSettings/AppDetailsSettings.tsx b/src/apps/views/AppDetailsSettings/AppDetailsSettings.tsx
index 3641e277c..d4ec8106a 100644
--- a/src/apps/views/AppDetailsSettings/AppDetailsSettings.tsx
+++ b/src/apps/views/AppDetailsSettings/AppDetailsSettings.tsx
@@ -1,3 +1,4 @@
+import NotFoundPage from "@saleor/components/NotFoundPage";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
 import React from "react";
@@ -18,10 +19,17 @@ export const AppDetailsSettings: React.FC<AppDetailsSetttingsProps> = ({
     displayLoader: true,
     variables: { id }
   });
+
+  const appExists = data?.app !== null;
+
   const navigate = useNavigator();
   const notify = useNotifier();
   const intl = useIntl();
 
+  if (!appExists) {
+    return <NotFoundPage onBack={() => navigate(appsListPath)} />;
+  }
+
   return (
     <AppDetailsSettingsPage
       data={data?.app}