mirror of
https://github.com/logseq/logseq.git
synced 2026-05-24 04:34:14 +00:00
enhance(capacitor): edit block
This commit is contained in:
@@ -126,7 +126,7 @@
|
||||
{:routerDirection "forward"
|
||||
:class "w-full"
|
||||
:component settings/page}
|
||||
(ionic/tabler-icon "help" {:size 24 :class "opacity-70"})))))
|
||||
(ionic/tabler-icon "upload" {:size 24 :class "opacity-70"})))))
|
||||
;; main content
|
||||
(if db-restoring?
|
||||
(ionic/ion-content
|
||||
|
||||
@@ -24,4 +24,10 @@ ul {
|
||||
li {
|
||||
@apply pl-0;
|
||||
}
|
||||
}
|
||||
|
||||
ion-textarea {
|
||||
textarea {
|
||||
@apply !p-1 min-h-[120px];
|
||||
}
|
||||
}
|
||||
@@ -4,9 +4,68 @@
|
||||
[rum.core :as rum]
|
||||
[frontend.db.async :as db-async]
|
||||
[frontend.db.utils :as db-utils]
|
||||
[frontend.handler.editor :as editor-handler]
|
||||
[frontend.state :as fstate]
|
||||
[capacitor.ionic :as ionic]))
|
||||
|
||||
(rum/defc edit-block-modal
|
||||
[block {:keys [reload-page!]}]
|
||||
(let [[^js nav] (state/use-nav-root)
|
||||
title (:block/title block)
|
||||
*input (rum/use-ref nil)
|
||||
close! #(.pop nav)]
|
||||
|
||||
(rum/use-effect!
|
||||
(fn []
|
||||
(js/setTimeout
|
||||
(fn []
|
||||
(when-let [^js input (some-> (rum/deref *input)
|
||||
(.querySelector "textarea"))]
|
||||
(.focus input)
|
||||
(let [len (.-length (.-value input))]
|
||||
(.setSelectionRange input len len))))
|
||||
100)
|
||||
#())
|
||||
[])
|
||||
|
||||
(ionic/ion-page
|
||||
(ionic/ion-header
|
||||
(ionic/ion-toolbar
|
||||
(ionic/ion-buttons {:slot "end"}
|
||||
(ionic/ion-button {:on-click #(close!)} "Cancel"))
|
||||
|
||||
(ionic/ion-title (or title "Untitled"))))
|
||||
|
||||
(ionic/ion-content {:class "ion-padding"}
|
||||
[:div.py-2
|
||||
(ionic/ion-textarea {:placeholder "block content"
|
||||
:ref *input
|
||||
:auto-grow true
|
||||
:autofocus true
|
||||
:value (:block/title block)})]
|
||||
[:div.flex.py-2
|
||||
(ionic/ion-button
|
||||
{:on-click (fn []
|
||||
(let [new? (nil? (:db/id block))
|
||||
val (.-value (.querySelector (rum/deref *input) "textarea"))]
|
||||
(if-let [page (and new? (:block/page block))]
|
||||
(-> (editor-handler/api-insert-new-block! val {:page (:db/id page)
|
||||
:sibling? true})
|
||||
(p/then (fn []
|
||||
(close!)
|
||||
(reload-page!))))
|
||||
(-> (editor-handler/save-block! (fstate/get-current-repo)
|
||||
(:block/uuid block) val)
|
||||
(p/then (fn []
|
||||
(close!)
|
||||
(reload-page!)))))))
|
||||
:class "w-full"} "Save")]))))
|
||||
|
||||
(defn nav-to-edit-block!
|
||||
[block opts]
|
||||
(some-> @state/*nav-root
|
||||
(.push #(edit-block-modal block opts))))
|
||||
|
||||
(rum/defc page [block]
|
||||
(let [[^js nav] (state/use-nav-root)
|
||||
[page set-page!] (rum/use-state (db-utils/entity (:db/id block)))
|
||||
@@ -46,14 +105,17 @@
|
||||
(ionic/ion-content {:class "ion-padding"}
|
||||
(if loading?
|
||||
[:p.text-xl.text-center "Loading ..."]
|
||||
[:<>
|
||||
[:code ":db/id " (:db/id page)]
|
||||
(when-let [children (:block/_parent page)]
|
||||
[:ul
|
||||
(for [block children]
|
||||
[:li.text-xl (:block/title block)])])
|
||||
[:p.pt-2.flex.justify-center
|
||||
(ionic/ion-button
|
||||
{:fill "clear"
|
||||
:class "w-full"}
|
||||
"+ Add")]])))))
|
||||
(let [edit-opts {:reload-page! rerender!}]
|
||||
[:<>
|
||||
(when-let [children (:block/_parent page)]
|
||||
[:ul.mt-2
|
||||
{:class "min-h-[80px]"}
|
||||
(for [block children]
|
||||
[:li.text-xl {:on-click #(nav-to-edit-block! block edit-opts)} (:block/title block)])])
|
||||
[:p.pt-3.flex
|
||||
(ionic/ion-button
|
||||
{:fill "outline"
|
||||
:on-click #(nav-to-edit-block! {:block/page page} edit-opts)
|
||||
:class "w-full"}
|
||||
"+ Add")]]))
|
||||
))))
|
||||
|
||||
@@ -6,3 +6,8 @@
|
||||
[page-or-block]
|
||||
(some-> @state/*nav-root
|
||||
(.push #(page-blocks/page page-or-block))))
|
||||
|
||||
(defn nav-to-edit-block!
|
||||
[block opts]
|
||||
(some-> @state/*nav-root
|
||||
(.push #(page-blocks/edit-block-modal block opts))))
|
||||
|
||||
Reference in New Issue
Block a user