瀏覽代碼

enhance(mobile): block sheet header buttons

Tienson Qin 3 月之前
父節點
當前提交
483473be9c
共有 3 個文件被更改,包括 57 次插入55 次删除
  1. 2 1
      src/main/frontend/components/block.cljs
  2. 48 42
      src/main/mobile/components/modal.cljs
  3. 7 12
      src/main/mobile/core.cljs

+ 2 - 1
src/main/frontend/components/block.cljs

@@ -2996,7 +2996,8 @@
                                             journal-title?
                                             (do
                                               (.preventDefault e)
-                                              (route-handler/redirect-to-page! (:block/uuid block)))
+                                              (when-not (util/capacitor-new?)
+                                                (route-handler/redirect-to-page! (:block/uuid block))))
 
                                             (ldb/journal? block)
                                             (.preventDefault e)

+ 48 - 42
src/main/mobile/components/modal.cljs

@@ -20,7 +20,7 @@
 (rum/defc block-modal
   []
   (let [[{:keys [open? block]}] (mobile-state/use-singleton-modal)
-        close! #(swap! mobile-state/*singleton-modal assoc :open? false)
+        close! #(reset! mobile-state/*singleton-modal nil)
         block (when-let [id (:block/uuid block)]
                 (db/entity [:block/uuid id]))
         open? (and open? block)
@@ -62,54 +62,60 @@
 
            [:div.app-silk-scroll-content-inner
             [:div.flex.justify-between.items-center.block-modal-page-header
-             [:a.opacity-40.active:opacity-60.px-2
-              {:on-pointer-down close!}
-              (shui/tabler-icon "chevron-down" {:size 18 :stroke 3})]
+             (shui/button
+              {:variant :text
+               :size :sm
+               :on-click close!
+               :class "-ml-2"}
+              (shui/tabler-icon "chevron-down" {:size 24}))
 
-             [:span.flex.items-center.gap-2
+             [:span.flex.items-center
               (when-let [block-id-str (str (:block/uuid block))]
-                [:a.active:opacity-80.pr-1
-                 {:class (if favorited? "opacity-80 !text-yellow-800" "opacity-40")
+                (shui/button
+                 {:variant :text
+                  :size :sm
+                  :class (when favorited? "!text-yellow-800")
                   :on-click #(-> (if favorited?
                                    (page-handler/<unfavorite-page! block-id-str)
                                    (page-handler/<favorite-page! block-id-str))
                                  (p/then (fn [] (set-favorited! (not favorited?)))))}
-                 (shui/tabler-icon (if favorited? "star-filled" "star") {:size 18 :stroke 2})])
-              [:a.opacity-40.active:opacity-60.pr-1
-               {:on-pointer-down (fn []
-                                   (mobile-ui/open-popup!
-                                    (fn []
-                                      [:div.-mx-2
-                                       (ui/menu-link
-                                        {:on-click #(mobile-ui/close-popup!)}
-                                        [:span.text-lg.flex.gap-2.items-center
-                                         (shui/tabler-icon "copy" {:class "opacity-80" :size 22})
-                                         "Copy"])
+                 (shui/tabler-icon (if favorited? "star-filled" "star") {:size 20})))
+              (shui/button
+               {:variant :text
+                :size :sm
+                :on-click (fn []
+                            (mobile-ui/open-popup!
+                             (fn []
+                               [:div.-mx-2
+                                (ui/menu-link
+                                 {:on-click #(mobile-ui/close-popup!)}
+                                 [:span.text-lg.flex.gap-2.items-center
+                                  (shui/tabler-icon "copy" {:class "opacity-80" :size 22})
+                                  "Copy"])
 
-                                       (ui/menu-link
-                                        {:on-click #(-> (shui/dialog-confirm!
-                                                         (str "⚠️ Are you sure you want to delete this "
-                                                              (if (entity-util/page? block) "page" "block")
-                                                              "?"))
-                                                        (p/then
-                                                         (fn []
-                                                           (mobile-ui/close-popup!)
-                                                           (some->
-                                                            (:block/uuid block)
-                                                            (page-handler/<delete!
-                                                             (fn [] (close!))
-                                                             {:error-handler
-                                                              (fn [{:keys [msg]}]
-                                                                (notification/show! msg :warning))})))))}
-                                        [:span.text-lg.flex.gap-2.items-center.text-red-700
-                                         (shui/tabler-icon "trash" {:class "opacity-80" :size 22})
-                                         "Delete"])])
-                                    {:title "Actions"
-                                     :type :action-sheet}))}
-               (shui/tabler-icon "dots-vertical" {:size 18 :stroke 2})]]]
+                                (ui/menu-link
+                                 {:on-click #(-> (shui/dialog-confirm!
+                                                  (str "⚠️ Are you sure you want to delete this "
+                                                       (if (entity-util/page? block) "page" "block")
+                                                       "?"))
+                                                 (p/then
+                                                  (fn []
+                                                    (mobile-ui/close-popup!)
+                                                    (some->
+                                                     (:block/uuid block)
+                                                     (page-handler/<delete!
+                                                      (fn [] (close!))
+                                                      {:error-handler
+                                                       (fn [{:keys [msg]}]
+                                                         (notification/show! msg :warning))})))))}
+                                 [:span.text-lg.flex.gap-2.items-center.text-red-700
+                                  (shui/tabler-icon "trash" {:class "opacity-80" :size 22})
+                                  "Delete"])])
+                             {:title "Actions"
+                              :type :action-sheet}))}
+               (shui/tabler-icon "dots-vertical" {:size 20}))]]
 
             ;; block page content
             [:div.block-modal-page-content
-             (when open?
-               (mobile-ui/classic-app-container-wrap
-                (page/page-cp (db/entity [:block/uuid (:block/uuid block)]))))]])))))))))
+             (mobile-ui/classic-app-container-wrap
+              (page/page-cp (db/entity [:block/uuid (:block/uuid block)])))]])))))))))

