Files
ubicloud/views/postgres/index.erb
Jeremy Evans cb389c5144 Use Roda part plugin to simplify render calls with locals
This uses the new part plugin to simplify and optimize render
calls with locals.

```ruby
render(:template, locals: {foo: 'bar'})

part(:template, foo: 'bar')
```

This simplifies a large number of calls in Clover, since
rendering with locals is one of the most common method
calls in the templates.

The main advantage of this is simplicity, but the part method
is also more optimized, and will be even more optimized when
we upgrade to Ruby 3.4.

Diff best reviewed with:

```
git diff -b --color-words --word-diff-regex='\\w+|[^[:space:]]'
```
2025-01-31 09:47:06 -08:00

86 lines
4.1 KiB
Plaintext

<% @page_title = "PostgreSQL Databases" %>
<%
flavors = {
"standard" => ["Ubicloud", "PostgreSQL Database", "Get started by creating a new PostgreSQL database which is managed by Ubicloud team. It's a good choice for general purpose databases."],
"paradedb" => ["ParadeDB", "ParadeDB PostgreSQL Database", "ParadeDB is an Elasticsearch alternative built on Postgres. ParadeDB instances are managed by the ParadeDB team and are optimal for search and analytics workloads."],
"lantern" => ["Lantern", "Lantern PostgreSQL Database", "Lantern is a PostgreSQL-based vector database designed specifically for building AI applications. Lantern instances are managed by the Lantern team and are optimal for AI workloads."]
}.compact
%>
<% if @postgres_databases.count > 0 %>
<%== part(
"components/page_header",
breadcrumbs: [%w[Projects /project], [@project_data[:name], @project_data[:path]], ["PostgreSQL Databases", "#"]],
right_items: [<<-DROPDOWN]
<div class="group dropdown relative inline-block text-left">
<div>#{part("components/button", text: "Create PostgreSQL Database", right_icon: "hero-chevron-down")}
</div>
<div class="hidden opacity-0 scale-95 group-[.active]:block group-[.active]:opacity-100 group-[.active]:scale-100 transition ease-out duration-100 absolute -right-2 z-10 mt-2 w-72 origin-top-right divide-y divide-gray-100 rounded-md bg-white shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none" role="menu" tabindex="-1">
#{flavors.map do |flavor, (_, title, description)|
<<-ITEM
<div class="py-1 hover:bg-gray-50" role="none">
<a href="#{@project_data[:path]}/postgres/create?flavor=#{flavor}" class="block px-4 py-3 focus:outline-none">
<h3 class="text-base font-semibold leading-6 text-gray-900">#{title}</h3>
<p class="mt-1 text-sm text-gray-500">#{description}</p>
</a>
</div>
ITEM
end.join}
</div>
</div>
DROPDOWN
) %>
<div class="grid gap-6">
<%== part(
"components/table_card",
headers: ["Name", "Managed by", "Location", "State"],
rows: @postgres_databases.map do |pg|
brand, = flavors[pg[:flavor]]
[
[
[pg[:name], {link: @project_data[:path] + pg[:path]}],
["<div class='inline-flex gap-x-1 items-center'><img src='/icons/pg-#{brand.downcase}.png' class='object-cover rounded-lg overflow-hidden w-6 h-6'/><p>#{brand}</p></div>", {escape: false}],
pg[:location],
["pg_state_label", {component: { state: pg[:state] }}]
],
{id: "pg-#{pg[:id]}"}
]
end
) %>
</div>
<% else %>
<%== part(
"components/page_header",
title: "Create PostgreSQL Database",
breadcrumbs: [%w[Projects /project], [@project_data[:name], @project_data[:path]], ["PostgreSQL Databases", "#"]]
) %>
<div class="grid gap-6">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 md:gap-6 lg:gap-10">
<% flavors.each do |flavor, (brand, title, description)| %>
<div class="rounded-lg shadow group relative bg-white p-6">
<div>
<span class="inline-flex rounded-lg overflow-hidden w-12 h-12">
<img src="/icons/pg-<%= brand.downcase %>.png" class="object-cover"/>
</span>
</div>
<div class="mt-4">
<h3 class="text-base font-semibold leading-6 text-gray-900">
<a href="<%= @project_data[:path] %>/postgres/create?flavor=<%= flavor %>" class="focus:outline-none">
<span class="absolute inset-0" aria-hidden="true"></span>
Create <%= title %>
</a>
</h3>
<p class="mt-2 text-sm text-gray-500"><%= description %></p>
</div>
<span class="pointer-events-none absolute right-6 top-6 text-gray-300 group-hover:text-gray-400">
<%== part("components/icon", name: "hero-arrow-up-right") %>
</span>
</div>
<% end %>
</div>
</div>
<% end %>