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.
39 lines
904 B
Plaintext
39 lines
904 B
Plaintext
<% @page_title = "Projects" %>
|
|
|
|
<% if @projects.count > 0 %>
|
|
<%== render(
|
|
"components/page_header",
|
|
locals: {
|
|
right_items: [render("components/button", locals: { text: "Create Project", link: "/project/create" })]
|
|
}
|
|
) %>
|
|
|
|
<div class="grid gap-6">
|
|
<%== render(
|
|
"components/table_card",
|
|
locals: {
|
|
headers: ["Name"],
|
|
rows: @projects.map do |p|
|
|
[
|
|
[
|
|
[p[:name], {link: p[:path] + "/dashboard"}]
|
|
],
|
|
{ id: "project-#{p[:id]}" }
|
|
]
|
|
end
|
|
}
|
|
) %>
|
|
</div>
|
|
<% else %>
|
|
<%== render(
|
|
"components/empty_state",
|
|
locals: {
|
|
icon: "hero-folder-open",
|
|
title: "No projects",
|
|
description: "Get started by creating a new project.",
|
|
button_link: "/project/create",
|
|
button_title: "New Project"
|
|
}
|
|
) %>
|
|
<% end %>
|