chore: Make 'readConfig' and 'parseCompose' static

Levev · Levev · commit 0542e3ad99e8 · 2025-11-03T13:08:40.000+01:00
chore: Naming change 'readConfig' -&gt; 'readConfigObject'

chore: Naming change 'parseCompose' -&gt; 'readCompose'

fix: Add spacing between 'Experimental Features' and 'Advanced Settings'
diff --git a/src/renderer/lib/config.ts b/src/renderer/lib/config.ts
@@ -42,17 +42,17 @@ const defaultConfig: WinboatConfigObj = {
 };
 
 export class WinboatConfig {
+    private static readonly configPath: string = path.join(WINBOAT_DIR, "winboat.config.json");
     private static instance: WinboatConfig | null = null;
-    readonly #configPath: string = path.join(WINBOAT_DIR, "winboat.config.json");
     #configData: WinboatConfigObj = { ...defaultConfig };
 
     static getInstance() {
         WinboatConfig.instance ??= new WinboatConfig();
         return WinboatConfig.instance;
     }
 
-    constructor() {
-        this.#configData = this.readConfig()!;
+    private constructor() {
+        this.#configData = WinboatConfig.readConfigObject()!;
         console.log("Reading current config", this.#configData);
     }
 
@@ -63,7 +63,7 @@ export class WinboatConfig {
             set: (target, key, value) => {
                 // @ts-expect-error This is valid
                 target[key as keyof WinboatConfigObj] = value;
-                this.writeConfig();
+                WinboatConfig.writeConfigObject(target);
                 console.info("Wrote modified config to disk");
                 return true;
             },
@@ -72,29 +72,29 @@ export class WinboatConfig {
 
     set config(newConfig: WinboatConfigObj) {
         this.#configData = { ...newConfig };
-        this.writeConfig();
+        WinboatConfig.writeConfigObject(newConfig);
         console.info("Wrote modified config to disk");
     }
 
-    writeConfig(): void {
-        console.log("writing data: ", this.#configData);
-        fs.writeFileSync(this.#configPath, JSON.stringify(this.#configData, null, 4), "utf-8");
+    static writeConfigObject(configObj: WinboatConfigObj): void {
+        console.log("writing data: ", configObj);
+        fs.writeFileSync(WinboatConfig.configPath, JSON.stringify(configObj, null, 4), "utf-8");
     }
 
-    readConfig(writeDefault = true): WinboatConfigObj | null {
-        if (!fs.existsSync(this.#configPath)) {
+    static readConfigObject(writeDefault = true): WinboatConfigObj | null {
+        if (!fs.existsSync(WinboatConfig.configPath)) {
             if (!writeDefault) return null;
             // Also the create the directory because we're not guaranteed to have it
             if (!fs.existsSync(WINBOAT_DIR)) {
                 fs.mkdirSync(WINBOAT_DIR);
             }
 
-            fs.writeFileSync(this.#configPath, JSON.stringify(defaultConfig, null, 4), "utf-8");
+            fs.writeFileSync(WinboatConfig.configPath, JSON.stringify(defaultConfig, null, 4), "utf-8");
             return { ...defaultConfig };
         }
 
         try {
-            const rawConfig = fs.readFileSync(this.#configPath, "utf-8");
+            const rawConfig = fs.readFileSync(WinboatConfig.configPath, "utf-8");
             const configObj = JSON.parse(rawConfig) as WinboatConfigObj;
             console.log("Successfully read the config file");
 
@@ -115,7 +115,7 @@ export class WinboatConfig {
                 // If we have any missing keys, we should just write the config back to disk so those new keys are saved
                 // We cannot use this.writeConfig() here since #configData is not populated yet
                 if (hasMissing) {
-                    fs.writeFileSync(this.#configPath, JSON.stringify(configObj, null, 4), "utf-8");
+                    fs.writeFileSync(WinboatConfig.configPath, JSON.stringify(configObj, null, 4), "utf-8");
                     console.log("Wrote updated config with missing keys to disk");
                 }
             }
diff --git a/src/renderer/lib/install.ts b/src/renderer/lib/install.ts
@@ -259,15 +259,14 @@ export class InstallManager {
                     logger.info("WinBoat Guest Server is up and healthy!");
                     this.changeState(InstallStates.COMPLETED);
 
-                    const winboat = Winboat.getInstance();
-                    const config = winboat.parseCompose();
-                    const filteredVolumes = config.services.windows.volumes.filter(
+                    const compose = Winboat.readCompose(this.container.composeFilePath);
+                    const filteredVolumes = compose.services.windows.volumes.filter(
                         volume => !volume.endsWith("/boot.iso"),
                     );
 
-                    if (config.services.windows.volumes.length !== filteredVolumes.length) {
-                        config.services.windows.volumes = filteredVolumes;
-                        await winboat.replaceCompose(config, false);
+                    if (compose.services.windows.volumes.length !== filteredVolumes.length) {
+                        compose.services.windows.volumes = filteredVolumes;
+                        await this.container.writeCompose(compose);
                     }
 
                     return;
@@ -311,8 +310,7 @@ export class InstallManager {
 
 export async function isInstalled(): Promise<boolean> {
     // Check if a winboat container exists
-    const configInstance = new WinboatConfig();
-    const config = configInstance.readConfig();
+    const config = WinboatConfig.readConfigObject();
 
     if (!config) return false;
 
diff --git a/src/renderer/lib/winboat.ts b/src/renderer/lib/winboat.ts
@@ -426,14 +426,14 @@ export class Winboat {
         return status.rdpConnected;
     }
 
-    parseCompose() {
-        const composeFile = fs.readFileSync(this.containerMgr!.composeFilePath, "utf-8");
+    static readCompose(composePath: string): ComposeConfig {
+        const composeFile = fs.readFileSync(composePath, "utf-8");
         const composeContents = YAML.parse(composeFile) as ComposeConfig;
         return composeContents;
     }
 
     getCredentials() {
-        const compose = this.parseCompose();
+        const compose = Winboat.readCompose(this.containerMgr!.composeFilePath);
         return {
             username: compose.services.windows.environment.USERNAME,
             password: compose.services.windows.environment.PASSWORD,
@@ -572,7 +572,7 @@ export class Winboat {
         console.info("Removed container");
 
         // 3. Remove the container volume or folder
-        const compose = this.parseCompose();
+        const compose = Winboat.readCompose(this.containerMgr!.composeFilePath);
         const storage = compose.services.windows.volumes.find(vol => vol.includes("/storage"));
         if (storage?.startsWith("data:")) {
             if (this.#wbConfig?.config.containerRuntime !== ContainerRuntimes.DOCKER) {
diff --git a/src/renderer/views/Config.vue b/src/renderer/views/Config.vue
@@ -390,6 +390,7 @@
                     </div>
                 </x-card>
 
+                <!-- Application Scaling -->
                 <x-card
                     class="flex flex-row justify-between items-center p-2 py-3 my-0 w-full backdrop-blur-xl backdrop-brightness-150 bg-neutral-800/20"
                 >
@@ -544,51 +545,55 @@
         <div>
             <x-label class="mb-4 text-neutral-300">WinBoat</x-label>
 
-            <!-- Experimental Features -->
-            <x-card
-                class="flex items-center p-2 flex-row justify-between w-full py-3 my-0 bg-neutral-800/20 backdrop-brightness-150 backdrop-blur-xl"
-            >
-                <div>
-                    <div class="flex flex-row items-center gap-2 mb-2">
-                        <Icon
-                            class="text-violet-400 inline-flex size-8"
-                            icon="streamline-ultimate:lab-tube-experiment"
+            <div class="flex flex-col gap-4">
+                <!-- Experimental Features -->
+                <x-card
+                    class="flex items-center p-2 flex-row justify-between w-full py-3 my-0 bg-neutral-800/20 backdrop-brightness-150 backdrop-blur-xl"
+                >
+                    <div>
+                        <div class="flex flex-row items-center gap-2 mb-2">
+                            <Icon
+                                class="text-violet-400 inline-flex size-8"
+                                icon="streamline-ultimate:lab-tube-experiment"
+                            />
+                            <h1 class="text-lg my-0 font-semibold">Experimental Features</h1>
+                        </div>
+                        <p class="text-neutral-400 text-[0.9rem] !pt-0 !mt-0">
+                            If enabled, you'll have access to experimental features that may not be stable or complete
+                        </p>
+                    </div>
+                    <div class="flex flex-row justify-center items-center gap-2">
+                        <x-switch
+                            :toggled="wbConfig.config.experimentalFeatures"
+                            @toggle="toggleExperimentalFeatures"
+                            size="large"
                         />
-                        <h1 class="text-lg my-0 font-semibold">Experimental Features</h1>
                     </div>
-                    <p class="text-neutral-400 text-[0.9rem] !pt-0 !mt-0">
-                        If enabled, you'll have access to experimental features that may not be stable or complete
-                    </p>
-                </div>
-                <div class="flex flex-row justify-center items-center gap-2">
-                    <x-switch
-                        :toggled="wbConfig.config.experimentalFeatures"
-                        @toggle="toggleExperimentalFeatures"
-                        size="large"
-                    />
-                </div>
-            </x-card>
-            <x-card
-                class="flex items-center p-2 flex-row justify-between w-full py-3 my-0 bg-neutral-800/20 backdrop-brightness-150 backdrop-blur-xl"
-            >
-                <div>
-                    <div class="flex flex-row items-center gap-2 mb-2">
-                        <Icon class="text-violet-400 inline-flex size-8" icon="mdi:administrator"> </Icon>
-                        <h1 class="text-lg my-0 font-semibold">Advanced Settings</h1>
+                </x-card>
+
+                <!-- Advanced Settings -->
+                <x-card
+                    class="flex items-center p-2 flex-row justify-between w-full py-3 my-0 bg-neutral-800/20 backdrop-brightness-150 backdrop-blur-xl"
+                >
+                    <div>
+                        <div class="flex flex-row items-center gap-2 mb-2">
+                            <Icon class="text-violet-400 inline-flex size-8" icon="mdi:administrator"> </Icon>
+                            <h1 class="text-lg my-0 font-semibold">Advanced Settings</h1>
+                        </div>
+                        <p class="text-neutral-400 text-[0.9rem] !pt-0 !mt-0">
+                            If enabled, you'll have access to advanced settings that may prevent WinBoat from working if
+                            misconfigured
+                        </p>
                     </div>
-                    <p class="text-neutral-400 text-[0.9rem] !pt-0 !mt-0">
-                        If enabled, you'll have access to advanced settings that may prevent WinBoat from working if
-                        misconfigured
-                    </p>
-                </div>
-                <div class="flex flex-row justify-center items-center gap-2">
-                    <x-switch
-                        :toggled="wbConfig.config.advancedFeatures"
-                        @toggle="toggleAdvancedFeatures"
-                        size="large"
-                    />
-                </div>
-            </x-card>
+                    <div class="flex flex-row justify-center items-center gap-2">
+                        <x-switch
+                            :toggled="wbConfig.config.advancedFeatures"
+                            @toggle="toggleAdvancedFeatures"
+                            size="large"
+                        />
+                    </div>
+                </x-card>
+            </div>
         </div>
 
         <div>
@@ -722,7 +727,7 @@ function updateApplicationScale(value: string | number) {
  * so we can display them and track when a change has been made
  */
 async function assignValues() {
-    compose.value = winboat.parseCompose();
+    compose.value = Winboat.readCompose(winboat.containerMgr!.composeFilePath);
     portMapper.value = new ComposePortMapper(compose.value);
 
     numCores.value = Number(compose.value.services.windows.environment.CPU_CORES);
diff --git a/src/renderer/views/Home.vue b/src/renderer/views/Home.vue
@@ -191,7 +191,7 @@ const compose = ref<ComposeConfig | null>(null);
 const wallpaper = ref("");
 
 onMounted(async () => {
-    compose.value = winboat.parseCompose();
+    compose.value = Winboat.readCompose(winboat.containerMgr!.composeFilePath);
     wallpaper.value = compose.value?.services.windows.environment.VERSION.includes("11")
         ? "./img/wallpaper/win11.webp"
         : "./img/wallpaper/win10.webp";
diff --git a/src/renderer/views/SetupUI.vue b/src/renderer/views/SetupUI.vue
@@ -1066,7 +1066,7 @@ function install() {
         container: createContainer(containerRuntime.value), // Hardcdde for now
     };
 
-    const wbConfig = new WinboatConfig(); // Create winboat config.
+    const wbConfig = WinboatConfig.getInstance(); // Create winboat config.
     wbConfig.config.containerRuntime = containerRuntime.value; // Save which runtime to use.
 
     installManager = new InstallManager(installConfig);
