fix: Save title change immediately on field blur

closes #3374

app/scenes/Document/components/EditableTitle.tsx

@@ -29,6 +29,8 @@ type Props = {
   onGoToNextInput: (insertParagraph?: boolean) => void;
   /** Callback called when the user expects to save (CMD+S) */
   onSave?: (options: { publish?: boolean; done?: boolean }) => void;
+  /** Callback called when focus leaves the input */
+  onBlur?: React.FocusEventHandler<HTMLSpanElement>;
 };
 
 const lineHeight = "1.25";
@@ -43,6 +45,7 @@ const EditableTitle = React.forwardRef(
       onChange,
       onSave,
       onGoToNextInput,
+      onBlur,
       starrable,
       placeholder,
     }: Props,
@@ -123,6 +126,7 @@ const EditableTitle = React.forwardRef(
         onClick={handleClick}
         onChange={handleChange}
         onKeyDown={handleKeyDown}
+        onBlur={onBlur}
         placeholder={placeholder}
         value={normalizedTitle}
         $emojiWidth={emojiWidth}

app/scenes/Document/components/Editor.tsx

@@ -53,6 +53,10 @@ function DocumentEditor(props: Props, ref: React.RefObject<any>) {
     }
   }, [ref]);
 
+  const handleBlur = React.useCallback(() => {
+    props.onSave({ autosave: true });
+  }, [props]);
+
   const handleGoToNextInput = React.useCallback(
     (insertParagraph: boolean) => {
       if (insertParagraph && ref.current) {
@@ -88,6 +92,7 @@ function DocumentEditor(props: Props, ref: React.RefObject<any>) {
         document={document}
         onGoToNextInput={handleGoToNextInput}
         onChange={onChangeTitle}
+        onBlur={handleBlur}
         starrable={!shareId}
         placeholder={t("Untitled")}
       />