From b8569ea243a6db2c9d6a0a1a700f8cf439758317 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sun, 27 Oct 2024 21:51:56 +0200
Subject: [PATCH] client, server: Create option to control word wrapping for
 code blocks

---
 .../type_widgets/options/appearance/code_block.js     | 11 +++++++++++
 src/routes/api/options.ts                             |  1 +
 src/services/options_init.ts                          |  4 +++-
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/public/app/widgets/type_widgets/options/appearance/code_block.js b/src/public/app/widgets/type_widgets/options/appearance/code_block.js
index 2a371938d..388f902dd 100644
--- a/src/public/app/widgets/type_widgets/options/appearance/code_block.js
+++ b/src/public/app/widgets/type_widgets/options/appearance/code_block.js
@@ -23,6 +23,13 @@ const TPL = `
             <label>${t("highlighting.color-scheme")}</label>
             <select class="theme-select form-select"></select>
         </div>
+
+        <div class="col-6">
+            <label>Word wrapping</label>
+            <div class="form-check">
+                <input type="checkbox" class="word-wrap form-check-input" />
+            </div>
+        </div>
     </div>
 
     <div class="form-group row">
@@ -51,6 +58,9 @@ export default class CodeBlockOptions extends OptionsWidget {
             library_loader.loadHighlightingTheme(newTheme);
             await server.put(`options/codeBlockTheme/${newTheme}`);
         });
+        
+        this.$wordWrap = this.$widget.find(".word-wrap");
+        this.$wordWrap.on("change", () => this.updateCheckboxOption("codeBlockWordWrap", this.$wordWrap));
 
         // Set up preview
         const sampleEl = this.$widget.find(".code-sample");
@@ -74,5 +84,6 @@ export default class CodeBlockOptions extends OptionsWidget {
                 .text(theme.title));
         }
         this.$themeSelect.val(options.codeBlockTheme);
+        this.setCheckboxState(this.$wordWrap, options.codeBlockWordWrap);
     }
 }
\ No newline at end of file
diff --git a/src/routes/api/options.ts b/src/routes/api/options.ts
index d028e7c0e..227d5c8af 100644
--- a/src/routes/api/options.ts
+++ b/src/routes/api/options.ts
@@ -17,6 +17,7 @@ const ALLOWED_OPTIONS = new Set([
     'zoomFactor',
     'theme',
     'codeBlockTheme',
+    "codeBlockWordWrap",
     'syncServerHost',
     'syncServerTimeout',
     'syncProxy',
diff --git a/src/services/options_init.ts b/src/services/options_init.ts
index f649b4e05..a9743ac0b 100644
--- a/src/services/options_init.ts
+++ b/src/services/options_init.ts
@@ -100,7 +100,9 @@ const defaultOptions: DefaultOption[] = [
 
     // Internationalization
     { name: 'locale', value: 'en', isSynced: true },
-    { name: 'firstDayOfWeek', value: '1', isSynced: true }    
+    { name: 'firstDayOfWeek', value: '1', isSynced: true },
+
+    { name: "codeBlockWordWrap", value: "false", isSynced: true }
 ];
 
 function initStartupOptions() {