Pārlūkot izejas kodu

enhance: user can delete a page icon or a closed value icon

Gabriel Horner 1 gadu atpakaļ
vecāks
revīzija
040b212e10

+ 10 - 2
src/main/frontend/components/db_based/page.cljs

@@ -91,7 +91,7 @@
   [:div.grid.grid-cols-5.gap-1.items-center.leading-8
    [:label.col-span-2 "Icon:"]
    (let [icon-value (pu/get-property page :icon)]
-     [:div.col-span-3
+     [:div.col-span-3.flex.flex-row.items-center.gap-2
       (icon-component/icon-picker icon-value
                                   {:disabled? config/publishing?
                                    :on-chosen (fn [_e icon]
@@ -99,7 +99,15 @@
                                                   (db-property-handler/update-property!
                                                    (state/get-current-repo)
                                                    (:block/uuid page)
-                                                   {:properties {icon-property-id icon}})))})])])
+                                                   {:properties {icon-property-id icon}})))})
+      (when (and icon-value (not config/publishing?))
+        [:a.fade-link.flex {:on-click (fn [_e]
+                                        (db-property-handler/remove-block-property!
+                                         (state/get-current-repo)
+                                         (:block/uuid page)
+                                         (db-pu/get-built-in-property-uuid :icon)))
+                            :title "Delete this icon"}
+        (ui/icon "X")])])])
 
 (rum/defcs page-configure-inner <
   (rum/local false ::show-page-properties?)

+ 10 - 2
src/main/frontend/components/property.cljs

@@ -158,7 +158,7 @@
       [:div.grid.grid-cols-4.gap-1.items-center.leading-8
        [:label.col-span-1 "Icon:"]
        (let [icon-value (pu/get-property property :icon)]
-         [:div.col-span-3
+         [:div.col-span-3.flex.flex-row.items-center.gap-2
           (icon-component/icon-picker icon-value
                                       {:disabled? disabled?
                                        :on-chosen (fn [_e icon]
@@ -166,7 +166,15 @@
                                                       (db-property-handler/update-property!
                                                        (state/get-current-repo)
                                                        (:block/uuid property)
-                                                       {:properties {icon-property-id icon}})))})])]
+                                                       {:properties {icon-property-id icon}})))})
+          (when (and icon-value (not disabled?))
+            [:a.fade-link.flex {:on-click (fn [_e]
+                                            (db-property-handler/remove-block-property!
+                                             (state/get-current-repo)
+                                             (:block/uuid property)
+                                             (db-pu/get-built-in-property-uuid :icon)))
+                                :title "Delete this icon"}
+             (ui/icon "X")])])]
 
       [:div.grid.grid-cols-4.gap-1.items-center.leading-8
        [:label.col-span-1 "Schema type:"]

+ 7 - 2
src/main/frontend/components/property/closed_value.cljs

@@ -72,10 +72,15 @@
       (item-value property-type *value)]
      [:div.grid.grid-cols-5.gap-1.items-center.leading-8
       [:label.col-span-2 "Icon:"]
-      [:div.col-span-3
+      [:div.col-span-3.flex.flex-row.items-center.gap-2
        (icon-component/icon-picker (rum/react *icon)
                                    {:on-chosen (fn [_e icon]
-                                                 (reset! *icon icon))})]]
+                                                 (reset! *icon icon))})
+       (when (rum/react *icon)
+        [:a.fade-link.flex {:on-click (fn [_e]
+                                        (reset! *icon nil))
+                            :title "Delete this icon"}
+        (ui/icon "X")])]]
      ;; Disable description for types that can't edit them
      (when-not (#{:page :date} property-type)
        [:div.grid.grid-cols-5.gap-1.items-start.leading-8