From 6f702c3927870e0af00a77bf9426dc7b3e222110 Mon Sep 17 00:00:00 2001
From: jelveh <nj@puter.com>
Date: Tue, 22 Oct 2024 16:46:06 -0700
Subject: [PATCH] Going to `/settings` will open the Settings in full page mode

---
 src/backend/src/routers/_default.js         |  4 ++++
 src/gui/src/UI/Settings/UIWindowSettings.js |  5 +++--
 src/gui/src/UI/UIDesktop.js                 | 12 +++++++++++-
 src/gui/src/css/style.css                   |  7 +++++--
 src/gui/src/index.js                        |  1 -
 src/gui/src/services/SettingsService.js     |  2 +-
 6 files changed, 24 insertions(+), 7 deletions(-)

diff --git a/src/backend/src/routers/_default.js b/src/backend/src/routers/_default.js
index c5b4d277c..fe45f4cd9 100644
--- a/src/backend/src/routers/_default.js
+++ b/src/backend/src/routers/_default.js
@@ -307,6 +307,10 @@ router.all('*', async function(req, res, next) {
             if(path.startsWith('/action/') || path.startsWith('/@')){
                 path = '/';
             }
+            // /settings
+            else if(path.startsWith('/settings')){
+                path = '/';
+            }
             // /app/
             else if(path.startsWith('/app/')){
                 app_name = path.replace('/app/', '');
diff --git a/src/gui/src/UI/Settings/UIWindowSettings.js b/src/gui/src/UI/Settings/UIWindowSettings.js
index fe80bf57a..5f6efca1a 100644
--- a/src/gui/src/UI/Settings/UIWindowSettings.js
+++ b/src/gui/src/UI/Settings/UIWindowSettings.js
@@ -34,7 +34,7 @@ async function UIWindowSettings(options){
         h += `<div class="settings-container">`;
         h += `<div class="settings">`;
             // sidebar toggle
-            h += `<button class="sidebar-toggle hidden-lg hidden-xl"><div class="sidebar-toggle-button"><span></span><span></span><span></span></div></button>`;
+            h += `<button class="sidebar-toggle hidden-lg hidden-xl hidden-md"><div class="sidebar-toggle-button"><span></span><span></span><span></span></div></button>`;
             // sidebar
             h += `<div class="settings-sidebar disable-user-select disable-context-menu">`;
                 // sidebar items
@@ -93,7 +93,8 @@ async function UIWindowSettings(options){
                 width: 'initial',
                 height: '100%',
                 overflow: 'auto'
-            }
+            },
+            ...options?.window_options??{}
         });
         const $el_window = $(el_window);
         tabs.forEach((tab, i) => {
diff --git a/src/gui/src/UI/UIDesktop.js b/src/gui/src/UI/UIDesktop.js
index 7729701af..590b69d70 100644
--- a/src/gui/src/UI/UIDesktop.js
+++ b/src/gui/src/UI/UIDesktop.js
@@ -1064,7 +1064,17 @@ async function UIDesktop(options){
                 window.app_query_params[key] = value;
         }
     }
-
+    //--------------------------------------------------------------------------------------
+    // /settings will open settings in fullpage mode
+    //--------------------------------------------------------------------------------------
+    else if(window.url_paths[0]?.toLocaleLowerCase() === 'settings'){
+        // open settings
+        UIWindowSettings({
+            window_options:{
+                is_fullpage: true,
+            }
+        });
+    }
     // ---------------------------------------------
     // Run apps from insta-login URL
     // ---------------------------------------------
diff --git a/src/gui/src/css/style.css b/src/gui/src/css/style.css
index 129a7ac48..846633e22 100644
--- a/src/gui/src/css/style.css
+++ b/src/gui/src/css/style.css
@@ -3599,6 +3599,7 @@ fieldset[name=number-code] {
     flex-direction: row;
     -webkit-font-smoothing: antialiased;
     flex-grow: 1;
+    position: relative;
 }
 
 .settings-sidebar {
@@ -3639,6 +3640,8 @@ fieldset[name=number-code] {
 
 .settings-content {
     display: none;
+    max-width: 800px;
+    margin: auto;
 }
 
 .settings-content[data-settings="about"] {
@@ -4134,13 +4137,13 @@ fieldset[name=number-code] {
 }
 
 .sidebar-toggle{
-	position: fixed;
+	position: absolute;
     z-index: 9999999999;
-    top: 32px;
     left: 2px;
 	border: 0;
 	padding-top: 5px;
 	padding-bottom: 5px;
+    top: 3px;
 }
 .sidebar-toggle .sidebar-toggle-button {
 	height: 20px;
diff --git a/src/gui/src/index.js b/src/gui/src/index.js
index 0ea9b609d..6d88c7dcd 100644
--- a/src/gui/src/index.js
+++ b/src/gui/src/index.js
@@ -80,7 +80,6 @@ window.gui = async function(options){
 
     // 🚀 Launch the GUI 🚀
     window.initgui(options);
-
 }
 
 /**
diff --git a/src/gui/src/services/SettingsService.js b/src/gui/src/services/SettingsService.js
index 0a7439496..b016bc85e 100644
--- a/src/gui/src/services/SettingsService.js
+++ b/src/gui/src/services/SettingsService.js
@@ -30,13 +30,13 @@ export class SettingsService extends Service {
     #tabs = [];
     async _init () {
         ;[
-            AboutTab,
             UsageTab,
             AccountTab,
             SecurityTab,
             PersonalizationTab,
             LanguageTag,
             ClockTab,
+            AboutTab,
         ].forEach(tab => {
             this.register_tab(tab);
         });