github/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2026-09-09 21:49:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

🐛 On component swap do not show secondary variants (#6928)

Browse Source
This commit is contained in:
Pablo Alba 2025-07-22 12:33:37 +02:00 committed by GitHub
parent 8c5afe5ab3
commit 4aa9f1f62b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 45 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/app/main/ui/workspace/sidebar/options/menus/component.cljs
View File

@ -12,6 +12,7 @@
[app.common.files.helpers :as cfh] [app.common.files.helpers :as cfh]
[app.common.files.variant :as cfv] [app.common.files.variant :as cfv]
[app.common.types.component :as ctk] [app.common.types.component :as ctk]
[app.common.types.components-list :as ctkl]
[app.common.types.file :as ctf] [app.common.types.file :as ctf]
[app.common.types.variant :as ctv] [app.common.types.variant :as ctv]
[app.main.data.helpers :as dsh] [app.main.data.helpers :as dsh]
@ -456,7 +457,7 @@
(mf/defc component-swap-item (mf/defc component-swap-item
{::mf/props :obj} {::mf/props :obj}
[{:keys [item loop shapes file-id root-shape container component-id is-search listing-thumbs]}] [{:keys [item loop shapes file-id root-shape container component-id is-search listing-thumbs num-variants]}]
(let [on-select (let [on-select
(mf/use-fn (mf/use-fn
(mf/deps shapes file-id item) (mf/deps shapes file-id item)
@ -483,7 +484,10 @@
:container container}]) :container container}])
[:span {:class (stl/css-case :component-name true [:span {:class (stl/css-case :component-name true
:selected (= (:id item) component-id))} :selected (= (:id item) component-id))}
(if is-search (:full-name item) (:name item))]])) (if is-search (:full-name item) (:name item))]
(when (ctk/is-variant? item)
[:span {:class (stl/css-case :variant-mark-cell listing-thumbs :variant-icon true)
:title (tr "workspace.assets.components.num-variants" num-variants)} i/variant])]))
(mf/defc component-group-item (mf/defc component-group-item
{::mf/props :obj} {::mf/props :obj}
@ -565,15 +569,24 @@
(:file-id filters) (:file-id filters)
current-file-id) current-file-id)
current-library-name (if (= current-library-id current-file-id) current-lib-name (if (= current-library-id current-file-id)
(str/upper (tr "workspace.assets.local-library")) (str/upper (tr "workspace.assets.local-library"))
(dm/get-in libraries [current-library-id :name])) (dm/get-in libraries [current-library-id :name]))
current-lib-data (get-in libraries [current-library-id :data])
components (->> (get-in libraries [current-library-id :data :components]) components (->> (get-in libraries [current-library-id :data :components])
vals vals
(remove #(true? (:deleted %))) (remove #(true? (:deleted %)))
(remove #(cfv/is-secondary-variant? % current-lib-data))
(map #(assoc % :full-name (cfh/merge-path-item-with-dot (:path %) (:name %))))) (map #(assoc % :full-name (cfh/merge-path-item-with-dot (:path %) (:name %)))))
count-variants (fn [component]
(->> (ctkl/components-seq current-lib-data)
(filterv #(= (:variant-id component) (:variant-id %)))
count))
get-subgroups (fn [path] get-subgroups (fn [path]
(let [split-path (cfh/split-path path)] (let [split-path (cfh/split-path path)]
(reduce (fn [acc dir] (reduce (fn [acc dir]
@ -666,7 +679,7 @@
[:div {:class (stl/css :swap-wrapper)} [:div {:class (stl/css :swap-wrapper)}
[:div {:class (stl/css :library-name-wrapper)} [:div {:class (stl/css :library-name-wrapper)}
[:div {:class (stl/css :library-name)} current-library-name] [:div {:class (stl/css :library-name)} current-lib-name]
[:div {:class (stl/css :listing-options-wrapper)} [:div {:class (stl/css :listing-options-wrapper)}
[:& radio-buttons {:class (stl/css :listing-options) [:& radio-buttons {:class (stl/css :listing-options)
@ -717,7 +730,8 @@
:container container :container container
:component-id component-id :component-id component-id
:is-search is-search? :is-search is-search?
:listing-thumbs (:listing-thumbs? filters)}]) :listing-thumbs (:listing-thumbs? filters)
:num-variants (count-variants item)}])
[:& component-group-item {:item item [:& component-group-item {:item item
:key (:name item) :key (:name item)

24
frontend/src/app/main/ui/workspace/sidebar/options/menus/component.scss
View File

@ -779,3 +779,27 @@
padding: 0; padding: 0;
text-align: start; text-align: start;
} }
.variant-icon {
@include flexCenter;
height: $s-24;
width: $s-24;
background-color: var(--color-background-tertiary);
border-radius: $br-8;
order: 3;
svg {
height: $s-12;
width: $s-12;
background-color: transparent;
margin: 0;
stroke: var(--color-accent-secondary);
}
}
.variant-mark-cell {
position: absolute;
right: $s-2;
top: $s-2;
}