use app drawer

src/renderer/src/layout/components/Drawer/index.jsx

@@ -0,0 +1,45 @@
+import React from "react"
+import { Drawer } from "antd"
+
+const AppDrawer = () => {
+    const [render, setRender] = React.useState(null)
+
+    const c_interface = {
+        open: (component, params) => {
+            setRender({
+                component: component,
+                params: params ?? {}
+            })
+        },
+        close: () => {
+            setRender(null)
+        }
+    }
+
+    React.useEffect(() => {
+        window.app.drawer = c_interface
+
+        return () => {
+            window.app.drawer = null
+            delete window.app.drawer
+        }
+    }, [])
+
+    return <Drawer
+        open={render !== null}
+        onClose={() => c_interface.close()}
+        destroyOnClose
+        placement="bottom"
+        title={render && render.params && render.params.title}
+        height={render && render.params && render.params.height}
+    >
+        {
+            render && render.component && React.createElement(render.component, {
+                ...render.params.props ?? {},
+                close: () => c_interface.close()
+            })
+        }
+    </Drawer>
+}
+
+export default AppDrawer

src/renderer/src/pages/index.jsx

@@ -13,16 +13,6 @@ import "./index.less"
 class InstallationsManager extends React.Component {
     static contextType = InstallationsContext
 
-    state = {
-        drawerVisible: false,
-    }
-
-    toggleDrawer = (to) => {
-        this.setState({
-            drawerVisible: to ?? !this.state.drawerVisible,
-        })
-    }
-
     render() {
         const { packages } = this.context
 
@@ -33,7 +23,10 @@ class InstallationsManager extends React.Component {
                 <antd.Button
                     type="primary"
                     icon={<MdAdd />}
-                    onClick={() => this.toggleDrawer(true)}
+                    onClick={() => app.drawer.open(NewInstallation, {
+                        title: "Add new installation",
+                        height: "200px",
+                    })}
                 >
                     Add new installation
                 </antd.Button>
@@ -57,18 +50,6 @@ class InstallationsManager extends React.Component {
                     })
                 }
             </div>
-
-            <antd.Drawer
-                title="Add new installation"
-                placement="bottom"
-                open={this.state.drawerVisible}
-                height={"200px"}
-                onClose={() => this.toggleDrawer(false)}
-            >
-                <NewInstallation
-                    close={() => this.toggleDrawer(false)}
-                />
-            </antd.Drawer>
         </div>
     }
 }

src/renderer/src/pages/pkg/[pkg_id].jsx

@@ -74,20 +74,14 @@ const PackageOptions = (props) => {
     })
 
     async function applyChanges() {
-        if (props.onClose) {
-            props.onClose()
-        }
-
-        if (props.close) {
-            props.close()
-        }
-
         setLoading(true)
 
         await ipc.exec("pkg:apply", manifest.id, changes).catch((err) => {
             console.log(err)
         })
 
+        app.location.back()
+
         setLoading(false)
     }