feature: Auto-focus when creating a new post (#191)

* Add auto-focus

* Remove from configuration and add focus to JS

* feat: Auto-focus Android editor when content is empty

Match the iOS UX.

---------

Co-authored-by: David Calhoun <[email protected]>

Author: kean

android/Gutenberg/src/main/java/org/wordpress/gutenberg/GutenbergView.kt

@@ -10,6 +10,7 @@ import android.os.Looper
 import android.util.AttributeSet
 import android.util.Log
 import android.view.View
+import android.view.inputmethod.InputMethodManager
 import android.webkit.ConsoleMessage
 import android.webkit.CookieManager
 import android.webkit.JavascriptInterface
@@ -477,6 +478,18 @@ class GutenbergView : WebView {
                     .alpha(1f)
                     .setDuration(300)
                     .start()
+
+                if (configuration.content.isEmpty()) {
+                    // Focus the editor content
+                    this.evaluateJavascript("editor.focus();", null)
+
+                    // Request focus on the WebView and show the soft keyboard
+                    handler.postDelayed({
+                        this.requestFocus()
+                        val imm = context.getSystemService(Context.INPUT_METHOD_SERVICE) as? InputMethodManager
+                        imm?.showSoftInput(this, InputMethodManager.SHOW_IMPLICIT)
+                    }, 100)
+                }
             }
         }
     }

ios/Sources/GutenbergKit/Sources/EditorViewController.swift

@@ -86,33 +86,6 @@ public final class EditorViewController: UIViewController, GutenbergEditorContro
             setUpEditor()
             loadEditor()
         }
-
-        // TODO: register it when editor is loaded
-//        service.$rawBlockTypesResponseData.compactMap({ $0 }).sink { [weak self] data in
-//            guard let self else { return }
-//            assert(Thread.isMainThread)
-//
-//        }.store(in: &cancellables)
-    }
-
-    // TODO: move
-    private func registerBlockTypes(data: Data) async {
-        guard let string = String(data: data, encoding: .utf8),
-            let escapedString = string.addingPercentEncoding(withAllowedCharacters: .alphanumerics) else {
-            assertionFailure("invalid block types")
-            return
-        }
-        do {
-            // TODO: simplify this
-            try await webView.evaluateJavaScript("""
-                const blockTypes = JSON.parse(decodeURIComponent('\(escapedString)'));
-                editor.registerBlocks(blockTypes);
-                "done";
-                """)
-        } catch {
-            NSLog("failed to register blocks \(error)")
-            // TOOD: relay to the client
-        }
     }
 
     private func setUpEditor() {
@@ -347,6 +320,10 @@ public final class EditorViewController: UIViewController, GutenbergEditorContro
         let duration = CFAbsoluteTimeGetCurrent() - timestampInit
         print("gutenbergkit-measure_editor-first-render:", duration)
         delegate?.editorDidLoad(self)
+
+        if configuration.content.isEmpty {
+            evaluate("editor.focus();")
+        }
     }
 
     // MARK: - Warmup

src/components/editor/use-host-bridge.js

@@ -108,6 +108,16 @@ export function useHostBridge( post, editorRef ) {
 			);
 		};
 
+		window.editor.focus = () => {
+			const editable = document.querySelector(
+				'[contenteditable="true"]'
+			);
+			if ( editable ) {
+				editable.focus();
+				editable.click();
+			}
+		};
+
 		window.editor.appendTextAtCursor = ( text ) => {
 			const selectedBlockClientId = getSelectedBlockClientId();