Serve Vue app in internal_dashboard.blade.php from public/build folder

app/Client/Factory.php

@@ -17,6 +17,7 @@
 use Ratchet\WebSocket\WsServer;
 use React\EventLoop\Factory as LoopFactory;
 use React\EventLoop\LoopInterface;
+use Symfony\Component\Routing\Route;
 
 class Factory
 {
@@ -144,6 +145,8 @@ protected function addRoutes()
     {
         $this->router->get('/', DashboardController::class);
 
+        $this->router->addPublicFilesystem();
+
         $this->router->get('/api/tunnels', GetTunnelsController::class);
         $this->router->post('/api/tunnel', CreateTunnelController::class);
         $this->router->get('/api/logs', LogController::class);

app/Client/Http/Controllers/DashboardController.php

@@ -13,11 +13,25 @@ public function handle(Request $request, ConnectionInterface $httpConnection)
     {
         $httpConnection->send(respond_html(
             $this->getBlade($httpConnection, 'client.internal_dashboard', [
-            'user' => Client::$user,
-            'subdomains' => Client::$subdomains,
-            'max_logs' => config()->get('expose.max_logged_requests', 10),
-        ])
+                'user' => Client::$user,
+                'subdomains' => Client::$subdomains,
+                'max_logs' => config()->get('expose.max_logged_requests', 10),
 
-    ));
+                'jsFile' => $this->getJsFilePath(),
+                'cssFile' => $this->getCssFilePath(),
+            ])
+        ));
+    }
+
+    private function getJsFilePath() {
+        return "/files/build/internal-dashboard/assets/" . collect(scandir(app()->basePath() . "/public/build/internal-dashboard/assets/"))->filter(function($file) {
+            return str($file)->startsWith("index-") && str($file)->endsWith(".js");
+        })->first();
+    }
+
+    private function getCssFilePath() {
+        return "/files/build/internal-dashboard/assets/" . collect(scandir(app()->basePath() . "/public/build/internal-dashboard/assets/"))->filter(function($file) {
+            return str($file)->startsWith("index-") && str($file)->endsWith(".css");
+        })->first();
     }
 }

app/Client/Http/Controllers/FileController.php

@@ -0,0 +1,41 @@
+<?php
+
+namespace App\Client\Http\Controllers;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Http\Request;
+use Ratchet\ConnectionInterface;
+use GuzzleHttp\Psr7\Message;
+use GuzzleHttp\Psr7\Response;
+
+class FileController extends Controller
+{
+    public function handle(Request $request, ConnectionInterface $httpConnection)
+    {
+        $file = $request->get("path");
+
+        $filePath = app()->basePath() . "/public/" . $file;
+
+        if(!file_exists($filePath)) {
+            $httpConnection->send(Message::toString(new Response(
+                404,
+                ['Content-Type' => 'text/html'],
+                "File not found"
+            )));
+            return;
+        }
+
+        $file = file_get_contents($filePath);
+        $contentType = mime_content_type($filePath);
+
+        if(str($filePath)->endsWith(".css")) {
+            $contentType = "text/css";
+        }
+
+        $httpConnection->send(Message::toString(new Response(
+            200,
+            ['Content-Type' => $contentType],
+            $file
+        )));
+    }
+}

app/Http/RouteGenerator.php

@@ -4,6 +4,7 @@
 
 use Symfony\Component\Routing\Route;
 use Symfony\Component\Routing\RouteCollection;
+use App\Client\Http\Controllers\FileController;
 
 class RouteGenerator
 {
@@ -55,6 +56,14 @@ public function addSymfonyRoute(string $name, Route $route)
         $this->routes->add($name, $route);
     }
 
+    public function addPublicFilesystem() {
+        $this->routes->add('get-files', new Route(
+            '/files/{path}',
+            ['_controller' => FileController::class],
+            ['path' => '.*']
+        ));
+    }
+
     protected function getRoute(string $method, string $uri, $action, string $condition = ''): Route
     {
         return new Route($uri, ['_controller' => app($action)], [], [], null, [], [$method], $condition);

public/build/internal-dashboard/build/index.html

@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + Vue + TS</title>
+    <script type="module" crossorigin src="/assets/index-mleR6s9-.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-CusWAS5C.css">
+  </head>
+  <body>
+    <div id="app"></div>
+  </body>
+</html>

public/build/internal-dashboard/index.html

@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Expose Dashboard</title>
+    <script type="module" crossorigin src="/assets/index-CZHspyA5.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-8zj_ClGA.css">
+  </head>
+  <body>
+    <div id="app"></div>
+  </body>
+</html>

resources/views/client/internal_dashboard.blade.php

@@ -1,14 +1,19 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Dashboard</title>
-    <link rel="stylesheet" href="{{ asset('build/assets/[your-css-file].css') }}">
+    <title>Internal Dashboard</title>
+
+    <link href="{{ $cssFile }}" rel="stylesheet">
 </head>
+
 <body>
-    <div id="vue-dashboard"></div>
+    <div id="internalDashboard">
+    </div>
 
-    <script src="{{ asset('build/assets/[your-js-file].js') }}"></script>
+    <script src="{{ $jsFile }}"></script>
 </body>
+
 </html>