Merge pull request #485 from pastemyst/feat/default_lang

feat: default language setting
pastemyst · May 31, 2024 · a8b7d23 · a8b7d23
2 parents b090d3a + e729b99
commit a8b7d23
Show file tree

Hide file tree

Showing 4 changed files with 92 additions and 21 deletions.
diff --git a/api/Models/Settings.cs b/api/Models/Settings.cs
@@ -2,6 +2,7 @@ namespace pastemyst.Models;
 
 public class Settings
 {
+    public string DefaultLanguage { get; set; } = "Text";
     public string DefaultIndentationUnit { get; set; } = "spaces";
     public uint DefaultIndentationWidth { get; set; } = 4;
 }
diff --git a/client/src/lib/Editor.svelte b/client/src/lib/Editor.svelte
@@ -38,31 +38,29 @@
 
     let langs: Language[];
 
-    onMount(() => {
-        (async () => {
-            langs = await getLangs(fetch);
+    onMount(async () => {
+        langs = await getLangs(fetch);
 
-            const popularLangs = await getPopularLangNames(fetch);
+        const popularLangs = await getPopularLangNames(fetch);
 
-            // make sure popular languages are at the top
-            langs.sort((a, b) => {
-                const aPopular = popularLangs.includes(a.name) ? 1 : 0;
-                const bPopular = popularLangs.includes(b.name) ? 1 : 0;
+        // make sure popular languages are at the top
+        langs.sort((a, b) => {
+            const aPopular = popularLangs.includes(a.name) ? 1 : 0;
+            const bPopular = popularLangs.includes(b.name) ? 1 : 0;
 
-                return bPopular - aPopular;
-            });
+            return bPopular - aPopular;
+        });
 
-            const textLangIndex = langs.findIndex((l) => l.name === "Text");
-            const textLang = langs[textLangIndex];
+        const textLangIndex = langs.findIndex((l) => l.name === "Text");
+        const textLang = langs[textLangIndex];
 
-            // place text on the top of the lang list
-            langs.splice(textLangIndex, 1);
-            langs.unshift(textLang);
+        // place text on the top of the lang list
+        langs.splice(textLangIndex, 1);
+        langs.unshift(textLang);
 
-            if (!selectedLanguage) {
-                selectedLanguage = textLang;
-            }
-        })();
+        if (!selectedLanguage) {
+            selectedLanguage = textLang;
+        }
 
         selectedIndentUnit = $settingsStore.defaultIndentationUnit;
         selectedIndentWidth = $settingsStore.defaultIndentationWidth;
@@ -92,6 +90,10 @@
             parent: editorElement
         });
 
+        const settingsLang =
+            langs.find((l) => l.name === $settingsStore.defaultLanguage) || textLang;
+        setSelectedLang(settingsLang);
+
         setEditorIndentation();
 
         focus();

diff --git a/client/src/lib/api/settings.ts b/client/src/lib/api/settings.ts
@@ -10,11 +10,13 @@ export interface UserSettings {
 }
 
 export interface Settings {
+    defaultLanguage: string;
     defaultIndentationUnit: IndentUnit;
     defaultIndentationWidth: number;
 }
 
 export const defaultSettings: Settings = {
+    defaultLanguage: "Text",
     defaultIndentationUnit: "spaces",
     defaultIndentationWidth: 4
 };
@@ -24,7 +26,19 @@ export const getLocalSettings = (): Settings => {
 
     if (!settings) return defaultSettings;
 
-    return JSON.parse(settings) as Settings;
+    const settingsObj = JSON.parse(settings) as Settings;
+
+    // if there are any undefined settings set them to default
+    // this can happen if new settings are added over time
+    // but the localstorage settings doesn't contain the new settings
+    let setting: keyof typeof settingsObj;
+    for (setting in defaultSettings) {
+        if (!settingsObj[setting]) {
+            settingsObj[setting] = defaultSettings[setting] as never;
+        }
+    }
+
+    return settingsObj;
 };
 
 export const updateSettings = async (

diff --git a/client/src/routes/settings/behaviour/+page.svelte b/client/src/routes/settings/behaviour/+page.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+    import { getLangs, getPopularLangNames } from "$lib/api/lang";
     import { getLocalSettings, updateSettings } from "$lib/api/settings";
     import { Close, setTempCommands, type Command } from "$lib/command";
     import { cmdPalOpen, cmdPalTitle, settingsContextStore } from "$lib/stores";
@@ -57,6 +58,52 @@
         return commands;
     };
 
+    const getLanguageCommands = async (): Promise<Command[]> => {
+        const commands: Command[] = [];
+
+        const langs = await getLangs(fetch);
+
+        const popularLangs = await getPopularLangNames(fetch);
+
+        // make sure popular languages are at the top
+        langs.sort((a, b) => {
+            const aPopular = popularLangs.includes(a.name) ? 1 : 0;
+            const bPopular = popularLangs.includes(b.name) ? 1 : 0;
+
+            return bPopular - aPopular;
+        });
+
+        const textLangIndex = langs.findIndex((l) => l.name === "Text");
+        const textLang = langs[textLangIndex];
+
+        // place text on the top of the lang list
+        langs.splice(textLangIndex, 1);
+        langs.unshift(textLang);
+
+        for (const lang of langs) {
+            commands.push({
+                name: lang.name,
+                description: lang.aliases?.join(", "),
+                action: () => {
+                    settings.defaultLanguage = lang.name;
+
+                    updateSettings(fetch, $settingsContextStore, settings);
+
+                    return Close.yes;
+                }
+            });
+        }
+
+        return commands;
+    };
+
+    const onDefaultLanguageClicked = async () => {
+        setTempCommands(await getLanguageCommands());
+
+        cmdPalTitle.set("select language");
+        cmdPalOpen.set(true);
+    };
+
     const onDefaultIndentationClicked = () => {
         setTempCommands(getIndentUnitCommands());
 
@@ -75,14 +122,21 @@
 
 <h4>editor</h4>
 
+<div class="flex row center gap-s">
+    <p>default language:</p>
+    <button on:click={onDefaultLanguageClicked}>{settings.defaultLanguage}</button>
+</div>
+
+<span class="hint">set the default language for the text editor</span>
+
 <div class="flex row center gap-s">
     <p>default indentation:</p>
     <button on:click={onDefaultIndentationClicked}
         >{settings.defaultIndentationUnit}: {settings.defaultIndentationWidth}</button
     >
 </div>
 
-<span class="hint"> set the default indentation unit and width for the text editor </span>
+<span class="hint">set the default indentation unit and width for the text editor</span>
 
 <style lang="scss">
     p {