From 82baa40794fa78ba37324e65634737c2a194b89b Mon Sep 17 00:00:00 2001
From: trisua <tri@swmff.org>
Date: Thu, 28 Nov 2024 22:23:20 -0500
Subject: [PATCH] add: language switcher add(langs/en-US): sessions settings,
 profile settings, privacy settings, login, sign up

---
 crates/langbeam/src/lib.rs                    |   2 +-
 crates/rainbeam-core/src/config.rs            |   2 +-
 crates/rainbeam/src/routing/api/util.rs       |  27 +++-
 crates/rainbeam/templates/auth/login.html     |  20 ++-
 crates/rainbeam/templates/auth/sign_up.html   |  22 +++-
 crates/rainbeam/templates/base.html           |  88 +++++++-------
 crates/rainbeam/templates/homepage.html       |   6 +-
 .../rainbeam/templates/settings/account.html  |   4 +
 .../settings/components/lang_picker.html      |  26 ++++
 .../settings/components/privacy_options.html  |  32 +++--
 .../settings/components/profile_options.html  | 115 +++++++-----------
 .../rainbeam/templates/settings/sessions.html |  30 +++--
 langs/en-US.json                              |  53 +++++++-
 13 files changed, 266 insertions(+), 161 deletions(-)
 create mode 100644 crates/rainbeam/templates/settings/components/lang_picker.html

