enhance(mobile): add quick add modal

src/main/frontend/components/quick_add.cljs

@@ -12,6 +12,18 @@
             [logseq.shui.ui :as shui]
             [rum.core :as rum]))
 
+(rum/defc page-blocks
+  [page]
+  (let [[scroll-container set-scroll-container] (rum/use-state nil)
+        *ref (rum/use-ref nil)]
+    (rum/use-effect!
+      #(set-scroll-container (rum/deref *ref))
+      [])
+    [:div.content-inner
+     {:ref *ref}
+     (when scroll-container
+       (page/page-blocks-cp page {:scroll-container scroll-container}))]))
+
 (rum/defc quick-add <
   {:will-mount (fn [state]
                  (state/clear-selection!)
@@ -45,5 +57,5 @@
           {:class (if mobile?
                     "flex flex-1 flex-col w-full"
                     "block -ml-6")}
-          (page/page-blocks-cp add-page {})]
+          (page-blocks add-page)]
          (when-not mobile? add-button)]))))

src/main/mobile/components/app.css

@@ -236,6 +236,10 @@ ul {
   }
 }
 
+.ls-quick-add {
+  @apply pb-[340px] min-h-[80vh] max-h-[90vh] overflow-y-auto;
+}
+
 /* silk styles */
 .app-silk-index-scroll-content {
   @apply bg-gray-01 min-h-[100svh];

src/main/mobile/components/ui_silk.cljs

@@ -1,6 +1,8 @@
 (ns mobile.components.ui-silk
-  (:require [logseq.shui.ui :as shui]
+  (:require [frontend.util :as util]
+            [logseq.shui.ui :as shui]
             [mobile.state :as mobile-state]
+            [frontend.handler.editor :as editor-handler]
             [rum.core :as rum]))
 
 (rum/defc app-silk-topbar
@@ -37,7 +39,11 @@
         (shui/tabler-icon "search" {:size 24}))
       [:small "Search"]]
      [:span.as-item
-      (shui/button {:variant :icon}
+      (shui/button
+        {:variant :icon
+         :on-click (fn [^js e]
+                     (util/stop e)
+                     (editor-handler/show-quick-add))}
         (shui/tabler-icon "plus" {:size 24}))
       [:small "Quick add"]]
      [:span.as-item