Work on reason codes

src/lib/islands/island.svelte

@@ -1,5 +1,5 @@
 <script>
-    export let variables = {title:"UNDEF"}
+    export let variables = {title:""}
 </script>
 
 <div>

src/routes/more/+page.svelte

@@ -5,7 +5,8 @@
     
     const links = [
         {title: "Your Data", path: "/more/data"},
-        {title: "Location Reference Codes", path: "/more/corpus"},
+        {title: "Location Reference Code Lookup", path: "/more/corpus"},
+        {title: "Reason Code Lookup", path: "/more/reasons"},
         {title: "Privacy Policy", path: "/more/privacy"},
         {title: "Component Versions", path: "/more/versions"},
         {title: "Statictics", path: "/more/statistics"},

src/routes/more/reasons/+page.svelte

@@ -0,0 +1,76 @@
+<script>
+    import Header from '$lib/navigation/header.svelte'
+    import Nav from '$lib/navigation/nav.svelte'
+    import Island from '$lib/islands/island.svelte'
+    import InputIsland from '$lib/islands/input-island.svelte'
+    import {onMount} from 'svelte'
+    import {page} from '$app/stores'
+    import {goto} from '$app/navigation'
+	import Loading from '$lib/navigation/loading.svelte'
+    const title = "Reason Codes"
+
+    const variables = {
+        title: "Find Reason Codes",
+        action: "/more/reasons",
+        placeholder: "Enter Reason Code",
+        queryName: "code"
+    };
+
+    let loading = false;
+    let results = false;
+    let result = {
+        code: "",
+        lateReason: "",
+        cancReason: "",
+        error: "",
+    };
+
+    async function getData() { // Will need a click handler and use $app/navigation to update the page
+        try {
+            loading = true;
+            results = false;
+            const query = $page.url.searchParams;
+            if (!query) {return;}
+            const url = `https://owlboard.info/api/v2/ref/reasonCode/${query}`
+            const res = await fetch(url);
+            const resData = await res.json();
+            if (!resData.length) {throw new Error('Code not found')};
+            result = resData[0];
+            results = true
+        } catch (err) {
+            console.log("Error", err)
+            result.error = "Unable to find code"
+            results = true
+        } finally {
+            loading = false;
+        }
+    }
+
+    onMount(async () => {
+        results = false;
+        getData();
+    })
+</script>
+ 
+<Header {title} />
+ 
+<InputIsland {variables} />
+
+{#if loading}
+    <Loading />
+{/if}
+
+{#if results}
+    <Island>
+        {#if result.code}
+          <p>{result.code}</p>
+          <p>Late Message: {result.lateReason}</p>
+          <p>Delay Message: {result.cancReason}</p>
+        {/if}
+        {#if result.error}
+          <p>{result.error}</p>
+        {/if}
+    </Island>
+ {/if}
+
+<Nav />