From 2669d5e7ff0f5b70922ec61d6f4afaf824fce45a Mon Sep 17 00:00:00 2001
From: Pierre-Olivier Mercier <nemunaire@nemunai.re>
Date: Mon, 9 Jan 2023 12:25:29 +0100
Subject: [PATCH] ui: resolver: Better handling of errors

---
 .../routes/resolver/[[domain]]/+page.svelte   | 32 +++++++++++++------
 1 file changed, 23 insertions(+), 9 deletions(-)

diff --git a/ui/src/routes/resolver/[[domain]]/+page.svelte b/ui/src/routes/resolver/[[domain]]/+page.svelte
index 90d5eb2..ac0f1e0 100644
--- a/ui/src/routes/resolver/[[domain]]/+page.svelte
+++ b/ui/src/routes/resolver/[[domain]]/+page.svelte
@@ -8,7 +8,7 @@
      Table,
  } from 'sveltestrap';
 
- import { resolve } from '$lib/api/resolver';
+ import { resolve as APIResolve } from '$lib/api/resolver';
  import ResolverForm from '$lib/components/resolver/Form.svelte';
  import { nsttl, nsrrtype } from '$lib/dns';
  import { recordsFields } from '$lib/resolver';
@@ -19,17 +19,16 @@
  export let data: {form?: ResolverFormT; domain: string; showDNSSEC: boolean;};
  let question: ResolverFormT | null = null;
  let responses: Array<any> | 'no-answer' | null = null;
+ let error_response: string | null = null;
  let request_pending = false;
 
- $: {
-     if (!data.form) {
-         data.form = {domain: "", type: "ANY", resolver: "local"};
-     }
-     data.form.domain = data.domain;
+ function resolve(form: ResolverFormT) {
+     if (!form.domain) return;
 
-     resolve(data.form)
+     APIResolve(form)
      .then(
          (response) => {
+             error_response = null;
              question = Object.assign({ }, data.form)
              if (response.Answer) {
                  responses = response.Answer;
@@ -39,13 +38,24 @@
              request_pending = false;
          },
          (error) => {
+             responses = null;
+             error_response = error;
              toasts.addErrorToast({
                  title: $t('errors.resolve'),
                  message: error,
                  timeout: 5000,
              });
              request_pending = false;
-     })
+     });
+ }
+
+ $: {
+     if (!data.form) {
+         data.form = {domain: "", type: "ANY", resolver: "local"};
+     }
+     data.form.domain = data.domain;
+
+     resolve(data.form);
  }
 
  function filteredResponses(responses: Array<any>, showDNSSEC: boolean): Array<any> {
@@ -99,7 +109,11 @@
             />
         </div>
         </Col>
-        {#if responses === 'no-answer'}
+        {#if error_response !== null}
+            <Col md="8" class="pt-3">
+                <h3 class="text-center text-danger">{error_response}</h3>
+            </Col>
+        {:else if responses === 'no-answer'}
             <Col md="8" class="pt-2">
                 <h3>{$t('common.records', { n: 0, type: question?question.type:"-" })}</h3>
             </Col>