From 4c39a2ea1a119973f041c911671d169c4cdb9afe Mon Sep 17 00:00:00 2001
From: Julian Prieber <julian.prieber@gmail.com>
Date: Thu, 19 Dec 2024 16:30:31 +0100
Subject: [PATCH] Add SPA_MODE configuration and update related views for
 conditional loading

---
 .env                                          |  4 +-
 .../views/components/config/config.blade.php  |  3 +
 .../views/components/finishing.blade.php      |  6 ++
 resources/views/layouts/sidebar.blade.php     | 59 ++++++++-----------
 resources/views/panel/users.blade.php         |  4 +-
 resources/views/studio/page.blade.php         |  8 ++-
 6 files changed, 46 insertions(+), 38 deletions(-)

diff --git a/.env b/.env
index a7fdb5c..5453e45 100644
--- a/.env
+++ b/.env
@@ -134,4 +134,6 @@ MANUAL_USER_VERIFICATION=true
 ENABLE_REPORT_ICON=false
 
 ENABLE_ADMIN_BAR=true
-ENABLE_ADMIN_BAR_USERS=false
\ No newline at end of file
+ENABLE_ADMIN_BAR_USERS=false
+
+SPA_MODE=false
\ No newline at end of file
diff --git a/resources/views/components/config/config.blade.php b/resources/views/components/config/config.blade.php
index 14f8feb..055f9a5 100644
--- a/resources/views/components/config/config.blade.php
+++ b/resources/views/components/config/config.blade.php
@@ -276,6 +276,9 @@ foreach($users as $user){if($user->littlelink_name != $configValue2){echo '<opti
 
 <a name="Panel-settings"><h2 class="ch2">{{__('messages.Panel settings')}}</h2></a>
 
+{{toggle('SPA_MODE')}}
+
+
 {{toggle('NOTIFY_EVENTS')}}
 
 
diff --git a/resources/views/components/finishing.blade.php b/resources/views/components/finishing.blade.php
index 8cf603a..5210121 100644
--- a/resources/views/components/finishing.blade.php
+++ b/resources/views/components/finishing.blade.php
@@ -162,6 +162,12 @@ if (EnvEditor::keyExists('ALLOW_REGISTRATION')) {
     }
 }
 
+if (EnvEditor::keyExists('SPA_MODE')) {
+    /* Do nothing if key already exists */
+} else {
+    EnvEditor::addKey('SPA_MODE', 'false');
+}
+
 try {
     $file = base_path('storage/RSTAC');
     if (file_exists($file)) {
diff --git a/resources/views/layouts/sidebar.blade.php b/resources/views/layouts/sidebar.blade.php
index 62b9032..5e1f44d 100755
--- a/resources/views/layouts/sidebar.blade.php
+++ b/resources/views/layouts/sidebar.blade.php
@@ -4,6 +4,8 @@
     use App\Models\UserData;
     $usrhandl = Auth::user()->littlelink_name;
 
+    $spa = env('SPA_MODE', false);
+
     $betaServer    = env('BETA_SERVER', 'https://beta.linkstack.org/');
     $versionServer = env('VERSION_SERVER', 'https://version.linkstack.org/');
 @endphp
@@ -16,7 +18,9 @@
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <title>{{ env('APP_NAME') }}</title>
 
-    @livewireStyles
+    @if($spa)
+        @livewireStyles
+    @endif
 
     <base href="{{ url()->current() }}" />
     <meta name="csrf-token" content="{{ csrf_token() }}">
@@ -71,29 +75,12 @@
     <link rel="stylesheet" href="{{ asset('assets/linkstack/css/hover-min.css') }}">
     <link rel="stylesheet" href="{{ asset('assets/linkstack/css/animate.css') }}">
     <link rel="stylesheet" href="{{ asset('assets/external-dependencies/bootstrap-icons.css') }}">
-{{-- <style>
-    body * {
-        animation-name: loadfade;
-        animation-duration: .6s;
-        animation-fill-mode: both;
-    }
 
-@keyframes loadfade {
-  from {
-    opacity: 0;
-  }
+    <!-- Library Bundle Script -->
+    <script src="{{ asset('assets/js/core/libs.min.js') }}"></script>
 
-  to {
-    opacity: 1;
-  }
-}
-</style> --}}
-
-<!-- Library Bundle Script -->
-<script src="{{ asset('assets/js/core/libs.min.js') }}"></script>
-
-<!-- App Script -->
-<script src="{{ asset('assets/js/hope-ui.js') }}" defer></script>
+    <!-- App Script -->
+    <script src="{{ asset('assets/js/hope-ui.js') }}" defer></script>
 
 
     <!-- External Library Bundle Script -->
@@ -102,10 +89,6 @@
     <!-- Widgetchart Script -->
     <script src="{{ asset('assets/js/charts/widgetcharts.js') }}"></script>
 
-    <!-- mapchart Script -->
-    <script src="{{ asset('assets/js/charts/vectore-chart.js') }}"></script>
-    <script src="{{ asset('assets/js/charts/dashboard.js') }}"></script>
-
     <!-- fslightbox Script -->
     <script src="{{ asset('assets/js/plugins/fslightbox.js') }}"></script>
 
@@ -168,14 +151,15 @@
     <script src="{{ asset('assets/vendor/livewire/core.min.js') }}"></script>
 </head>
 <body class="{{$_COOKIE['color-mode'] ?? 'auto'}}">
-    {{-- <!-- loader Start -->
-    <div id="loading">
-        <div id="loader" class="loader simple-loader">
-            <div class="loader-body"></div>
+    @if(!$spa)
+        <!-- loader Start -->
+        <div id="loading">
+            <div id="loader" @if($_COOKIE['color-mode'] == 'dark')style="background:#222738"@endif class="loader simple-loader">
+                <div class="loader-body"></div>
+            </div>
         </div>
-    </div>
-    <script>document.getElementById('loader').style.backgroundColor = colorMode === 'dark' ? '#222738' : '';</script>
-    <!-- loader END --> --}}
+        <!-- loader END -->
+    @endif
 
     <aside class="sidebar sidebar-default sidebar-white sidebar-base navs-rounded-all ">
         <div class="sidebar-header d-flex align-items-center justify-content-start">
@@ -1238,6 +1222,10 @@ MODAL; // <-- Indentation breaks my code editor :/
     <!-- Settings Script -->
     <script src="{{ asset('assets/js/plugins/setting.js') }}"></script>
 
+    <!-- mapchart Script -->
+    <script src="{{ asset('assets/js/charts/vectore-chart.js') }}"></script>
+    <script src="{{ asset('assets/js/charts/dashboard.js') }}"></script>
+
     @stack('sidebar-scripts')
 
     {{-- <script src="{{ asset('assets/js/detect-dark-mode.js') }}"></script> --}}
@@ -1254,6 +1242,9 @@ MODAL; // <-- Indentation breaks my code editor :/
         }
     }, { once: true });
     </script>
