github/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2026-06-16 20:32:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

⚡ Add memo to layout-container component

Browse Source
This commit is contained in:
Eva Marco 2026-06-11 16:18:01 +02:00
parent 2250c8e057
commit f6dac06c4e
10 changed files with 51 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs
View File

@ -1070,8 +1070,39 @@
[_]
(st/emit! (dom/open-new-window cf/grid-help-uri)))
(mf/defc layout-container-menu
{::mf/memo #{:ids :values :multiple :shapes :applied-tokens}}
(defn- check-layout-container-menu-props
[old-props new-props]
(let [old-applied-tokens (unchecked-get old-props "appliedTokens")
new-applied-tokens (unchecked-get new-props "appliedTokens")
o-values (unchecked-get old-props "values")
n-values (unchecked-get new-props "values")]
(and (identical? (get o-values :layout-gap)
(get n-values :layout-gap))
(identical? (get o-values :layout-gap-type)
(get n-values :layout-gap-type))
(identical? (get o-values :layout-padding)
(get n-values :layout-padding))
(identical? (get o-values :layout-padding-type)
(get n-values :layout-padding-type))
(identical? (get o-values :layout-wrap-type)
(get n-values :layout-wrap-type))
(identical? (get o-values :layout-align-items)
(get n-values :layout-align-items))
(identical? (get o-values :layout-flex-dir)
(get n-values :layout-flex-dir))
(identical? (get o-values :layout-justify-content)
(get n-values :layout-justify-content))
(identical? (get o-values :layout-align-content)
(get n-values :layout-align-content))
(identical? (get o-values :layout)
(get n-values :layout))
(identical? (unchecked-get old-props "ids")
(unchecked-get new-props "ids"))
(identical? old-applied-tokens
new-applied-tokens))))
(mf/defc layout-container-menu*
{::mf/wrap [#(mf/memo' % check-layout-container-menu-props)]}
[{:keys [ids values multiple applied-tokens]}]
(let [;; Display
layout-type (:layout values)

4
frontend/src/app/main/ui/workspace/sidebar/options/shapes/bool.cljs
View File

@ -15,7 +15,7 @@
[app.main.ui.workspace.sidebar.options.menus.fill :as fill]
[app.main.ui.workspace.sidebar.options.menus.grid-cell :as grid-cell]
[app.main.ui.workspace.sidebar.options.menus.layer :refer [layer-attrs layer-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-attrs layout-item-menu]]
[app.main.ui.workspace.sidebar.options.menus.measures :refer [measure-attrs measures-menu*]]
[app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-menu*]]
@ -94,7 +94,7 @@
:values measure-values
:shapes shapes}]
[:& layout-container-menu
[:> layout-container-menu*
{:type type
:ids [(:id shape)]
:values layout-container-values

4
frontend/src/app/main/ui/workspace/sidebar/options/shapes/circle.cljs
View File

@ -15,7 +15,7 @@
[app.main.ui.workspace.sidebar.options.menus.fill :as fill]
[app.main.ui.workspace.sidebar.options.menus.grid-cell :as grid-cell]
[app.main.ui.workspace.sidebar.options.menus.layer :refer [layer-attrs layer-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-attrs layout-item-menu]]
[app.main.ui.workspace.sidebar.options.menus.measures :refer [measure-attrs measures-menu*]]
[app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-menu*]]
@ -93,7 +93,7 @@
:values measure-values
:shapes shapes}]
[:& layout-container-menu
[:> layout-container-menu*
{:type type
:ids [(:id shape)]
:values layout-container-values

4
frontend/src/app/main/ui/workspace/sidebar/options/shapes/frame.cljs
View File

@ -19,7 +19,7 @@
[app.main.ui.workspace.sidebar.options.menus.frame-grid :refer [frame-grid*]]
[app.main.ui.workspace.sidebar.options.menus.grid-cell :as grid-cell]
[app.main.ui.workspace.sidebar.options.menus.layer :refer [layer-attrs layer-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-attrs layout-item-menu]]
[app.main.ui.workspace.sidebar.options.menus.measures :refer [select-measure-keys measures-menu*]]
[app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-menu*]]
@ -113,7 +113,7 @@
(when is-variant?
[:> component-variant-main* {:shapes shapes}])
[:& layout-container-menu
[:> layout-container-menu*
{:type shape-type
:ids ids
:applied-tokens applied-tokens

4
frontend/src/app/main/ui/workspace/sidebar/options/shapes/group.cljs
View File

@ -18,7 +18,7 @@
[app.main.ui.workspace.sidebar.options.menus.fill :as fill]
[app.main.ui.workspace.sidebar.options.menus.grid-cell :as grid-cell]
[app.main.ui.workspace.sidebar.options.menus.layer :refer [layer-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-menu]]
[app.main.ui.workspace.sidebar.options.menus.measures :refer [measures-menu*]]
[app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-menu*]]
@ -119,7 +119,7 @@
:values measure-values
:shapes shapes}]
[:& layout-container-menu
[:> layout-container-menu*
{:type type
:ids [(:id shape)]
:values layout-container-values

4
frontend/src/app/main/ui/workspace/sidebar/options/shapes/multiple.cljs
View File

@ -27,7 +27,7 @@
[app.main.ui.workspace.sidebar.options.menus.exports :refer [exports-attrs exports-menu*]]
[app.main.ui.workspace.sidebar.options.menus.fill :as fill]
[app.main.ui.workspace.sidebar.options.menus.layer :refer [layer-attrs layer-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-attrs layout-item-menu]]
[app.main.ui.workspace.sidebar.options.menus.measures :refer [select-measure-keys measure-attrs measures-menu*]]
[app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-attrs shadow-menu*]]
@ -459,7 +459,7 @@
(when (some? components)
[:> component-menu* {:shapes components}])
[:& layout-container-menu
[:> layout-container-menu*
{:type type
:ids layout-container-ids
:values layout-container-values

4
frontend/src/app/main/ui/workspace/sidebar/options/shapes/path.cljs
View File

@ -15,7 +15,7 @@
[app.main.ui.workspace.sidebar.options.menus.fill :as fill]
[app.main.ui.workspace.sidebar.options.menus.grid-cell :as grid-cell]
[app.main.ui.workspace.sidebar.options.menus.layer :refer [layer-attrs layer-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-attrs layout-item-menu]]
[app.main.ui.workspace.sidebar.options.menus.measures :refer [measure-attrs measures-menu*]]
[app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-menu*]]
@ -93,7 +93,7 @@
:values measure-values
:shapes shapes}]
[:& layout-container-menu
[:> layout-container-menu*
{:type type
:ids [(:id shape)]
:values layout-container-values

4
frontend/src/app/main/ui/workspace/sidebar/options/shapes/rect.cljs
View File

@ -15,7 +15,7 @@
[app.main.ui.workspace.sidebar.options.menus.fill :as fill]
[app.main.ui.workspace.sidebar.options.menus.grid-cell :as grid-cell]
[app.main.ui.workspace.sidebar.options.menus.layer :refer [layer-attrs layer-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-attrs layout-item-menu]]
[app.main.ui.workspace.sidebar.options.menus.measures :refer [measure-attrs measures-menu*]]
[app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-menu*]]
@ -93,7 +93,7 @@
:applied-tokens applied-tokens
:shapes shapes}]
[:& layout-container-menu
[:> layout-container-menu*
{:type type
:ids ids
:values layout-container-values

4
frontend/src/app/main/ui/workspace/sidebar/options/shapes/svg_raw.cljs
View File

@ -16,7 +16,7 @@
[app.main.ui.workspace.sidebar.options.menus.exports :refer [exports-menu* exports-attrs]]
[app.main.ui.workspace.sidebar.options.menus.fill :as fill]
[app.main.ui.workspace.sidebar.options.menus.grid-cell :as grid-cell]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-attrs layout-item-menu]]
[app.main.ui.workspace.sidebar.options.menus.measures :refer [measure-attrs measures-menu*]]
[app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-menu*]]
@ -160,7 +160,7 @@
:values measure-values
:shapes shapes}]
[:& layout-container-menu
[:> layout-container-menu*
{:type type
:ids [(:id shape)]
:values layout-container-values

4
frontend/src/app/main/ui/workspace/sidebar/options/shapes/text.cljs
View File

@ -21,7 +21,7 @@
[app.main.ui.workspace.sidebar.options.menus.fill :as fill]
[app.main.ui.workspace.sidebar.options.menus.grid-cell :as grid-cell]
[app.main.ui.workspace.sidebar.options.menus.layer :refer [layer-attrs layer-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu]]
[app.main.ui.workspace.sidebar.options.menus.layout-container :refer [layout-container-flex-attrs layout-container-menu*]]
[app.main.ui.workspace.sidebar.options.menus.layout-item :refer [layout-item-attrs layout-item-menu]]
[app.main.ui.workspace.sidebar.options.menus.measures :refer [measure-attrs measures-menu*]]
[app.main.ui.workspace.sidebar.options.menus.shadow :refer [shadow-menu*]]
@ -154,7 +154,7 @@
:applied-tokens applied-tokens
:shapes shapes}]
[:& layout-container-menu
[:> layout-container-menu*
{:type type
:ids ids
:values layout-container-values