Merge 138548ad45 into 3809375694

- [+] feat(chat.tsx): enhance local storage handling for chat input

app/components/chat.tsx

@@ -1494,20 +1494,36 @@ function _Chat() {
 
   // remember unfinished input
   useEffect(() => {
-    // try to load from local storage
+    // Define the key for storing unfinished input based on the session ID.
     const key = UNFINISHED_INPUT(session.id);
+
+    // Attempt to load unfinished input from local storage.
     const mayBeUnfinishedInput = localStorage.getItem(key);
     if (mayBeUnfinishedInput && userInput.length === 0) {
       setUserInput(mayBeUnfinishedInput);
+      // Clear the unfinished input from local storage after loading it.
       localStorage.removeItem(key);
     }
 
-    const dom = inputRef.current;
+    // Capture the current value of the input reference.
+    const currentInputRef = inputRef.current;
+
+    // This function will be called when the component unmounts or dependencies change.
     return () => {
-      localStorage.setItem(key, dom?.value ?? "");
+      // Save the current input to local storage only if it is not a command.
+      // Use the captured value from the input reference.
+      const currentInputValue = currentInputRef?.value ?? "";
+      // Save the input to local storage only if it's not empty and not a command.
+      if (currentInputValue && !currentInputValue.startsWith(ChatCommandPrefix)) {
+        localStorage.setItem(key, currentInputValue);
+      } else {
+        // If there's no value, ensure we don't create an empty key in local storage.
+        localStorage.removeItem(key);
+      }
     };
+    // The effect should depend on the session ID to ensure it runs when the session changes.
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  }, [session.id]);
 
   const handlePaste = useCallback(
     async (event: React.ClipboardEvent<HTMLTextAreaElement>) => {