init

2023-10-02 23:10:49 +03:00
commit c6cb488379
255 changed files with 18731 additions and 0 deletions
@@ -0,0 +1,129 @@
+<script>
+    import ErrorAlert from "../common/ErrorAlert.svelte";
+    import SuccessAlert from "../common/SuccessAlert.svelte";
+    import SpinnerButton from "../common/SpinnerButton.svelte";
+    import Radio from "../forms/Radio.svelte";
+    import MemberSettingsCard from "./MemberSettingsCard.svelte";
+    import {getContext} from "svelte";
+
+
+    const channel = getContext("channel");
+    export let title;
+    export let users;
+    export let roles;
+    let name;
+    let email;
+    let role;
+    let errorMessage = "";
+    let successAlert;
+
+    function submitInvite(e) {
+        e.preventDefault();
+        invite(name, email, role);
+    }
+
+    function invite(newName, newEmail, newRole) {
+        errorMessage = "";
+
+        axios
+            .post(channel.lucentUrl + "/members/invite", {
+                name: newName,
+                email: newEmail,
+                role: newRole,
+            })
+            .then((response) => {
+                successAlert.show("User was invited");
+                users = [...users, response.data.user];
+                name = null;
+                email = null;
+                role = null;
+            })
+            .catch((error) => {
+                errorMessage = error.response?.data?.error ?? "";
+            });
+    }
+
+    function update(e) {
+        e.preventDefault();
+        errorMessage = "";
+
+        axios
+            .post(channel.lucentUrl + "/members/update", {
+                id: e.detail.user,
+                role: e.detail.role,
+            })
+            .then((response) => {
+                successAlert.show("Users updated");
+                users = response.data.users;
+            })
+            .catch((error) => {
+                errorMessage = error.response?.data?.error ?? "";
+            });
+    }
+</script>
+
+<div class="wrapper-tiny transparent mb-5">
+    <div class="lx-card mt-5">
+        <h3 class="header-small mb-5">Invite people</h3>
+        <ErrorAlert message={errorMessage}/>
+        <SuccessAlert bind:this={successAlert}/>
+
+        <form on:submit={submitInvite}>
+            <div class="mb-3">
+                <label for="inviteeName" class="form-label"
+                >Invitee Name</label
+                >
+                <input
+                    type="text"
+                    bind:value={name}
+                    class="form-control"
+                    id="inviteeName"
+                    placeholder="Member name"
+                    required
+                />
+            </div>
+            <div class="mb-3">
+                <label for="inviteeEmail" class="form-label"
+                >Invitee Email Address</label
+                >
+                <input
+                    type="email"
+                    bind:value={email}
+                    class="form-control"
+                    id="inviteeEmail"
+                    placeholder="Member email"
+                    required
+                />
+            </div>
+
+            <div class="me-3">
+                {#each roles.filter((r) => r !== "removed") as arole}
+                    <Radio
+                        bind:group={role}
+                        value={arole}
+                        name="role"
+                        label={arole}
+                    />
+                {/each}
+            </div>
+
+            <div class="mt-5 d-block text-center">
+                <SpinnerButton label="Invite"/>
+            </div>
+        </form>
+    </div>
+
+    <div class="lx-card mt-3">
+        <h3 class="header-small mb-5">Members</h3>
+        {#each users as user}
+            <MemberSettingsCard
+                member={user}
+                roles={roles}
+                on:update={update}
+                on:reinvite={(e) => invite(e.detail.email, e.detail.role)}
+            />
+        {/each}
+
+
+    </div>
+</div>