pinokiod 3.11.0 → 3.11.2

package/kernel/bin/git.js

@@ -12,34 +12,47 @@ class Git {
     }
   }
   async install(req, ondata) {
+    console.log("GIT install")
+    await this.kernel.bin.exec({
+      message: [
+        "conda clean -y --all",
+        `conda install -y -c conda-forge ${this.cmd()}`
+      ]
+    }, ondata)
     if (this.kernel.platform === "darwin") {
+      console.log("brew install gh")
       await this.kernel.bin.exec({
-        conda: { skip: true },
-        message: "brew install gh",
-      }, ondata)
-    } else {
-      await this.kernel.bin.exec({
+//        conda: { skip: true },
         message: [
-          "conda clean -y --all",
-          `conda install -y -c conda-forge ${this.cmd()}`
-        ]
-      }, ondata)
+          "echo $PATH",
+          "which brew",
+          "brew install gh",
+        ],
+      }, (e) => {
+        process.stdout.write(e.raw)
+        ondata(e)
+      })
     }
     await fs.promises.mkdir(this.kernel.path("config/gh"), { recursive: true }).catch((e) => { })
-//    if (this.kernel.platform === 'win32') {
-//      let gitconfig_path = path.resolve(this.kernel.homedir, "gitconfig")
-//      // check if gitconfig exists
-//      let exists = await this.kernel.api.exists(gitconfig_path)
-//      // if not, create one
-//      if (!exists) {
-//        await fs.promises.copyFile(
-//          path.resolve(__dirname, "..", "gitconfig_template"),
-//          gitconfig_path
-//        )
-//      }
-//    }
+
+    let gitconfig_path = path.resolve(this.kernel.homedir, "gitconfig")
+    // check if gitconfig exists
+    let exists = await this.kernel.api.exists(gitconfig_path)
+    // if not, create one
+    if (!exists) {
+      await fs.promises.copyFile(
+        path.resolve(__dirname, "..", "gitconfig_template"),
+        gitconfig_path
+      )
+    }
   }
   async installed() {
+    let gitconfig_path = path.resolve(this.kernel.homedir, "gitconfig")
+    let exists = await this.kernel.api.exists(gitconfig_path)
+    if (!exists) {
+      return false; 
+    }
+
     if (this.kernel.platform === "darwin") {
       let gh_config_exists = await this.kernel.exists("config/gh")
       return this.kernel.bin.installed.conda && this.kernel.bin.installed.conda.has("git") && this.kernel.bin.installed.brew.has("gh") && gh_config_exists

package/kernel/bin/index.js

@@ -285,13 +285,13 @@ class Bin {
         await fs.promises.writeFile(pipconfig_path, pipconfigStr) 
       }
 
-      // add gitconfig => support git lfs, long path, etc.
-      let gitconfig_path = path.resolve(this.kernel.homedir, "gitconfig")
-      // check if gitconfig exists
-      await fs.promises.copyFile(
-        path.resolve(__dirname, "..", "gitconfig_template"),
-        gitconfig_path
-      )
+//      // add gitconfig => support git lfs, long path, etc.
+//      let gitconfig_path = path.resolve(this.kernel.homedir, "gitconfig")
+//      // check if gitconfig exists
+//      await fs.promises.copyFile(
+//        path.resolve(__dirname, "..", "gitconfig_template"),
+//        gitconfig_path
+//      )
 
       for(let mod of this.mods) {
         if (mod.mod.start) {

package/kernel/bin/setup.js

@@ -1,8 +1,15 @@
 const os = require('os')
 let platform = os.platform()
+let zip_cmd
+if (platform === 'win32') {
+  zip_cmd = "7zip"
+} else {
+  zip_cmd = "p7zip"
+}
 module.exports = {
   ai: (kernel) => {
     let conda_requirements = [
+      zip_cmd,
       "uv",
       "node",
       "huggingface",
@@ -12,19 +19,21 @@ module.exports = {
     ]
     let requirements = [
       { name: "conda", },
+      { name: "zip", },
+    ]
+    if (platform === "darwin") {
+      requirements.push({ name: "brew" })
+    }
+    requirements = requirements.concat([
       { name: "git", },
-  //      { name: "zip", },
       { name: "node", },
       { name: "ffmpeg", },
 //      { name: "caddy", }
-    ]
+    ])
     if (platform === "win32") {
       requirements.push({ name: "registry" })
       requirements.push({ name: "vs" })
     }
-    if (platform === "darwin") {
-      requirements.push({ name: "brew" })
-    }
     if (platform === "linux") {
       requirements.push({ name: "gxx" })
       conda_requirements.push("gxx")
@@ -49,34 +58,50 @@ module.exports = {
     }
   },
   javascript: (kernel) => {
+    let requirements = [
+      { name: "conda", },
+      { name: "zip", },
+    ]
+    if (platform === "darwin") {
+      requirements.push({ name: "brew" })
+    }
+    requirements = requirements.concat([
+      { name: "git", },
+      { name: "node", },
+      { name: "py" },
+    ])
     return {
       icon: "fa-brands fa-js",
       title: "Node.js",
       description: "Set up self-contained node.js development environment",
-      requirements: [
-        { name: "conda", },
-        { name: "git", },
-        { name: "node", },
-        { name: "py" },
-      ],
+      requirements,
       conda_requirements: [
+        zip_cmd,
         "node",
         "git",
       ]
     }
   },
   python: (kernel) => {
+    let requirements = [
+      { name: "conda", },
+      { name: "zip", },
+    ]
+    if (platform === "darwin") {
+      requirements.push({ name: "brew" })
+    }
+    requirements = requirements.concat([
+      { name: "git", },
+      { name: "uv", },
+      { name: "py" },
+    ])
     return {
       icon: "fa-brands fa-python",
       title: "Python",
       description: "Set up self-contained python development environment",
-      requirements: [
-        { name: "conda", },
-        { name: "git", },
-        { name: "uv", },
-        { name: "py" },
-      ],
+      requirements,
       conda_requirements: [
+        zip_cmd,
         "uv",
         "git",
       ]
@@ -85,11 +110,18 @@ module.exports = {
   dev: (kernel) => {
     let requirements = [
       { name: "conda", },
+      { name: "zip", },
+    ]
+    if (platform === "darwin") {
+      requirements.push({ name: "brew" })
+    }
+    requirements = requirements.concat([
       { name: "git", },
       { name: "node", },
       { name: "uv", },
-    ]
+    ])
     let conda_requirements = [
+      zip_cmd,
       "uv",
       "node",
       "git",
@@ -114,34 +146,52 @@ module.exports = {
     }
   },
   network: (kernel) => {
+    let requirements = [
+      { name: "conda", },
+      { name: "zip", },
+    ]
+    if (platform === "darwin") {
+      requirements.push({ name: "brew" })
+    }
+    requirements = requirements.concat([
+      { name: "git", },
+      { name: "caddy", },
+      { name: "py", },
+    ])
+    console.log("Setup.network", requirements)
     return {
       icon: "fa-solid fa-wifi",
       title: "Network",
       description: "Automatic HTTPS and local network sharing for ALL local apps",
-      requirements: [
-        { name: "conda", },
-        { name: "git", },
-        { name: "caddy", },
-        { name: "py", },
-      ],
+      requirements,
       conda_requirements: [
+        zip_cmd,
         "git",
         "caddy"
       ]
     }
   },
   connect: (kernel) => {
+    let requirements = [
+      { name: "conda", },
+      { name: "zip", },
+    ]
+    if (platform === "darwin") {
+      requirements.push({ name: "brew" })
+    }
+    requirements = requirements.concat([
+      { name: "git", },
+      { name: "caddy", },
+      { name: "py", },
+    ])
+    console.log("Setup.connect", requirements)
     return {
       icon: "fa-solid fa-wifi",
       title: "API Connect",
       description: "Connect with 3rd party APIs",
-      requirements: [
-        { name: "conda", },
-        { name: "git", },
-        { name: "caddy", },
-        { name: "py", },
-      ],
+      requirements,
       conda_requirements: [
+        zip_cmd,
         "git",
         "caddy"
       ]

package/kernel/index.js

@@ -264,14 +264,20 @@ class Kernel {
   }
   async refresh(notify_peers) {
     let env = await Environment.get(this.homedir)
-    let peer_active = false
+    let peer_active = true
     // if PINOKIO_NETWORK_SHARE is 0 or false, turn it off
-    if (env && env.PINOKIO_NETWORK_ACTIVE && (env.PINOKIO_NETWORK_ACTIVE==="1" || env.PINOKIO_NETWORK_ACTIVE.toLowerCase()==="true")) {
-      peer_active = true
-    }
-    let https_active = false
-    if (env && env.PINOKIO_HTTPS_ACTIVE && (env.PINOKIO_HTTPS_ACTIVE==="1" || env.PINOKIO_HTTPS_ACTIVE.toLowerCase()==="true")) {
-      https_active = true
+    // By default it should be on.
+    // It's off if the value is set, and it's 0 or false
+
+    //if (env && env.PINOKIO_NETWORK_ACTIVE && (env.PINOKIO_NETWORK_ACTIVE==="1" || env.PINOKIO_NETWORK_ACTIVE.toLowerCase()==="true")) {
+    if (env && env.PINOKIO_NETWORK_ACTIVE && (env.PINOKIO_NETWORK_ACTIVE==="0" || env.PINOKIO_NETWORK_ACTIVE.toLowerCase()==="false")) {
+      peer_active = false
+    }
+    let https_active = true
+    //if (env && env.PINOKIO_HTTPS_ACTIVE && (env.PINOKIO_HTTPS_ACTIVE==="1" || env.PINOKIO_HTTPS_ACTIVE.toLowerCase()==="true")) {
+    if (env && env.PINOKIO_HTTPS_ACTIVE && (env.PINOKIO_HTTPS_ACTIVE==="0" || env.PINOKIO_HTTPS_ACTIVE.toLowerCase()==="false")) {
+      //https_active = true
+      https_active = false 
     }
 //    console.log("kernel.refresh", { active, notify_peers })
 

package/kernel/peer.js

@@ -29,10 +29,11 @@ class PeerDiscovery {
     let env = await Environment.get(kernel.homedir)
 
     // by default expose to the local network
-    this.active = false
+    this.active = true
     // if PINOKIO_NETWORK_SHARE is 0 or false, turn it off
-    if (env && env.PINOKIO_NETWORK_ACTIVE && (env.PINOKIO_NETWORK_ACTIVE==="1" || env.PINOKIO_NETWORK_ACTIVE.toLowerCase()==="true")) {
-      this.active = true
+    if (env && env.PINOKIO_NETWORK_ACTIVE && (env.PINOKIO_NETWORK_ACTIVE==="0" || env.PINOKIO_NETWORK_ACTIVE.toLowerCase()==="false")) {
+    //if (env && env.PINOKIO_NETWORK_ACTIVE && (env.PINOKIO_NETWORK_ACTIVE==="1" || env.PINOKIO_NETWORK_ACTIVE.toLowerCase()==="true")) {
+      this.active = false
     }
 
     this.name = os.userInfo().username

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pinokiod",
-  "version": "3.11.0",
+  "version": "3.11.2",
   "description": "",
   "main": "index.js",
   "scripts": {

package/server/index.js

@@ -2449,6 +2449,10 @@ class Server {
         let p2 = path.resolve(home, "prototype")
         await fse.remove(p2)
 
+        let gitconfig = path.resolve(home, "gitconfig")
+        await fse.remove(gitconfig)
+
+
         console.log("[TRY] Updating to the new version")
         this.kernel.store.set("version", this.version.pinokiod)
         console.log("[DONE] Updating to the new version")
@@ -2770,6 +2774,51 @@ class Server {
 //      }
     }))
 
+    this.app.get("/check_router_up", ex(async (req, res) => {
+      // check if caddy is runnign properly
+      //    try https://pinokio.localhost
+      //    if it works, proceed
+      //    if not, redirect
+      let https_running = false
+      try {
+        let res = await axios.get(`http://127.0.0.1:2019/config/`, {
+          timeout: 2000
+        })
+        let test = /pinokio\.localhost/.test(JSON.stringify(res.data))
+        if (test) {
+          https_running = true
+        }
+      } catch (e) {
+        console.log(e)
+      }
+      console.log({ https_running })
+      if (!https_running) {
+        res.json({ error: "pinokio.host not yet available" })
+//        res.redirect("/setup/connect?callback=/connect/" + req.params.provider)
+        return
+      }
+
+
+      // check if pinokio.localhost router is running
+      let router_running = false
+      let router = this.kernel.router.published()
+      for(let ip in router) {
+        let domains = router[ip]
+        if (domains.includes("pinokio.localhost")) {
+          router_running = true
+          break
+        }
+      }
+      console.log({ router_running })
+      if (!router_running) {
+        res.json({ error: "pinokio.localhost not yet available" })
+//        res.redirect("/setup/connect?callback=/connect/" + req.params.provider)
+        return
+      }
+
+      res.json({ success: true })
+    }))
+
     /*
     GET /connect => display connection options
     - github
@@ -2804,32 +2853,13 @@ class Server {
       let { requirements, install_required, requirements_pending, error } = await this.kernel.bin.check({
         bin: this.kernel.bin.preset("connect"),
       })
-      console.log({ requirements_pending, install_required })
+      console.log("1", { requirements_pending, install_required })
       if (!requirements_pending && install_required) {
+        console.log("REDIRECT", req.params.provider)
         res.redirect("/setup/connect?callback=/connect/" + req.params.provider)
         return
       }
 
-      // check if router is running
-      let router_running = false
-      let router = this.kernel.router.published()
-      for(let ip in router) {
-        let domains = router[ip]
-        if (domains.includes("pinokio.localhost")) {
-          router_running = true
-          break
-        }
-      }
-      console.log({ router_running })
-      if (!router_running) {
-        res.redirect("/setup/connect?callback=/connect/" + req.params.provider)
-        return
-      }
-
-      // check if caddy is runnign properly
-      //    try https://pinokio.localhost
-      //    if it works, proceed
-      //    if not, redirect
       let https_running = false
       try {
         let res = await axios.get(`http://127.0.0.1:2019/config/`, {
@@ -2844,10 +2874,30 @@ class Server {
       }
       console.log({ https_running })
       if (!https_running) {
+//        res.json({ error: "pinokio.host not yet available" })
         res.redirect("/setup/connect?callback=/connect/" + req.params.provider)
         return
       }
 
+
+      // check if pinokio.localhost router is running
+      let router_running = false
+      let router = this.kernel.router.published()
+      for(let ip in router) {
+        let domains = router[ip]
+        if (domains.includes("pinokio.localhost")) {
+          router_running = true
+          break
+        }
+      }
+      console.log({ router_running })
+      if (!router_running) {
+//        res.json({ error: "pinokio.localhost not yet available" })
+        res.redirect("/setup/connect?callback=/connect/" + req.params.provider)
+        return
+      }
+
+
       let readme = await this.kernel.connect[req.params.provider].readme()
       res.render(`connect/${req.params.provider}`, {
         portal: this.portal,
@@ -3022,28 +3072,63 @@ class Server {
       }
       let md = await fs.promises.readFile(path.resolve(__dirname, "..", "kernel/connect/providers/github/README.md"), "utf8")
       let readme = marked.parse(md)
+
+      let hosts = ""
+      let hosts_file = this.kernel.path("config/gh/hosts.yml")
+      let e = await this.exists(hosts_file)
+      console.log({ hosts_file, e })
+      if (e) {
+        hosts = await fs.promises.readFile(hosts_file, "utf8")
+        console.log( { hosts: `#${hosts}#` })
+        if (hosts.startsWith("{}")) {
+          hosts = ""
+        }
+      }
+      console.log("hosts", hosts)
+
+      let items
+      if (hosts.length > 0) {
+        // logged in => display logout
+        items = [{
+          icon: "fa-solid fa-circle-xmark",
+          title: "Logout",
+          description: "Log out of Github",
+          url: "/github/logout"
+        }]
+      } else {
+        // logged out => display login
+        items = [{
+          icon: "fa-solid fa-key",
+          title: "Login",
+          description: "Log into Github",
+          url: "/github/login"
+        }]
+      }
+
       res.render("github", {
+        hosts,
         readme,
         portal: this.portal,
         logo: this.logo,
         theme: this.theme,
         agent: this.agent,
-        items: [{
-          icon: "fa-solid fa-key",
-          title: "Login",
-          description: "Log into Github",
-          url: "/github/login"
-        }, {
-          icon: "fa-solid fa-check",
-          title: "Status",
-          description: "Check Github login status",
-          url: "/github/status"
-        }, {
-          icon: "fa-solid fa-circle-xmark",
-          title: "Logout",
-          description: "Log out of Github",
-          url: "/github/logout"
-        }]
+        items
+//        items: [{
+//          icon: "fa-solid fa-key",
+//          title: "Login",
+//          description: "Log into Github",
+//          url: "/github/login"
+////        }, {
+////          icon: "fa-solid fa-check",
+////          title: "Status",
+////          description: "Check Github login status",
+////          url: "/github/status"
+//        }, {
+//          icon: "fa-solid fa-circle-xmark",
+//          title: "Logout",
+//          description: "Log out of Github",
+//          url: "/github/logout"
+//        }]
       })
     }))
     this.app.get("/github/status", ex(async (req, res) => {
@@ -3067,7 +3152,7 @@ class Server {
       params.set("message", encodeURIComponent(message))
       params.set("path", this.kernel.homedir)
 //      params.set("kill", "/Logged in/i")
-      params.set("kill_message", "Click to return home")
+//      params.set("kill_message", "Click to return home")
       params.set("callback", encodeURIComponent("/github"))
       params.set("id", id)
       params.set("target", "_top")
@@ -3091,7 +3176,7 @@ class Server {
       params.set("input", true)
       params.set("path", this.kernel.homedir)
       params.set("kill", "/Logged in/i")
-      params.set("kill_message", "Your Github account is now connected.")
+//      params.set("kill_message", "Your Github account is now connected.")
       params.set("callback", encodeURIComponent("/github"))
       params.set("id", id)
       params.set("target", "_top")
@@ -3229,14 +3314,38 @@ class Server {
         bin
       })
       // set dependencies for conda
+      let cr = new Set()
       for(let i=0; i<requirements.length; i++) {
         let r = requirements[i]
         if (r.name === "conda") {
           requirements[i].dependencies = bin.conda_requirements
+          if (bin.conda_requirements) {
+            for(let r of bin.conda_requirements) {
+              cr.add(r)
+            }
+          }
         }
       }
+
+      // if the setup mode includes caddy, wait
+      let wait = null
+      if (cr.has("caddy")) {
+        wait = "caddy"
+      }
+      console.log({ wait, cr })
+
       let current = req.query.callback || req.originalUrl
+      console.log("render setup", { current })
+
+//      console.log("2", { requirements_pending, install_required })
+//      if (!requirements_pending && !install_required) {
+//        console.log("redirect", current)
+//        res.redirect(current)
+//        return
+//      }
+//
       res.render("setup", {
+        wait,
         error,
         current,
         install_required,
@@ -4392,6 +4501,7 @@ class Server {
       res.redirect("/pinokio/install")
     }))
     this.app.get("/pinokio/install", ex((req, res) => {
+      console.log("render /pinokio/install")
       let requirements = req.session.requirements
       let callback = req.session.callback
       req.session.requirements = null

package/server/public/common.js

@@ -48,6 +48,11 @@ document.addEventListener("DOMContentLoaded", () => {
       history.forward()
     })
   }
+  if (document.querySelector("#refresh-page")) {
+    document.querySelector("#refresh-page").addEventListener("click", (e) => {
+      location.reload()
+    })
+  }
   if (document.querySelector("#genlog")) {
     document.querySelector("#genlog").addEventListener("click", (e) => {
       e.preventDefault()

package/server/public/nav.js

@@ -15,6 +15,7 @@ document.addEventListener("DOMContentLoaded", () => {
   if (document.querySelector("#new-window")) {
     document.querySelector("#new-window").addEventListener("click", (e) => {
       let agent = document.body.getAttribute("data-agent")
+      debugger
       if (agent === "electron") {
         window.open("/", "_blank", "self")
       } else {

package/server/public/style.css

@@ -367,8 +367,8 @@ footer b {
   justify-content: center;
 }
 .requirements .loading {
-  font-size: 48px;
-  font-weight: bold;
+  font-size: 28px;
+  font-weight: lighter;
 }
 .requirements .btn-group {
   padding: 10px 0;

package/server/views/app.ejs

@@ -735,12 +735,13 @@ body.dark .appcanvas {
 <script src="/filepond.min.js"></script>
 <script src="/fseditor.js"></script>
 </head>
-<body class='<%=theme%>' data-platform="<%=platform%>">
+<body class='<%=theme%>' data-platform="<%=platform%>" data-agent="<%=agent%>">
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <button class='btn2' id='back'><div><i class="fa-solid fa-chevron-left"></i></div><div>Prev</div></button>
 <button class='btn2' id='forward'><div><i class="fa-solid fa-chevron-right"></i></div><div>Next</div></button>
+<button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
 <a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>

package/server/views/connect/x.ejs

@@ -125,8 +125,11 @@ hr {
 table {
   table-layout: fixed;
   width: 100%;
+  box-sizing: border-box;
 }
 td {
+  background: rgba(0,0,0,0.04);
+  padding: 10px;
   word-wrap:break-word;
   font-size: 14px;
 }
@@ -135,7 +138,7 @@ td.key {
   color: royalblue;
 }
 .head {
-  padding: 80px;
+  padding: 30px;
   text-align: center;
 }
 .head .desc {
@@ -185,12 +188,13 @@ pre {
 <script src="/highlight.js"></script>
 <script src="/highlight-js.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <button class='btn2' id='back'><div><i class="fa-solid fa-chevron-left"></i></div><div>Prev</div></button>
 <button class='btn2' id='forward'><div><i class="fa-solid fa-chevron-right"></i></div><div>Next</div></button>
+<button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
 <a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
@@ -224,6 +228,7 @@ pre {
   hljs.highlightAll();
 
   const render = (kv) => {
+    console.log("render", kv)
     let html = Object.keys(kv).map((key) => {
       return `<tr><td class='key'>${key}</td><td>${kv[key]}</td></tr>`
     }).join("")

package/server/views/connect.ejs

@@ -223,12 +223,13 @@ body.dark .config {
 <script src="/common.js"></script>
 <script src="/opener.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <button class='btn2' id='back'><div><i class="fa-solid fa-chevron-left"></i></div><div>Prev</div></button>
 <button class='btn2' id='forward'><div><i class="fa-solid fa-chevron-right"></i></div><div>Next</div></button>
+<button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
 <a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>

package/server/views/download.ejs

@@ -105,15 +105,16 @@ body.frozen {
 <script src="/report.js"></script>
 </head>
 <% if (install_required) { %>
-<body class='frozen <%=theme%>'>
+<body class='frozen <%=theme%>' data-agent="<%=agent%>">
 <% } else { %>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <% } %>
 <header class='grabbable'>
 <h1>
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <button class='btn2' id='back'><div><i class="fa-solid fa-chevron-left"></i></div><div>Prev</div></button>
 <button class='btn2' id='forward'><div><i class="fa-solid fa-chevron-right"></i></div><div>Next</div></button>
+<button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
 <a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>

package/server/views/editor.ejs

@@ -858,9 +858,9 @@ const reloadMemory = async () => {
 </script>
 </head>
 <% if (install_required) { %>
-<body class='columns frozen <%=theme%>'>
+<body class='columns frozen <%=theme%>' data-agent="<%=agent%>">
 <% } else { %>
-<body class='columns <%=theme%>'>
+<body class='columns <%=theme%>' data-agent="<%=agent%>">
 <% } %>
   <header class='navheader'>
   <h1>

package/server/views/env_editor.ejs

@@ -264,7 +264,7 @@ document.addEventListener("DOMContentLoaded", async () => {
 })
 </script>
 </head>
-<body class='<%=theme%> <%=init ? 'center' : ''%>'>
+<body class='<%=theme%> <%=init ? 'center' : ''%>' data-agent="<%=agent%>">
   <main>
     <% if (init) { %>
       <div>

package/server/views/explore.ejs

@@ -117,12 +117,13 @@ body main iframe {
 <script src="/sweetalert2.js"></script>
 <script src="/nav.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <button class='btn2' id='back'><div><i class="fa-solid fa-chevron-left"></i></div><div>Prev</div></button>
 <button class='btn2' id='forward'><div><i class="fa-solid fa-chevron-right"></i></div><div>Next</div></button>
+<button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
 <a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>

package/server/views/file_explorer.ejs

@@ -148,7 +148,7 @@ body.dark .browser-options-row {
 <script src="/fuse.js"></script>
 <script src="/report.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <% if (error) { %>
 <nav class='error-message'>
   <div><%=error%></div>
@@ -165,6 +165,7 @@ body.dark .browser-options-row {
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <button class='btn2' id='back'><i class="fa-solid fa-chevron-left"></i></button>
 <button class='btn2' id='forward'><i class="fa-solid fa-chevron-right"></i></button>
+<button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
 <% } %>
 <% paths.forEach((path) => { %>
   <% if (path.action) { %>

package/server/views/frame.ejs

@@ -45,7 +45,7 @@ main iframe {
 }
 </style>
 </head>
-<body class='columns <%=theme%>'>
+<body class='columns <%=theme%>' data-agent="<%=agent%>">
 <header>
 <h1>
 <% paths.forEach((path) => { %>

package/server/views/general_editor.ejs

@@ -185,7 +185,7 @@ document.addEventListener("DOMContentLoaded", async () => {
 })
 </script>
 </head>
-<body class='columns <%=theme%>'>
+<body class='columns <%=theme%>' data-agent="<%=agent%>">
   <header class='navheader grabbable'>
   <h1>
     <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>

package/server/views/github.ejs

@@ -110,9 +110,16 @@ main {
   margin: 0 auto;
   max-width: 800px;
   width: 100%;
+  align-items: center;
+}
+.setup-items pre {
+  width: 100%;
+  padding: 30px;
+  background: rgba(0,0,0,0.04) !important;
+  margin-bottom: 20px;
 }
 .head {
-  padding: 80px;
+  padding: 30px;
   text-align: center;
 }
 .head .desc {
@@ -172,12 +179,13 @@ hr {
 <script src="/common.js"></script>
 <script src="/opener.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <button class='btn2' id='back'><div><i class="fa-solid fa-chevron-left"></i></div><div>Prev</div></button>
 <button class='btn2' id='forward'><div><i class="fa-solid fa-chevron-right"></i></div><div>Next</div></button>
+<button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
 <a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>
@@ -197,12 +205,17 @@ hr {
   <div class='head'>
     <h3><i class="fa-brands fa-github"></i><br><br>Connect with Github</h3>
   </div>
+  <div class='setup-items'>
+    <% if (hosts.length > 0) { %>
+      <pre><%=hosts%></pre>
+    <% } else { %>
+      <pre>not logged in</pre>
+    <% } %>
+  </div>
   <div class='setup-items'>
     <% items.forEach((item) => { %>
-      <a class='card' href="<%=item.url%>">
-        <i class="<%=item.icon%>"></i>
-        <h3><%=item.title%></h3>
-        <div class='desc'><%=item.description%></div>
+      <a class='btn' href="<%=item.url%>">
+        <i class="<%=item.icon%>"></i> <%=item.title%>
       </a>
     <% }) %>
   </div>

package/server/views/help.ejs

@@ -250,12 +250,13 @@ body.dark .item .tile .badge {
 <script src="/nav.js"></script>
 <script src="/report.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <button class='btn2' id='back'><div><i class="fa-solid fa-chevron-left"></i></div><div>Prev</div></button>
 <button class='btn2' id='forward'><div><i class="fa-solid fa-chevron-right"></i></div><div>Next</div></button>
+<button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
 <a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
 <div class='flexible'></div>

package/server/views/install.ejs

@@ -131,7 +131,7 @@ body {
 <script src="/waitmodal.js"></script>
 <script src="/notifyinput.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='grabbable'></header>
 <div id='status-screen'><b><i class="fas fa-circle-notch fa-spin"></i> Setting up...</b><br>Setting up core modules including conda, uv, git, etc.</div>
 <div class='terminal-container'>
@@ -187,6 +187,7 @@ const createTerm = async (_theme) => {
   return term
 }
 document.addEventListener("DOMContentLoaded", async () => {
+  debugger
   const n = new N()
   let socket = new Socket()
   <% if (theme === "dark") { %>

package/server/views/keys.ejs

@@ -247,7 +247,7 @@ document.addEventListener("DOMContentLoaded", async () => {
 })
 </script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
   <main>
     <header class='navheader grabbable'>
       <h1>

package/server/views/network.ejs

@@ -398,12 +398,13 @@ input:checked + .slider:before {
 <script src="/common.js"></script>
 <script src="/opener.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <button class='btn2' id='back'><div><i class="fa-solid fa-chevron-left"></i></div><div>Prev</div></button>
 <button class='btn2' id='forward'><div><i class="fa-solid fa-chevron-right"></i></div><div>Next</div></button>
+<button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
 <a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>

package/server/views/pre.ejs

@@ -106,7 +106,7 @@ footer a.btn {
 }
 </style>
 </head>
-<body class='columns <%=theme%>'>
+<body class='columns <%=theme%>' data-agent="<%=agent%>">
   <header class='navheader grabbable'>
   </header>
   <main>

package/server/views/prototype/old_index.ejs

@@ -541,7 +541,7 @@ body.dark .header-item.cursor.header-top {
 <script src="/filepond.min.js"></script>
 <script src="/commander.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='navheader grabbable'>
 <h1>
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>

package/server/views/prototype/show.ejs

@@ -573,7 +573,7 @@ body.dark .header-item.cursor.header-top {
 <script src="/filepond.min.js"></script>
 <script src="/commander.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <div class='appcanvas'>
   <main>
   <div class='doc'>

package/server/views/required_env_editor.ejs

@@ -257,7 +257,7 @@ document.addEventListener("DOMContentLoaded", async () => {
 })
 </script>
 </head>
-<body class='<%=theme%> center'>
+<body class='<%=theme%> center' data-agent="<%=agent%>">
   <main>
     <div>
       <h1><%=filename%></h1>

package/server/views/settings.ejs

@@ -254,7 +254,7 @@ body.dark .keys pre {
 <script src="/nav.js"></script>
 <script src="/report.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <!--
 <nav>
   <a class='logo' href="/">dal</a>
@@ -265,6 +265,7 @@ body.dark .keys pre {
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <button class='btn2' id='back'><div><i class="fa-solid fa-chevron-left"></i></div><div>Prev</div></button>
 <button class='btn2' id='forward'><div><i class="fa-solid fa-chevron-right"></i></div><div>Next</div></button>
+<button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
 <a class='btn2 create-new' id='create-new-folder'><div><i class="fa-solid fa-folder-plus"></i></div><div>Create</div></a>
 <a class='btn2' id='explore' href="/?mode=explore"><div><i class="fa-solid fa-magnifying-glass"></i></div><div>Discover</div></a>
 <a href="/network" class='btn2'><div><i class="fa-solid fa-wifi"></i></div><div>Network</div></a>

package/server/views/setup.ejs

@@ -126,7 +126,7 @@ body {
 <script src="/common.js"></script>
 <script src="/report.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='grabbable'>
 <h1>
 <a class='path' href="/"><%-logo%></a>
@@ -146,55 +146,58 @@ body {
     <div class='content'>
       <div class='loading'>
         <i class="fa-solid fa-circle-notch fa-spin"></i>
+        <span>Stand by...</span>
+      </div>
+    </div>
+  </div>
+<% } else if (!install_required && wait === 'caddy') { %>
+  <div class='requirements'>
+    <div class='content'>
+      <div class='loading'>
+        <i class="fa-solid fa-circle-notch fa-spin"></i>
+        <span>Stand by...</span>
       </div>
     </div>
   </div>
 <% } else { %>
-  <% if (true || install_required) { %>
-    <div class='requirements'>
-      <div class='content'>
-        <% if (install_required) { %>
-          <div class='title'><i class="fa-solid fa-circle-exclamation"></i> Installation required</div>
-        <% } else { %>
-          <div class='title'><i class="fa-solid fa-circle-exclamation"></i> Installation complete</div>
-        <% } %>
-        <div class='btn-group'>
-          <% requirements.map((r) => { %>
-            <div class='requirement-item'>
-              <% if (r.installed) { %>
-                <div class='name'><%=r.name%></div>
-                <div class='flexible'></div>
-                <div class='label'>Installed</div>
-              <% } else { %>
-                <div class='name highlighted'><%=r.name%></div>
-                <div class='flexible'></div>
-                <div class='label highlighted'>Not Installed</div>
-              <% } %>
-            </div>
-          <% }) %>
-        </div>
-        <% if (!install_required) { %>
-          <a class='btn' href="/">Return home</a>
-        <% } %>
-        <form class="<%= install_required ? '' : 'hidden'%>" id='install-form' method="post" action="/pinokio/install">
-          <input type='hidden' name="requirements" value="<%=JSON.stringify(requirements)%>">
-          <input type='hidden' name='callback' value="<%=current%>">
-          <button class='btn'>Install</button>
-        </form>
-        <div class='item'>
-          <div class='d'>Not working? <a id='del-bin'>Try a fresh install</a></div>
-          <div class='reset-bin-loading hidden'>
-            <i class="fa-solid fa-circle-notch fa-spin"></i> Stand by. Do not close this window..
+  <div class='requirements'>
+    <div class='content'>
+      <% if (install_required) { %>
+        <div class='title'><i class="fa-solid fa-circle-exclamation"></i> Installation required</div>
+      <% } else { %>
+        <div class='title'><i class="fa-solid fa-circle-exclamation"></i> Installation complete</div>
+      <% } %>
+      <div class='btn-group'>
+        <% requirements.map((r) => { %>
+          <div class='requirement-item'>
+            <% if (r.installed) { %>
+              <div class='name'><%=r.name%></div>
+              <div class='flexible'></div>
+              <div class='label'>Installed</div>
+            <% } else { %>
+              <div class='name highlighted'><%=r.name%></div>
+              <div class='flexible'></div>
+              <div class='label highlighted'>Not Installed</div>
+            <% } %>
           </div>
+        <% }) %>
+      </div>
+      <% if (!install_required) { %>
+        <a class='btn' href="<%=current%>">Continue</a>
+      <% } %>
+      <form class="<%= install_required ? '' : 'hidden'%>" id='install-form' method="post" action="/pinokio/install">
+        <input type='hidden' name="requirements" value="<%=JSON.stringify(requirements)%>">
+        <input type='hidden' name='callback' value="<%=current%>">
+        <button class='btn'>Install</button>
+      </form>
+      <div class='item'>
+        <div class='d'>Not working? <a id='del-bin'>Try a fresh install</a></div>
+        <div class='reset-bin-loading hidden'>
+          <i class="fa-solid fa-circle-notch fa-spin"></i> Stand by. Do not close this window..
         </div>
       </div>
     </div>
-  <% } else { %>
-    <main>
-      <div id='terminal'>all installed</div>
-      <a href="/" class='btn'>Home</a>
-    </main>
-  <% } %>
+  </div>
 <% } %>
 <script>
 document.addEventListener("DOMContentLoaded", async () => {
@@ -221,6 +224,39 @@ document.addEventListener("DOMContentLoaded", async () => {
     })
     location.href = location.href
   <% } %>
+  <% if (!requirements_pending && !install_required && wait === "caddy") { %>
+    console.log("RESTART")
+
+    let r = await fetch("/network", {
+      method: "post",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        PINOKIO_NETWORK_ACTIVE: "1",
+        PINOKIO_HTTPS_ACTIVE: "1",
+      })
+    }).then((res) => {
+      return res.json()
+    })
+    fetch("/restart", {
+      method: "post"
+    }, () => {
+    })
+    console.log("Fetch finished")
+    await new Promise((resolve, reject) => {
+      let interval = setInterval(() => {
+        fetch("/check_router_up").then((res) => {
+          return res.json()
+        }).then((res) => {
+          console.log(res)
+          if (res.success) {
+            clearInterval(interval)
+            resolve()
+          }
+        })
+      }, 500)
+    })
+    location.href = "<%=current%>"
+  <% } %>
   if (document.querySelector("#del-bin")) {
     document.querySelector("#del-bin").addEventListener("click", async (e) => {
       console.log("del-bin")

package/server/views/setup_home.ejs

@@ -148,7 +148,7 @@ body.dark .card {
 </style>
 <script src="/common.js"></script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <header class='grabbable'>
 <h1>
 <a class='path' href="/"><%-logo%></a>

package/server/views/share_editor.ejs

@@ -255,7 +255,7 @@ document.addEventListener("DOMContentLoaded", async () => {
 })
 </script>
 </head>
-<body class='columns <%=theme%>'>
+<body class='columns <%=theme%>' data-agent="<%=agent%>">
   <main>
     <div id='editor'>
       <h1>Share Apps</h1>

package/server/views/shell.ejs

@@ -575,8 +575,13 @@ document.addEventListener("DOMContentLoaded", async () => {
               <% if (callback) { %>
               callbacks: {
                 onClose: () => {
+                  // reload after 500ms in case the page didn't change because only the hash changed.
+                  // if it's a different url, the location.reload won't trigger since location.href
+                  // assingment will send the user to the url before settimeout happens
                   location.href = "<%=callback%>"
-                  location.reload()
+                  setTimeout(() => {
+                    location.reload()
+                  }, 500)
                 }
               }
               <% } %>
@@ -584,7 +589,12 @@ document.addEventListener("DOMContentLoaded", async () => {
           <% } else { %>
             <% if (callback) { %>
             location.href = "<%=callback%>"
-            location.reload()
+            // reload after 500ms in case the page didn't change because only the hash changed.
+            // if it's a different url, the location.reload won't trigger since location.href
+            // assingment will send the user to the url before settimeout happens
+            setTimeout(() => {
+              location.reload()
+            }, 500)
             <% } %>
           <% } %>
         })
@@ -757,7 +767,7 @@ document.addEventListener("DOMContentLoaded", async () => {
 
 </script>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
   <% if (target === "_top") { %>
     <header class='navheader grabbable'>
   <% } else { %>
@@ -767,6 +777,7 @@ document.addEventListener("DOMContentLoaded", async () => {
       <% if (target === "_top") { %>
       <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
       <% } %>
+      <button class='btn2' id='refresh-page'><div><i class="fa-solid fa-rotate-right"></i></div><div>Refresh</div></button>
       <div class='hidden btn run play-btn'>
         <span class='play'><i class="fa-solid fa-play"></i> Start</span>
       </div>

package/server/views/sidebar.ejs

@@ -34,7 +34,7 @@ html, body {
 }
 </style>
 </head>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <a class='home' href="/"><img class='icon' src="/pinokio-black.png"></a>
 <a class='header-item' href="<%=home%>">
   <img src="<%=rawpath%>/<%=config.icon%>?raw=true"/>

package/server/views/terminal.ejs

@@ -893,9 +893,9 @@ const reloadMemory = async () => {
 </script>
 </head>
 <% if (install_required) { %>
-<body class='frozen <%=theme%>'>
+<body class='frozen <%=theme%>' data-agent="<%=agent%>">
 <% } else { %>
-<body class='<%=theme%>'>
+<body class='<%=theme%>' data-agent="<%=agent%>">
 <% } %>
   <% if (!install_required) { %>
     <header class='navheader2'>