import-csv: improve error handling (hide 500, add close button)

CONTRIBUTORS

@@ -26,7 +26,7 @@ GitHub's online interface.
 For users who previously confirmed the license of their contributions on the
 support site, it would be great if you could add your name below as well.
 
-********************
+---
 
 AMBOSS MD Inc. <https://www.amboss.com/>
 Aristotelis P. <https://glutanimate.com/contact>
@@ -247,8 +247,9 @@ Hanna Nilsén <hanni614@student.liu.se>
 Elias Johansson Lara <elias.johanssonlara@gmail.com>
 Toby Penner <tobypenner01@gmail.com>
 Danilo Spillebeen <spillebeendanilo@gmail.com>
+Josefin Odermalm <112946011+josod827@users.noreply.github.com>
 
-********************
+---
 
 The text of the 3 clause BSD license follows:
 

ts/lib/components/ErrorPage.svelte

@@ -2,12 +2,32 @@
 Copyright: Ankitects Pty Ltd and contributors
 License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 -->
+<script context="module" lang="ts">
+    declare function pycmd(cmd: string): void;
+</script>
+
 <script lang="ts">
     export let error: Error;
+
+    function normalizeErrorMessage(message: string): string {
+        return message.replace(/^\d{3}:\s*/, "");
+    }
+
+    function closeWindow() {
+        try {
+            pycmd("close");
+        } catch {
+            history.back();
+        }
+    }
 </script>
 
 <div class="message">
-    {error.message}
+    {normalizeErrorMessage(error.message)}
+</div>
+
+<div class="actions">
+    <button on:click={closeWindow}>Close</button>
 </div>
 
 <style lang="scss">
@@ -15,4 +35,18 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
         text-align: center;
         margin: 50px 0 0;
     }
+
+    .actions {
+        text-align: center;
+        margin-top: 1rem;
+
+        button {
+            padding: 0.5rem 1rem;
+            border: none;
+            border-radius: 4px;
+            background: var(--anki-button-bg, #007acc);
+            color: white;
+            cursor: pointer;
+        }
+    }
 </style>

ts/routes/import-csv/[...path]/+page.svelte

@@ -4,9 +4,14 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
 -->
 <script lang="ts">
     import ImportCsvPage from "../ImportCsvPage.svelte";
+    import ErrorPage from "$lib/components/ErrorPage.svelte";
     import type { PageData } from "./$types";
 
     export let data: PageData;
 </script>
 
+{#if data.initialError}
+    <ErrorPage error={data.initialError} />
+{:else}
     <ImportCsvPage state={data.state} />
+{/if}

ts/routes/import-csv/[...path]/+page.ts

@@ -6,6 +6,7 @@ import { ImportCsvState } from "../lib";
 import type { PageLoad } from "./$types";
 
 export const load = (async ({ params }) => {
+    try {
         const [notetypes, decks, metadata] = await Promise.all([
             getNotetypeNames({}),
             getDeckNames({
@@ -14,6 +15,11 @@ export const load = (async ({ params }) => {
             }),
             getCsvMetadata({ path: params.path }, { alertOnError: false }),
         ]);
+
         const state = new ImportCsvState(params.path, notetypes, decks, metadata);
         return { state };
+    } catch (e: any) {
+        const rawMsg = e?.message ?? String(e ?? "");
+        return { initialError: new Error(rawMsg) };
+    }
 }) satisfies PageLoad;