move global app

src/main/setup.js

@@ -37,7 +37,7 @@ async function main() {
     let rclone_exec = Vars.rclone_path
 
     if (!fs.existsSync(sevenzip_exec)) {
-        global.win.webContents.send("initializing_text", "Downloading 7z binaries...")
+        global.win.webContents.send("setup:step", "Downloading 7z binaries...")
         console.log(`Downloading 7z binaries...`)
 
         fs.mkdirSync(path.resolve(binariesPath, "7z-bin"), { recursive: true })
@@ -63,7 +63,7 @@ async function main() {
         const binPath = path.resolve(binariesPath, "git-bin")
 
         if (!fs.existsSync(tempPath)) {
-            global.win.webContents.send("initializing_text", "Downloading GIT binaries...")
+            global.win.webContents.send("setup:step", "Downloading GIT binaries...")
             console.log(`Downloading git binaries...`)
 
             let url = resolveDestBin(`https://storage.ragestudio.net/rstudio/binaries/git`, "git-bundle-2.4.0.zip")
@@ -74,7 +74,7 @@ async function main() {
             )
         }
 
-        global.win.webContents.send("initializing_text", "Extracting GIT binaries...")
+        global.win.webContents.send("setup:step", "Extracting GIT binaries...")
         console.log(`Extracting GIT...`)
 
         await new Promise((resolve, reject) => {
@@ -86,7 +86,7 @@ async function main() {
 
     if (!fs.existsSync(Vars.rclone_path)) {
         console.log(`Downloading rclone binaries...`)
-        global.win.webContents.send("initializing_text", "Downloading rclone binaries...")
+        global.win.webContents.send("setup:step", "Downloading rclone binaries...")
 
         const tempPath = path.resolve(binariesPath, "rclone-bin.zip")
 
@@ -97,7 +97,7 @@ async function main() {
             fs.createWriteStream(tempPath)
         )
 
-        global.win.webContents.send("initializing_text", "Extracting rclone binaries...")
+        global.win.webContents.send("setup:step", "Extracting rclone binaries...")
 
         await new Promise((resolve, reject) => {
             fs.createReadStream(tempPath).pipe(unzipper.Extract({ path: path.resolve(binariesPath, "rclone-bin") })).on("close", resolve).on("error", reject)
@@ -112,7 +112,7 @@ async function main() {
 
     if (!fs.existsSync(Vars.java_path)) {
         console.log(`Downloading java binaries...`)
-        global.win.webContents.send("initializing_text", "Downloading Java JDK...")
+        global.win.webContents.send("setup:step", "Downloading Java JDK...")
 
         const tempPath = path.resolve(binariesPath, "java-jdk.zip")
 
@@ -123,7 +123,7 @@ async function main() {
             fs.createWriteStream(tempPath)
         )
 
-        global.win.webContents.send("initializing_text", "Extracting JAVA...")
+        global.win.webContents.send("setup:step", "Extracting JAVA...")
 
         await new Promise((resolve, reject) => {
             fs.createReadStream(tempPath).pipe(unzipper.Extract({ path: path.resolve(binariesPath, "java-jdk") })).on("close", resolve).on("error", reject)
@@ -140,6 +140,9 @@ async function main() {
     console.log(`GIT binaries: ${git_exec}`)
     console.log(`rclone binaries: ${rclone_exec}`)
     console.log(`JAVA jdk: ${Vars.java_path}`)
+
+    global.win.webContents.send("setup:step", undefined)
+    global.win.webContents.send("setup:done")
 }
 
 export default main

src/renderer/src/App.jsx

@@ -1,61 +1,19 @@
+import GlobalApp from "./GlobalApp.jsx"
+
 import React from "react"
-import versions from "utils/getVersions"
 import * as antd from "antd"
 
+import versions from "utils/getVersions"
 import GlobalStateContext from "contexts/global"
 
-import getRootCssVar from "utils/getRootCssVar"
-
-import ManifestInfo from "components/ManifestInfo"
-import PackageUpdateAvailable from "components/PackageUpdateAvailable"
-import InstallConfigAsk from "components/InstallConfigAsk"
-
 import AppLayout from "layout"
 import AppModalDialog from "layout/components/ModalDialog"
+import AppDrawer from "layout/components/Drawer"
 
 import { InternalRouter, PageRender } from "./router.jsx"
 
-globalThis.getRootCssVar = getRootCssVar
-globalThis.notification = antd.notification
-globalThis.message = antd.message
-
 // create a global app context
-window.app = {
+window.app = GlobalApp
-  applyUpdate: () => {
-    antd.message.loading("Updating, please wait...")
-
-    ipc.exec("updater:apply")
-  },
-  invokeInstall: (manifest) => {
-    console.log(`installation invoked >`, manifest)
-
-    app.modal.open(ManifestInfo, {
-      manifest: manifest,
-      close: () => {
-        app.modal.close()
-      }
-    })
-  },
-  pkgUpdateAvailable: (update_data) => {
-    app.modal.open(PackageUpdateAvailable, {
-      update: update_data,
-      close: () => {
-        app.modal.close()
-      }
-    })
-  },
-  pkgInstallWizard: (manifest) => {
-    app.modal.open(InstallConfigAsk, {
-      manifest: manifest,
-      close: () => {
-        app.modal.close()
-      }
-    })
-  },
-  checkUpdates: () => {
-    ipc.exec("updater:check")
-  },
-}
 
 class App extends React.Component {
   state = {
@@ -92,20 +50,35 @@ class App extends React.Component {
       antd.message[data.type || "info"](data.message)
     },
     "app:update_available": (event, data) => {
-      this.onUpdateAvailable(data)
+      if (this.state.loading) {
+        return false
+      }
+
+      this.setState({
+        updateAvailable: true,
+      })
+
+      app.appUpdateAvailable(data)
     },
     "pkg:install:ask": (event, data) => {
+      if (this.state.loading) {
+        return false
+      }
+
       app.pkgInstallWizard(data)
     },
     "pkg:update_available": (event, data) => {
+      if (this.state.loading) {
+        return false
+      }
+
       app.pkgUpdateAvailable(data)
     },
-    "initializing_text": (event, data) => {
-      this.setState({
-        initializing_text: data,
-      })
-    },
     "installation:invoked": (event, manifest) => {
+      if (this.state.loading) {
+        return false
+      }
+
       app.invokeInstall(manifest)
     },
     "drive:authorized": (event, data) => {
@@ -126,56 +99,24 @@ class App extends React.Component {
 
       message.success("Google Drive API unauthorized")
     },
-    "app:checking_update_downloading": (event, data) => {
+    "setup:step": (event, data) => {
       this.setState({
-        updateText: "Downloading update..."
+        setup_step: data,
       })
     },
-    "app:checking_update": (event, data) => {
-      this.setState({
-        updateText: "Checking for updates..."
-      })
-    },
-    "app:checking_update_error": (event, data) => {
-      this.setState({
-        updateText: null
-      })
-    },
-  }
-
-  onUpdateAvailable = () => {
-    this.setState({
-      updateAvailable: true,
-    })
-
-    console.log(data)
-
-    antd.Modal.confirm({
-      title: "Update Available",
-      content: <>
-        <p>
-          A new version of the application is available.
-        </p>
-      </>,
-      okText: "Update",
-      cancelText: "Later",
-      onOk: () => {
-        app.applyUpdate()
-      }
-    })
   }
 
   componentDidMount = async () => {
-    for (const event in this.ipcEvents) {
-      ipc.on(event, this.ipcEvents[event])
-    }
-
     const initResult = await ipc.exec("app:init")
 
     console.log(`Using React version > ${versions["react"]}`)
     console.log(`Using DOMRouter version > ${versions["react-router-dom"]}`)
     console.log(`[APP] app:init() | Result >`, initResult)
 
+    for (const event in this.ipcEvents) {
+      ipc.exclusiveListen(event, this.ipcEvents[event])
+    }
+
     app.location.push("/")
 
     this.setState({
@@ -187,12 +128,6 @@ class App extends React.Component {
     })
   }
 
-  componentWillUnmount = () => {
-    for (const event in this.ipcEvents) {
-      ipc.off(event, this.ipcEvents[event])
-    }
-  }
-
   render() {
     return <antd.ConfigProvider
       theme={{
@@ -206,6 +141,8 @@ class App extends React.Component {
     >
       <InternalRouter>
         <GlobalStateContext.Provider value={this.state}>
+
+          <AppDrawer />
           <AppModalDialog />
 
           <AppLayout>

src/renderer/src/GlobalApp.jsx

@@ -0,0 +1,68 @@
+import { notification, message, Modal } from "antd"
+
+import ManifestInfo from "components/ManifestInfo"
+import PackageUpdateAvailable from "components/PackageUpdateAvailable"
+import InstallConfigAsk from "components/InstallConfigAsk"
+
+import getRootCssVar from "utils/getRootCssVar"
+
+globalThis.getRootCssVar = getRootCssVar
+globalThis.notification = notification
+globalThis.message = message
+
+export default class GlobalCTXApp {
+    static applyUpdate = () => {
+        message.loading("Updating, please wait...")
+
+        ipc.exec("updater:apply")
+    }
+
+    static invokeInstall = (manifest) => {
+        console.log(`installation invoked >`, manifest)
+
+        app.drawer.open(ManifestInfo, {
+            title: "New installation",
+            props: {
+                manifest: manifest,
+            }
+        })
+    }
+
+    static pkgUpdateAvailable = (update_data) => {
+        app.drawer.open(PackageUpdateAvailable, {
+            title: "Update Available",
+            props: {
+                update: update_data,
+            }
+        })
+    }
+
+    static pkgInstallWizard = (manifest) => {
+        app.drawer.open(InstallConfigAsk, {
+            title: "Configure installation",
+            props: {
+                manifest: manifest,
+            }
+        })
+    }
+
+    static appUpdateAvailable = (update_data) => {
+        Modal.confirm({
+            title: "Update Available",
+            content: <>
+                <p>
+                    A new version of the application is available.
+                </p>
+            </>,
+            okText: "Update",
+            cancelText: "Later",
+            onOk: () => {
+                app.applyUpdate()
+            }
+        })
+    }
+
+    static checkUpdates = () => {
+        ipc.exec("updater:check")
+    }
+}

src/renderer/src/router.jsx

@@ -155,7 +155,7 @@ export const PageRender = (props) => {
 
     const globalState = React.useContext(GlobalStateContext)
 
-    if (globalState.initializing_text && globalState.loading) {
+    if (globalState.setup_step && globalState.loading) {
         return <div className="app_setup">
             <BarLoader
                 className="app_loader"
@@ -165,7 +165,7 @@ export const PageRender = (props) => {
             <h1>Setting up...</h1>
 
             <code>
-                <pre>{globalState.initializing_text}</pre>
+                <pre>{globalState.setup_step}</pre>
             </code>
         </div>
     }