✨ Add clear artboard guides option to context menu (#8936)

* ✨ Add clear artboard guides option to context menu

Adds a "Clear artboard guides" option to the right-click context menu
when one or more frames with guides are selected. Closes #6987

* ♻️ Address review feedback from niwinz

- Replace deprecated dm/assert! with assert
- Replace (map :id) with d/xf:map-id

Signed-off-by: eureka928 <meobius123@gmail.com>

CHANGES.md

@@ -10,6 +10,7 @@
 
 ### :sparkles: New features & Enhancements
 
+- Add "Clear artboard guides" option to right-click context menu for frames (by @eureka928) [Github #6987](https://github.com/penpot/penpot/issues/6987)
 - Allow duplicating color and typography styles (by @MkDev11) [Github #2912](https://github.com/penpot/penpot/issues/2912)
 - Add woff2 support on user uploaded fonts (by @Nivl) [Github #8248](https://github.com/penpot/penpot/pull/8248)
 - Import Tokens from linked library (by @dfelinto) [Github #8391](https://github.com/penpot/penpot/pull/8391)

frontend/src/app/main/data/workspace/guides.cljs

@@ -6,6 +6,7 @@
 
 (ns app.main.data.workspace.guides
   (:require
+   [app.common.data :as d]
    [app.common.data.macros :as dm]
    [app.common.files.changes-builder :as pcb]
    [app.common.geom.point :as gpt]
@@ -77,6 +78,36 @@
             guides (-> (select-keys guides ids) (vals))]
         (rx/from (mapv remove-guide guides))))))
 
+(defn remove-frame-guides
+  [frame-ids]
+
+  (assert (every? uuid? frame-ids) "expected a coll of uuids")
+
+  (ptk/reify ::remove-frame-guides
+    ptk/UpdateEvent
+    (update [_ state]
+      (let [{:keys [guides]} (dsh/lookup-page state)
+            frame-ids-set    (set frame-ids)
+            guide-ids        (into #{}
+                                   (comp (filter #(contains? frame-ids-set (:frame-id %)))
+                                         d/xf:map-id)
+                                   (vals guides))]
+        (update-in state [:workspace-guides :hover]
+                   (fn [hover] (reduce disj (or hover #{}) guide-ids)))))
+
+    ptk/WatchEvent
+    (watch [it state _]
+      (let [{:keys [guides] :as page} (dsh/lookup-page state)
+            frame-ids-set    (set frame-ids)
+            to-remove        (filter #(contains? frame-ids-set (:frame-id %)) (vals guides))
+            changes          (reduce
+                              (fn [acc {:keys [id]}]
+                                (pcb/set-guide acc id nil))
+                              (-> (pcb/empty-changes it)
+                                  (pcb/with-page page))
+                              to-remove)]
+        (rx/of (dwc/commit-changes changes))))))
+
 (defmethod ptk/resolve ::move-frame-guides
   [_ args]
   (dm/assert!

frontend/src/app/main/refs.cljs

@@ -306,6 +306,9 @@
 (def workspace-page-flows
   (l/derived #(-> % :flows not-empty) workspace-page))
 
+(def workspace-page-guides
+  (l/derived :guides workspace-page))
+
 (defn workspace-page-object-by-id
   [page-id shape-id]
   (l/derived #(dsh/lookup-shape % page-id shape-id) st/state =))

frontend/src/app/main/ui/workspace/context_menu.cljs

@@ -21,6 +21,7 @@
    [app.main.data.modal :as modal]
    [app.main.data.shortcuts :as scd]
    [app.main.data.workspace :as dw]
+   [app.main.data.workspace.guides :as dwg]
    [app.main.data.workspace.interactions :as dwi]
    [app.main.data.workspace.libraries :as dwl]
    [app.main.data.workspace.selection :as dws]
@@ -646,6 +647,25 @@
         [:> menu-entry* {:title (tr "workspace.shape.menu.combine-as-variants")
                          :on-click do-combine-as-variants}]])]))
 
+(mf/defc context-menu-guides*
+  {::mf/props :obj
+   ::mf/private true}
+  [{:keys [shapes]}]
+  (let [frame-ids    (into #{} (comp (filter cfh/frame-shape?) d/xf:map-id) shapes)
+        guides       (mf/deref refs/workspace-page-guides)
+        has-guides?  (some #(contains? frame-ids (:frame-id %)) (vals guides))
+
+        do-remove-guides
+        (mf/use-fn
+         (mf/deps frame-ids)
+         #(st/emit! (dwg/remove-frame-guides frame-ids)))]
+
+    (when (and (seq frame-ids) has-guides?)
+      [:*
+       [:> menu-separator* {}]
+       [:> menu-entry* {:title (tr "workspace.shape.menu.clear-guides")
+                        :on-click do-remove-guides}]])))
+
 (mf/defc context-menu-delete*
   {::mf/props :obj
    ::mf/private true}
@@ -687,6 +707,7 @@
        (when is-not-variant-container?
          [:> context-menu-layout* props])
        [:> context-menu-component* props]
+       [:> context-menu-guides* props]
        [:> context-menu-delete* props]])))
 
 (mf/defc page-item-context-menu*

frontend/translations/en.po

@@ -7867,6 +7867,9 @@ msgid "workspace.shape.menu.show-main"
 msgstr "Show main component"
 
 #: src/app/main/ui/workspace/context_menu.cljs:314
+msgid "workspace.shape.menu.clear-guides"
+msgstr "Clear artboard guides"
+
 msgid "workspace.shape.menu.thumbnail-remove"
 msgstr "Remove thumbnail"