fix(i18n): replace fragment translation keys with placeholder-based complete sentences

- Use {gravatar} placeholder in profile.avatar_upload_hint for proper i18n
- Use {settings_link} placeholder in subscription.single_user_body
- Use {api_tokens_link} placeholder in integrations.webhook_step1
- Add optional chaining in common.js for window.__i18n safety

Co-authored-by: christianlouis <361235+christianlouis@users.noreply.github.com>

frontend/static/js/common.js

@@ -165,7 +165,7 @@ function _makeMenuLink(href, iconClass, label, extraClasses = '') {
           'flex items-center gap-2 px-2 py-1 rounded-md text-gray-700 hover:text-gray-900 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-blue-500';
         btn.setAttribute('aria-haspopup', 'true');
         btn.setAttribute('aria-expanded', 'false');
-        btn.setAttribute('aria-label', `${(window.__i18n.accountMenuFor || 'Account menu for {name}').replace('{name}', displayName)}`);
+        btn.setAttribute('aria-label', `${((window.__i18n?.accountMenuFor) || 'Account menu for {name}').replace('{name}', displayName)}`);
 
         const avatar = document.createElement('img');
         avatar.src = data.picture;

frontend/templates/integrations_dashboard.html

@@ -846,8 +846,8 @@
               </h4>
               <ol class="text-sm text-gray-600 dark:text-gray-400 space-y-2 list-decimal list-inside">
                 <li>
-                  Go to <a href="/api-tokens" class="text-indigo-600 hover:underline font-medium">API Tokens</a>
-                  {{ _("integrations.webhook_create_token") }}
+                  {% set api_tokens_link %}<a href="/api-tokens" class="text-indigo-600 hover:underline font-medium">{{ _("nav.api_tokens") }}</a>{% endset %}
+                  {{ _("integrations.webhook_step1", api_tokens_link=api_tokens_link) | safe }}
                 </li>
                 <li>{{ _("integrations.webhook_upload_with_token") }}</li>
               </ol>

frontend/templates/profile.html

@@ -77,7 +77,8 @@
       <!-- Upload controls -->
       <div class="flex-1 space-y-3">
         <p class="text-sm text-gray-600 dark:text-gray-400">
-          {{ _("profile.avatar_upload_hint") }} <a href="https://gravatar.com" class="underline" target="_blank" rel="noopener noreferrer" aria-label="{{ _('profile.gravatar_link') }} (opens in new tab)">{{ _("profile.gravatar_link") }}</a> {{ _("profile.avatar_gravatar_suffix") }}
+          {% set gravatar_anchor %}<a href="https://gravatar.com" class="underline" target="_blank" rel="noopener noreferrer" aria-label="{{ _('profile.gravatar_link') }} (opens in new tab)">{{ _("profile.gravatar_link") }}</a>{% endset %}
+          {{ _("profile.avatar_upload_hint", gravatar=gravatar_anchor) | safe }}
         </p>
         <label
           for="avatar-input"

frontend/templates/subscription.html

@@ -23,8 +23,8 @@
     <div>
       <p class="font-semibold text-blue-800">{{ _("subscription.single_user_title") }}</p>
       <p class="text-blue-700 text-sm mt-1">
-        {{ _("subscription.single_user_body_before_link") }}
-        <a href="/settings" class="underline hover:text-blue-900">{{ _("nav.settings") }}</a>{{ _("subscription.single_user_body_after_link") }}
+        {% set settings_link %}<a href="/settings" class="underline hover:text-blue-900">{{ _("nav.settings") }}</a>{% endset %}
+        {{ _("subscription.single_user_body", settings_link=settings_link) | safe }}
       </p>
     </div>
   </div>

frontend/translations/en.json

@@ -683,13 +683,13 @@
   "integrations.watch_folder_settings": "Watch Folder Settings",
   "integrations.webdav_settings": "WebDAV Settings",
   "integrations.webdav_url_label": "WebDAV URL",
-  "integrations.webhook_create_token": "and create a personal token.",
   "integrations.webhook_heading": "Webhook Ingestion",
   "integrations.webhook_how_heading": "How Webhook Ingestion Works",
   "integrations.webhook_how_text": "A webhook integration allows external systems to push documents directly into DocuElevate via the REST API. Instead of DocuElevate polling for new files (like IMAP), your application sends files to DocuElevate using an HTTP request with an API token for authentication.",
   "integrations.webhook_ideal_text": "This is ideal for CI/CD pipelines, automation scripts, scanner integrations, or any system that generates documents and needs to send them for processing.",
   "integrations.webhook_quick_start": "Quick Start",
   "integrations.webhook_security_tip": "Create a dedicated API token for each integration and revoke it immediately if compromised. Tokens can be managed on the API Tokens page.",
+  "integrations.webhook_step1": "Go to {api_tokens_link} and create a personal token.",
   "integrations.webhook_upload_with_token": "Use the token to upload documents via the API:",
   "language.bg": "Български",
   "language.ca": "Català",
@@ -829,10 +829,9 @@
   "pipelines.system_pipeline_label": "System pipeline (visible to all users)",
   "pipelines.title": "Processing Pipelines",
   "profile.avatar_alt": "Your profile picture",
-  "profile.avatar_gravatar_suffix": "is shown.",
   "profile.avatar_heading": "Profile Picture",
   "profile.avatar_remove": "Remove custom avatar",
-  "profile.avatar_upload_hint": "Upload a JPEG, PNG, GIF, or WebP image up to 2 MB. If no custom picture is set, your",
+  "profile.avatar_upload_hint": "Upload a JPEG, PNG, GIF, or WebP image up to 2 MB. If no custom picture is set, your {gravatar} is shown.",
   "profile.choose_image": "Choose image…",
   "profile.confirm_password": "Confirm New Password",
   "profile.contact_email_hint": "Used for system notifications. This does not change your login e-mail.",
@@ -1074,8 +1073,7 @@
   "subscription.per_mo": "/mo",
   "subscription.per_month": "/month",
   "subscription.since": "Since",
-  "subscription.single_user_body_after_link": ".",
-  "subscription.single_user_body_before_link": "Subscription tiers apply when multi-user mode is active. Your instance currently runs in single-user mode with no processing limits. An admin can enable multi-user mode via",
+  "subscription.single_user_body": "Subscription tiers apply when multi-user mode is active. Your instance currently runs in single-user mode with no processing limits. An admin can enable multi-user mode via {settings_link}.",
   "subscription.single_user_title": "Multi-user mode is not enabled.",
   "subscription.subtitle": "Your current plan, usage and available upgrades.",
   "subscription.this_month_label": "this month",