adjust title

app/javascript/elements/bar_chart.js

@@ -1,8 +1,7 @@
 export default class extends HTMLElement {
-  connectedCallback () {
-    this.chartLabels = JSON.parse(this.dataset.labels || '[]')
-    this.chartDatasets = JSON.parse(this.dataset.datasets || '[]')
+  static observedAttributes = ['data-labels', 'data-datasets']
 
+  connectedCallback () {
     this.initChart()
   }
 
@@ -13,6 +12,15 @@ export default class extends HTMLElement {
     }
   }
 
+  attributeChangedCallback (_, oldValue, newValue) {
+    if (!this.chartInstance || oldValue === newValue) return
+
+    this.chartInstance.data.labels = JSON.parse(this.dataset.labels || '[]')
+    this.chartInstance.data.datasets = JSON.parse(this.dataset.datasets || '[]')
+
+    this.chartInstance.update()
+  }
+
   async initChart () {
     const { default: Chart } = await import(/* webpackChunkName: "chartjs" */ 'chart.js/auto')
 
@@ -23,8 +31,8 @@ export default class extends HTMLElement {
     this.chartInstance = new Chart(ctx, {
       type: 'bar',
       data: {
-        labels: this.chartLabels,
-        datasets: this.chartDatasets
+        labels: JSON.parse(this.dataset.labels || '[]'),
+        datasets: JSON.parse(this.dataset.datasets || '[]')
       },
       options: {
         responsive: true,

app/javascript/elements/native_bridge.js

@@ -39,7 +39,8 @@ if (handlers?.native && window === window.top) {
 
     if (!link) return
 
-    const title = link.dataset.nativeTitle || link.getAttribute('aria-label') || link.closest('[data-native-title]')?.dataset.nativeTitle || link.innerText.trim()
+    const action = link.closest('native-action, native-menu-action')
+    const title = link.dataset.nativeTitle || link.getAttribute('aria-label') || link.closest('[data-native-title]')?.dataset.nativeTitle || action?.dataset.label || action?.textContent.replace(/\s+/g, ' ').trim()
 
     if (!title) return
 

app/views/api_settings/index.html.erb

@@ -19,7 +19,7 @@
               </masked-input>
               <%= render 'shared/clipboard_copy', icon: 'copy', text: token, class: 'base-button', icon_class: 'w-6 h-6 text-white', copy_title: t('copy'), copied_title: t('copied') %>
             <% else %>
-              <a id="access_token_container" href="<%= settings_reveal_access_token_path %>" data-turbo-frame="modal" class="flex w-full space-x-4">
+              <a id="access_token_container" href="<%= settings_reveal_access_token_path %>" data-turbo-frame="modal" data-native-modal="medium" aria-label="<%= t('reveal_api_key') %>" class="flex w-full space-x-4">
                 <input id="api_key" type="text" value="<%= obscured_token %>" class="input font-mono input-bordered w-full" autocomplete="off" readonly>
                 <div class="base-button">
                   <%= svg_icon('copy', class: 'w-6 h-6 text-white') %>

app/views/esign_settings/show.html.erb

@@ -46,7 +46,7 @@
         <%= t('signing_certificates') %>
       </h2>
       <% if can?(:create, @encrypted_config) %>
-        <%= link_to new_settings_esign_path, class: 'btn btn-primary btn-md', data: { turbo_frame: 'modal' } do %>
+        <%= link_to new_settings_esign_path, class: 'btn btn-primary btn-md', aria: { label: t('upload_certificate') }, data: { turbo_frame: 'modal' } do %>
           <%= svg_icon('plus', class: 'w-6 h-6') %>
           <span><%= t('upload_cert') %></span>
         <% end %>

app/views/mcp_settings/index.html.erb

@@ -7,7 +7,7 @@
         <%= t('mcp_server') %>
       </h1>
       <div class="flex flex-col md:flex-row gap-y-2 gap-x-4 md:items-center">
-        <%= link_to new_settings_mcp_path, class: 'btn btn-primary btn-md gap-2 w-full md:w-fit', data: { turbo_frame: 'modal' } do %>
+        <%= link_to new_settings_mcp_path, class: 'btn btn-primary btn-md gap-2 w-full md:w-fit', aria: { label: t('new_token') }, data: { turbo_frame: 'modal' } do %>
           <%= svg_icon('plus', class: 'w-6 h-6') %>
           <span><%= t('new_token') %></span>
         <% end %>

app/views/profile/index.html.erb

@@ -40,7 +40,7 @@
         <img src="<%= signature.url(time: ActiveStorage::Attachment.service_url_time) %>" style="height: 130px; width: 100%; object-fit: contain;">
       </div>
     <% end %>
-    <a href="<%= edit_user_signature_path %>" data-turbo-frame="modal" data-native-modal="medium" class="base-button w-full">
+    <a href="<%= edit_user_signature_path %>" data-turbo-frame="modal" data-native-modal="medium" aria-label="<%= t('update_signature') %>" class="base-button w-full">
       <%= t('update_signature') %>
     </a>
     <p class="text-2xl font-bold mt-8 mb-4">
@@ -53,7 +53,7 @@
         <img src="<%= initials.url(time: ActiveStorage::Attachment.service_url_time) %>" style="height: 130px; width: 100%; object-fit: contain;">
       </div>
     <% end %>
-    <a href="<%= edit_user_initials_path %>" data-turbo-frame="modal" data-native-modal="medium" class="base-button w-full">
+    <a href="<%= edit_user_initials_path %>" data-turbo-frame="modal" data-native-modal="medium" aria-label="<%= t('update_initials') %>" class="base-button w-full">
       <%= t('update_initials') %>
     </a>
     <% if true_user == current_user && !current_account.testing? %>
@@ -94,7 +94,7 @@
               <%= t('2fa_has_been_configured') %>
             </span>
           </p>
-          <a href="<%= edit_mfa_setup_path %>" data-turbo-frame="modal" class="white-button w-full !px-8">🔓 <%= t('remove_2fa') %></a>
+          <a href="<%= edit_mfa_setup_path %>" data-turbo-frame="modal" aria-label="<%= t('remove_2fa') %>" class="white-button w-full !px-8">🔓 <%= t('remove_2fa') %></a>
         <% else %>
           <p class="flex items-center space-x-1">
             <%= svg_icon('info_circle', class: 'stroke-warning inline flex-none w-5 h-5') %>
@@ -102,7 +102,7 @@
               <%= t('2fa_is_not_configured') %>
             </span>
           </p>
-          <a href="<%= new_mfa_setup_path %>" data-turbo-frame="modal" class="base-button w-full !px-8">🔒 <%= t('set_up_2fa') %></a>
+          <a href="<%= new_mfa_setup_path %>" data-turbo-frame="modal" aria-label="<%= t('setup_2fa') %>" class="base-button w-full !px-8">🔒 <%= t('set_up_2fa') %></a>
         <% end %>
       </div>
     <% end %>

app/views/submissions_filters/_applied_filters.html.erb

@@ -33,11 +33,11 @@
       <% end %>
     </div>
   <% end %>
-  <% if params[:template_id].present? %>
+  <% if local_assigns[:filter_template] %>
     <div class="order-<%= chip_order['template'] %> md:order-none flex md:flex h-10 px-2 py-1 text-base md:text-lg items-center justify-between border text-center text-neutral font-semibold rounded-xl shrink-0 max-w-[60vw] md:w-36 border-neutral-700">
       <span class="flex items-center space-x-1 flex-1 min-w-0 pr-1">
         <%= svg_icon('layout_grid', class: 'w-5 h-5 shrink-0') %>
-        <span class="font-normal truncate"><%= local_assigns[:filter_template]&.name || 'NA' %></span>
+        <span class="font-normal truncate"><%= local_assigns[:filter_template].name %></span>
       </span>
       <%= link_to url_for(params: request.query_parameters.except('template_id')), class: 'rounded-lg ml-1 shrink-0 hover:bg-base-content hover:text-white' do %>
         <%= svg_icon('x', class: 'w-5 h-5') %>

app/views/template_folders/_folder.html.erb

@@ -1,6 +1,6 @@
 <% is_long = folder.name.size > 32 %>
 <% icon = folder.default? ? 'folder_star' : 'folder' %>
-<a href="<%= folder_path(folder) %>" class="flex h-full flex-col justify-between rounded-2xl py-5 px-6 w-full bg-base-200 before:border-2 before:border-base-300 before:border-dashed before:absolute before:left-0 before:right-0 before:top-0 before:bottom-0 before:hidden before:rounded-2xl relative" data-targets="dashboard-dropzone.folderCards" data-full-name="<%= folder.full_name %>">
+<a href="<%= folder_path(folder) %>" class="flex h-full flex-col justify-between rounded-2xl py-5 px-6 w-full bg-base-200 before:border-2 before:border-base-300 before:border-dashed before:absolute before:left-0 before:right-0 before:top-0 before:bottom-0 before:hidden before:rounded-2xl relative" data-targets="dashboard-dropzone.folderCards" data-full-name="<%= folder.full_name %>" data-native-title="<%= folder.name %>">
   <% if !is_long %>
     <%= svg_icon(icon, class: 'w-6 h-6') %>
   <% end %>

app/views/template_folders/_shared_folder.html.erb

@@ -1,4 +1,4 @@
-<a href="<%= templates_shared_index_path %>" class="flex h-full flex-col justify-between rounded-2xl py-5 px-6 w-full bg-base-200 before:border-2 before:border-base-300 before:border-dashed before:absolute before:left-0 before:right-0 before:top-0 before:bottom-0 before:hidden before:rounded-2xl relative">
+<a href="<%= templates_shared_index_path %>" class="flex h-full flex-col justify-between rounded-2xl py-5 px-6 w-full bg-base-200 before:border-2 before:border-base-300 before:border-dashed before:absolute before:left-0 before:right-0 before:top-0 before:bottom-0 before:hidden before:rounded-2xl relative" data-native-title="<%= t('shared').capitalize %>">
   <%= svg_icon('folder_up', class: 'w-6 h-6') %>
   <div class="text-lg font-semibold mt-1 capitalize" style="overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;">
     <%= t('shared') %>

app/views/templates/_template.html.erb

@@ -1,5 +1,5 @@
 <div class="h-36 relative group min-w-0">
-  <a href="<%= template_path(template) %>" class="flex h-full flex-col justify-between rounded-2xl pt-6 px-7 w-full bg-base-200 before:border-2 before:border-base-300 before:border-dashed before:absolute before:left-0 before:right-0 before:top-0 before:bottom-0 before:hidden before:rounded-2xl" data-targets="dashboard-dropzone.templateCards" data-native-actions="<%= (!template.archived_at? && can?(:update, template) ? 'pencil,menu' : 'file_text,menu') if turbo_native_app? %>">
+  <a href="<%= template_path(template) %>" class="flex h-full flex-col justify-between rounded-2xl pt-6 px-7 w-full bg-base-200 before:border-2 before:border-base-300 before:border-dashed before:absolute before:left-0 before:right-0 before:top-0 before:bottom-0 before:hidden before:rounded-2xl" data-targets="dashboard-dropzone.templateCards" data-native-title="<%= template.name %>" data-native-actions="<%= (!template.archived_at? && can?(:update, template) ? 'pencil,menu' : 'file_text,menu') if turbo_native_app? %>">
     <div class="text-xl font-semibold" style="line-height: 1.6rem; overflow: hidden; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;">
       <% if template.template_accesses.present? %>
         <%= svg_icon('lock', class: 'w-6 h-6 inline -translate-y-[4px]') %>
@@ -97,7 +97,7 @@
         <% if can?(:update, template) && template.account_id == current_account.id %>
           <li>
             <native-menu-action data-icon="folder" data-label="<%= t('move') %>" class="grid-cols-1 p-0">
-              <%= link_to edit_template_folder_path(template.id), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: :modal, native_modal: :medium } do %>
+              <%= link_to edit_template_folder_path(template.id), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: :modal, native_title: t('move_into_folder'), native_modal: :medium } do %>
                 <%= svg_icon('folder_share', class: 'w-5 h-5 flex-shrink-0') %>
                 <span><%= t('move') %></span>
               <% end %>
@@ -107,7 +107,7 @@
         <% if can?(:create, template) %>
           <li>
             <native-menu-action data-icon="copy" data-label="<%= t('clone') %>" class="grid-cols-1 p-0">
-              <%= link_to new_template_clone_path(template), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: :modal, native_modal: :medium } do %>
+              <%= link_to new_template_clone_path(template), class: 'flex items-center gap-2 px-4 py-2', data: { turbo_frame: :modal, native_title: t('clone_template'), native_modal: :medium } do %>
                 <%= svg_icon('copy', class: 'w-5 h-5 flex-shrink-0') %>
                 <span><%= t('clone') %></span>
               <% end %>

app/views/templates/_title.html.erb

@@ -39,7 +39,7 @@
             </a>
             <% if can?(:update, template) %>
               <span class="pl-1 tooltip tooltip-right tooltip-no-touch md:opacity-0 hover:opacity-100 peer-hover:opacity-100" data-tip="<%= t('move') %>">
-                <a href="<%= edit_template_folder_path(template.id, subfolder: @template.folder.parent_folder.present?) %>" data-turbo-frame="modal" data-native-modal="medium">
+                <a href="<%= edit_template_folder_path(template.id, subfolder: @template.folder.parent_folder.present?) %>" data-turbo-frame="modal" data-native-modal="medium" aria-label="<%= t('move_into_folder') %>">
                   <%= svg_icon('pencil_share', class: 'w-5 h-5') %>
                 </a>
               </span>
@@ -71,7 +71,7 @@
           </div>
         <% end %>
         <open-modal-mobile class="absolute md:relative -bottom-1 md:bottom-0 right-0 mt-1">
-          <%= link_to template_share_link_path(template), class: 'btn btn-xs md:btn-sm whitespace-nowrap btn-neutral text-white px-2', data: { turbo_frame: :modal, native_modal: :medium } do %>
+          <%= link_to template_share_link_path(template), class: 'btn btn-xs md:btn-sm whitespace-nowrap btn-neutral text-white px-2', aria: { label: t('share_link') }, data: { turbo_frame: :modal, native_modal: :medium } do %>
             <span class="flex items-center justify-center space-x-2">
               <%= svg_icon('link', class: 'w-4 h-4 md:w-6 md:h-6') %>
               <span><%= t('link') %></span>
@@ -117,7 +117,7 @@
     <% end %>
     <% if !template.archived_at? && can?(:update, template) && @template.account_id == current_account.id %>
       <native-action data-section="edit" data-icon="folder" data-label="<%= t('move') %>">
-        <a href="<%= edit_template_folder_path(template.id, subfolder: @template.folder.parent_folder.present?) %>" data-turbo-frame="modal" data-native-modal="medium"></a>
+        <a href="<%= edit_template_folder_path(template.id, subfolder: @template.folder.parent_folder.present?) %>" data-turbo-frame="modal" data-native-modal="medium" aria-label="<%= t('move_into_folder') %>"></a>
       </native-action>
     <% end %>
     <% if can?(:destroy, template) %>

app/views/templates/show.html.erb

@@ -30,7 +30,7 @@
         <% end %>
         <% if !@template.archived_at? && can?(:create, Submission) %>
           <open-modal-mobile class="flex">
-            <%= link_to new_template_submission_path(@template), id: 'add_recipients_button', class: 'white-button !border', data: { turbo_frame: 'modal', native_modal: ('medium' if @template.submitters.size < 3) } do %>
+            <%= link_to new_template_submission_path(@template), id: 'add_recipients_button', class: 'white-button !border', aria: { label: t('add_new_recipients') }, data: { turbo_frame: 'modal', native_modal: ('medium' if @template.submitters.size < 3) } do %>
               <%= svg_icon('plus', class: 'w-6 h-6 stroke-2') %>
               <%= t('add_recipients_html') %>
             <% end %>
@@ -104,7 +104,7 @@
             <div class="space-y-2 flex flex-col">
               <% if can?(:create, Submission) %>
                 <open-modal-mobile class="flex flex-col mt-6">
-                  <%= link_to new_template_submission_path(@template, with_link: true), id: 'send_to_recipients_button', class: 'base-button', data: { turbo_frame: 'modal', native_modal: ('medium' if @template.submitters.size < 3) } do %>
+                  <%= link_to new_template_submission_path(@template, with_link: true), id: 'send_to_recipients_button', class: 'base-button', data: { turbo_frame: 'modal', native_title: t('add_new_recipients'), native_modal: ('medium' if @template.submitters.size < 3) } do %>
                     <%= svg_icon('plus', class: 'w-6 h-6 stroke-2') %>
                     <span class="mr-1"><%= t('send_to_recipients') %></span>
                   <% end %>
@@ -117,7 +117,7 @@
                 <% end %>
               <% else %>
                 <open-modal-mobile class="flex flex-col mt-6">
-                  <%= link_to new_template_submission_path(@template, selfsign: true), id: 'sign_yourself_button', class: 'white-button', data: { turbo_frame: 'modal', native_modal: ('medium' if @template.submitters.size < 3) } do %>
+                  <%= link_to new_template_submission_path(@template, selfsign: true), id: 'sign_yourself_button', class: 'white-button', data: { turbo_frame: 'modal', native_title: t('add_recipients'), native_modal: ('medium' if @template.submitters.size < 3) } do %>
                     <%= svg_icon('writing', class: 'w-6 h-6') %>
                     <span class="mr-1"><%= t('sign_it_yourself') %></span>
                   <% end %>

app/views/webhook_settings/index.html.erb

@@ -7,7 +7,7 @@
       <div class="flex flex-col gap-2 md:flex-row md:justify-between md:items-center">
         <%= render 'shared/test_mode_toggle' %>
         <% if @webhook_url.persisted? %>
-          <%= link_to new_settings_webhook_path, class: 'md:ml-3 btn bg-white btn-outline btn-md gap-2 w-full md:w-fit', data: { turbo_frame: 'modal' } do %>
+          <%= link_to new_settings_webhook_path, class: 'md:ml-3 btn bg-white btn-outline btn-md gap-2 w-full md:w-fit', aria: { label: t('new_webhook') }, data: { turbo_frame: 'modal' } do %>
             <%= svg_icon('plus', class: 'w-6 h-6') %>
             <span><%= t('new_webhook') %></span>
           <% end %>

app/views/webhook_settings/show.html.erb

@@ -9,7 +9,7 @@
           <%= render 'shared/test_mode_toggle' %>
         <% end %>
         <% if @webhook_url.persisted? && params[:action] == 'index' %>
-          <%= link_to new_settings_webhook_path, class: 'md:ml-3 btn bg-white btn-outline btn-md gap-2 w-full md:w-fit', data: { turbo_frame: 'modal' } do %>
+          <%= link_to new_settings_webhook_path, class: 'md:ml-3 btn bg-white btn-outline btn-md gap-2 w-full md:w-fit', aria: { label: t('new_webhook') }, data: { turbo_frame: 'modal' } do %>
             <%= svg_icon('plus', class: 'w-6 h-6') %>
             <span><%= t('new_webhook') %></span>
           <% end %>
@@ -22,7 +22,7 @@
           <%= label_tag :url, 'Webhook URL', class: 'text-sm font-semibold' %>
           <% if @webhook_url.persisted? %>
             <div class="flex items-center space-x-2 md:absolute md:right-0">
-              <%= link_to webhook_secret_path(@webhook_url), class: 'btn btn-outline btn-sm bg-white', data: { turbo_frame: 'modal' } do %>
+              <%= link_to webhook_secret_path(@webhook_url), class: 'btn btn-outline btn-sm bg-white', aria: { label: t('webhook_security') }, data: { turbo_frame: 'modal' } do %>
                 <%= svg_icon('lock', class: 'w-4 h-4') %>
                 <span><%= t('security') %></span>
               <% end %>