Standardize look of language boxes

app/javascript/controllers/session_controller.js

@@ -40,7 +40,7 @@ export default class extends Controller {
       return;
     }
     if (!languagesFrom.split(',').includes(languageSession)) {
-      const response = confirm("You are signing up for a talk with language " + languageSession + ", which you claim not to understand!");
+      const response = confirm("You are signing up for a talk with language \"" + languageSession + "\", which you claim not to understand!");
       if (response) {
         return;
       } else {

app/views/assignments/_user_avatar.html.erb

@@ -10,11 +10,4 @@
       <span class="absolute -inset-1"></span>
     <% end %>
   </button>
-</span>
-<% if !user.languages_from.blank? || !user.languages_to.blank? %>
-<small class="text-2xs uppercase font-light bg-black/10 rounded-sm p-1 mr-1" aria-label="Languages <%= user.name %> can translate" title="Languages <%= user.name %> can translate">
-    <%= user.languages_from %>
-    <span aria-label="to">→</span>
-    <%= user.languages_to %>
-</small>
-<% end %>
+</span><%= render partial: 'shared/user_languages', locals: { user:, session: assignment.session } %>

app/views/candidates/_user_avatar.html.erb

@@ -11,17 +11,7 @@
       <span class="absolute -inset-1"></span>
     <% end %>
   </button>
-</span>
-<% if !user.languages_from.blank? || !user.languages_to.blank? %>
-<small class="text-2xs uppercase font-light bg-black/10 rounded-sm p-1 ml-1">
-  <% if !user.languages_from.blank? && !user.languages_from.split(',').include?(session.language) %>
-  <span aria-help="User doesn't understand the language of the talk" title="User doesn't understand the language of the talk">⚠️</span>
-  <% end %>
-  <%= user.languages_from %>
-  <span aria-label="to">→</span>
-  <%= user.languages_to %>
-</small>
-<% end %>
+</span><%= render partial: 'shared/user_languages', locals: { user:, session: } %>
 <% if candidate.note %>
  <span class="relative ml-1.5"><span class="max-w-60 max-h-14 overflow-scroll bg-gray-600 text-white text-xs font-medium px-2 py-1 rounded-md relative inline-block"><%= candidate.note %></span><span class="w-0 h-0 border-t-[6px] border-t-transparent border-b-[6px] border-b-transparent border-r-[6px] border-r-gray-600 absolute left-[-5px] top-[20%] transform -translate-y-1/2"></span> </span>
 <% end %>

app/views/shared/_user_languages.erb

+<% if !user.languages_from.blank? || !user.languages_to.blank? %><small class="text-2xs uppercase font-light bg-black/10 rounded-sm p-1 ml-1" aria-label="Languages <%= user.name %> can translate" title="Languages <%= user.name %> can translate">
+  <% if !user.languages_from.blank? && !user.languages_from.split(',').include?(session.language) %>
+  <span aria-help="User doesn't understand the language of the talk" title="User doesn't understand the language of the talk">⚠️</span>
+  <% end %>
+  <%= user.languages_from.presence || "?" %>
+  <span aria-label="to">→</span>
+  <%= user.languages_to.presence || "?" %>
+</small>
+<% end %>