diff options
| author | Adam Soltys <[email protected]> | 2023-12-01 20:04:13 -0800 |
|---|---|---|
| committer | Adam Soltys <[email protected]> | 2023-12-01 20:04:13 -0800 |
| commit | 216a600224fde22ce76b367557a02094ec693886 (patch) | |
| tree | d1189bbaa39db204633523132a7d4767b952717d /src/routes/(app)/support | |
| parent | 7d9bc1f54dfd04172e8d6d43ebc2efd6f407e833 (diff) | |
| download | coinos-ui-216a600224fde22ce76b367557a02094ec693886.tar.gz coinos-ui-216a600224fde22ce76b367557a02094ec693886.zip | |
prettier
Diffstat (limited to 'src/routes/(app)/support')
| -rw-r--r-- | src/routes/(app)/support/+page.svelte | 214 | ||||
| -rw-r--r-- | src/routes/(app)/support/+server.js | 8 |
2 files changed, 119 insertions, 103 deletions
diff --git a/src/routes/(app)/support/+page.svelte b/src/routes/(app)/support/+page.svelte index b2f82e89..b31b4389 100644 --- a/src/routes/(app)/support/+page.svelte +++ b/src/routes/(app)/support/+page.svelte @@ -1,122 +1,138 @@ <script> - import { onDestroy } from 'svelte'; - import { fail, success, post } from '$lib/utils'; - import { scale } from 'svelte/transition'; - import { AppHeader, Icon } from '$comp'; - import { t } from '$lib/translations'; + import { onDestroy } from "svelte"; + import { fail, success, post } from "$lib/utils"; + import { scale } from "svelte/transition"; + import { AppHeader, Icon } from "$comp"; + import { t } from "$lib/translations"; - export let data; + export let data; - let { user } = data; - $: if (user) { - data.subject = { ...user }; - } + let { user } = data; + $: if (user) { + data.subject = { ...user }; + } - let email; - let message; - let sent; - let recaptchaSiteKey = '6LfCd8YkAAAAANmVJgzN3SQY3n3fv1RhiS5PgMYM'; + let email; + let message; + let sent; + let recaptchaSiteKey = "6LfCd8YkAAAAANmVJgzN3SQY3n3fv1RhiS5PgMYM"; - let submit = (e) => { - e.preventDefault(); - grecaptcha.ready(() => { - grecaptcha.execute(recaptchaSiteKey, { action: 'submit' }).then((token) => - post('/support', { username: user?.username, email, message, token }) - .then(() => (sent = true)) - .catch(() => fail('problem submitting')) - ); - }); - }; + let submit = (e) => { + e.preventDefault(); + grecaptcha.ready(() => { + grecaptcha.execute(recaptchaSiteKey, { action: "submit" }).then((token) => + post("/support", { username: user?.username, email, message, token }) + .then(() => (sent = true)) + .catch(() => fail("problem submitting")) + ); + }); + }; - onDestroy(() => { - const nodeBadge = document.querySelector('.grecaptcha-badge'); - if (nodeBadge) { - document.body.removeChild(nodeBadge.parentNode); - } + onDestroy(() => { + const nodeBadge = document.querySelector(".grecaptcha-badge"); + if (nodeBadge) { + document.body.removeChild(nodeBadge.parentNode); + } - const scriptSelector = - "script[src='https://www.google.com/recaptcha/api.js?render=" + recaptchaSiteKey + "']"; - const script = document.querySelector(scriptSelector); - if (script) { - script.remove(); - } - }); + const scriptSelector = + "script[src='https://www.google.com/recaptcha/api.js?render=" + + recaptchaSiteKey + + "']"; + const script = document.querySelector(scriptSelector); + if (script) { + script.remove(); + } + }); </script> <svelte:head> - <script - src="https://www.google.com/recaptcha/api.js?render=6LfCd8YkAAAAANmVJgzN3SQY3n3fv1RhiS5PgMYM" - ></script> + <script + src="https://www.google.com/recaptcha/api.js?render=6LfCd8YkAAAAANmVJgzN3SQY3n3fv1RhiS5PgMYM" + ></script> </svelte:head> {#if user} - <AppHeader {data} /> + <AppHeader {data} /> {/if} <div class="container px-4 max-w-lg mx-auto mt-20 space-y-8"> - {#if sent} - <h1 class="text-center text-3xl md:text-4xl font-semibold">Thank you!</h1> - <div class="text-center text-lg text-secondary">Someone will be in touch shortly.</div> + {#if sent} + <h1 class="text-center text-3xl md:text-4xl font-semibold">Thank you!</h1> + <div class="text-center text-lg text-secondary"> + Someone will be in touch shortly. + </div> - <div> - <a href={user ? `/${user.username}` : '/'}> - <button - class="rounded-full border py-2 px-5 font-bold hover:opacity-80 w-full bg-black text-white" - >Ok</button - > - </a> - </div> - {:else} - <h1 class="text-center text-3xl md:text-4xl font-semibold mb-8"> - {$t('user.support.header')} - </h1> + <div> + <a href={user ? `/${user.username}` : "/"}> + <button + class="rounded-full border py-2 px-5 font-bold hover:opacity-80 w-full bg-black text-white" + >Ok</button + > + </a> + </div> + {:else} + <h1 class="text-center text-3xl md:text-4xl font-semibold mb-8"> + {$t("user.support.header")} + </h1> - <p class="text-secondary text-lg"> - Fill out this form or email us directly at <a - class="underline" - href="mailto:[email protected]">[email protected]</a - > and we'll do our best to get back to you in a timely manner. - </p> + <p class="text-secondary text-lg"> + Fill out this form or email us directly at <a + class="underline" + href="mailto:[email protected]">[email protected]</a + > and we'll do our best to get back to you in a timely manner. + </p> - <form on:submit={submit}> - <div class="mb-4"> - <label for="account" class="font-semibold">{$t('user.support.accountName')}</label> - <input - class="bg-primary" - type="text" - name="account" - required - value={user?.username || ''} - /> - </div> + <form on:submit={submit}> + <div class="mb-4"> + <label for="account" class="font-semibold" + >{$t("user.support.accountName")}</label + > + <input + class="bg-primary" + type="text" + name="account" + required + value={user?.username || ""} + /> + </div> - <div class="mb-4"> - <label for="email" class="font-semibold">{$t('user.support.email')}</label> - <input class="bg-primary" type="email" name="email" bind:value={email} required /> - </div> + <div class="mb-4"> + <label for="email" class="font-semibold" + >{$t("user.support.email")}</label + > + <input + class="bg-primary" + type="email" + name="email" + bind:value={email} + required + /> + </div> - <div class="mb-4"> - <label for="message" class="font-semibold">{$t('user.support.message')}</label> - <textarea - rows={5} - class="bg-primary" - type="text" - name="message" - bind:value={message} - required - /> - </div> + <div class="mb-4"> + <label for="message" class="font-semibold" + >{$t("user.support.message")}</label + > + <textarea + rows={5} + class="bg-primary" + type="text" + name="message" + bind:value={message} + required + /> + </div> - <button - type="submit" - disabled={!email || !message} - class="g-recaptcha {!email || !message - ? 'opacity-50' - : 'opacity-100'} bg-black text-white font-bold rounded-xl py-3 w-full mx-auto {email && - message - ? 'hover:opacity-80' - : ''}">{$t('user.support.send')}</button - > - </form> - {/if} + <button + type="submit" + disabled={!email || !message} + class="g-recaptcha {!email || !message + ? 'opacity-50' + : 'opacity-100'} bg-black text-white font-bold rounded-xl py-3 w-full mx-auto {email && + message + ? 'hover:opacity-80' + : ''}">{$t("user.support.send")}</button + > + </form> + {/if} </div> diff --git a/src/routes/(app)/support/+server.js b/src/routes/(app)/support/+server.js index 6b1778a8..e9a16cfc 100644 --- a/src/routes/(app)/support/+server.js +++ b/src/routes/(app)/support/+server.js @@ -1,9 +1,9 @@ -import { json } from '@sveltejs/kit'; -import { auth, post } from '$lib/utils'; +import { json } from "@sveltejs/kit"; +import { auth, post } from "$lib/utils"; export const prerender = false; export async function POST({ cookies, request }) { - let result = await post('/email', await request.json(), auth(cookies)); - return json(result); + let result = await post("/email", await request.json(), auth(cookies)); + return json(result); } |
