fix #16

cli/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "wasmo"
-version = "0.2.5"
+version = "1.0.0"
 edition = "2021"
 authors = ["Zwiterrion <[email protected]>"]
 license = "MIT OR Apache-2.0"

server/index.js

@@ -43,33 +43,70 @@ if (AUTHENTICATION.BASIC_AUTH === ENV.AUTH_MODE &&
   return;
 }
 
+function rewriteStaticPaths(baseURL) {
+  const indexHTMLPath = path.join(__dirname, '..', 'ui/build/index.html');
+  const indexHTMLContent = fs.readFileSync(indexHTMLPath).toString();
+  fs.writeFileSync(indexHTMLPath,
+    indexHTMLContent
+      .replace(/src="(.*?)\/static/g, `src=\"${baseURL}/static`)
+      .replace(/href="(.*?)\/static/g, `href=\"${baseURL}/static`)
+      // .replace(/\/static/g, `${baseURL}/static`)
+      .replace(/\/static\/static/g, "/static")
+      .replace(/\/{2}/g, "/")
+  );
+  logger.info('The baseURL value has been applied')
+}
+
 function createServer(appVersion) {
   const app = express();
-  app.use(express.static(path.join(__dirname, '..', 'ui/build')));
-  app.use(compression());
-  app.use(bodyParser.raw({
+
+  let router;
+
+  if (process.env.BASE_URL) {
+    const baseURL = process.env.BASE_URL;
+
+    console.log(`has baseURL ${baseURL}`)
+    router = express.Router();
+
+    rewriteStaticPaths(baseURL);
+
+    app.use('/', (req, _res, next) => {
+      if (!req.path.startsWith(baseURL))
+        req.url = `${baseURL}${req.path}`;
+      next()
+    })
+    app.use(baseURL, router);
+  } else {
+    rewriteStaticPaths("");
+    router = express.Router();
+    app.use('/', router);
+  }
+
+  router.use(express.static(path.join(__dirname, '..', 'ui/build')));
+  router.use(compression());
+  router.use(bodyParser.raw({
     type: 'application/octet-stream',
     limit: '10mb'
   }));
-  app.use(bodyParser.json());
-  app.use(bodyParser.urlencoded({ extended: true }));
-  app.use(bodyParser.text());
+  router.use(bodyParser.json());
+  router.use(bodyParser.urlencoded({ extended: true }));
+  router.use(bodyParser.text());
 
-  app.use('/_/healthcheck', (_, res) => {
+  router.use('/_/healthcheck', (_, res) => {
     return res.status(200).json()
   });
 
-  app.use('/', Security.extractUserFromQuery);
-  app.use('/', publicRouter);
-  app.use('/api/plugins', pluginsRouter);
-  app.use('/api/templates', templatesRouter);
-  app.use('/api/wasm', wasmRouter);
-  app.use('/api/version', (_, res) => res.json(appVersion));
-  app.use('/api/development', (_, res) => res.json(process.env.NODE_ENV === "development"));
+  router.use('/', Security.extractUserFromQuery);
+  router.use('/', publicRouter);
+  router.use('/api/plugins', pluginsRouter);
+  router.use('/api/templates', templatesRouter);
+  router.use('/api/wasm', wasmRouter);
+  router.use('/api/version', (_, res) => res.json(appVersion));
+  router.use('/api/development', (_, res) => res.json(process.env.NODE_ENV === "development"));
 
-  app.use('/health', (_, res) => res.json({ status: true }))
+  router.use('/health', (_, res) => res.json({ status: true }))
 
-  app.get('/', (_, res) => res.sendFile(path.join(__dirname, '..', 'ui/build', '/index.html')));
+  router.get('/', (_, res) => res.sendFile(path.join(__dirname, '..', 'ui/build', '/index.html')));
 
   return http.createServer(app);
 }

server/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wasmo",
-  "version": "0.2.5",
+  "version": "1.0.0",
   "main": "index.js",
   "license": "MIT",
   "scripts": {

ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ui",
-  "version": "0.2.5",
+  "version": "1.0.0",
   "private": true,
   "dependencies": {
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",

ui/public/index.html

@@ -6,7 +6,6 @@
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="theme-color" content="#ffffff" />
   <meta name="description" content="Wasmo builder" />
-  <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
 
   <link rel="apple-touch-icon" sizes="180x180" href="%PUBLIC_URL%/apple-touch-icon.png">
   <link rel="icon" type="image/png" sizes="32x32" href="%PUBLIC_URL%/favicon-32x32.png">

ui/public/site.webmanifest

@@ -0,0 +1,32 @@
+{
+    "theme_color": "#000000",
+    "background_color": "#000000",
+    "display": "browser",
+    "scope": "/",
+    "start_url": "/",
+    "name": "Wasmo",
+    "short_name": "Wasmo",
+    "description": "WASM Binary builder",
+    "icons": [
+        {
+            "src": "/icon-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "/icon-256x256.png",
+            "sizes": "256x256",
+            "type": "image/png"
+        },
+        {
+            "src": "/icon-384x384.png",
+            "sizes": "384x384",
+            "type": "image/png"
+        },
+        {
+            "src": "/icon-512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ]
+}

ui/src/FilesLogo.js

@@ -20,7 +20,7 @@ const LOGOS = {
   go: <Go style={{ height: 22, width: 22 }} />,
   opa: <OPA style={{ height: 22, width: 22 }} />,
   github: <Github style={{ height: 22, width: 22 }} />,
-  logo: <img src={window.location.origin + "/wasmo.png"}
+  logo: <img src={window.location.origin + "/icon-512x512.png"}
     style={{ width: 42, userSelect: 'none' }} />,
   release: <Release style={{ height: 22, width: 22 }} />
 };

ui/src/TabsManager.js

@@ -160,7 +160,7 @@ function SidebarHeader({ version }) {
       background: '#000',
       color: 'white',
       height: 42
-    }} className="p-2 m-0 d-flex align-items-center"><img src="./wasmo.png" width={32} />Wasmo <span style={{ fontSize: '1rem', marginTop: 'auto' }} className="ms-auto">{version}</span></h1> : <div className='d-flex justify-content-center p-1'>
+    }} className="p-2 m-0 d-flex align-items-center"><img src="./icon-512x512.png" width={32} />Wasmo <span style={{ fontSize: '1rem', marginTop: 'auto' }} className="ms-auto">{version}</span></h1> : <div className='d-flex justify-content-center p-1'>
       {LOGOS.logo}
     </div>
     }