Files
ubicloud/views/github/runner.erb
Enes Cakir 97fb279f3a Add table component to UI
We have many tables to display resources in our UI, and we keep copying
and pasting the same code. Some of these tables also have incorrectly
copied styles. When we want to make changes to a table, it requires
updating multiple places. The new component will help us solve these
issues.

We have a similar `kv_data_card` component for displaying resource
details, and I find it very useful.
2025-01-10 23:14:32 +03:00

51 lines
2.1 KiB
Plaintext

<% @page_title = "Active Runners" %>
<div class="auto-refresh hidden" data-interval="10"></div>
<%== render("github/tabbar") %>
<div class="grid gap-6">
<%== render(
"components/table_card",
locals: {
headers: ["Runner", "Repository", "Label", "State", "Branch", "Workflow Job"],
rows:
@runners.map do |runner|
[
[
[runner[:ubid], { link: runner[:runner_url] }],
runner[:repository_name],
runner[:label],
["vm_state_label", { component: { state: runner[:state] } }],
runner.dig(:workflow_job, :head_branch),
if (workflow_job = runner[:workflow_job])
[<<~CONTENT, {escape: false}]
<a href="#{workflow_job[:run_url]}" class="text-orange-600 hover:text-orange-700" target="_blank">#{workflow_job[:workflow_name]}</a>
-
<a href="#{workflow_job[:job_url]}" class="text-orange-600 hover:text-orange-700" target="_blank">#{workflow_job[:job_name]}</a>
CONTENT
else
"Runner doesn't have a job yet"
end
],
{ id: "runner-#{runner[:id]}" }
]
end,
empty_state: <<~EMPTY
<h3 class="text-xl leading-10 font-medium mb-2">No active runners</h3>
<p class="leading-6">
To use Ubicloud runners, you need to change
<span class="text-rose-500 text-sm font-medium bg-slate-100 py-0.5 px-2 rounded font-mono whitespace-nowrap">runs-on: ...</span>
line to one of our labels such as
<span class="text-rose-500 text-sm font-medium bg-slate-100 py-0.5 px-2 rounded font-mono whitespace-nowrap">runs-on: ubicloud-standard-2</span>
in your workflow file. Then, trigger your workflow to start a runner.
<br>
Check out
<a href="https://www.ubicloud.com/docs/github-actions-integration/quickstart" class="text-orange-500 font-medium">our documentation</a>
for using larger runners, using arm64, enabling GPU.
</p>
EMPTY
}
) %>
</div>