From 893a1e37231b3c817731944069ef27ef96932bac Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 8 Sep 2024 19:45:19 +0300
Subject: [PATCH] i18n: Translate setup screen

---
 .vscode/i18n-ally-custom-framework.yml |  1 +
 src/views/setup.ejs                    | 58 +++++++++++++-------------
 translations/en/server.json            | 41 +++++++++++++++++-
 3 files changed, 70 insertions(+), 30 deletions(-)

diff --git a/.vscode/i18n-ally-custom-framework.yml b/.vscode/i18n-ally-custom-framework.yml
index dd7f701e5..32ec786aa 100644
--- a/.vscode/i18n-ally-custom-framework.yml
+++ b/.vscode/i18n-ally-custom-framework.yml
@@ -26,6 +26,7 @@ scopeRangeRegex: "useTranslation\\(\\s*\\[?\\s*['\"`](.*?)['\"`]"
 refactorTemplates:
   - t("$1")
   - ${t("$1")}
+  - <%= t("$1") %>
 
 
 # If set to true, only enables this custom framework (will disable all built-in frameworks)
diff --git a/src/views/setup.ejs b/src/views/setup.ejs
index a6f71d759..a5334326f 100644
--- a/src/views/setup.ejs
+++ b/src/views/setup.ejs
@@ -47,7 +47,7 @@
 <noscript><%= t("javascript-required") %></noscript>
 <div class="container">
     <div id="setup-dialog" class="col-md-12 col-lg-8 col-xl-6 mx-auto" style="padding-top: 25px; font-size: larger; display: none;">
-        <h1>TriliumNext Notes setup</h1>
+        <h1><%= t("setup.heading") %></h1>
 
         <div class="alert alert-warning" id="alert" style="display: none;">
         </div>
@@ -55,22 +55,22 @@
         <div id="setup-type" data-bind="visible: step() == 'setup-type'" style="margin-top: 20px;">
             <div class="radio" style="margin-bottom: 15px;">
                 <label><input type="radio" name="setup-type" value="new-document" data-bind="checked: setupType">
-                    I'm a new user, and I want to create a new Trilium document for my notes</label>
+                    <%= t("setup.new-document") %></label>
             </div>
             <div class="radio" style="margin-bottom: 15px;">
                 <label><input type="radio" name="setup-type" value="sync-from-desktop" data-bind="checked: setupType">
-                    I have a desktop instance already, and I want to set up sync with it</label>
+                    <%= t("setup.sync-from-desktop") %></label>
             </div>
             <div class="radio" style="margin-bottom: 15px;">
                 <label><input type="radio" name="setup-type" value="sync-from-server" data-bind="checked: setupType">
-                    I have a server instance already, and I want to set up sync with it</label>
+                    <%= t("setup.sync-from-server") %></label>
             </div>
 
-            <button type="button" data-bind="disable: !setupTypeSelected(), click: selectSetupType" class="btn btn-primary">Next</button>
+            <button type="button" data-bind="disable: !setupTypeSelected(), click: selectSetupType" class="btn btn-primary"><%= t("setup.next") %></button>
         </div>
 
         <div data-bind="visible: step() == 'new-document-in-progress'">
-            <h2>Document initialization in progress</h2>
+            <h2><%= t("setup.init-in-progress") %></h2>
 
             <div style="display: flex; justify-content: flex-start; margin-top: 20px;">
                 <div class="lds-ring" style="margin-right: 20px;">
@@ -81,61 +81,61 @@
                 </div>
 
                 <div style="line-height: 60px;">
-                    <p>You will be shortly redirected to the application.</p>
+                    <p><%= t("setup.redirecting") %></p>
                 </div>
             </div>
         </div>
 
         <div data-bind="visible: step() == 'sync-from-desktop'">
-            <h2>Sync from Desktop</h2>
+            <h2><%= t("setup_sync-from-desktop.heading") %></h2>
 
-            <p>This setup needs to be initiated from the desktop instance:</p>
+            <p><%= t("setup_sync-from-desktop.description") %></p>
 
             <ol>
-                <li>Open your desktop instance of TriliumNext Notes.</li>
-                <li>From the Trilium Menu, click Options.</li>
-                <li>Click on Sync tab.</li>
-                <li>Change server instance address to: <span id="current-host"></span> and click save.</li>
-                <li>Click "Test sync" button to verify connection is successful.</li>
-                <li>Once you've completed these steps, click <a href="/">here</a>.</li>
+                <li><%= t("setup_sync-from-desktop.step1") %></li>
+                <li><%= t("setup_sync-from-desktop.step2") %></li>
+                <li><%= t("setup_sync-from-desktop.step3") %></li>
+                <li><%- t("setup_sync-from-desktop.step4", { host: '<span id="current-host"></span>'}) %></li>
+                <li><%= t("setup_sync-from-desktop.step5") %></li>
+                <li><%- t("setup_sync-from-desktop.step6", { link: '<a href="/">here</a>' }) %></li>
             </ol>
 
             <button type="button" data-bind="click: back" class="btn btn-secondary">Back</button>
         </div>
 
         <div data-bind="visible: step() == 'sync-from-server'">
-            <h2>Sync from Server</h2>
+            <h2><%= t("setup_sync-from-server.heading") %></h2>
 
-            <p>Please enter Trilium server address and credentials below. This will download the whole Trilium document from server and setup sync to it. Depending on the document size and your connection speed, this may take a while.</p>
+            <p><%= t("setup_sync-from-server.instructions") %></p>
 
             <div class="form-group">
