Show error overlay with link to services view if filemanager addon is down

dashboard/src/components/FileManager.vue

@@ -9,6 +9,7 @@ const profileModel = ProfileModel.create();
 
 const offlineOverlay = useTemplateRef('offlineOverlay');
 const ready = ref(false);
+const serviceDown = ref(false);
 
 function onOnline() {
   ready.value = true;
@@ -24,6 +25,9 @@ fetcher.globalOptions.errorHook = (error) => {
   // re-login will make the code get a new token
   if (error.status === 401) return profileModel.logout();
 
+  // if sftp addon is down, tell the user
+  if (error.status === 424) return serviceDown.value = true;
+
   if (error.status === 500 || error.status === 501) {
     // actual internal server error, most likely a bug or timeout log to console only to not alert the user
     if (!ready.value) {
@@ -48,6 +52,23 @@ onMounted(() => {
 <template>
   <div style="height: 100%;">
     <OfflineOverlay ref="offlineOverlay" @online="onOnline()"/>
-    <router-view v-if="ready"></router-view>
+    <div v-if="ready && serviceDown" class="service-down">
+      <div>
+        Unable to connect to filemanager service. Check the status and logs in <a href="/#/services">Services view</a>.
+      </div>
+    </div>
+    <router-view v-if="ready" v-show="!serviceDown"></router-view>
   </div>
 </template>
+
+<style scoped>
+
+.service-down {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+</style>