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
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
|
<div class="chat" data-turbo="false">
<div class="py-4 px-4 bg-gradient-to-b from-black to-gray-900">
<div class="grid grid-cols-2">
<h1 class="text-gray-50 tracking-tight font-extrabold text-xl">
<%= @network %>
<span class="font-bold"><%= @chan %></span>
</h1>
<div class="text-right">
<a href="/" class="text-gray-400"><%= @account_id %></a>
</div>
</div>
</div>
<div class="body">
<div class="log">
<%= if Enum.empty?(@backlog) do %>
<p class="disconnected text-center text-6xl tracking-tight font-extrabold text-red-800 w-full my-24 mx-auto overflow-y-auto">
Disconnected
</p>
<p class="phx-errored text-center text-6xl tracking-tight font-extrabold text-red-800 w-full my-24 mx-auto overflow-y-auto">
Oh no error
</p>
<% end %>
<ul class="pt-4 pl-4">
<%= for message <- @backlog do %>
<%= if is_map(message) && Map.get(message, :__struct__) == IRC.Message do %>
<li class="flex gap-2 place-items-center message"
data-account-id={message.account.id}>
<LSGWeb.Component.naive_date_time_utc datetime={message.at} format="time-24-with-seconds" />
<span class="inline-block font-bold flex-none cursor-default"><%= message.sender.nick %></span>
<span class="inline-block flex-grow cursor-default">
<LSGWeb.MessageComponent.content
self={message.account.id == @account_id}
text={message.text}
/>
</span>
</li>
<% end %>
<%= if is_binary(message) do %>
<li class="notice"><%= message %></li>
<% end %>
<%= if is_map(message) && Map.get(message, :type) do %>
<li class="flex gap-2 place-items-center event">
<LSGWeb.Component.naive_date_time_utc datetime={message.at} format="time-24-with-seconds" />
<span class="inline-block font-bold flex-none cursor-default text-gray-700">* * *</span>
<span class="inline-block flex-grow cursor-default text-gray-700">
<LSGWeb.EventComponent.content event={message}
self={@users[message.user_id] && @users[message.user_id].account == @account_id}
user={@users[message.user_id]}
/>
</span>
</li>
<% end %>
<% end %>
</ul>
</div>
<aside>
<%= for {_, user} <- @users do %>
<details class="user dropdown">
<summary><%= user.nick %></summary>
<div class="content">
<h3 class="text-xl font-bold"><%= user.nick %></h3>
<ul class="mt-4 space-y-2">
<li class="">User: <span class="font-bold"><%= user.username %></span></li>
<li class="">Name: <%= user.realname || user.nick %></li>
<li class="">Host: <span class="font-mono"><%= user.host %></span></li>
</ul>
<div class="mt-4 font-xs text-gray-300 text-center">
UID: <%= user.id %>
<br />
AID: <%= user.account %>
</div>
</div>
</details>
<% end %>
</aside>
</div>
<.form let={f} id={"form-#{@counter}"} for={:message} phx-submit="send" class="w-full px-4 pt-4">
<div>
<div class="mt-1 flex rounded-md shadow-sm border border-gray-300">
<%= text_input f, :text, class: "focus:ring-indigo-500 focus:border-indigo-500 block w-full border rounded-md pl-4 sm:text-sm border-gray-300", autofocus: true, 'phx-hook': "AutoFocus", autocomplete: "off", placeholder: "Don't be shy, say something…" %>
<%= submit content_tag(:span, "Send"), class: "-ml-px relative inline-flex items-center space-x-2 px-4 py-2 border border-gray-300 text-sm font-medium rounded-r-md text-gray-700 bg-gray-50 hover:bg-gray-100 focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500"%>
</div>
</div>
</.form>
</div>
|