From e8c72d60b511c2e9fd77ca05da39a59820637589 Mon Sep 17 00:00:00 2001
From: Oliver <oliver.henry.walters@gmail.com>
Date: Wed, 9 Oct 2024 16:13:32 +1100
Subject: [PATCH] TemplateEditor: Handle fetch error (#8260)

* TemplateEditor: Handle fetch error

- Handle error condition where template cannot be loaded from server

* Remove test code
---
 .../editors/TemplateEditor/TemplateEditor.tsx | 29 +++++++++++++++----
 1 file changed, 24 insertions(+), 5 deletions(-)

diff --git a/src/frontend/src/components/editors/TemplateEditor/TemplateEditor.tsx b/src/frontend/src/components/editors/TemplateEditor/TemplateEditor.tsx
index 40fdc0ee84..10fc7b79a9 100644
--- a/src/frontend/src/components/editors/TemplateEditor/TemplateEditor.tsx
+++ b/src/frontend/src/components/editors/TemplateEditor/TemplateEditor.tsx
@@ -9,7 +9,11 @@ import {
   Tabs
 } from '@mantine/core';
 import { openConfirmModal } from '@mantine/modals';
-import { notifications, showNotification } from '@mantine/notifications';
+import {
+  hideNotification,
+  notifications,
+  showNotification
+} from '@mantine/notifications';
 import {
   IconAlertTriangle,
   IconDeviceFloppy,
@@ -126,10 +130,25 @@ export function TemplateEditor(props: Readonly<TemplateEditorProps>) {
 
     api.get(templateUrl).then((response: any) => {
       if (response.data?.template) {
-        api.get(response.data.template).then((res) => {
-          codeRef.current = res.data;
-          loadCodeToEditor(res.data);
-        });
+        api
+          .get(response.data.template)
+          .then((res) => {
+            codeRef.current = res.data;
+            loadCodeToEditor(res.data);
+          })
+          .catch(() => {
+            console.error(
+              `ERR: Could not load template from ${response.data.template}`
+            );
+            codeRef.current = undefined;
+            hideNotification('template-load-error');
+            showNotification({
+              id: 'template-load-error',
+              title: t`Error`,
+              message: t`Could not load the template from the server.`,
+              color: 'red'
+            });
+          });
       }
     });
   }, [templateUrl]);