mirror of
https://github.com/logseq/logseq.git
synced 2026-05-28 06:34:34 +00:00
enhance(ux): able to edit #Comments title
This commit is contained in:
@@ -263,6 +263,8 @@
|
||||
min-height: 30px;
|
||||
padding: 5px 10px;
|
||||
font-size: 12px;
|
||||
--ls-comments-title-font-size: 12px;
|
||||
--ls-comments-title-font-weight: 600;
|
||||
color: var(--ls-secondary-text-color);
|
||||
}
|
||||
|
||||
@@ -279,8 +281,50 @@
|
||||
}
|
||||
|
||||
.ls-comments-label {
|
||||
font-weight: 600;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
font-weight: var(--ls-comments-title-font-weight);
|
||||
color: var(--ls-primary-text-color);
|
||||
cursor: text;
|
||||
font-size: var(--ls-comments-title-font-size);
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
.ls-comments-label:hover {
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 2px;
|
||||
}
|
||||
|
||||
.ls-comments-title-editor {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
color: var(--ls-primary-text-color);
|
||||
font-size: var(--ls-comments-title-font-size);
|
||||
font-weight: var(--ls-comments-title-font-weight);
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
.ls-comments-title-editor .block-content-or-editor-wrap,
|
||||
.ls-comments-title-editor .block-content-or-editor-inner {
|
||||
min-height: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.ls-comments-title-editor .block-row {
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.ls-comments-title-editor .editor-wrapper,
|
||||
.ls-comments-title-editor .editor-inner,
|
||||
.ls-comments-title-editor .block-editor,
|
||||
.ls-comments-title-editor textarea,
|
||||
.ls-comments-title-editor .editor-inner .uniline-block {
|
||||
min-height: 0;
|
||||
color: inherit;
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
.ls-comments-count,
|
||||
|
||||
@@ -417,10 +417,50 @@
|
||||
(reference {} uuid)
|
||||
(string/trim (or (:block/title target) "")))]))])))
|
||||
|
||||
(defn- comments-area-title-editing?
|
||||
[config block]
|
||||
(let [block-uuid (:block/uuid block)
|
||||
container-id (:container-id config)
|
||||
editing-in-container? (state/sub-editing? [container-id block-uuid])
|
||||
editing-in-unknown-container? (state/sub-editing? [:unknown-container block-uuid])]
|
||||
(boolean
|
||||
(and block-uuid
|
||||
(or editing-in-container?
|
||||
editing-in-unknown-container?)))))
|
||||
|
||||
(defn- comments-area-title-view
|
||||
[config block editing? *hide-block-refs? *show-query? {:keys [block-content-or-editor]}]
|
||||
(let [block-uuid (:block/uuid block)
|
||||
edit-input-id (str "edit-block-" block-uuid)]
|
||||
(if (and editing? block-content-or-editor)
|
||||
[:div.ls-comments-title-editor
|
||||
(block-content-or-editor
|
||||
(assoc config :table-block-title? true)
|
||||
(merge block (block/parse-title-and-body block-uuid
|
||||
(get block :block/format :markdown)
|
||||
(:block/title block)))
|
||||
{:edit-input-id edit-input-id
|
||||
:block-id block-uuid
|
||||
:edit? true
|
||||
:refs-count nil
|
||||
:*hide-block-refs? *hide-block-refs?
|
||||
:hide-block-refs-count? true
|
||||
:*show-query? *show-query?})]
|
||||
[:button.ls-comments-label
|
||||
{:type "button"
|
||||
:title (t :editor/click-to-edit)
|
||||
:aria-label (t :editor/click-to-edit)
|
||||
:on-pointer-down util/stop
|
||||
:on-click (fn [e]
|
||||
(util/stop e)
|
||||
(comments-handler/edit-comments-area-title! block (:container-id config)))}
|
||||
(comments-model/comments-area-title block)])))
|
||||
|
||||
(rum/defc comments-area-view
|
||||
[config block children collapsed? *hide-block-refs? *show-query? renderers {:keys [focus-editor? inline?]}]
|
||||
(let [*comments-list-ref (hooks/use-ref nil)
|
||||
[targets-open? set-targets-open!] (hooks/use-state false)
|
||||
title-editing? (comments-area-title-editing? config block)
|
||||
render-token (comments-model/comments-render-token children)
|
||||
summary (comments-model/comments-summary children)
|
||||
count (count children)]
|
||||
@@ -451,7 +491,7 @@
|
||||
(comments-model/collapsed-comments-label summary)]
|
||||
[:<>
|
||||
[:div.ls-comments-header
|
||||
[:span.ls-comments-label (t :block.comments/label)]
|
||||
(comments-area-title-view config block title-editing? *hide-block-refs? *show-query? renderers)
|
||||
[:span.ls-comments-count count]
|
||||
(when (comments-model/comment-thread-targets-toggle-visible? block)
|
||||
[:button.ls-comments-targets-toggle
|
||||
|
||||
@@ -200,6 +200,13 @@
|
||||
(:latest-author summary))
|
||||
(t :block.comments/label)))
|
||||
|
||||
(defn comments-area-title
|
||||
[comments-area]
|
||||
(or (some-> (:block/title comments-area)
|
||||
string/trim
|
||||
not-empty)
|
||||
(t :block.comments/label)))
|
||||
|
||||
(defn- same-local-day?
|
||||
[^js a ^js b]
|
||||
(and (= (.getFullYear a) (.getFullYear b))
|
||||
|
||||
@@ -239,6 +239,11 @@
|
||||
(when-let [uuid (:block/uuid (comments-area-entity comments-area))]
|
||||
(editor-handler/expand-block! uuid)))
|
||||
|
||||
(defn edit-comments-area-title!
|
||||
[comments-area container-id]
|
||||
(when-let [block (comments-area-entity comments-area)]
|
||||
(editor-handler/edit-block! block :max {:container-id (or container-id :unknown-container)})))
|
||||
|
||||
(defn- selected-block-entities
|
||||
[]
|
||||
(keep #(db/entity [:block/uuid %]) (state/get-selection-block-ids)))
|
||||
|
||||
@@ -96,3 +96,20 @@
|
||||
(comments-handler/reveal-comments-area!
|
||||
{:block/uuid #uuid "22222222-2222-2222-2222-222222222222"})
|
||||
(is (empty? @expanded))))))
|
||||
|
||||
(deftest edit-comments-area-title-edits-comments-block
|
||||
(let [comments-uuid #uuid "22222222-2222-2222-2222-222222222222"
|
||||
comments-area {:db/id 2
|
||||
:block/uuid comments-uuid
|
||||
:block/title "Comments"
|
||||
:block/tags [{:db/ident comments-model/comments-tag-ident}]}
|
||||
edited (atom nil)]
|
||||
(with-redefs [db/entity (fn [lookup]
|
||||
(case lookup
|
||||
[:block/uuid comments-uuid] comments-area
|
||||
nil))
|
||||
editor-handler/edit-block! (fn [block pos opts]
|
||||
(reset! edited [block pos opts]))]
|
||||
(comments-handler/edit-comments-area-title! comments-area :main)
|
||||
(is (= [comments-area :max {:container-id :main}]
|
||||
@edited)))))
|
||||
|
||||
Reference in New Issue
Block a user