Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-23 23:35:58 -05:00
Code Issues Activity

🐛 Fix swap component breaks grid layout

Browse source
This commit is contained in:
alonso.torres 2024-01-09 15:42:15 +01:00 • committed by Andrey Antukh
parent 5c3ea37bbe
commit a4796e8db8
2 changed files with 19 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
frontend/src/app/main/data/workspace/libraries.cljs
View file

@ -825,12 +825,11 @@
second)
0)))))
(defn- component-swap
"Swaps a component with another one"
(defn- add-component-for-swap
[shape file-id id-new-component]
(dm/assert! (uuid? id-new-component))
(dm/assert! (uuid? file-id))
(ptk/reify ::component-swap
(ptk/reify ::add-component-for-swap
ptk/WatchEvent
(watch [it state _]
(let [page (wsh/lookup-page state)
@ -856,12 +855,24 @@
;; We need to set the same index as the original shape
changes (pcb/change-parent changes (:parent-id shape) [new-shape] index {:component-swap true})]
;; First delete so we don't break the grid layout cells
(rx/of (dch/commit-changes changes)
(ptk/data-event :layout/update [(:id new-shape)])
(dws/select-shape (:id new-shape) true)
(dwsh/delete-shapes nil (d/ordered-set (:id shape)) {:component-swap true}))))))
(dws/select-shape (:id new-shape) true))))))
(defn- component-swap
"Swaps a component with another one"
[shape file-id id-new-component]
(dm/assert! (uuid? id-new-component))
(dm/assert! (uuid? file-id))
(ptk/reify ::component-swap
ptk/WatchEvent
(watch [_ _ _]
;; First delete shapes so we have space in the layout otherwise we can have problems
;; in the grid creating new rows/columns to make space
(rx/of (dwsh/delete-shapes nil (d/ordered-set (:id shape)) {:component-swap true})
(add-component-for-swap shape file-id id-new-component)
(ptk/data-event :layout/update [(:parent-id shape)])))))
(defn component-multi-swap
"Swaps several components with another one"

1
frontend/src/app/main/ui/workspace/sidebar/options/menus/component.scss
View file

@ -213,6 +213,7 @@
.component-list-empty {
@include titleTipography;
margin: 0 $s-4 0 $s-8;
color: $df-secondary;
}
.component-list {