-                <label for="sync-server-host">Trilium server address</label>
-                <input type="text" id="syncServerHost" class="form-control" data-bind="value: syncServerHost" placeholder="https://<hostname>:<port>">
+                <label for="sync-server-host"><%= t("setup_sync-from-server.server-host") %></label>
+                <input type="text" id="syncServerHost" class="form-control" data-bind="value: syncServerHost" placeholder="<%= t("setup_sync-from-server.server-host-placeholder") %>">
             </div>
             <div class="form-group">
-                <label for="sync-proxy">Proxy server (optional)</label>
-                <input type="text" id="sync-proxy" class="form-control" data-bind="value: syncProxy" placeholder="https://<hostname>:<port>">
+                <label for="sync-proxy"><%= t("setup_sync-from-server.proxy-server") %></label>
+                <input type="text" id="sync-proxy" class="form-control" data-bind="value: syncProxy" placeholder="<%= t("setup_sync-from-server.proxy-server-placeholder") %>">
 
-                <p><strong>Note:</strong> If you leave proxy setting blank, system proxy will be used (applies to desktop/electron build only)</p>
+                <p><strong><%= t("setup_sync-from-server.note") %></strong> <%= t("setup_sync-from-server.proxy-instruction") %></p>
             </div>
             <div class="form-group">
-                <label for="password">Password</label>
-                <input type="password" id="password" class="form-control" data-bind="value: password" placeholder="Password">
+                <label for="password"><%= t("setup_sync-from-server.password") %></label>
+                <input type="password" id="password" class="form-control" data-bind="value: password" placeholder="<%= t("setup_sync-from-server.password-placeholder") %>">
             </div>
 
-            <button type="button" data-bind="click: back" class="btn btn-secondary">Back</button>
+            <button type="button" data-bind="click: back" class="btn btn-secondary"><%= t("setup_sync-from-server.back") %></button>
 
             &nbsp;
 
-            <button type="button" data-bind="click: finish" class="btn btn-primary">Finish setup</button>
+            <button type="button" data-bind="click: finish" class="btn btn-primary"><%= t("setup_sync-from-server.finish-setup") %></button>
         </div>
 
         <div data-bind="visible: step() == 'sync-in-progress'">
-            <h2>Sync in progress</h2>
+            <h2><%= t("setup_sync-in-progress.heading") %></h2>
 
-            <div class="alert alert-success">Sync has been correctly set up. It will take some time for the initial sync to finish. Once it's done, you'll be redirected to the login page.</div>
+            <div class="alert alert-success"><%= t("setup_sync-in-progress.successful") %></div>
 
-            <div>Outstanding sync items: <strong id="outstanding-syncs">N/A</strong></div>
+            <div><%= t("setup_sync-in-progress.outstanding-items") %> <strong id="outstanding-syncs"><%= t("setup_sync-in-progress.outstanding-items-default") %></strong></div>
         </div>
     </div>
 </div>
diff --git a/translations/en/server.json b/translations/en/server.json
index e65a7eda1..6281dc449 100644
--- a/translations/en/server.json
+++ b/translations/en/server.json
@@ -106,5 +106,44 @@
     "password-confirmation": "Password confirmation",
     "button": "Set password"
   },
-  "javascript-required": "Trilium requires JavaScript to be enabled."
+  "javascript-required": "Trilium requires JavaScript to be enabled.",
+  "setup": {
+    "heading": "TriliumNext Notes setup",
+    "new-document": "I'm a new user, and I want to create a new Trilium document for my notes",
+    "sync-from-desktop": "I have a desktop instance already, and I want to set up sync with it",
+    "sync-from-server": "I have a server instance already, and I want to set up sync with it",
+    "next": "Next",
+    "init-in-progress": "Document initialization in progress",
+    "redirecting": "You will be shortly redirected to the application."
+  },
+  "setup_sync-from-desktop": {
+    "heading": "Sync from Desktop",
+    "description": "This setup needs to be initiated from the desktop instance:",
+    "step1": "Open your desktop instance of TriliumNext Notes.",
+    "step2": "From the Trilium Menu, click Options.",
+    "step3": "Click on Sync tab.",
+    "step4": "Change server instance address to: {{- host}} and click save.",
+    "step5": "Click \"Test sync\" button to verify connection is successful.",
+    "step6": "Once you've completed these steps, click {{- link}}."
+  },
+  "setup_sync-from-server": {
+    "heading": "Sync from Server",
+    "instructions": "Please enter Trilium server address and credentials below. This will download the whole Trilium document from server and setup sync to it. Depending on the document size and your connection speed, this may take a while.",
+    "server-host": "Trilium server address",
+    "server-host-placeholder": "https://<hostname>:<port>",
+    "proxy-server": "Proxy server (optional)",
+    "proxy-server-placeholder": "https://<hostname>:<port>",
+    "note": "Note:",
+    "proxy-instruction": "If you leave proxy setting blank, system proxy will be used (applies to desktop/electron build only)",
+    "password": "Password",
+    "password-placeholder": "Password",
+    "back": "Back",
+    "finish-setup": "Finish setup"
+  },
+  "setup_sync-in-progress": {
+    "heading": "Sync in progress",
+    "successful": "Sync has been correctly set up. It will take some time for the initial sync to finish. Once it's done, you'll be redirected to the login page.",
+    "outstanding-items": "Outstanding sync items:",
+    "outstanding-items-default": "N/A"
+  }
 }