The exact issuance and expiry times in the device rows' hover titles were rendered in UTC, which reads as wrong to anyone not living there. - Mark the dates with a <time> element carrying the absolute (UTC) timestamp, rather than a custom data attribute whose name claimed to hold local time - Rewrite those titles in the browser's own zone, keeping the server's UTC rendering as the fallback for when JavaScript is unavailable - Only convert values that carry an explicit offset, so a date-only <time> is not read as UTC midnight and shifted onto the previous day - Give the revoke button a little more room from the device name and dates Part of #254
52 lines
2.3 KiB
ERB
52 lines
2.3 KiB
ERB
<%= render ModalComponent.new(show_close_button: false) do %>
|
|
<div class="flex items-center gap-4">
|
|
<div class="h-16 w-16 flex-none">
|
|
<%= render AppCatalog::WebAppIconComponent.new(web_app: @web_app) %>
|
|
</div>
|
|
<div class="min-w-0">
|
|
<h4 class="mb-1 text-xl font-bold truncate"><%= @auth.display_name %></h4>
|
|
<% if @auth.client_id != @auth.display_name %>
|
|
<p class="text-sm text-gray-500 truncate"><%= @auth.client_id %></p>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
|
|
<%= render RsAuthAccessComponent.new(authorizations: @authorizations) %>
|
|
|
|
<h5 class="mt-8 mb-3 text-xs font-semibold uppercase tracking-wide text-gray-500">
|
|
Connected devices
|
|
</h5>
|
|
<ul class="divide-y divide-gray-100 rounded-lg border border-gray-200" data-turbo-prefetch="false">
|
|
<% @authorizations.each do |auth| %>
|
|
<li id="<%= rs_device_dom_id(auth) %>" class="flex items-center justify-between gap-6 px-4 py-3">
|
|
<div class="min-w-0">
|
|
<p class="mb-1 truncate text-base font-medium"><%= auth.device_label %></p>
|
|
<p class="truncate text-xs text-gray-500">
|
|
Connected <%= timestamp_tag(auth.created_at, title: connected_at_title(auth)) %>
|
|
<span class="mx-1">·</span>
|
|
<%= tag.span class: ("text-red-700" if auth.expired?) do %>
|
|
<% if auth.expire_at.present? %>
|
|
<%= expiry_prefix(auth) %> <%= timestamp_tag(auth.expire_at, title: expires_at_title(auth)) %>
|
|
<% else %>
|
|
Never expires
|
|
<% end %>
|
|
<% end %>
|
|
</p>
|
|
</div>
|
|
<%= button_to "Revoke access", services_storage_rs_auth_path(auth), method: :delete,
|
|
form: { class: "flex-none" },
|
|
class: "whitespace-nowrap text-sm text-red-700 hover:underline bg-transparent border-0 p-0 cursor-pointer" %>
|
|
</li>
|
|
<% end %>
|
|
</ul>
|
|
|
|
<div class="mt-8 flex flex-col sm:flex-row gap-3 sm:gap-2">
|
|
<%= link_to "Launch app", launch_app_services_storage_path(@auth.client_id),
|
|
class: "btn-md btn-blue w-full sm:grow sm:order-last text-center",
|
|
target: "_blank", rel: "noopener", data: { turbo: false } %>
|
|
<button type="button" class="btn-md btn-gray w-full sm:grow text-center"
|
|
data-action="click->modal#close:prevent">
|
|
Close
|
|
</button>
|
|
</div>
|
|
<% end %> |