terminado generador de pngs desde issues de redmine

src/App.svelte

@@ -0,0 +1,54 @@
+<script lang="ts">
+    import Tarjeta from "./componentes/tarjeta.svelte";
+    import html2canvas from "html2canvas";
+
+    let issues: any[] = $state([]);
+    $effect(() => {
+        obtener_issues();
+    });
+
+    async function obtener_issues() {
+        /*
+        const req = await fetch(
+            "https://fedesrv.ddns.net/redmine/issues.json?key={key}&proyect_id=1&limit=100&status_id=2&tracker_id=1",
+        );
+        if (req.ok) {
+            issues = await req.json();
+        }
+      */
+        const data = await import("./assets/issues.json");
+        issues = data.issues;
+    }
+    async function exportToPNG(issue: any) {
+        setTimeout(() => {}, 100);
+        const element = document.getElementById(`card-${issue.id}`);
+
+        if (element) {
+            const canvas = await html2canvas(element);
+            const image = canvas.toDataURL("image/png");
+            const link = document.createElement("a");
+            link.download = `issue-${issue.id}.png`;
+            link.href = image;
+            link.click();
+        }
+        setTimeout(() => {}, 100);
+    }
+</script>
+
+<main>
+    {#if issues.length == 0}
+        <p>Cargando...</p>
+    {:else}
+        <div class="d-flex justify-center flex-column align-items-center">
+            {#each issues as issue}
+                <div class="m-2 w-75">
+                    <Tarjeta {issue} />
+                    <button
+                        onclick={() => exportToPNG(issue)}
+                        class="btn btn-primary mt-3">Exportar a PNG</button
+                    >
+                </div>
+            {/each}
+        </div>
+    {/if}
+</main>