diff --git a/deps/shui/src/logseq/shui/ui.cljs b/deps/shui/src/logseq/shui/ui.cljs index d684407e9a1..3ef4c22e812 100644 --- a/deps/shui/src/logseq/shui/ui.cljs +++ b/deps/shui/src/logseq/shui/ui.cljs @@ -22,6 +22,9 @@ (def alert-title (util/lsui-wrap "AlertTitle")) (def alert-description (util/lsui-wrap "AlertDescription")) (def slider (util/lsui-wrap "Slider")) +(def slider-track (util/lsui-wrap "SliderTrack")) +(def slider-range (util/lsui-wrap "SliderRange")) +(def slider-thumb (util/lsui-wrap "SliderThumb")) (def badge (util/lsui-wrap "Badge")) (def skeleton (util/lsui-wrap "Skeleton")) (def calendar (util/lsui-wrap "Calendar")) diff --git a/src/main/frontend/components/block.css b/src/main/frontend/components/block.css index 46ecc2a99ad..ec9dac1065c 100644 --- a/src/main/frontend/components/block.css +++ b/src/main/frontend/components/block.css @@ -1061,3 +1061,7 @@ html.is-mac { } } } + +.recent-block .bullet-container .bullet { + border: 2px solid; +} diff --git a/src/main/frontend/components/header.cljs b/src/main/frontend/components/header.cljs index e7e9cba633a..b51ed311b69 100644 --- a/src/main/frontend/components/header.cljs +++ b/src/main/frontend/components/header.cljs @@ -28,7 +28,10 @@ [logseq.shui.ui :as shui] [logseq.shui.util :as shui-util] [reitit.frontend.easy :as rfe] - [rum.core :as rum])) + [rum.core :as rum] + [dommy.core :as d] + [cljs-time.core :as t] + [cljs-time.coerce :as tc])) (rum/defc home-button < {:key-fn #(identity "home-button")} @@ -240,6 +243,73 @@ {:on-click #(handler/quit-and-install-new-version!)} (svg/reload 16) [:strong (t :updater/quit-and-install)]]]]))) +(defn- clear-recent-highlight! + [] + (let [nodes (d/by-class "recent-block")] + (when (seq nodes) + (doseq [node nodes] + (d/remove-class! node "recent-block"))))) + +(rum/defc recent-slider-inner + [] + (let [[recent-days set-recent-days!] (rum/use-state (state/get-highlight-recent-days)) + [thumb-ref set-thumb-ref!] (rum/use-state nil)] + (rum/use-effect! + (fn [] + (when thumb-ref + (.focus ^js thumb-ref))) + [thumb-ref]) + (rum/use-effect! + (fn [] + (let [all-nodes (d/by-class "ls-block") + recent-node (fn [node] + (let [id (some-> (d/attr node "blockid") uuid) + block (db/entity [:block/uuid id])] + (when block + (t/after? + (tc/from-long (:block/updated-at block)) + (t/ago (t/days recent-days)))))) + recent-nodes (filter recent-node all-nodes) + old-nodes (remove recent-node all-nodes)] + (when (seq recent-nodes) + (doseq [node recent-nodes] + (d/add-class! node "recent-block"))) + (when (seq old-nodes) + (doseq [node old-nodes] + (d/remove-class! node "recent-block"))))) + [recent-days]) + (shui/slider + {:class "relative flex w-full touch-none select-none items-center w-[30%]" + :default-value #js [3 100] + :on-value-change (fn [result] + (set-recent-days! (first result)) + (state/set-highlight-recent-days! (first result))) + :minStepsBetweenThumbs 1} + (shui/slider-track + {:class "relative h-2 w-full grow overflow-hidden rounded-full bg-secondary"}) + (shui/tooltip-provider + (shui/tooltip + (shui/tooltip-trigger + {:as-child true + :on-click (fn [e] (.preventDefault e))} + (shui/slider-thumb + {:ref set-thumb-ref! + :class "block h-4 w-4 rounded-full border-2 border-primary bg-background ring-offset-background transition-colors focus-visible:outline-none"})) + (shui/tooltip-content + {:onPointerDownOutside (fn [e] (.preventDefault e))} + (str "Highlight recent blocks" + (when (not= recent-days 0) + (str ": " recent-days " days ago"))))))))) + +(rum/defc recent-slider < rum/reactive + {:will-update (fn [state] + (when-not @(:ui/toggle-highlight-recent-blocks? @state/state) + (clear-recent-highlight!)) + state)} + [] + (when (state/sub :ui/toggle-highlight-recent-blocks?) + (recent-slider-inner))) + (rum/defc ^:large-vars/cleanup-todo header < rum/reactive [{:keys [current-repo default-home new-block-mode]}] (let [_ (state/sub [:user/info :UserGroups]) @@ -284,6 +354,10 @@ (ui/icon "search" {:size ui/icon-size})])))]] [:div.r.flex.drag-region + (when (and (config/db-based-graph? current-repo) + (user-handler/team-member?)) + (recent-slider)) + (when (and current-repo (user-handler/logged-in?) (config/db-based-graph? current-repo) diff --git a/src/main/frontend/modules/shortcut/config.cljs b/src/main/frontend/modules/shortcut/config.cljs index 62561c21ef6..3f14a73786e 100644 --- a/src/main/frontend/modules/shortcut/config.cljs +++ b/src/main/frontend/modules/shortcut/config.cljs @@ -510,6 +510,8 @@ :ui/toggle-document-mode {:binding "t d" :fn state/toggle-document-mode!} + :ui/highlight-recent-blocks {:fn state/toggle-highlight-recent-blocks!} + :ui/toggle-settings {:binding (if mac? ["t s" "mod+,"] "t s") :fn ui-handler/toggle-settings-modal!} @@ -777,6 +779,7 @@ :go/next-journal :go/prev-journal :ui/toggle-document-mode + :ui/highlight-recent-blocks :ui/toggle-settings :ui/toggle-right-sidebar :ui/toggle-left-sidebar @@ -921,7 +924,7 @@ :editor/toggle-open-blocks :editor/toggle-number-list :ui/toggle-wide-mode - :ui/toggle-document-mode + :ui/highlight-recent-blocks :ui/toggle-brackets :ui/toggle-theme :ui/toggle-left-sidebar diff --git a/src/main/frontend/state.cljs b/src/main/frontend/state.cljs index 909695a4e8d..5a56c7cf159 100644 --- a/src/main/frontend/state.cljs +++ b/src/main/frontend/state.cljs @@ -318,6 +318,9 @@ :system/info {} ;; Whether block is selected :ui/select-query-cache (atom {}) + :ui/toggle-highlight-recent-blocks? (atom false) + :ui/highlight-recent-days (atom (or (storage/get :ui/highlight-recent-days) + 3)) :favorites/updated? (atom 0) :db/async-query-loading (atom #{}) :db/async-queries (atom {}) @@ -1559,6 +1562,11 @@ Similar to re-frame subscriptions" (set-state! :document/mode? (not mode)) (storage/set :document/mode? (not mode)))) +(defn toggle-highlight-recent-blocks! + [] + (let [value @(:ui/toggle-highlight-recent-blocks? @state)] + (set-state! :ui/toggle-highlight-recent-blocks? (not value)))) + (defn shortcut-tooltip-enabled? [] (get @state :ui/shortcut-tooltip?)) @@ -2353,3 +2361,13 @@ Similar to re-frame subscriptions" [ref-entity] (let [refs! (:editor/block-refs @state)] (swap! refs! conj ref-entity))) + +(defn get-highlight-recent-days + [] + @(:ui/highlight-recent-days @state)) + +(defn set-highlight-recent-days! + [days] + (prn :debug :set :days days) + (reset! (:ui/highlight-recent-days @state) days) + (storage/set :ui/highlight-recent-days days)) diff --git a/src/resources/dicts/en.edn b/src/resources/dicts/en.edn index 82e9a465b88..f092d42b9a1 100644 --- a/src/resources/dicts/en.edn +++ b/src/resources/dicts/en.edn @@ -783,6 +783,7 @@ :editor/copy-current-file "Copy current file" :editor/copy-page-url "Copy page url" :ui/toggle-wide-mode "Toggle wide mode" + :ui/highlight-recent-blocks "Toggle highlight recent blocks" :editor/toggle-display-all-properties "Toggle display all properties" :ui/select-theme-color "Select available theme colors" :ui/goto-plugins "Go to plugins dashboard"