feat: hello node download

Author: keiner5212

.env.example

@@ -19,6 +19,7 @@
   "devDependencies": {
     "@eslint/js": "^9.7.0",
     "@tauri-apps/cli": "^1",
+    "@types/node": "^20.14.11",
     "@types/react": "^18.2.15",
     "@types/react-dom": "^18.2.7",
     "@vitejs/plugin-react": "^4.2.1",

package.json

@@ -3,11 +3,13 @@
 
 mod system_utils;
 
+use std::thread;
+
 use lazy_static::lazy_static;
+use system_utils::executor::run_command_with_logging;
 use tauri::Window;
 use tauri::{CustomMenuItem, Manager, SystemTray, SystemTrayEvent, SystemTrayMenu};
 use tauri_plugin_autostart::MacosLauncher;
-use system_utils::executor::run_command_with_logging;
 
 // create a mutex to store the main window
 lazy_static! {
@@ -23,17 +25,32 @@ fn logger(message: String, js_function: String) {
     }
 }
 
-#[allow(non_snake_case)]
 #[tauri::command]
-fn executeCommand(command: String, args: Vec<String>) {
-    // convert from Vec<String> to Vec<&str> (required by run_command_with_logging)
-    let parsed_args: Vec<&str> = args.iter().map(|s| s.as_str()).collect();
-    match run_command_with_logging(command.as_str(), parsed_args.as_slice(), logger) {
-        Ok(_) => println!("Command executed successfully"),
-        Err(e) => println!("Failed to execute command: {}", e),
-    }
-}
+fn execute_command(command: String, args: Vec<String>, emit_event: bool) {
+    // Clone the command and args to pass them to the new thread
+    let command_clone = command.clone();
+    let args_clone = args.clone();
 
+    // Create a new thread to run the command in the background
+    let handle = thread::spawn(move || {
+        // convert from Vec<String> to Vec<&str> (required by run_command_with_logging)
+        let parsed_args: Vec<&str> = args_clone.iter().map(|s| s.as_str()).collect();
+        match run_command_with_logging(command_clone.as_str(), parsed_args.as_slice(), logger) {
+            Ok(_) => {
+                if emit_event {
+                    // emit event with the command executed
+                    let _ = MAIN_WINDOW
+                        .lock()
+                        .unwrap()
+                        .as_ref()
+                        .unwrap()
+                        .emit("command_executed", command);
+                }
+            }
+            Err(e) => println!("Failed to execute command: {}", e),
+        }
+    });
+}
 
 fn main() {
     // creating a menu for the system tray, with a quit option (add more options later if needed)
@@ -67,7 +84,11 @@ fn main() {
             _ => {}
         })
         // setting the system tray
-        .system_tray(SystemTray::new().with_tooltip(tray_title).with_menu(system_tray_menu))
+        .system_tray(
+            SystemTray::new()
+                .with_tooltip(tray_title)
+                .with_menu(system_tray_menu),
+        )
         // opening the main window when the system tray is clicked
         .on_system_tray_event(|app, event| match event {
             SystemTrayEvent::LeftClick {
@@ -94,7 +115,7 @@ fn main() {
             _ => {}
         })
         // tauri commands (to use in the frontend)
-        .invoke_handler(tauri::generate_handler![executeCommand])
+        .invoke_handler(tauri::generate_handler![execute_command])
         .run(tauri::generate_context!())
         .expect("error while running tauri application");
 }

pnpm-lock.yaml

@@ -36,30 +36,33 @@ pub fn run_command_with_logging(
     let stderr = cmd.stderr.take().expect("Failed to open stderr");
 
     let (tx, rx) = mpsc::channel();
-
+    
     let tx_clone = tx.clone();
-    thread::spawn(move || {
+    let stdout_handle = thread::spawn(move || {
         let reader = BufReader::new(stdout);
         for line in reader.lines() {
             if let Ok(line) = line {
                 tx_clone.send(line).unwrap();
             }
         }
     });
-
-    thread::spawn(move || {
+    
+    let stderr_handle = thread::spawn(move || {
         let reader = BufReader::new(stderr);
         for line in reader.lines() {
             if let Ok(line) = line {
                 tx.send(line).unwrap();
             }
         }
     });
-
+    
     for line in rx {
         logger(line, "FunctionOutputLogger".to_string());
     }
 
+    stdout_handle.join().expect("Failed to join stdout thread");
+    stderr_handle.join().expect("Failed to join stderr thread");
+    
     cmd.wait()?;
     Ok(())
 }

src-tauri/ipfs-user-node-windows-0.0.1.exe

@@ -32,6 +32,11 @@
   overflow-y: auto;
   resize: none;
   height: 200px;
+  text-shadow: 1px  0px 0px #0000007e,
+               0px  1px 0px #0000007e,
+              -1px  0px 0px #0000007e,
+               0px -1px 0px #0000007e;
+  font-family: monospace;
 
   &::-webkit-scrollbar {
     background: transparent;

src-tauri/src/main.rs

@@ -3,54 +3,71 @@ import { enable, isEnabled, disable } from "tauri-plugin-autostart-api";
 import "./App.css";
 import "./assets/styles/wave.css";
 import "./assets/styles/card.css";
-import { ExecuteCommand } from "./utils/CommandUtils";
+import { ExecuteCommand, GetHelloNodeUrl, greet } from "./utils/CommandUtils";
+import { useLogs } from "./assets/globalHooks/useLogs";
+import { listen } from "@tauri-apps/api/event";
 
 function App() {
 	const [enabledAutostart, setEnabledAutostart] = useState(false);
-	const [logs, setLogs] = useState("");
-	const executableurl =
-		"https://github.com/Hello-Storage/hello-ipfs-user-node/releases/download/0.0.1/ipfs-user-node-windows-0.0.1.exe";
+	const { logs, addLog } = useLogs();
+	const [executableurl, setExecutableurl] = useState<string | undefined>();
+	const [executing, setExecuting] = useState<string | undefined>();
+	const [executed, setExecuted] = useState<string | undefined>();
 
-	async function greet() {
-		await ExecuteCommand("echo", ["Hello there from hello.app!"]);
-	}
+	useEffect(() => {
+		greet();
+		//get the url of the hello node
+		setExecutableurl(GetHelloNodeUrl());
+		// detect if autostart is enabled
+		isEnabled().then((e) => {
+			if (e) {
+				setEnabledAutostart(true);
+			}
+		});
+
+		//listen the event "command_executed"
+		listen("command_executed", (event) => {
+			setExecuted(event.payload as string);
+		});
+	}, []);
 
 	useEffect(() => {
 		window.FunctionOutputLogger = function (msg: string) {
-			// update logs
-			setLogs(logs + msg + "\n");
-			// scroll to bottom
-			const textarea = document.getElementById("logs");
-			if (textarea) {
-				textarea.scrollTop = textarea.scrollHeight + 100;
-			}
+			addLog(msg);
 		};
 	}, [logs]);
 
 	useEffect(() => {
-		greet();
-
+		if (!executableurl) return;
 		// check if hello node is installed (from localstorage)
 		let helloNodeInstalled = localStorage.getItem("hello-node-installed");
 		if (!helloNodeInstalled) {
+			setExecuting("curl");
 			// install hello node
-			ExecuteCommand("curl", ["-O", "-L", executableurl]).then(() => {
+			ExecuteCommand(
+				"curl",
+				["-O", "-L", executableurl],
+				true
+			).then(() => {
 				// update localstorage
-				localStorage.setItem("hello-node-installed", "true");
+				// localStorage.setItem("hello-node-installed", "true");
+				addLog("Hello Node installed");
 			});
-			setLogs(logs + "Hello Node installed\n");
+			addLog("Installing Hello Node");
 		} else {
-			setLogs(logs + "Hello Node already installed\n");
+			addLog("Hello Node already installed");
 		}
+	}, [executableurl]);
 
-		// detect if autostart is enabled
-		isEnabled().then((e) => {
-			if (e) {
-				setEnabledAutostart(true);
-			}
-		});
-		//
-	}, []);
+	// detect if command (executing) is finished
+	useEffect(() => {
+		if (!executed) return;
+		if(!executing) return;
+		if(!executed.includes(executing)) return;
+		setExecuting(undefined);
+		setExecuted(undefined);
+		addLog("Command waited: " + executed);
+	}, [executed]);
 
 	async function switchAutostart() {
 		if (await isEnabled()) {
@@ -74,7 +91,7 @@ function App() {
 			</section>
 
 			<div className="bgblue">
-				<div className="card">
+				<div className="log-card">
 					<textarea
 						name="logs"
 						id="logs"

src-tauri/src/system_utils/executor.rs

@@ -0,0 +1,18 @@
+import { useState } from "react";
+
+export function useLogs() {
+    const [logs, setLogs] = useState("");
+
+    const addLog = (newLine: string) => {
+        // update logs
+        setLogs((logs) => logs + newLine + "\n");
+        // scroll to bottom
+        const textarea = document.getElementById("logs");
+        if (textarea) {
+            textarea.scrollTop = textarea.scrollHeight + 100;
+        }
+    }
+
+    return { logs, addLog };
+
+}

src/App.css

@@ -5,10 +5,10 @@
     box-shadow: 0px 1rem 1.5rem -0.9rem #000000e1;
 }
 
-.card {
+.log-card {
     font-size: 1rem;
     color: #bec4cf;
     background: linear-gradient(135deg, #3586ffc0 0%, #1e284b79 50%, #3586ffc0 100%);
-    padding: 1.5rem;
+    padding: 1rem;
     border-radius: 1.2rem;
 }