-    @livewireScripts
+
+    @if($spa)
+        @livewireScripts
+    @endif
 </body>
 </html>
diff --git a/resources/views/panel/users.blade.php b/resources/views/panel/users.blade.php
index 3c69b17..93cfcb9 100755
--- a/resources/views/panel/users.blade.php
+++ b/resources/views/panel/users.blade.php
@@ -124,14 +124,14 @@
     </div>
 
     @push('sidebar-stylesheets')
-        @if(false)
+        @if(!env('SPA_MODE', false))
             @livewireStyles
         @endif
         <link rel="stylesheet" href="{{ asset('assets/vendor/livewire/core.min.css') }}" />
     @endpush
 
     @push('sidebar-scripts')
-        @if(false)
+        @if(!env('SPA_MODE', false))
             @livewireScripts
             <script src="{{ asset('assets/vendor/livewire/core.min.js') }}"></script>
         @endif
diff --git a/resources/views/studio/page.blade.php b/resources/views/studio/page.blade.php
index 6f58cdc..399be8d 100755
--- a/resources/views/studio/page.blade.php
+++ b/resources/views/studio/page.blade.php
@@ -347,6 +347,8 @@
                                                 @if (env('ALLOW_USER_HTML') === true)
                                                     @push('sidebar-stylesheets')
                                                         <script src="{{ asset('assets/external-dependencies/ckeditor.js') }}"></script>
+                                                    @endpush
+                                                    @push('sidebar-scripts')
                                                         <script>
                                                             function performOperation() {
                                                                 ClassicEditor
@@ -405,6 +407,10 @@
                                                                     .catch(error => {
                                                                         console.error(error);
                                                                     });
+                                                                    var element = document.querySelector('.ckeditor');
+                                                                    if (element) {
+                                                                        element.classList.remove('ckeditor');
+                                                                    }
                                                             }
 
                                                             document.addEventListener('DOMContentLoaded', () => {
@@ -415,7 +421,7 @@
 
                                                             document.addEventListener('livewire:navigated', () => {
                                                                 performOperation();
-                                                            });
+                                                            }, { once: true });
                                                         </script>
                                                     @endpush
                                                 @endif