Signaling event processing

3 files changed, 67 insertions, 0 deletions

diff --git a/assets/src/components/share/DataPicker.svelte b/assets/src/components/share/DataPicker.svelte
new file mode 100644
index 0000000..6e8dbd4
--- /dev/null
+++ b/assets/src/components/share/DataPicker.svelte
@@ -0,0 +1,16 @@
+<script lang="ts">
+    import data from "../../stores/data";
+
+    let value = "";
+
+    const submit = () => {
+        data.set(value);
+    };
+
+    // TODO: Accept data other than text.
+</script>
+
+<form on:submit|preventDefault={submit}>
+    <input type="text" bind:value />
+    <input type="submit" value="Submit" />
+</form>
diff --git a/assets/src/components/share/Request.svelte b/assets/src/components/share/Request.svelte
new file mode 100644
index 0000000..26002ae
--- /dev/null
+++ b/assets/src/components/share/Request.svelte
@@ -0,0 +1,31 @@
+<script lang="ts">
+    import { offer } from "../../network/transfer/transfer";
+
+    export let token: string;
+
+    async function accept() {
+        const transfer = await offer(token);
+    }
+
+    function decline() {}
+</script>
+
+<div class="container">
+    <span>{token}</span>
+    <div class="buttons">
+        <button on:click={accept}>Accept</button>
+        <button on:click={decline}>X</button>
+    </div>
+</div>
+
+<style>
+    .container {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+    }
+
+    .buttons {
+        display: flex;
+    }
+</style>
diff --git a/assets/src/components/share/Requests.svelte b/assets/src/components/share/Requests.svelte
new file mode 100644
index 0000000..509d7be
--- /dev/null
+++ b/assets/src/components/share/Requests.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+    import { getOwnToken, start, Type } from "../../network/channel/connection";
+
+    import requests from "../../stores/requests";
+    import Request from "./Request.svelte";
+
+    const startPromise = start(Type.SHARE);
+
+    // TODO: Switch to store-based state updates.
+</script>
+
+{#await startPromise}
+    <h3>Fetching token...</h3>
+{:then}
+    <h3>Your token is <b>{getOwnToken()}</b>.</h3>
+
+    {#each $requests as request}
+        <Request token={request} />
+    {/each}
+{/await}