+ 7 - 12
src/main/mobile/core.cljs

@@ -5,7 +5,6 @@
             [frontend.components.page :as page]
             [frontend.handler :as fhandler]
             [frontend.handler.db-based.rtc-background-tasks]
-            [frontend.handler.route :as route-handler]
             [frontend.util :as util]
             [mobile.components.app :as app]
             [mobile.events]
@@ -21,28 +20,24 @@
   (.render root (app/main)))
 
 (def routes
-  [["/page/:name"
+  [["/"
+    {:name :home}]
+   ["/page/:name"
     {:name :page
      :view (fn [route-match]
              (page/page-cp (assoc route-match :current-page? true)))}]])
 
 (defn set-router!
   []
-  (.addEventListener js/window "popstate" route-handler/restore-scroll-pos)
   (rfe/start!
    (rf/router routes nil)
    (fn [route]
-     (route-handler/set-route-match! route)
-     (case (get-in route [:data :name])
-       :page
+     (when (= :page (get-in route [:data :name]))
        (let [id-str (get-in route [:path-params :name])]
          (when (util/uuid-string? id-str)
            (let [page-uuid (uuid id-str)]
              (state/set-singleton-modal! {:open? true
-                                :block {:block/uuid page-uuid}}))))
-       :user-login
-       nil
-       nil))
+                                          :block {:block/uuid page-uuid}}))))))
 
    ;; set to false to enable HistoryAPI
    {:use-fragment true}))
@@ -51,7 +46,7 @@
   ;; init is called ONCE when the page loads
   ;; this is called in the index.html and must be exported
   ;; so it is available even in :advanced release builds
-  (prn "[capacitor-new] init!")
+  (prn "[Mobile] init!")
   (set-router!)
   (init/init!)
   (fhandler/start! render!))
@@ -59,4 +54,4 @@
 (defn ^:export stop! []
   ;; stop is called before any code is reloaded
   ;; this is controlled by :before-load in the config
-  (prn "[capacitor-new] stop!"))
+  (prn "[Mobile] stop!"))