From edaa647b9e3064f03caebceaade1a8426abf4a9d Mon Sep 17 00:00:00 2001
From: Andrew Beal <andrew.business@tuta.com>
Date: Sat, 8 Nov 2025 13:48:39 +0000
Subject: [PATCH] feat: add help modal topic titles and improve layout

- Add titles for About, Plugin Guide, Troubleshooting, and Privacy sections
- Limit topic sidebar width to 150px with text truncation for long labels
- Apply ellipsis overflow handling to prevent layout breaking
---
 Enums/Copy.ts                 | 8 ++++----
 Modals/HelpModalSvelte.svelte | 5 +++++
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/Enums/Copy.ts b/Enums/Copy.ts
index e1f752c..0b3e966 100644
--- a/Enums/Copy.ts
+++ b/Enums/Copy.ts
@@ -27,16 +27,16 @@ export enum Copy {
     GPT_4_1_Mini = "GPT-4.1 Mini",
     GPT_4_1_Nano = "GPT-4.1 Nano",
 
-    HelpModalAboutTitle = "",
+    HelpModalAboutTitle = "About",
     HelpModalAboutContent = "",
 
-    HelpModalGuideTitle = "",
+    HelpModalGuideTitle = "Plugin Guide",
     HelpModalGuideContent = "",
 
-    HelpModalTroubleshootTitle = "",
+    HelpModalTroubleshootTitle = "Troubleshooting",
     HelpModalTroubleshootContent = "",
 
-    HelpModalPrivacyTitle = "",
+    HelpModalPrivacyTitle = "Privacy",
     HelpModalPrivacyContent = "",
 
     EXAMPLE_USER_INSTRUCTION = `### TL;DR
diff --git a/Modals/HelpModalSvelte.svelte b/Modals/HelpModalSvelte.svelte
index 7c23470..92ddfc5 100644
--- a/Modals/HelpModalSvelte.svelte
+++ b/Modals/HelpModalSvelte.svelte
@@ -224,12 +224,17 @@
 		grid-row: 1 / 9;
 		grid-column: 1;
 		display: grid;
+		max-width: 150px;
 		grid-template-rows: auto var(--size-4-3) auto var(--size-4-3) auto var(--size-4-3) auto 1fr;
 		grid-template-columns: auto var(--size-4-2) 1fr;
 	}
 
 	.help-modal-topic-item {
 		grid-column: 1;
+		display: inline-block;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
 		padding: var(--size-4-1) var(--size-4-3);
 		cursor: pointer;
 		transition: color 0.15s ease-in-out;