1{{#> layout }}
 2<script>
 3    window.addEventListener("DOMContentLoaded", function () {
 4        let users = document.getElementById("users");
 5        if (users) {
 6            users.addEventListener("change", async function (event) {
 7                const action = event.target.getAttribute("action");
 8                if (action) {
 9                    console.log(action, event.target.checked);
10                    const response = await fetch(action, {
11                        method: 'PUT',
12                        headers: {
13                            'Content-Type': 'application/json'
14                        },
15                        body: JSON.stringify({ admin: event.target.checked })
16                    });
17                }
18            });
19        }
20    });
21</script>
22
23<div class="max-w-screen-lg p-20 mx-auto text-white text-main font-extralight">
24        <h1 class="mb-10 font-display font-extralight">Admin</h1>
25        <h2 class="mb-4 text-xl font-bold border-b border-gray-300">Users</h1>
26        <table class="table text-white" id="users">
27            <tr>
28                <th class="pr-2 text-left">GitHub Login</th>
29                <th class="pr-2 text-left">Admin</th>
30                <th></th>
31            </tr>
32            <form action="/users" method="post" class="m-0 mb-4">
33                <tr>
34                    <td>
35                        <input name="github_login" type="text" class="w-48 p-1 mr-2 border border-gray-300"
36                            placeholder="@github_handle">
37                    </td>
38                    <td>
39                        <input type="checkbox" id="admin" name="admin" value="true">
40                    </td>
41                    <td class="text-right">
42                        <button class="w-20 p-1 text-white bg-gray-600 rounded-md hover:bg-black">Add</button>
43                    </td>
44                </tr>
45            </form>
46
47            {{#each users}}
48            <tr>
49                <form action="/users/{{id}}/delete" method="post">
50                    <td class="py-1 text-white">
51                        {{github_login}}
52                    </td>
53                    <td>
54                        <input action="/users/{{id}}" type="checkbox" {{#if admin}}checked{{/if}}>
55                    </td>
56                    <td class="text-right">
57                        <button class="w-20 p-1 text-white bg-gray-600 rounded-md hover:bg-black">Remove</button>
58                    </td>
59                </form>
60            </tr>
61            {{/each}}
62        </table>
63
64        <h2 class="mt-8 mb-4 text-xl font-bold border-b border-gray-300">Signups</h1>
65        <table class="table text-white">
66            {{#each signups}}
67            <tr>
68                <form action="/signups/{{id}}/delete" method="post">
69                    <td class="align-top">{{github_login}}</td>
70                    <td class="pl-4 align-top">{{email_address}}</td>
71                    <td class="pl-4 align-top">{{about}}</td>
72                    <td class="pl-4 align-top">
73                         {{#if wants_releases}}releases{{/if}}
74                         {{#if wants_updates}}updates{{/if}}
75                         {{#if wants_community}}community{{/if}}
76                     </td>
77                    <td class="text-right">
78                        <button class="w-20 p-1 text-white bg-gray-600 rounded-md hover:bg-black">Remove</button>
79                    </td>
80                </form>
81            </tr>
82            {{/each}}
83        </table>
84</div>
85{{/layout}}