Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-09 08:38:15 -05:00
Code Issues Activity

Merge pull request #3843 from penpot/niwinz-feature-grid-hotfix-2

Browse source 
🐛 Bugfixes backport to features-grid
This commit is contained in:
Andrey Antukh 2023-11-22 23:28:00 +01:00 • committed by GitHub
commit 4cb69b8cb6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 92 additions and 82 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
common/src/app/common/files/repair.cljc
View file

@ -68,16 +68,10 @@
(defmethod repair-error :child-not-found (defmethod repair-error :child-not-found
[_ {:keys [shape page-id args] :as error} file-data _] [_ {:keys [shape page-id args] :as error} file-data _]
(let [repair-shape
(fn [parent-shape]
; Remove child shape from children list
(log/debug :hint " -> Remove child " :child-id (:child-id args))
(update parent-shape :shapes d/removev #(= % (:child-id args))))]
(log/info :hint "Repairing shape :child-not-found" :id (:id shape) :name (:name shape) :page-id page-id) (log/info :hint "Repairing shape :child-not-found" :id (:id shape) :name (:name shape) :page-id page-id)
(-> (pcb/empty-changes nil page-id) (-> (pcb/empty-changes nil page-id)
(pcb/with-file-data file-data) (pcb/with-file-data file-data)
(pcb/update-shapes [(:id shape)] repair-shape)))) (pcb/change-parent (:parent-id args) [shape] nil {:component-swap true})))
(defmethod repair-error :frame-not-found (defmethod repair-error :frame-not-found
[_ {:keys [shape page-id] :as error} file-data _] [_ {:keys [shape page-id] :as error} file-data _]

9
common/src/app/common/files/validate.cljc
View file

@ -64,7 +64,7 @@
(def ^:dynamic *errors* nil) (def ^:dynamic *errors* nil)
(defn report-error! (defn report-error!
[code hint shape file page & args] [code hint shape file page & {:as args}]
(if (some? *errors*) (if (some? *errors*)
(vswap! *errors* conj {:code code (vswap! *errors* conj {:code code
:hint hint :hint hint
@ -122,11 +122,12 @@
shape file page))) shape file page)))
(doseq [child-id (:shapes shape)] (doseq [child-id (:shapes shape)]
(when (nil? (ctst/get-shape page child-id)) (let [child (ctst/get-shape page child-id)]
(when (or (nil? child) (not= (:parent-id child) (:id shape)))
(report-error! :child-not-found (report-error! :child-not-found
(str/ffmt "Child % not found" child-id) (str/ffmt "Child % not found" child-id)
shape file page child file page
:child-id child-id))))))) :parent-id (:id shape)))))))))
(defn validate-frame! (defn validate-frame!
"Validate that the frame-id shape exists and is indeed a frame. Also "Validate that the frame-id shape exists and is indeed a frame. Also

2
common/src/app/common/types/container.cljc
View file

@ -338,7 +338,7 @@
[new-shape new-shapes _] [new-shape new-shapes _]
(ctst/clone-object component-shape (ctst/clone-object component-shape
uuid/zero frame-id
(if components-v2 (:objects component-page) (:objects component)) (if components-v2 (:objects component-page) (:objects component))
update-new-shape update-new-shape
(fn [object _] object) (fn [object _] object)

3
frontend/src/app/main/data/workspace.cljs
View file

@ -1318,7 +1318,8 @@
(rx/of (go-to-page page-id)) (rx/of (go-to-page page-id))
(->> stream (->> stream
(rx/filter (ptk/type? ::initialize-page)) (rx/filter (ptk/type? ::initialize-page))
(rx/take 1)) (rx/take 1)
(rx/observe-on :async))
(select-and-zoom shape-id))) (select-and-zoom shape-id)))
redirect-to-file redirect-to-file

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

