auto update on by default, refactor "my apps" page visually, styling

kinode-dao · Jan 13, 2025 · 61abc1b · 61abc1b
1 parent fdd9f2c
commit 61abc1b
Show file tree

Hide file tree

Showing 7 changed files with 303 additions and 287 deletions.
diff --git a/kinode/packages/app-store/app-store/src/http_api.rs b/kinode/packages/app-store/app-store/src/http_api.rs
@@ -269,7 +269,6 @@ fn gen_package_info(id: &PackageId, state: &PackageState) -> serde_json::Value {
         },
         "our_version_hash": state.our_version_hash,
         "publisher": id.publisher(),
-        "our_version_hash": state.our_version_hash,
         "verified": state.verified,
         "caps_approved": state.caps_approved,
     })
@@ -586,6 +585,13 @@ fn serve_paths(
                         "successfully installed {}:{}",
                         process_package_id.package_name, process_package_id.publisher_node
                     );
+                    // TODO handle?
+                    let _ = Request::to(("our", "chain", "app-store", "sys"))
+                        .body(
+                            serde_json::to_vec(&ChainRequest::StartAutoUpdate(process_package_id))
+                                .unwrap(),
+                        )
+                        .send_and_await_response(5)??;
                     Ok((StatusCode::CREATED, None, vec![]))
                 }
                 Err(e) => Ok((

diff --git a/kinode/packages/app-store/app-store/src/lib.rs b/kinode/packages/app-store/app-store/src/lib.rs
@@ -29,6 +29,7 @@
 //! Note: This process does not directly handle file transfers or on-chain operations.
 //! It delegates these responsibilities to the downloads and chain processes respectively.
 //!
+use crate::kinode::process::chain::ChainRequest;
 use crate::kinode::process::downloads::{
     AutoDownloadCompleteRequest, DownloadCompleteRequest, DownloadResponse, ProgressUpdate,
 };
@@ -38,7 +39,7 @@ use crate::kinode::process::main::{
 };
 use kinode_process_lib::{
     await_message, call_init, get_blob, http, print_to_terminal, println, vfs, Address,
-    LazyLoadBlob, Message, PackageId, Response,
+    LazyLoadBlob, Message, PackageId, Request, Response,
 };
 use serde::{Deserialize, Serialize};
 use state::{State, UpdateInfo, Updates};
@@ -310,6 +311,12 @@ fn handle_local_request(
                         "successfully installed {}:{}",
                         package_id.package_name, package_id.publisher_node
                     );
+                    // TODO handle?
+                    let _ = Request::to(("our", "chain", "app-store", "sys"))
+                        .body(
+                            serde_json::to_vec(&ChainRequest::StartAutoUpdate(package_id)).unwrap(),
+                        )
+                        .send_and_await_response(5);
                     LocalResponse::InstallResponse(InstallResponse::Success)
                 }
                 Err(e) => {

diff --git a/kinode/packages/app-store/app-store/src/utils.rs b/kinode/packages/app-store/app-store/src/utils.rs
@@ -220,23 +220,12 @@ pub fn install(
     let bytes = file.read()?;
     let manifest_hash = create_package_drive(&process_package_id, bytes)?;
 
-    let package_state = PackageState {
-        our_version_hash: version_hash.to_string(),
-        verified: true, // sideloaded apps are implicitly verified because there is no "source" to verify against
-        caps_approved: true, // TODO see if we want to auto-approve local installs
-        manifest_hash: Some(manifest_hash),
-    };
-
     if let Ok(extracted) = extract_api(&process_package_id) {
         if extracted {
             state.installed_apis.insert(process_package_id.clone());
         }
     }
 
-    state
-        .packages
-        .insert(process_package_id.clone(), package_state);
-
     // get the package manifest
     let drive_path = format!("/{process_package_id}/pkg");
     let manifest = fetch_package_manifest(&process_package_id)?;
@@ -247,6 +236,17 @@ pub fn install(
         fetch_package_metadata(&package_id)?
     };
 
+    let package_state = PackageState {
+        our_version_hash: version_hash.to_string(),
+        verified: true, // sideloaded apps are implicitly verified because there is no "source" to verify against
+        caps_approved: true, // TODO see if we want to auto-approve local installs
+        manifest_hash: Some(manifest_hash),
+    };
+
+    state
+        .packages
+        .insert(process_package_id.clone(), package_state);
+
     let wit_version = metadata.properties.wit_version;
 
     // first, for each process in manifest, initialize it

diff --git a/kinode/packages/app-store/chain/src/lib.rs b/kinode/packages/app-store/chain/src/lib.rs
@@ -603,12 +603,10 @@ fn handle_eth_log(
     state.db.insert_or_update_listing(&package_id, &listing)?;
 
     if !startup && listing.auto_update {
-        println!("kicking off auto-update for: {}", package_id);
+        println!("kicking off auto-update for {package_id}");
         Request::to(("our", "downloads", "app-store", "sys"))
             .body(&DownloadRequest::AutoUpdate(AutoUpdateRequest {
-                package_id: crate::kinode::process::main::PackageId::from_process_lib(
-                    package_id.clone(),
-                ),
+                package_id: crate::kinode::process::main::PackageId::from_process_lib(package_id),
                 metadata: metadata.unwrap().into(),
             }))
             .send()

diff --git a/kinode/packages/app-store/ui/src/index.css b/kinode/packages/app-store/ui/src/index.css
@@ -195,11 +195,6 @@ button.danger:hover {
     background: var(--surface-hover);
 } */
 
-.store-page {
-    max-width: 960px !important;
-    margin: 0 auto !important;
-}
-
 /* App Grid */
 .app-grid {
     display: grid;
@@ -238,12 +233,16 @@ td {
 }
 
 /* App Icon */
+.app-icon-wrapper {
+    margin: 0 auto;
+    width: fit-content;
+}
+
 .app-icon {
     max-width: 128px;
     max-height: 128px;
     min-width: 128px;
     min-height: 128px;
-    margin: 0 auto;
     object-fit: cover;
     border-radius: var(--border-radius);
 }
@@ -337,6 +336,7 @@ td {
     display: flex;
     justify-content: space-between;
     margin-bottom: 0.5rem;
+    gap: 0.5rem;
 }
 
 /* Error Message */
@@ -357,12 +357,9 @@ td {
 .publish-page {
     padding: 1rem;
     background: light-dark(var(--bg-light), var(--bg-dark));
-    margin: 0 1vw;
     border-radius: var(--border-radius);
-}
-
-.app-info {
-    max-width: 20rem;
+    max-width: 960px;
+    margin: 0 auto;
 }
 
 .app-header {
@@ -372,6 +369,10 @@ td {
     margin-bottom: 1.5rem;
 }
 
+div.app-header {
+    background: transparent !important;
+}
+
 .app-warning {
     background: var(--orange) !important;
     color: var(--text-light);
@@ -382,19 +383,11 @@ td {
     margin-bottom: 0.5rem;
     line-height: 1.6;
     word-wrap: break-word;
-}
-
-.app-info {
-    background: light-dark(var(--surface-light), var(--surface-dark));
-    border-radius: var(--border-radius);
-    padding: 1.5rem;
-    margin-bottom: 2rem;
+    color: light-dark(var(--text-light), var(--text-dark));
 }
 
 /* Components with secondary backgrounds */
 .app-header,
-.app-info,
-.app-description,
 .form-group,
 .search-bar input,
 .version-selector,
@@ -1125,8 +1118,6 @@ td {
 
 /* App Page Layout */
 .app-page {
-    max-width: 80rem;
-    margin: 0 auto;
     padding: 2rem 1rem;
 }
 
@@ -1214,6 +1205,7 @@ td {
     padding: 1rem;
     border-radius: var(--border-radius);
     background: light-dark(var(--surface-light), var(--surface-dark));
+    margin-bottom: 1rem;
 }
 
 .file-explorer h3 {

diff --git a/kinode/packages/app-store/ui/src/pages/AppPage.tsx b/kinode/packages/app-store/ui/src/pages/AppPage.tsx
@@ -13,6 +13,7 @@ export default function AppPage() {
   const [installedApp, setInstalledApp] = useState<PackageState | null>(null);
   const [currentVersion, setCurrentVersion] = useState<string | null>(null);
   const [latestVersion, setLatestVersion] = useState<string | null>(null);
+  const [upToDate, setUpToDate] = useState(true);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const [isUninstalling, setIsUninstalling] = useState(false);
@@ -46,6 +47,11 @@ export default function AppPage() {
             if (installedVersion) {
               setCurrentVersion(installedVersion[0]);
             }
+            if (installedVersion && installedVersion[0] === latestVer) {
+              setUpToDate(true);
+            } else {
+              setUpToDate(false);
+            }
           }
         }
       }
@@ -132,17 +138,8 @@ export default function AppPage() {
         )}
         <div className="app-title">
           <h2>{app.metadata?.name || app.package_id.package_name}</h2>
-          <p className="app-id">{`${app.package_id.package_name}.${app.package_id.publisher_node}`}</p>
+          <p className="app-id">{`${app.package_id.package_name}:${app.package_id.publisher_node}`}</p>
         </div>
-      </div>
-
-      <div className="app-warning">
-        {valid_wit_version ? <></> : "THIS APP MUST BE UPDATED TO 1.0"}
-      </div>
-
-      <div className="app-description">{app.metadata?.description || "No description available"}</div>
-
-      <div className="app-info">
         <ul className="detail-list">
           <li>
             <span>Installed:</span>
@@ -157,7 +154,7 @@ export default function AppPage() {
           {installedApp?.pending_update_hash && (
             <li className="warning">
               <span>Failed Auto-Update:</span>
-              <span>Update to version with hash {installedApp.pending_update_hash.slice(0, 8)}... failed, approve newly requested capabilities and install it here:</span>
+              <span>Update to version with hash {installedApp.pending_update_hash.slice(0, 8)}... failed</span>
             </li>
           )}
           <li><span>Publisher:</span> <span>{app.package_id.publisher_node}</span></li>
@@ -171,6 +168,8 @@ export default function AppPage() {
         </ul>
       </div>
 
+      {valid_wit_version ? <></> : <div className="app-warning">THIS APP MUST BE UPDATED TO 1.0</div>}
+
       <div className="app-actions">
         {installedApp && (
           <>
@@ -189,7 +188,7 @@ export default function AppPage() {
           </>
         )}
         <button onClick={handleDownload} className="primary">
-          <FaDownload /> Download
+          <FaDownload /> Download Latest Version
         </button>
       </div>
 
@@ -203,6 +202,8 @@ export default function AppPage() {
           </div>
         </div>
       )}
+
+      <div className="app-description">{app.metadata?.description || "No description available"}</div>
     </section>
   );
 }