5c64f02579
Reviewed-on: https://git.nikos.gg/prymn/prymn/pulls/8 Co-authored-by: Nikos Papadakis <nikos@papadakis.xyz> Co-committed-by: Nikos Papadakis <nikos@papadakis.xyz>
110 lines
3.6 KiB
Text
110 lines
3.6 KiB
Text
<.header>
|
|
<span class="relative flex items-center">
|
|
Server <%= @server.name %>
|
|
<span
|
|
role="tooltip"
|
|
class={[
|
|
"absolute -left-6 inline-flex h-3 w-3 before:-translate-x-1/2 before:-translate-y-full",
|
|
"before:-top-2 before:left-1/2 before:absolute before:text-sm before:text-white",
|
|
"before:font-normal before:content-[attr(data-tip)] before:opacity-0",
|
|
"hover:before:opacity-100 before:py-1 before:px-2 before:bg-black",
|
|
"before:rounded before:pointer-events-none before:transition-opacity"
|
|
]}
|
|
data-tip={@health.message}
|
|
>
|
|
<%= case @health.message do %>
|
|
<% "Connected" -> %>
|
|
<span class="absolute top-0 left-0 h-full w-full animate-ping rounded-full bg-green-400 opacity-75" />
|
|
<span class="h-3 w-3 rounded-full bg-green-500" />
|
|
<% "Disconnected" -> %>
|
|
<span class="h-3 w-3 rounded-full bg-red-500" />
|
|
<% _ -> %>
|
|
<span class="h-3 w-3 rounded-full bg-yellow-500" />
|
|
<% end %>
|
|
</span>
|
|
</span>
|
|
<:subtitle>
|
|
<%= @server.public_ip %>
|
|
</:subtitle>
|
|
</.header>
|
|
|
|
<div class="my-3 text-sm text-slate-700">
|
|
<%= for {name, task} <- @health.tasks do %>
|
|
Background task in progress: <%= name %>
|
|
<p><%= task.progress %> complete</p>
|
|
<% end %>
|
|
</div>
|
|
|
|
<div :if={@server.status == :unregistered} class="my-10">
|
|
<p class="mb-9">
|
|
Connect to your server using root credentials and execute the following command:
|
|
</p>
|
|
<div class="group inline-flex items-center rounded-lg bg-gray-800 p-4 pl-6 text-white">
|
|
<code class="flex gap-4">
|
|
<span class="select-none text-gray-500">#</span>
|
|
<span class="flex-1">
|
|
<%= @registration_command %>
|
|
</span>
|
|
</code>
|
|
<button type="button" tabindex="-1">
|
|
<.icon
|
|
name="hero-document-duplicate-solid"
|
|
class="invisible ml-4 animate-bounce text-gray-500 group-hover:visible"
|
|
/>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div :if={@server.status == :registered && @sys_info} class="my-10">
|
|
<section class="flex justify-between rounded bg-gray-800 p-5 text-white">
|
|
<div>
|
|
<p class="text-xl"><%= @sys_info.uptime || "" %>s</p>
|
|
<p class="text-sm">Uptime</p>
|
|
</div>
|
|
<div class="ml-4">
|
|
<p class="text-xl"><%= Enum.count(@sys_info.cpus || []) %></p>
|
|
<p class="text-sm">CPUs</p>
|
|
</div>
|
|
<div class="ml-4">
|
|
<p class="text-xl"><%= calculate_cpu_usage(@sys_info.cpus) %></p>
|
|
<p class="text-sm">CPU%</p>
|
|
</div>
|
|
<div class="ml-4">
|
|
<p class="text-xl">
|
|
<%= bytes_to_gigabytes(@sys_info.mem_total_bytes - @sys_info.mem_avail_bytes) %>
|
|
<span>/</span>
|
|
<%= bytes_to_gigabytes(@sys_info.mem_total_bytes) %>
|
|
<span>GiB</span>
|
|
</p>
|
|
<p class="text-sm">Memory</p>
|
|
</div>
|
|
<div class="ml-4">
|
|
<p class="text-xl">
|
|
<%= calculate_disk_used_percent(@sys_info.disks) %>
|
|
<span>%</span>
|
|
</p>
|
|
<p class="text-sm">Used Disk</p>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="mt-4">
|
|
<form phx-change="change_dry_run">
|
|
<.input type="checkbox" name="dry_run" value={@dry_run} label="Enable dry-run operations" />
|
|
</form>
|
|
</section>
|
|
|
|
<section class="mt-4">
|
|
<h2 class="border-b border-solid border-gray-500 pb-1 text-2xl font-medium">System</h2>
|
|
<p class="mt-4">
|
|
Updates: <%= @sys_info.updates_available %> pending updates.
|
|
<.button type="button" class="ml-4" phx-click="system_update">
|
|
Update now
|
|
</.button>
|
|
<p :for={output <- assigns.update_output}>
|
|
<%= output %>
|
|
</p>
|
|
</p>
|
|
</section>
|
|
</div>
|
|
|
|
<.back navigate={~p"/servers"}>Back to servers</.back>
|