@ -817,7 +817,12 @@
id-new-component id-new-component
position position
page page
libraries) libraries
nil
(:parent-id shape)
(:frame-id shape))
;; 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})] changes (pcb/change-parent changes (:parent-id shape) [new-shape] index {:component-swap true})]
(rx/of (dch/commit-changes changes) (rx/of (dch/commit-changes changes)
(ptk/data-event :layout/update [(:id new-shape)]) (ptk/data-event :layout/update [(:id new-shape)])

15
frontend/src/app/main/data/workspace/libraries_helpers.cljs
View file

@ -144,10 +144,11 @@
(defn generate-instantiate-component (defn generate-instantiate-component
"Generate changes to create a new instance from a component." "Generate changes to create a new instance from a component."
([changes objects file-id component-id position page libraries] ([changes objects file-id component-id position page libraries]
(generate-instantiate-component changes objects file-id component-id position page libraries nil nil)) (generate-instantiate-component changes objects file-id component-id position page libraries nil nil nil))
([changes objects file-id component-id position page libraries old-id parent-id] ([changes objects file-id component-id position page libraries old-id parent-id frame-id]
(let [component (ctf/get-component libraries file-id component-id) (let [component (ctf/get-component libraries file-id component-id)
parent (when parent-id (get objects parent-id))
library (get libraries file-id) library (get libraries file-id)
components-v2 (dm/get-in library [:data :options :components-v2]) components-v2 (dm/get-in library [:data :options :components-v2])
@ -161,7 +162,15 @@
first-shape (cond-> (first new-shapes) first-shape (cond-> (first new-shapes)
(not (nil? parent-id)) (not (nil? parent-id))
(assoc :parent-id parent-id)) (assoc :parent-id parent-id)
(and (not (nil? parent)) (= :frame (:type parent)))
(assoc :frame-id (:id parent))
(and (not (nil? parent)) (not= :frame (:type parent)))
(assoc :frame-id (:frame-id parent))
(and (not (nil? parent)) (ctn/in-any-component? objects parent))
(dissoc :component-root)
(and (nil? parent) (not (nil? frame-id)))
(assoc :frame-id frame-id))
;; on copy/paste old id is used later to reorder the paster layers ;; on copy/paste old id is used later to reorder the paster layers
changes (cond-> (pcb/add-object changes first-shape {:ignore-touched true}) changes (cond-> (pcb/add-object changes first-shape {:ignore-touched true})

27
frontend/src/app/main/data/workspace/media.cljs
View file

@ -17,7 +17,6 @@
[app.common.svg.shapes-builder :as csvg.shapes-builder] [app.common.svg.shapes-builder :as csvg.shapes-builder]
[app.common.types.container :as ctn] [app.common.types.container :as ctn]
[app.common.types.shape :as cts] [app.common.types.shape :as cts]
[app.common.types.shape-tree :as ctst]
[app.common.uuid :as uuid] [app.common.uuid :as uuid]
[app.config :as cf] [app.config :as cf]
[app.main.data.media :as dmm] [app.main.data.media :as dmm]
@ -315,9 +314,9 @@
(defn create-shapes-img (defn create-shapes-img
"Convert a media object that contains a bitmap image into shapes, "Convert a media object that contains a bitmap image into shapes,
one shape of type :rect containing an image fill and one group that contains it." one shape of type :rect containing an image fill and one group that contains it."
[pos {:keys [name width height id mtype] :as media-obj} & {:keys [wrapper-type] :or {wrapper-type :group}}] [pos {:keys [name width height id mtype] :as media-obj}]
(let [group-shape (cts/setup-shape (let [frame-shape (cts/setup-shape
{:type wrapper-type {:type :frame
:x (:x pos) :x (:x pos)
:y (:y pos) :y (:y pos)
:width width :width width
@ -339,24 +338,18 @@
:height height :height height
:mtype mtype}}] :mtype mtype}}]
:name name :name name
:frame-id uuid/zero :frame-id (:id frame-shape)
:parent-id (:id group-shape)})] :parent-id (:id frame-shape)})]
(rx/of [group-shape [img-shape]]))) (rx/of [frame-shape [img-shape]])))
(defn- add-shapes-and-component (defn- add-shapes-and-component
[it file-data page name [shape children]] [it file-data page name [shape children]]
(let [page' (reduce #(ctst/add-shape (:id %2) %2 %1 uuid/zero (:parent-id %2) nil false) (let [[component-shape component-shapes updated-shapes]
page (ctn/convert-shape-in-component shape children (:id file-data))
(cons shape children))
shape' (ctn/get-shape page' (:id shape))
[component-shape component-shapes updated-shapes]
(ctn/make-component-shape shape' (:objects page') (:id file-data) true)
changes (-> (pcb/empty-changes it) changes (-> (pcb/empty-changes it)
(pcb/with-page page') (pcb/with-page page)
(pcb/with-objects (:objects page')) (pcb/with-objects (:objects page))
(pcb/with-library-data file-data) (pcb/with-library-data file-data)
(pcb/add-objects (cons shape children)) (pcb/add-objects (cons shape children))
(pcb/add-component (:id component-shape) (pcb/add-component (:id component-shape)

7
frontend/src/app/main/data/workspace/selection.cljs
View file

@ -380,7 +380,7 @@
(prepare-duplicate-guides shapes page ids-map delta))))) (prepare-duplicate-guides shapes page ids-map delta)))))
(defn- prepare-duplicate-component-change (defn- prepare-duplicate-component-change
[changes objects page component-root parent-id delta libraries library-data it] [changes objects page component-root parent-id frame-id delta libraries library-data it]
(let [component-id (:component-id component-root) (let [component-id (:component-id component-root)
file-id (:component-file component-root) file-id (:component-file component-root)
main-component (ctf/get-component libraries file-id component-id) main-component (ctf/get-component libraries file-id component-id)
@ -396,7 +396,8 @@
page page
libraries libraries
(:id component-root) (:id component-root)
parent-id) parent-id
frame-id)
restore-component restore-component
#(let [restore (dwlh/prepare-restore-component changes library-data (:component-id component-root) it page delta (:id component-root) parent-id)] #(let [restore (dwlh/prepare-restore-component changes library-data (:component-id component-root) it page delta (:id component-root) parent-id)]
@ -419,7 +420,7 @@
changes changes
(ctf/is-known-component? obj libraries) (ctf/is-known-component? obj libraries)
(prepare-duplicate-component-change changes objects page obj parent-id delta libraries library-data it) (prepare-duplicate-component-change changes objects page obj parent-id frame-id delta libraries library-data it)
:else :else
(let [frame? (cfh/frame-shape? obj) (let [frame? (cfh/frame-shape? obj)

1
frontend/src/app/main/ui/export.scss
View file

@ -201,6 +201,7 @@
img, img,
svg { svg {
object-fit: contain; object-fit: contain;
max-height: $s-40;
} }
} }
} }

4
frontend/src/app/main/ui/workspace/sidebar.cljs
View file

@ -66,8 +66,8 @@
:id "left-sidebar-aside" :id "left-sidebar-aside"
:data-size size :data-size size
:class (stl/css-case new-css-system :class (stl/css-case new-css-system
:global/settings-bar true :global/settings-bar (not new-css-system)
:global/settings-bar-left true :global/settings-bar-left (not new-css-system)
:left-settings-bar true :left-settings-bar true
:global/two-row (<= size 300) :global/two-row (<= size 300)
:global/three-row (and (> size 300) (<= size 400)) :global/three-row (and (> size 300) (<= size 400))

58
frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs
View file

@ -17,7 +17,6 @@
[app.main.data.workspace.specialized-panel :as dwsp] [app.main.data.workspace.specialized-panel :as dwsp]
[app.main.refs :as refs] [app.main.refs :as refs]
[app.main.store :as st] [app.main.store :as st]
[app.main.ui.components.context-menu :refer [context-menu]]
[app.main.ui.components.dropdown :refer [dropdown]] [app.main.ui.components.dropdown :refer [dropdown]]
[app.main.ui.components.radio-buttons :refer [radio-button radio-buttons]] [app.main.ui.components.radio-buttons :refer [radio-button radio-buttons]]
[app.main.ui.components.search-bar :refer [search-bar]] [app.main.ui.components.search-bar :refer [search-bar]]
@ -161,6 +160,7 @@
visible? (h/use-visible item-ref :once? true)] visible? (h/use-visible item-ref :once? true)]
[:div [:div
{:ref item-ref {:ref item-ref
:title (if is-search (:full-name item) (:name item))
:class (stl/css-case :component-item (not listing-thumbs) :class (stl/css-case :component-item (not listing-thumbs)
:grid-cell listing-thumbs :grid-cell listing-thumbs
:selected (= (:id item) component-id) :selected (= (:id item) component-id)
@ -182,7 +182,8 @@
path (cfh/butlast-path group-name) path (cfh/butlast-path group-name)
on-group-click #(on-enter-group group-name)] on-group-click #(on-enter-group group-name)]
[:div {:class (stl/css :component-group) [:div {:class (stl/css :component-group)
:key (uuid/next) :on-click on-group-click} :key (uuid/next) :on-click on-group-click
:title group-name}
[:div [:div
(when-not (str/blank? path) (when-not (str/blank? path)
[:span {:class (stl/css :component-group-path)} (str "\u00A0/\u00A0" path)]) [:span {:class (stl/css :component-group-path)} (str "\u00A0/\u00A0" path)])
@ -195,10 +196,10 @@
(let [single? (= 1 (count shapes)) (let [single? (= 1 (count shapes))
shape (first shapes) shape (first shapes)
current-file-id (mf/use-ctx ctx/current-file-id) current-file-id (mf/use-ctx ctx/current-file-id)
workspace-file (deref refs/workspace-file) workspace-file (mf/deref refs/workspace-file)
workspace-data (deref refs/workspace-data) workspace-data (mf/deref refs/workspace-data)
workspace-libraries (deref refs/workspace-libraries) workspace-libraries (mf/deref refs/workspace-libraries)
objects (deref refs/workspace-page-objects) objects (mf/deref refs/workspace-page-objects)
libraries (assoc workspace-libraries current-file-id (assoc workspace-file :data workspace-data)) libraries (assoc workspace-libraries current-file-id (assoc workspace-file :data workspace-data))
every-same-file? (every? #(= (:component-file shape) (:component-file %)) shapes) every-same-file? (every? #(= (:component-file shape) (:component-file %)) shapes)
current-comp-id (when (every? #(= (:component-id shape) (:component-id %)) shapes) current-comp-id (when (every? #(= (:component-id shape) (:component-id %)) shapes)
@ -233,8 +234,15 @@
filters (deref filters*) filters (deref filters*)
is-search? (not (str/blank? (:term filters))) is-search? (not (str/blank? (:term filters)))
current-library-id (if (contains? libraries (:file-id filters))
(:file-id filters)
current-file-id)
components (->> (get-in libraries [(:file-id filters) :data :components]) current-library-name (if (= current-library-id current-file-id)
(str/upper (tr "workspace.assets.local-library"))
(get-in libraries [current-library-id :name]))
components (->> (get-in libraries [current-library-id :data :components])
vals vals
(remove #(true? (:deleted %))) (remove #(true? (:deleted %)))
(map #(assoc % :full-name (cfh/merge-path-item (:path %) (:name %))))) (map #(assoc % :full-name (cfh/merge-path-item (:path %) (:name %)))))
@ -283,11 +291,6 @@
libraries-options (map (fn [library] {:value (:id library) :label (:name library)}) (vals libraries)) libraries-options (map (fn [library] {:value (:id library) :label (:name library)}) (vals libraries))
current-library-id (:file-id filters)
current-library-name (if (= current-library-id current-file-id)
(str/upper (tr "workspace.assets.local-library"))
(get-in libraries [current-library-id :name]))
on-library-change on-library-change
(mf/use-fn (mf/use-fn
(fn [id] (fn [id]
@ -323,13 +326,13 @@
[:& search-bar {:on-change on-search-term-change [:& search-bar {:on-change on-search-term-change
:clear-action on-search-clear-click :clear-action on-search-clear-click
:value (:term filters) :value (:term filters)
:placeholder (str (tr "labels.search") " " (get-in libraries [(:file-id filters) :name])) :placeholder (str (tr "labels.search") " " (get-in libraries [current-library-id :name]))
:icon (mf/html [:span {:class (stl/css :search-icon)} i/search-refactor])}]] :icon (mf/html [:span {:class (stl/css :search-icon)} i/search-refactor])}]]
[:div {:class (stl/css :select-field)} [:div {:class (stl/css :select-field)}
[:& select [:& select
{:class (stl/css :select-library) {:class (stl/css :select-library)
:default-value (:file-id filters) :default-value current-library-id
:options libraries-options :options libraries-options
:on-change on-library-change}]] :on-change on-library-change}]]
@ -351,7 +354,8 @@
(if (or is-search? (str/empty? (:path filters))) (if (or is-search? (str/empty? (:path filters)))
[:div {:class (stl/css :component-path-empty)}] [:div {:class (stl/css :component-path-empty)}]
[:button {:class (stl/css :component-path) [:button {:class (stl/css :component-path)
:on-click on-go-back} :on-click on-go-back
:title (:path filters)}
[:span i/arrow-slide] [:span i/arrow-slide]
[:span (:path filters)]]) [:span (:path filters)]])
@ -364,7 +368,7 @@
:component-list (not (:listing-thumbs? filters)))} :component-list (not (:listing-thumbs? filters)))}
(for [item items] (for [item items]
(if (:id item) (if (:id item)
(let [data (get-in libraries [(:file-id filters) :data]) (let [data (get-in libraries [current-library-id :data])
container (ctf/get-component-page data item) container (ctf/get-component-page data item)
root-shape (ctf/get-component-root data item) root-shape (ctf/get-component-root data item)
loop? (or (contains? parent-components (:main-instance-id item)) loop? (or (contains? parent-components (:main-instance-id item))
@ -372,7 +376,7 @@
[:& component-swap-item {:item item [:& component-swap-item {:item item
:loop loop? :loop loop?
:shapes shapes :shapes shapes
:file-id (:file-id filters) :file-id current-library-id
:root-shape root-shape :root-shape root-shape
:container container :container container
:component-id current-comp-id :component-id current-comp-id
@ -381,21 +385,18 @@
[:& component-group-item {:item item :on-enter-group on-enter-group}]))]]])) [:& component-group-item {:item item :on-enter-group on-enter-group}]))]]]))
(mf/defc component-ctx-menu (mf/defc component-ctx-menu
[{:keys [menu-entries on-close show type] :as props}] [{:keys [menu-entries on-close show] :as props}]
(case type (let [do-action
:context-menu (fn [action event]
[:& context-menu {:on-close on-close (dom/stop-propagation event)
:show show (action)
:options (on-close))]
(vec (for [entry menu-entries :when (not (nil? entry))]
[(tr (:msg entry)) (:action entry)]))}]
:dropdown
[:& dropdown {:show show :on-close on-close} [:& dropdown {:show show :on-close on-close}
[:ul {:class (stl/css :custom-select-dropdown)} [:ul {:class (stl/css :custom-select-dropdown)}
(for [entry menu-entries :when (not (nil? entry))] (for [entry menu-entries :when (not (nil? entry))]
[:li {:key (uuid/next) [:li {:key (uuid/next)
:class (stl/css :dropdown-element) :class (stl/css :dropdown-element)
:on-click (:action entry)} :on-click (partial do-action (:action entry))}
[:span {:class (stl/css :dropdown-label)} [:span {:class (stl/css :dropdown-label)}
(tr (:msg entry))]])]])) (tr (:msg entry))]])]]))
@ -486,8 +487,7 @@
[:& component-ctx-menu {:show menu-open? [:& component-ctx-menu {:show menu-open?
:on-close on-menu-close :on-close on-menu-close
:menu-entries menu-entries :menu-entries menu-entries}]])
:type :dropdown}]])
(when (and can-swap? (not multi)) (when (and can-swap? (not multi))
[:div {:class (stl/css :component-parent-name)} [:div {:class (stl/css :component-parent-name)}
(cfh/merge-path-item (:path component) (:name component))])]] (cfh/merge-path-item (:path component) (:name component))])]]

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

@ -230,6 +230,11 @@
background-color: var(--assets-item-background-color); background-color: var(--assets-item-background-color);
color: var(--assets-item-name-foreground-color); color: var(--assets-item-name-foreground-color);
.component-name {
@include textEllipsis;
width: 80%;
}
svg, svg,
img { img {
background-color: var(--assets-component-background-color); background-color: var(--assets-component-background-color);