frontend/src/routes/+page.svelte (view raw)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 |
<script lang="ts">
import ControlButton from '$lib/components/ControlButton.svelte';
import EnvelopeControl from '$lib/components/EnvelopeControl.svelte';
import ConversationView from '$lib/components/ConversationView.svelte';
import MessageBar from '$lib/components/MessageBar.svelte';
import searchIcon from '$lib/assets/icons/search.svg?raw';
import contactIcon from '$lib/assets/icons/contact.svg?raw';
import attachIcon from '$lib/assets/icons/attach.svg?raw';
import sendmailIcon from '$lib/assets/icons/sendmail.svg?raw';
import { goto } from "$app/navigation";
import { GetUserContact, SendMail } from "$lib/wailsjs/go/main/App";
import { global } from "$lib/global.svelte.js";
const userContact = await GetUserContact();
let message = $state("");
let highlight = $derived(message.trim() !== "");
async function handleSubmit(event) {
if (event) event.preventDefault();
const recipients = global.conversation?.Recipients;
if (!recipients || recipients.length === 0) return;
if (!message.trim()) return;
global.conversation = await SendMail(
global.fromAddress,
global.conversation,
message,
);
message = "";
}
async function edit_user_contact() {
global.contact = await GetUserContact();
goto("/contact");
}
function manage_contacts() {
goto("/contacts");
}
</script>
<section class="flex flex-col w-full h-full">
{#if global.conversations.length > 0}
<section class="bg-header w-full p-2 flex justify-between">
<EnvelopeControl conversation={global.conversation} />
<div class="flex gap-2">
<ControlButton icon={searchIcon} />
<ControlButton icon={contactIcon} onclick={manage_contacts} />
</div>
</section>
<ConversationView conversation={global.conversation} />
<form onsubmit={handleSubmit} class="flex p-2 gap-2 items-end">
<ControlButton icon={attachIcon} />
<MessageBar bind:value={message} onsubmit={handleSubmit} />
<ControlButton type="submit" icon={sendmailIcon} {highlight} />
</form>
{:else}
<section class="bg-header w-full p-2 flex justify-end">
<ControlButton icon={contactIcon} onclick={edit_user_contact} />
</section>
<h1 class="text-center my-auto font-bold text-7xl">Welcome to<br/>EMessage</h1>
{/if}
</section>
|