add log downloader

src/components/Logs.tsx

@@ -0,0 +1,22 @@
+import { Button, Card, NiceP, VStack } from "~/components/layout";
+import { useMegaStore } from "~/state/megaStore";
+import { downloadTextFile } from "~/utils/download";
+
+export function Logs() {
+    const [state, _] = useMegaStore()
+
+    async function handleSave() {
+        const logs = await state.mutiny_wallet?.get_logs()
+        downloadTextFile(logs.join("") || "", "mutiny-logs.txt", "text/plain")
+    }
+
+    return (
+        <Card>
+            <VStack>
+                <NiceP>Something screwy going on? Check out the logs!</NiceP>
+                <Button onClick={handleSave}>Download Logs</Button>
+            </VStack>
+        </Card>
+
+    )
+}

src/components/SettingsStringsEditor.tsx

@@ -1,7 +1,7 @@
 import { createForm, url } from '@modular-forms/solid';
 import { TextField } from '~/components/layout/TextField';
 import { MutinyWalletSettingStrings, getExistingSettings } from '~/logic/mutinyWalletSetup';
-import { Button, SmallHeader } from '~/components/layout';
+import { Button, Card, SmallHeader } from '~/components/layout';
 import { showToast } from './Toaster';
 import eify from '~/utils/eify';
 import { useMegaStore } from '~/state/megaStore';
@@ -24,36 +24,38 @@ export function SettingsStringsEditor() {
         console.log(values)
     }
 
-    return <Form onSubmit={handleSubmit} class="flex flex-col gap-4">
-        <h2 class="text-2xl font-light">Don't trust us! Use your own servers to back Mutiny.</h2>
-        <div class="flex flex-col gap-2">
-            <SmallHeader>Network</SmallHeader>
-            <pre>
-                {existingSettings.network}
-            </pre>
-        </div>
+    return <Card>
+        <Form onSubmit={handleSubmit} class="flex flex-col gap-4">
+            <h2 class="text-2xl font-light">Don't trust us! Use your own servers to back Mutiny.</h2>
+            <div class="flex flex-col gap-2">
+                <SmallHeader>Network</SmallHeader>
+                <pre>
+                    {existingSettings.network}
+                </pre>
+            </div>
 
-        <Field name="proxy" validate={[url("Should be a url starting with wss://")]}>
-            {(field, props) => (
-                <TextField  {...props} value={field.value} error={field.error} label="Websockets Proxy" />
-            )}
-        </Field>
-        <Field name="esplora" validate={[url("That doesn't look like a URL")]}>
-            {(field, props) => (
-                <TextField  {...props} value={field.value} error={field.error} label="Esplora" />
-            )}
-        </Field>
-        <Field name="rgs" validate={[url("That doesn't look like a URL")]}>
-            {(field, props) => (
-                <TextField  {...props} value={field.value} error={field.error} label="RGS" />
-            )}
-        </Field>
-        <Field name="lsp" validate={[url("That doesn't look like a URL")]}>
-            {(field, props) => (
-                <TextField  {...props} value={field.value} error={field.error} label="LSP" />
-            )}
-        </Field>
-        <Button type="submit">Save</Button>
-    </Form>
+            <Field name="proxy" validate={[url("Should be a url starting with wss://")]}>
+                {(field, props) => (
+                    <TextField  {...props} value={field.value} error={field.error} label="Websockets Proxy" />
+                )}
+            </Field>
+            <Field name="esplora" validate={[url("That doesn't look like a URL")]}>
+                {(field, props) => (
+                    <TextField  {...props} value={field.value} error={field.error} label="Esplora" />
+                )}
+            </Field>
+            <Field name="rgs" validate={[url("That doesn't look like a URL")]}>
+                {(field, props) => (
+                    <TextField  {...props} value={field.value} error={field.error} label="RGS" />
+                )}
+            </Field>
+            <Field name="lsp" validate={[url("That doesn't look like a URL")]}>
+                {(field, props) => (
+                    <TextField  {...props} value={field.value} error={field.error} label="LSP" />
+                )}
+            </Field>
+            <Button type="submit">Save</Button>
+        </Form>
+    </Card>
 
 }

src/routes/Settings.tsx

@@ -1,5 +1,6 @@
 import { ButtonLink, DefaultMain, LargeHeader, MutinyWalletGuard, SafeArea, VStack } from "~/components/layout";
 import { BackLink } from "~/components/layout/BackLink";
+import { Logs } from "~/components/Logs";
 import NavBar from "~/components/NavBar";
 import { SeedWords } from "~/components/SeedWords";
 import { SettingsStringsEditor } from "~/components/SettingsStringsEditor";
@@ -20,6 +21,7 @@ export default function Settings() {
                             <SeedWords words={store.mutiny_wallet?.show_seed() || ""} />
                         </VStack>
                         <SettingsStringsEditor />
+                        <Logs />
                         <ButtonLink href="/admin">"I know what I'm doing"</ButtonLink>
                     </VStack>
                 </DefaultMain>

src/utils/download.ts

@@ -1,7 +1,7 @@
 // https://stackoverflow.com/questions/34156282/how-do-i-save-json-to-local-text-file
 
-export function downloadTextFile(content: string, fileName: string) {
-    const contentType = "application/json";
+export function downloadTextFile(content: string, fileName: string, type: string) {
+    const contentType = type ? type : "application/json";
     const a = document.createElement("a");
     const file = new Blob([content], { type: contentType });
     a.href = URL.createObjectURL(file);