Changeset 923235e in Klonkt

Timestamp:

06/27/2026 01:44:32 PM (2 months ago)

Author:

Robin Genis <roboburr@…>

Branches:

main

Children:

0960c1d

Parents:

8d054ca

Message:

feat(setup): note the username is permanent + becomes your fediverse handle

• views/pages/auth-register.ejs — the first-run wizard shows, under the username field, that it can't be changed later, plus a live @username@host preview. The username becomes the site slug (auth.js register: slug = username.toLowerCase()), hence the fediverse handle / actor URI.
• services/i18n.js — setup.username_note (nl/en/de).

Location:

src

Files:

• services/i18n.js (modified) (3 diffs)
• views/pages/auth-register.ejs (modified) (2 diffs)

src/services/i18n.js

@@ -100 +100 @@
     'setup.sitename_ph': 'bijv. jouw artiestennaam',
     'setup.submit': 'Mijn site aanmaken',
+    'setup.username_note': 'Dit wordt je adres op de fediverse en kun je later niet meer wijzigen:',
     'auth.f_username': 'Gebruikersnaam (3-32 tekens, letters/cijfers/_-)',
     'auth.f_email': 'E-mail',
@@ -1115 +1116 @@
     'setup.sitename_ph': 'e.g. your artist name',
     'setup.submit': 'Create my site',
+    'setup.username_note': 'This becomes your address on the fediverse and can’t be changed later:',
     'auth.f_username': 'Username (3-32 chars, letters/digits/_-)',
     'auth.f_email': 'Email',
@@ -2126 +2128 @@
     'setup.sitename_ph': 'z. B. dein Künstlername',
     'setup.submit': 'Meine Seite erstellen',
+    'setup.username_note': 'Das wird deine Adresse im Fediverse und kann später nicht geändert werden:',
     'auth.f_username': 'Benutzername (3-32 Zeichen, Buchstaben/Ziffern/_-)',
     'auth.f_email': 'E-Mail',

src/views/pages/auth-register.ejs

@@ -22 +22 @@
     <label>
       <span><%= t('auth.f_username') %></span>
-      <input type="text" name="username" value="<%= username %>" required autocomplete="username" pattern="[a-zA-Z0-9_-]{3,32}">
+      <input type="text" id="setup-username" name="username" value="<%= username %>" required autocomplete="username" pattern="[a-zA-Z0-9_-]{3,32}">
+      <small class="setup-handle-hint"><%= t('setup.username_note') %> <code id="setup-handle">@username@…</code></small>
     </label>
     <label>
@@ -35 +36 @@
   </form>
 </div>
+
+<style>
+  .setup-handle-hint { display: block; margin-top: .35rem; font-size: .82rem; line-height: 1.4; color: var(--ink-soft, #888); }
+  .setup-handle-hint code { color: var(--accent); font-weight: 600; background: color-mix(in srgb, var(--accent) 12%, transparent); padding: .05rem .35rem; border-radius: 6px; white-space: nowrap; }
+</style>
+<script>
+(function () {
+  var u = document.getElementById('setup-username'), out = document.getElementById('setup-handle');
+  if (!u || !out) return;
+  function upd() {
+    var v = (u.value || '').toLowerCase().replace(/[^a-z0-9_-]/g, '') || 'username';
+    out.textContent = '@' + v + '@' + location.host;
+  }
+  u.addEventListener('input', upd);
+  upd();
+})();
+</script>