Files
akkounts/app/components/rs_auth_details_modal_component.html.erb
raucao 17bad40bf4
CI / Test (pull_request) Successful in 48s
Release Drafter / Update release notes draft (pull_request) Successful in 3s
Show device timestamps in the reader's local time
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
2026-11-03 18:28:14 +04:00

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">&middot;</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 %>