hyperware-ai · dr-frmr · May 31, 2024 · May 29, 2024 · May 29, 2024 · May 31, 2024
diff --git a/kinode/packages/app_store/app_store/src/utils.rs b/kinode/packages/app_store/app_store/src/utils.rs
@@ -56,17 +56,18 @@ impl OnchainMetadata {
 /// fetch state from disk or create a new one if that fails
 pub fn fetch_state(our: Address, provider: eth::Provider) -> State {
     if let Some(state_bytes) = get_state() {
-        if let Ok(state) = serde_json::from_slice::<SerializedState>(&state_bytes) {
-            if state.contract_address == CONTRACT_ADDRESS {
-                return State::from_serialized(our, provider, state);
-            } else {
-                println!(
-                    "state contract address mismatch! expected {}, got {}",
-                    CONTRACT_ADDRESS, state.contract_address
-                );
+        match serde_json::from_slice::<SerializedState>(&state_bytes) {
+            Ok(state) => {
+                if state.contract_address == CONTRACT_ADDRESS {
+                    return State::from_serialized(our, provider, state);
+                } else {
+                    println!(
+                        "state contract address mismatch! expected {}, got {}",
+                        CONTRACT_ADDRESS, state.contract_address
+                    );
+                }
             }
-        } else {
-            println!("failed to deserialize saved state");
+            Err(e) => println!("failed to deserialize saved state: {e}"),
         }
     }
     State::new(our, provider, CONTRACT_ADDRESS.to_string()).expect("state creation failed")

diff --git a/kinode/packages/app_store/pkg/ui/assets/index-EAwGkdAI.css b/kinode/packages/app_store/pkg/ui/assets/index-EAwGkdAI.css
diff --git a/...app_store/pkg/ui/assets/index--h2dsLNv.js → ...app_store/pkg/ui/assets/index-GPWa2djr.js b/...app_store/pkg/ui/assets/index--h2dsLNv.js → ...app_store/pkg/ui/assets/index-GPWa2djr.js
diff --git a/kinode/packages/app_store/pkg/ui/assets/index-OOHWYMdt.css b/kinode/packages/app_store/pkg/ui/assets/index-OOHWYMdt.css
diff --git a/kinode/packages/app_store/pkg/ui/index.html b/kinode/packages/app_store/pkg/ui/index.html
@@ -14,8 +14,8 @@
   <meta httpEquiv="X-UA-Compatible" content="IE=edge" />
   <meta name="viewport"
     content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" />
-  <script type="module" crossorigin src="/main:app_store:sys/assets/index--h2dsLNv.js"></script>
-  <link rel="stylesheet" crossorigin href="/main:app_store:sys/assets/index-OOHWYMdt.css">
+  <script type="module" crossorigin src="/main:app_store:sys/assets/index-GPWa2djr.js"></script>
+  <link rel="stylesheet" crossorigin href="/main:app_store:sys/assets/index-EAwGkdAI.css">
 </head>
 
 <body>

diff --git a/kinode/packages/app_store/ui/src/components/DownloadButton.tsx b/kinode/packages/app_store/ui/src/components/DownloadButton.tsx
@@ -18,7 +18,7 @@ export default function DownloadButton({ app, isIcon = false, ...props }: Downlo
   const [showModal, setShowModal] = useState(false);
   const [mirror, setMirror] = useState(app.metadata?.properties?.mirrors?.[0] || "Other");
   const [customMirror, setCustomMirror] = useState("");
-  const [loading, setLoading] = useState("");
+  const [downloading, setDownloading] = useState("");
 
   useEffect(() => {
     setMirror(app.metadata?.properties?.mirrors?.[0] || "Other");
@@ -40,12 +40,12 @@ export default function DownloadButton({ app, isIcon = false, ...props }: Downlo
     }
 
     try {
-      setLoading(`Downloading ${getAppName(app)}...`);
+      setDownloading(`Downloading ${getAppName(app)}...`);
       await downloadApp(app, targetMirror);
       const interval = setInterval(() => {
         getMyApp(app)
           .then(() => {
-            setLoading("");
+            setDownloading("");
             setShowModal(false);
             clearInterval(interval);
             getMyApps();
@@ -57,7 +57,7 @@ export default function DownloadButton({ app, isIcon = false, ...props }: Downlo
       window.alert(
         `Failed to download app from ${targetMirror}, please try a different mirror.`
       );
-      setLoading("");
+      setDownloading("");
     }
   }, [mirror, customMirror, app, downloadApp, getMyApp]);
 
@@ -72,13 +72,23 @@ export default function DownloadButton({ app, isIcon = false, ...props }: Downlo
           'icon clear': isIcon,
           'black': !isIcon,
         })}
+        disabled={!!downloading}
         onClick={onClick}
       >
-        {isIcon ? <FaDownload /> : 'Download'}
+        {isIcon
+          ? <FaDownload />
+          : downloading
+            ? 'Downloading...'
+            : 'Download'}
       </button>
       <Modal show={showModal} hide={() => setShowModal(false)}>
-        {loading ? (
-          <Loader msg={loading} />
+        {downloading ? (
+          <div className="flex-col-center gap-4">
+            <Loader msg={downloading} />
+            <div className="text-center">
+              App is downloading in the background. You can safely close this window.
+            </div>
+          </div>
         ) : (
           <form className="flex flex-col items-center gap-2" onSubmit={download}>
             <h4>Download '{appName}'</h4>

diff --git a/kinode/packages/app_store/ui/src/components/InstallButton.tsx b/kinode/packages/app_store/ui/src/components/InstallButton.tsx
@@ -17,7 +17,7 @@ export default function InstallButton({ app, isIcon = false, ...props }: Install
     useAppsStore();
   const [showModal, setShowModal] = useState(false);
   const [caps, setCaps] = useState<string[]>([]);
-  const [loading, setLoading] = useState("");
+  const [installing, setInstalling] = useState("");
 
   const onClick = useCallback(async (e: React.MouseEvent<HTMLButtonElement>) => {
     e.preventDefault();
@@ -29,14 +29,14 @@ export default function InstallButton({ app, isIcon = false, ...props }: Install
 
   const install = useCallback(async () => {
     try {
-      setLoading(`Installing ${getAppName(app)}...`);
+      setInstalling(`Installing ${getAppName(app)}...`);
       await installApp(app);
 
       const interval = setInterval(() => {
         getMyApp(app)
           .then((app) => {
             if (!app.installed) return;
-            setLoading("");
+            setInstalling("");
             setShowModal(false);
             clearInterval(interval);
             getMyApps();
@@ -46,7 +46,7 @@ export default function InstallButton({ app, isIcon = false, ...props }: Install
     } catch (e) {
       console.error(e);
       window.alert(`Failed to install, please try again.`);
-      setLoading("");
+      setInstalling("");
     }
   }, [app, installApp, getMyApp]);
 
@@ -59,14 +59,24 @@ export default function InstallButton({ app, isIcon = false, ...props }: Install
           'icon clear': isIcon
         })}
         onClick={onClick}
+        disabled={!!installing}
       >
-        {isIcon ? <FaI /> : "Install"}
+        {isIcon
+          ? <FaI />
+          : installing
+            ? 'Installing...'
+            : "Install"}
       </button>
       <Modal show={showModal} hide={() => setShowModal(false)}>
-        {loading ? (
-          <Loader msg={loading} />
+        {installing ? (
+          <div className="flex-col-center gap-4">
+            <Loader msg={installing} />
+            <div className="text-center">
+              App is installing in the background. You can safely close this window.
+            </div>
+          </div>
         ) : (
-          <>
+          <div className="flex-col-center gap-2">
             <h4>Approve App Permissions</h4>
             <h5 className="m-0">
               {getAppName(app)} needs the following permissions:
@@ -79,7 +89,7 @@ export default function InstallButton({ app, isIcon = false, ...props }: Install
             <button type="button" onClick={install}>
               Approve & Install
             </button>
-          </>
+          </div>
         )}
       </Modal>
     </>

diff --git a/kinode/packages/app_store/ui/src/components/Loader.tsx b/kinode/packages/app_store/ui/src/components/Loader.tsx
@@ -1,14 +1,15 @@
 import React from 'react'
+import { FaCircleNotch } from 'react-icons/fa6'
 
 type LoaderProps = {
   msg: string
 }
 
 export default function Loader({ msg }: LoaderProps) {
   return (
-    <div id="loading" className="flex flex-col text-center">
+    <div id="loading" className="flex-col-center text-center gap-4">
       <h4>{msg}</h4>
-      <div id="loader"> <div /> <div /> <div /> <div /> </div>
+      <FaCircleNotch className="animate-spin rounded-full h-8 w-8" />
     </div>
   )
 }
diff --git a/kinode/src/register.rs b/kinode/src/register.rs
@@ -73,10 +73,9 @@ pub async fn register(
                 ("tcp".to_string(), tcp_port),
             ]),
             routers: vec![
-                // "default-router-1.os".into(),
-                // "default-router-2.os".into(),
-                // "default-router-3.os".into(),
-                "default-router-7.os".into(),
+                "default-router-1.os".into(),
+                "default-router-2.os".into(),
+                "default-router-3.os".into(),
             ],
         },
     });