aboutsummaryrefslogtreecommitdiffstats
path: root/src/routes/(app)/support
diff options
context:
space:
mode:
authorAdam Soltys <[email protected]>2023-12-01 20:04:13 -0800
committerAdam Soltys <[email protected]>2023-12-01 20:04:13 -0800
commit216a600224fde22ce76b367557a02094ec693886 (patch)
treed1189bbaa39db204633523132a7d4767b952717d /src/routes/(app)/support
parent7d9bc1f54dfd04172e8d6d43ebc2efd6f407e833 (diff)
downloadcoinos-ui-216a600224fde22ce76b367557a02094ec693886.tar.gz
coinos-ui-216a600224fde22ce76b367557a02094ec693886.zip
prettier
Diffstat (limited to 'src/routes/(app)/support')
-rw-r--r--src/routes/(app)/support/+page.svelte214
-rw-r--r--src/routes/(app)/support/+server.js8
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"
- > 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"
+ > 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);
}