diff --git a/crates/langbeam/src/lib.rs b/crates/langbeam/src/lib.rs
index 37a202e0..b5a071f8 100644
--- a/crates/langbeam/src/lib.rs
+++ b/crates/langbeam/src/lib.rs
@@ -12,7 +12,7 @@ pub struct LangFile {
 impl Default for LangFile {
     fn default() -> Self {
         Self {
-            name: "net.rainbeam.langs:aa-BB".to_string(),
+            name: "net.rainbeam.langs.testing:aa-BB".to_string(),
             version: "0.0.0".to_string(),
             data: HashMap::new(),
         }
diff --git a/crates/rainbeam-core/src/config.rs b/crates/rainbeam-core/src/config.rs
index a9bb42f9..114066bd 100644
--- a/crates/rainbeam-core/src/config.rs
+++ b/crates/rainbeam-core/src/config.rs
@@ -12,7 +12,7 @@ pub struct Tiers {
     ///
     /// * Questions: ~~2048~~ **4096**
     /// * Responses: ~~4096~~ **8192**
-    /// * CommentS: ~~2048~~ **4096**
+    /// * Comments: ~~2048~~ **4096**
     ///
     /// *\*Carpgraph drawings stay at 32kb maximum*
     #[serde(default)]
diff --git a/crates/rainbeam/src/routing/api/util.rs b/crates/rainbeam/src/routing/api/util.rs
index 40b0cfbf..a9bbd290 100644
--- a/crates/rainbeam/src/routing/api/util.rs
+++ b/crates/rainbeam/src/routing/api/util.rs
@@ -4,7 +4,8 @@ use askama_axum::IntoResponse;
 use axum::{
     body::Body,
     extract::{Query, State},
-    routing::get,
+    http::HeaderMap,
+    routing::{get, post},
     Json, Router,
 };
 use serde::{Deserialize, Serialize};
@@ -12,6 +13,7 @@ use serde::{Deserialize, Serialize};
 pub fn routes(database: Database) -> Router {
     Router::new()
         .route("/lang", get(langfile_request))
+        .route("/lang/set", post(set_langfile_request))
         .route("/ext/image", get(external_image_request))
         // ...
         .with_state(database.clone())
@@ -117,3 +119,26 @@ pub async fn langfile_request(
 ) -> impl IntoResponse {
     Json(database.lang(&props.id))
 }
+
+/// Set a langfile
+pub async fn set_langfile_request(Query(props): Query<LangFileQuery>) -> impl IntoResponse {
+    (
+        {
+            let mut headers = HeaderMap::new();
+
+            headers.insert(
+                "Set-Cookie",
+                format!(
+                    "net.rainbeam.langs.choice={}; SameSite=Lax; Secure; Path=/; HostOnly=true; HttpOnly=true; Max-Age={}",
+                    props.id,
+                    60* 60 * 24 * 365
+                )
+                .parse()
+                .unwrap(),
+            );
+
+            headers
+        },
+        "Language changed",
+    )
+}
diff --git a/crates/rainbeam/templates/auth/login.html b/crates/rainbeam/templates/auth/login.html
index 8e6c7520..efd3697a 100644
--- a/crates/rainbeam/templates/auth/login.html
+++ b/crates/rainbeam/templates/auth/login.html
@@ -15,12 +15,14 @@
         ></div>
 
         <div id="forms" class="flex flex-col gap-2 items-center">
-            <h3 class="no-margin">Login</h3>
+            <h3 class="no-margin">{{ text "auth:login.html:title.login" }}</h3>
 
             <div class="card" style="width: 25rem">
                 <form id="login_form" class="flex flex-col gap-2">
                     <div class="row flex flex-col gap-1">
-                        <label for="username">Username</label>
+                        <label for="username"
+                            >{{ text "auth:label.username" }}</label
+                        >
                         <input
                             type="text"
                             name="username"
@@ -32,7 +34,9 @@ <h3 class="no-margin">Login</h3>
                     </div>
 
                     <div class="row flex flex-col gap-1">
-                        <label for="password">Password</label>
+                        <label for="password"
+                            >{{ text "auth:label.password" }}</label
+                        >
                         <input
                             type="password"
                             name="password"
@@ -49,13 +53,17 @@ <h3 class="no-margin">Login</h3>
 
                     <hr />
 
-                    <button class="primary bold">Login</button>
+                    <button class="primary bold">
+                        {{ text "general:link.login" }}
+                    </button>
                 </form>
             </div>
 
             <p>
-                Don't have an account?
-                <a href="/sign_up" data-turbo="false">Sign Up</a>
+                {{ text "auth:login.html:text.no_account" }}
+                <a href="/sign_up" data-turbo="false"
+                    >{{ text "general:link.sign_up" }}</a
+                >
             </p>
         </div>
 
diff --git a/crates/rainbeam/templates/auth/sign_up.html b/crates/rainbeam/templates/auth/sign_up.html
index 8dd1ed12..6d5a7a71 100644
--- a/crates/rainbeam/templates/auth/sign_up.html
+++ b/crates/rainbeam/templates/auth/sign_up.html
@@ -15,12 +15,16 @@
         ></div>
 
         <div id="forms" class="flex flex-col gap-2 items-center">
-            <h3 class="no-margin">Sign Up</h3>
+            <h3 class="no-margin">
+                {{ text "auth:sign_up.html:title.sign_up" }}
+            </h3>
 
             <div class="card" style="width: 25rem">
                 <form id="register_form" class="flex flex-col gap-2">
                     <div class="row flex flex-col gap-1">
-                        <label for="username">Username</label>
+                        <label for="username"
+                            >{{ text "auth:label.username" }}</label
+                        >
                         <input
                             type="text"
                             name="username"
@@ -32,7 +36,9 @@ <h3 class="no-margin">Sign Up</h3>
                     </div>
 
                     <div class="row flex flex-col gap-1">
-                        <label for="password">Password</label>
+                        <label for="password"
+                            >{{ text "auth:label.password" }}</label
+                        >
                         <input
                             type="password"
                             name="password"
@@ -49,13 +55,17 @@ <h3 class="no-margin">Sign Up</h3>
 
                     <hr />
 
-                    <button class="primary bold">Register</button>
+                    <button class="primary bold">
+                        {{ text "general:link.sign_up" }}
+                    </button>
                 </form>
             </div>
 
             <p>
-                Already have an account?
-                <a href="/login" data-turbo="false">Login</a>
+                {{ text "auth:sign_up.html:text.has_account" }}
+                <a href="/login" data-turbo="false"
+                    >{{ text "general:link.login" }}</a
+                >
             </p>
         </div>
 
diff --git a/crates/rainbeam/templates/base.html b/crates/rainbeam/templates/base.html
index d1291172..61d5b388 100644
--- a/crates/rainbeam/templates/base.html
+++ b/crates/rainbeam/templates/base.html
@@ -223,13 +223,13 @@
                             <b class="title">{{ profile.username }}</b>
 
                             <a href="/@{{ profile.username }}">
-                                {{ icon "circle-user-round" }} {{
-                                text "general:link.show_profile" }}
+                                {{ icon "circle-user-round" }} {{ text
+                                "general:link.show_profile" }}
                             </a>
 
                             <a href="/settings">
-                                {{ icon "settings" }} {{
-                                text "general:link.settings" }}
+                                {{ icon "settings" }} {{ text
+                                "general:link.settings" }}
                             </a>
 
                             <b class="title"
@@ -237,18 +237,18 @@
                             >
 
                             <a href="/chats">
-                                {{ icon "message-circle-more" }} {{
-                                text "general:service.chats" }}
+                                {{ icon "message-circle-more" }} {{ text
+                                "general:service.chats" }}
                             </a>
 
                             <a href="/inbox/mail"
-                                >{{ icon "mails" }} {{
-                                text "general:service.mail" }}</a
+                                >{{ icon "mails" }} {{ text
+                                "general:service.mail" }}</a
                             >
 
                             <a href="/circles">
-                                {{ icon "users-round" }} {{
-                                text "general:service.circles" }}
+                                {{ icon "users-round" }} {{ text
+                                "general:service.circles" }}
                             </a>
 
                             <b class="title"
@@ -259,16 +259,16 @@
                                 href="/@{{ profile.username }}/friends"
                                 title="My friends"
                             >
-                                {{ icon "book-user" }} {{
-                                text "general:link.friends" }}
+                                {{ icon "book-user" }} {{ text
+                                "general:link.friends" }}
                             </a>
 
                             <a
                                 href="/@{{ profile.username }}/friends/requests"
                                 title="My friend requests"
                             >
-                                {{ icon "user-round-plus" }} {{
-                                text "general:link.requests" }}
+                                {{ icon "user-round-plus" }} {{ text
+                                "general:link.requests" }}
                             </a>
                             {% else %}
                             <b class="title"
@@ -276,13 +276,13 @@
                             >
 
                             <a href="/login" data-turbo="false">
-                                {{ icon "log-in" }} {{
-                                text "general:link.login" }}
+                                {{ icon "log-in" }} {{ text "general:link.login"
+                                }}
                             </a>
 
                             <a href="/sign_up" data-turbo="false">
-                                {{ icon "user-round-plus" }} {{
-                                text "base.html:link.sign_up" }}
+                                {{ icon "user-round-plus" }} {{ text
+                                "general:link.sign_up" }}
                             </a>
                             {% endif %}
 
@@ -290,19 +290,19 @@
                             <b class="title">{{ config.name }}</b>
 
                             <a href="/site/about">
-                                {{ icon "info" }} {{
-                                text "base.html:link.about" }}
+                                {{ icon "info" }} {{ text "base.html:link.about"
+                                }}
                             </a>
 
                             <a href="https://swmff.github.io/rainbeam/">
-                                {{ icon "book" }} {{
-                                text "base.html:link.reference" }}
+                                {{ icon "book" }} {{ text
+                                "base.html:link.reference" }}
                             </a>
 
                             <!-- ... -->
                             <a href="/search">
-                                {{ icon "search" }} {{
-                                text "general:link.search" }}
+                                {{ icon "search" }} {{ text
+                                "general:link.search" }}
                             </a>
 
                             {% if profile.is_some() %}
@@ -312,8 +312,8 @@
                                 onclick="trigger('app:logout')"
                                 class="red"
                             >
-                                {{ icon "log-out" }} {{
-                                text "base.html:link.sign_out" }}
+                                {{ icon "log-out" }} {{ text
+                                "base.html:link.sign_out" }}
                             </a>
                             {% endif %}
                         </div>
@@ -388,13 +388,12 @@
                         <b class="header">Actions</b>
 
                         <a href="/intents/post" class="button camo">
-                            {{ icon "square-pen" }} {{
-                            text "general:link.post" }}
+                            {{ icon "square-pen" }} {{ text "general:link.post"
+                            }}
                         </a>
 
                         <a href="/search" class="button camo">
-                            {{ icon "search" }} {{
-                            text "general:link.search" }}
+                            {{ icon "search" }} {{ text "general:link.search" }}
                         </a>
                     </section>
 
@@ -402,13 +401,12 @@
                         <b class="header">Services</b>
 
                         <a href="/chats" class="button camo">
-                            {{ icon "message-circle-more" }} {{
-                            text "general:service.chats" }}
+                            {{ icon "message-circle-more" }} {{ text
+                            "general:service.chats" }}
                         </a>
 
                         <a href="/inbox/mail" class="button camo">
-                            {{ icon "mails" }} {{
-                            text "general:service.mail" }}
+                            {{ icon "mails" }} {{ text "general:service.mail" }}
                         </a>
                     </section>
                     {% endif %}
@@ -417,16 +415,15 @@
                         <b class="header">Site</b>
 
                         <a href="/site/about" class="button camo">
-                            {{ icon "info" }} {{
-                            text "base.html:link.about" }}
+                            {{ icon "info" }} {{ text "base.html:link.about" }}
                         </a>
 
                         <a
                             href="https://github.com/swmff/rainbeam"
                             class="button camo"
                         >
-                            {{ icon "code" }} {{
-                            text "base.html:link.source_code" }}
+                            {{ icon "code" }} {{ text
+                            "base.html:link.source_code" }}
                         </a>
                     </section>
                 </div>
@@ -553,8 +550,8 @@
                                 onclick="globalThis.web_api_prompt_submit(document.getElementById('prompt').value); document.getElementById('prompt').value = ''"
                                 type="buton"
                             >
-                                {{ icon "check" }} {{
-                                text "general:dialog.okay" }}
+                                {{ icon "check" }} {{ text "general:dialog.okay"
+                                }}
                             </button>
 
                             <button
@@ -563,8 +560,8 @@
                                 type="button"
                                 title="Close"
                             >
-                                {{ icon "x" }} {{
-                                text "general:dialog.cancel" }}
+                                {{ icon "x" }} {{ text "general:dialog.cancel"
+                                }}
                             </button>
                         </div>
                     </div>
@@ -590,8 +587,8 @@
                                 onclick="globalThis.web_api_confirm_submit(true)"
                                 type="buton"
                             >
-                                {{ icon "check" }} {{
-                                text "general:dialog.yes" }}
+                                {{ icon "check" }} {{ text "general:dialog.yes"
+                                }}
                             </button>
 
                             <button
@@ -600,8 +597,7 @@
                                 type="button"
                                 title="Close"
                             >
-                                {{ icon "x" }} {{ text "general:dialog.no"
-                                }}
+                                {{ icon "x" }} {{ text "general:dialog.no" }}
                             </button>
                         </div>
                     </div>
diff --git a/crates/rainbeam/templates/homepage.html b/crates/rainbeam/templates/homepage.html
index 39c84883..ba07e562 100644
--- a/crates/rainbeam/templates/homepage.html
+++ b/crates/rainbeam/templates/homepage.html
@@ -28,8 +28,8 @@ <h3 style="font-weight: normal; margin-top: 0">
                 data-turbo="false"
                 style="gap: 1rem !important"
             >
-                {{ icon "user-round-plus" }} {{
-                text "homepage.html:link.create_account" }}
+                {{ icon "user-round-plus" }} {{ text
+                "homepage.html:link.create_account" }}
             </a>
 
             <a
@@ -40,6 +40,8 @@ <h3 style="font-weight: normal; margin-top: 0">
             >
                 {{ icon "smile" }} {{ text "general:link.login" }}
             </a>
+
+            {% include "settings/components/lang_picker.html" %}
         </div>
     </div>
 </main>
diff --git a/crates/rainbeam/templates/settings/account.html b/crates/rainbeam/templates/settings/account.html
index bf1730b7..d0a7d00e 100644
--- a/crates/rainbeam/templates/settings/account.html
+++ b/crates/rainbeam/templates/settings/account.html
@@ -6,6 +6,10 @@
 {% endblock %} {% block panel %}
 
 <div class="flex flex-col gap-4">
+    <h4 class="title">{{ text "settings:account.html:title.language" }}</h4>
+
+    {% include "components/lang_picker.html" %}
+
     <h4 class="title">
         {{ text "settings:account.html:title.local_theming" }}
     </h4>
diff --git a/crates/rainbeam/templates/settings/components/lang_picker.html b/crates/rainbeam/templates/settings/components/lang_picker.html
new file mode 100644
index 00000000..66c9769c
--- /dev/null
+++ b/crates/rainbeam/templates/settings/components/lang_picker.html
@@ -0,0 +1,26 @@
+<select
+    name="language"
+    id="language"
+    onchange="set_language(event.target.options[event.target.selectedIndex].value)"
+>
+    <option value="net.rainbeam.langs:en-US">🇺🇸 en-US</option>
+    <option value="net.rainbeam.langs.testing:aa-BB">🏁 aa-BB (debug)</option>
+</select>
+
+<script>
+    function fill_language() {
+        document
+            .querySelector('option[value="{{ lang.name }}"]')
+            .setAttribute("selected", "true");
+    }
+
+    fill_language();
+
+    async function set_language(lang) {
+        fetch(`/api/v0/util/lang/set?id=${lang}`, { method: "POST" }).then(
+            () => {
+                window.location.reload();
+            },
+        );
+    }
+</script>
diff --git a/crates/rainbeam/templates/settings/components/privacy_options.html b/crates/rainbeam/templates/settings/components/privacy_options.html
index 4b61faef..2ab6d950 100644
--- a/crates/rainbeam/templates/settings/components/privacy_options.html
+++ b/crates/rainbeam/templates/settings/components/privacy_options.html
@@ -1,5 +1,7 @@
 <div class="flex flex-col gap-4">
-    <h4 class="title">General Privacy</h4>
+    <h4 class="title">
+        {{ text "settings:privacy_options.html:title.general_privacy" }}
+    </h4>
     <div class="flex flex-col gap-1">
         <div class="checkbox_container">
             <input
@@ -10,7 +12,8 @@ <h4 class="title">General Privacy</h4>
             />
 
             <label for="sparkler:lock_profile" class="normal">
-                Disable questions
+                {{ text "settings:privacy_options.html:label.disable_questions"
+                }}
             </label>
         </div>
 
@@ -28,7 +31,8 @@ <h4 class="title">General Privacy</h4>
         />
 
         <label for="sparkler:disallow_anonymous" class="normal">
-            Disallow anonymous questions on your profile
+            {{ text
+            "settings:privacy_options.html:label.disable_anonymous_questions" }}
         </label>
     </div>
 
@@ -42,7 +46,9 @@ <h4 class="title">General Privacy</h4>
             />
 
             <label for="sparkler:disallow_anonymous_comments" class="normal">
-                Disallow anonymous comments on your responses
+                {{ text
+                "settings:privacy_options.html:label.disable_anonymous_comments"
+                }}
             </label>
         </div>
     </div>
@@ -56,7 +62,7 @@ <h4 class="title">General Privacy</h4>
         />
 
         <label for="sparkler:require_account" class="normal">
-            Require an account to ask questions on your profile
+            {{ text "settings:privacy_options.html:label.require_account" }}
         </label>
     </div>
 
@@ -69,13 +75,18 @@ <h4 class="title">General Privacy</h4>
         />
 
         <label for="sparkler:private_social" class="normal">
-            Keep your socials private (followers/following)
+            {{ text "settings:privacy_options.html:label.keep_socials_private"
+            }}
         </label>
     </div>
 
-    <h4 class="title">Moderation</h4>
+    <h4 class="title">
+        {{ text "settings:privacy_options.html:title.moderation" }}
+    </h4>
     <div class="flex flex-col gap-1">
-        <label for="sparkler:filter">Filter</label>
+        <label for="sparkler:filter"
+            >{{ text "settings:privacy_options.html:label.filter" }}</label
+        >
 
         <textarea
             name="sparkler:filter"
@@ -84,10 +95,7 @@ <h4 class="title">Moderation</h4>
         ></textarea>
 
         <p class="fade">
-            A list of strings that are not allowed in questions asked to you.
-            Each different string
-            <b>must</b>
-            be on a new line.
+            {{ text "settings:privacy_options.html:text.filter" }}
         </p>
     </div>
 </div>
diff --git a/crates/rainbeam/templates/settings/components/profile_options.html b/crates/rainbeam/templates/settings/components/profile_options.html
index 66170203..e8975008 100644
--- a/crates/rainbeam/templates/settings/components/profile_options.html
+++ b/crates/rainbeam/templates/settings/components/profile_options.html
@@ -1,7 +1,11 @@
 <div class="flex flex-col gap-4">
-    <h4 class="title">About Me</h4>
+    <h4 class="title">
+        {{ text "settings:profile_options.html:title.about_me" }}
+    </h4>
     <div class="flex flex-col gap-1">
-        <label for="sparkler:display_name">Display name</label>
+        <label for="sparkler:display_name">
+            {{ text "settings:profile_options.html:label.display_name" }}
+        </label>
 
         <input
             name="sparkler:display_name"
@@ -16,21 +20,8 @@ <h4 class="title">About Me</h4>
     </div>
 
     <div class="flex flex-col gap-1">
-        <label for="sparkler:biography" class="flex gap-2 items-center"
-            >Biography
-            <svg
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 16 16"
-                width="16"
-                height="16"
-                title="Supports Markdown formatting"
-                aria-label="Markdown logo"
-                class="icon"
-            >
-                <path
-                    d="M14.85 3c.63 0 1.15.52 1.14 1.15v7.7c0 .63-.51 1.15-1.15 1.15H1.15C.52 13 0 12.48 0 11.84V4.15C0 3.52.52 3 1.15 3ZM9 11V5H7L5.5 7 4 5H2v6h2V8l1.5 1.92L7 8v3Zm2.99.5L14.5 8H13V5h-2v3H9.5Z"
-                ></path>
-            </svg>
+        <label for="sparkler:biography" class="flex gap-2 items-center">
+            {{ text "settings:profile_options.html:label.biography" }}
         </label>
 
         <textarea
@@ -43,21 +34,8 @@ <h4 class="title">About Me</h4>
     </div>
 
     <div class="flex flex-col gap-1">
-        <label for="sparkler:sidebar" class="flex gap-2 items-center"
-            >Sidebar
-            <svg
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 16 16"
-                width="16"
-                height="16"
-                title="Supports Markdown formatting"
-                aria-label="Markdown logo"
-                class="icon"
-            >
-                <path
-                    d="M14.85 3c.63 0 1.15.52 1.14 1.15v7.7c0 .63-.51 1.15-1.15 1.15H1.15C.52 13 0 12.48 0 11.84V4.15C0 3.52.52 3 1.15 3ZM9 11V5H7L5.5 7 4 5H2v6h2V8l1.5 1.92L7 8v3Zm2.99.5L14.5 8H13V5h-2v3H9.5Z"
-                ></path>
-            </svg>
+        <label for="sparkler:sidebar" class="flex gap-2 items-center">
+            {{ text "settings:profile_options.html:label.sidebar" }}
         </label>
 
         <textarea
@@ -75,7 +53,9 @@ <h4 class="title">About Me</h4>
 
     <h4 class="title">Images</h4>
     <div class="flex flex-col gap-1">
-        <label for="sparkler:avatar_url">Avatar URL</label>
+        <label for="sparkler:avatar_url">
+            {{ text "settings:profile_options.html:label.avatar_url" }}
+        </label>
 
         <input
             type="url"
@@ -92,7 +72,9 @@ <h4 class="title">Images</h4>
     </div>
 
     <div class="flex flex-col gap-1">
-        <label for="sparkler:banner_url">Banner URL</label>
+        <label for="sparkler:banner_url">
+            {{ text "settings:profile_options.html:label.banner_url" }}
+        </label>
 
         <input
             type="url"
@@ -108,7 +90,9 @@ <h4 class="title">Images</h4>
     </div>
 
     <div class="flex flex-col gap-1">
-        <label for="sparkler:banner_fit">Banner fit</label>
+        <label for="sparkler:banner_fit">
+            {{ text "settings:profile_options.html:label.banner_fit" }}
+        </label>
 
         <select
             type="url"
@@ -127,7 +111,10 @@ <h4 class="title">Images</h4>
     </div>
 
     <div class="flex flex-col gap-1">
-        <label for="sparkler:desktop_tl_logo">(desktop) Top-left Logo</label>
+        <label for="sparkler:desktop_tl_logo">
+            {{ text "settings:profile_options.html:label.desktop_top_left_logo"
+            }}
+        </label>
 
         <input
             type="url"
@@ -141,25 +128,15 @@ <h4 class="title">Images</h4>
         </p>
     </div>
 
-    <h4 class="title">Greetings</h4>
+    <h4 class="title">
+        {{ text "settings:profile_options.html:title.greetings" }}
+    </h4>
     <div class="flex flex-col gap-1">
         <label
             for="sparkler:motivational_header"
             class="flex gap-2 items-center"
-            >Motivational header
-            <svg
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 16 16"
-                width="16"
-                height="16"
-                title="Supports Markdown formatting"
-                aria-label="Markdown logo"
-                class="icon"
-            >
-                <path
-                    d="M14.85 3c.63 0 1.15.52 1.14 1.15v7.7c0 .63-.51 1.15-1.15 1.15H1.15C.52 13 0 12.48 0 11.84V4.15C0 3.52.52 3 1.15 3ZM9 11V5H7L5.5 7 4 5H2v6h2V8l1.5 1.92L7 8v3Zm2.99.5L14.5 8H13V5h-2v3H9.5Z"
-                ></path>
-            </svg>
+        >
+            {{ text "settings:profile_options.html:label.motivational_header" }}
         </label>
 
         <input
@@ -175,21 +152,8 @@ <h4 class="title">Greetings</h4>
     </div>
 
     <div class="flex flex-col gap-1">
-        <label for="sparkler:warning" class="flex gap-2 items-center"
-            >Profile warning
-            <svg
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 16 16"
-                width="16"
-                height="16"
-                title="Supports Markdown formatting"
-                aria-label="Markdown logo"
-                class="icon"
-            >
-                <path
-                    d="M14.85 3c.63 0 1.15.52 1.14 1.15v7.7c0 .63-.51 1.15-1.15 1.15H1.15C.52 13 0 12.48 0 11.84V4.15C0 3.52.52 3 1.15 3ZM9 11V5H7L5.5 7 4 5H2v6h2V8l1.5 1.92L7 8v3Zm2.99.5L14.5 8H13V5h-2v3H9.5Z"
-                ></path>
-            </svg>
+        <label for="sparkler:warning" class="flex gap-2 items-center">
+            {{ text "settings:profile_options.html:label.profile_warning" }}
         </label>
 
         <textarea
@@ -205,9 +169,13 @@ <h4 class="title">Greetings</h4>
         </p>
     </div>
 
-    <h4 class="title">Anonymous</h4>
+    <h4 class="title">
+        {{ text "settings:profile_options.html:title.anonymous" }}
+    </h4>
     <div class="flex flex-col gap-1">
-        <label for="sparkler:anonymous_username">Anonymous username</label>
+        <label for="sparkler:anonymous_username">
+            {{ text "settings:profile_options.html:title.anonymous_username" }}
+        </label>
 
         <input
             name="sparkler:anonymous_username"
@@ -222,7 +190,10 @@ <h4 class="title">Anonymous</h4>
     </div>
 
     <div class="flex flex-col gap-1">
-        <label for="sparkler:anonymous_avatar">Anonymous avatar URL</label>
+        <label for="sparkler:anonymous_avatar">
+            {{ text "settings:profile_options.html:label.anonymous_avatar_url"
+            }}
+        </label>
 
         <input
             type="url"
@@ -237,9 +208,11 @@ <h4 class="title">Anonymous</h4>
         </p>
     </div>
 
-    <h4 class="title">Feed</h4>
+    <h4 class="title">{{ text "settings:profile_options.html:title.feed" }}</h4>
     <div class="flex flex-col gap-1">
-        <label for="sparkler:pinned">Pinned</label>
+        <label for="sparkler:pinned">
+            {{ text "settings:profile_options.html:label.pinned" }}
+        </label>
 
         <textarea
             name="sparkler:pinned"
diff --git a/crates/rainbeam/templates/settings/sessions.html b/crates/rainbeam/templates/settings/sessions.html
index 75291705..66f1a859 100644
--- a/crates/rainbeam/templates/settings/sessions.html
+++ b/crates/rainbeam/templates/settings/sessions.html
@@ -12,16 +12,20 @@
         id="manage_sessions"
         style="overflow: auto"
     >
-        <h4 class="title">My Sessions</h4>
+        <h4 class="title">
+            {{ text "settings:sessions.html:title.sessions" }}
+        </h4>
 
         <table>
             <thead>
                 <tr>
-                    <th>Tag</th>
+                    <th>{{ text "settings:sessions.html:label.tag" }}</th>
                     <th>IP</th>
-                    <th>App</th>
-                    <th>Permissions</th>
-                    <th>Actions</th>
+                    <th>{{ text "settings:sessions.html:label.app" }}</th>
+                    <th>
+                        {{ text "settings:sessions.html:label.permissions" }}
+                    </th>
+                    <th>{{ text "settings:sessions.html:label.actions" }}</th>
                 </tr>
             </thead>
 
@@ -31,9 +35,9 @@ <h4 class="title">My Sessions</h4>
                 <tr id="session:{{ session }}" title="{{ session[..10] }}">
                     <td style="white-space: nowrap">
                         {% if current_session == session.to_owned() %}
-                        <span class="notification marker">Active</span>
+                        <span class="notification marker">{{ text "settings:sessions.html:text.active" }}</span>
                         {% else %}
-                        <span class="tag">None</span>
+                        <span class="tag">{{ text "settings:sessions.html:text.none" }}</span>
                         {% endif %}
                     </td>
 
@@ -41,7 +45,7 @@ <h4 class="title">My Sessions</h4>
                     {% if let Some(ip) = profile.ips.get(i.to_owned()) %}
                     <td style="white-space: nowrap">
                         {% if ip.is_empty() %}
-                        <span class="tag">None</span>
+                        <span class="tag">{{ text "settings:sessions.html:text.none" }}</span>
                         {% else %}
                         {{ ip }}
                         {% endif %}
@@ -54,14 +58,14 @@ <h4 class="title">My Sessions</h4>
                     <td style="white-space: nowrap">
                         {% let name = ctx.app_name() %}
                         {% if name.is_empty() %}
-                        <span class="tag">None</span>
+                        <span class="tag">{{ text "settings:sessions.html:text.none" }}</span>
                         {% else %}
                         {{ name }}
                         {% endif %}
                     </td>
                     {% else %}
                     <td style="white-space: nowrap">
-                        <span class="tag">None</span>
+                        <span class="tag">{{ text "settings:sessions.html:text.none" }}</span>
                     </td>
                     {% endif %}
 
@@ -75,7 +79,7 @@ <h4 class="title">My Sessions</h4>
                     {% if let Some(permissions) = ctx.permissions %}
                     <td style="white-space: nowrap">
                         {% if permissions.is_empty() %}
-                        <span class="tag">None</span>
+                        <span class="tag">{{ text "settings:sessions.html:text.none" }}</span>
                         {% else %}
                         <ul>
                             {% for permission in permissions %}
@@ -88,7 +92,7 @@ <h4 class="title">My Sessions</h4>
                     </td>
                     {% else %}
                     <td style="white-space: nowrap">
-                        <span class="tag">All</span>
+                        <span class="tag">{{ text "settings:sessions.html:text.all" }}</span>
                     </td>
                     {% endif %}
 
@@ -102,7 +106,7 @@ <h4 class="title">My Sessions</h4>
 
                     <td>
                         <a href="javascript:remove_session('{{ session }}')"
-                            >Delete</a
+                            >{{ text "general:action.delete" }}</a
                         >
                     </td>
                 </tr>
diff --git a/langs/en-US.json b/langs/en-US.json
index 853b9060..fe0be766 100644
--- a/langs/en-US.json
+++ b/langs/en-US.json
@@ -6,7 +6,6 @@
         "general:link.settings": "Settings",
         "general:link.friends": "Friends",
         "general:link.requests": "Requests",
-        "general:link.login": "Login",
         "general:link.search": "Search",
         "general:link.more": "More",
         "general:link.chat": "Chat",
@@ -16,6 +15,9 @@
         "general:link.previous": "Previous",
         "general:link.next": "Next",
 
+        "general:link.login": "Login",
+        "general:link.sign_up": "Sign up",
+
         "general:link.timeline": "Timeline",
         "general:link.home": "Home",
         "general:link.inbox": "Inbox",
@@ -53,7 +55,6 @@
         "base.html:link.about": "About",
         "base.html:link.reference": "Reference",
         "base.html:link.source_code": "Source code",
-        "base.html:link.sign_up": "Sign up",
         "base.html:link.sign_out": "Sign out",
 
         "homepage.html:link.create_account": "Create account",
@@ -61,6 +62,13 @@
         "error.html:link.uh_oh": "Uh oh.",
         "error.html:link.go_home": "Go home",
 
+        "auth:label.username": "Username",
+        "auth:label.password": "Password",
+        "auth:login.html:title.login": "Login",
+        "auth:login.html:text.no_account": "Don't have an account?",
+        "auth:sign_up.html:title.sign_up": "Sign up",
+        "auth:sign_up.html:text.has_account": "Already have an account?",
+
         "profile:link.followers": "Followers",
         "profile:link.following": "Following",
 
@@ -129,6 +137,7 @@
         "settings:text.dark": "Dark",
         "settings:text.midnight": "Midnight",
 
+        "settings:account.html:title.language": "Language",
         "settings:account.html:title.local_theming": "Local themeing",
         "settings:account.html:label.website_theme": "Website theme",
         "settings:account.html:label.allow_profile_themes": "Allow profile themes",
@@ -171,6 +180,46 @@
         "settings:account.html:text.status_emoji": "Your status emoji is shown in place of the default thought balloon.",
         "settings:account.html:text.signature": "Your signature is automatically appended to mail sent from your account.",
 
+        "settings:profile_options.html:title.about_me": "About me",
+        "settings:profile_options.html:label.display_name": "Display name",
+        "settings:profile_options.html:label.biography": "Biography",
+        "settings:profile_options.html:label.sidebar": "Sidebar",
+        "settings:profile_options.html:label.avatar_url": "Avatar URL",
+        "settings:profile_options.html:label.banner_url": "Banner URL",
+        "settings:profile_options.html:label.banner_fit": "Banner fit",
+        "settings:profile_options.html:label.desktop_top_left_logo": "(desktop) Top-left logo",
+
+        "settings:profile_options.html:title.greetings": "Greetings",
+        "settings:profile_options.html:label.motivational_header": "Motivational header",
+        "settings:profile_options.html:label.profile_warning": "Profile warning",
+
+        "settings:profile_options.html:title.anonymous": "Anonymous",
+        "settings:profile_options.html:label.anonymous_username": "Anonymous username",
+        "settings:profile_options.html:label.anonymous_avatar_url": "Anonymous avatar URL",
+
+        "settings:profile_options.html:title.feed": "feed",
+        "settings:profile_options.html:label.pinned": "Pinned",
+
+        "settings:privacy_options.html:title.general_privacy": "General privacy",
+        "settings:privacy_options.html:label.disable_questions": "Disable questions",
+        "settings:privacy_options.html:label.disable_anonymous_questions": "Disallow anonymous questions on your profile",
+        "settings:privacy_options.html:label.disable_anonymous_comments": "Disallow anonymous comments on your responses",
+        "settings:privacy_options.html:label.require_account": "Require an account to ask questions on your profile",
+        "settings:privacy_options.html:label.keep_socials_private": "Keep your socials private (followers/following)",
+
+        "settings:privacy_options.html:title.moderation": "Moderation",
+        "settings:privacy_options.html:label.filter": "Filter",
+        "settings:privacy_options.html:text.filter": "A list of strings that are not allowed in questions asked to you. Each different string must be on a new line.",
+
+        "settings:sessions.html:title.sessions": "My sessions",
+        "settings:sessions.html:label.tag": "Tag",
+        "settings:sessions.html:label.app": "App",
+        "settings:sessions.html:label.permissions": "Permisisons",
+        "settings:sessions.html:label.actions": "Actions",
+        "settings:sessions.html:text.active": "Active",
+        "settings:sessions.html:text.none": "None",
+        "settings:sessions.html:text.all": "All",
+
         "chats:chat.html:action.change_name": "Change name",
         "chats:chat.html:action.add_friend": "Add friend",
         "chats:chat.html:action.leave": "Leave",