diff --git a/CHANGES.md b/CHANGES.md
index d1a107f50d..815e44385e 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -54,6 +54,7 @@
 - Fix problem with SVG imports with style [#2605](https://github.com/penpot/penpot/issues/2605)
 - Fix ghost shapes after sync groups in components [Taiga #4649](https://tree.taiga.io/project/penpot/issue/4649)
 - Fix layer orders messed up on move, group, reparent and undo [Github #2672](https://github.com/penpot/penpot/issues/2672)
+- Fix max height in library dialog [Github #2335](https://github.com/penpot/penpot/issues/2335)
 
 ## 1.16.2-beta
 
diff --git a/backend/src/app/rpc/commands/files.clj b/backend/src/app/rpc/commands/files.clj
index 059d3aa949..5d6895c725 100644
--- a/backend/src/app/rpc/commands/files.clj
+++ b/backend/src/app/rpc/commands/files.clj
@@ -962,7 +962,8 @@
   [{:keys [pool] :as cfg} {:keys [::rpc/profile-id file-id] :as params}]
   (db/with-atomic [conn pool]
     (check-edition-permissions! conn profile-id file-id)
-    (ignore-sync conn params)))
+    (->  (ignore-sync conn params)
+         (update :features db/decode-pgarray #{}))))
 
 
 ;; --- MUTATION COMMAND: upsert-file-object-thumbnail
diff --git a/common/src/app/common/geom/matrix.cljc b/common/src/app/common/geom/matrix.cljc
index f6fb4af36c..8ee0cc2acb 100644
--- a/common/src/app/common/geom/matrix.cljc
+++ b/common/src/app/common/geom/matrix.cljc
@@ -19,7 +19,6 @@
 (def precision 6)
 
 ;; --- Matrix Impl
-
 (defrecord Matrix [^double a
                    ^double b
                    ^double c
@@ -28,13 +27,23 @@
                    ^double f]
   Object
   (toString [_]
-    (str "matrix("
-         (mth/precision a precision) ","
-         (mth/precision b precision) ","
-         (mth/precision c precision) ","
-         (mth/precision d precision) ","
-         (mth/precision e precision) ","
-         (mth/precision f precision) ")")))
+    #?(:clj
+       (dm/fmt "matrix(%, %, %, %, %, %)"
+               (mth/precision a precision)
+               (mth/precision b precision)
+               (mth/precision c precision)
+               (mth/precision d precision)
+               (mth/precision e precision)
+               (mth/precision f precision))
+
+       :cljs
+       (dm/fmt "matrix(%, %, %, %, %, %)"
+               (.toFixed a precision)
+               (.toFixed b precision)
+               (.toFixed c precision)
+               (.toFixed d precision)
+               (.toFixed e precision)
+               (.toFixed f precision)))))
 
 (defn matrix?
   "Return true if `v` is Matrix instance."
diff --git a/common/src/app/common/geom/shapes/flex_layout/drop_area.cljc b/common/src/app/common/geom/shapes/flex_layout/drop_area.cljc
index 3c11174479..fe686ae0eb 100644
--- a/common/src/app/common/geom/shapes/flex_layout/drop_area.cljc
+++ b/common/src/app/common/geom/shapes/flex_layout/drop_area.cljc
@@ -41,7 +41,7 @@
           (:width parent-rect)
 
           :else
-          (+ box-width (- box-x prev-x) (/ layout-gap-row 2)))
+          (+ box-width (- box-x prev-x) (/ layout-gap-col 2)))
 
         height
         (cond
@@ -52,7 +52,7 @@
           (:height parent-rect)
 
           :else
-          (+ box-height (- box-y prev-y) (/ layout-gap-col 2)))]
+          (+ box-height (- box-y prev-y) (/ layout-gap-row 2)))]
 
     (if row?
       (let [half-point-width (+ (- box-x x) (/ box-width 2))]
@@ -87,14 +87,14 @@
         (if row?
           (:width frame)
           (+ line-width margin-x
-             (if row? (* layout-gap-row (dec num-children)) 0)))
+             (if row? (* layout-gap-col (dec num-children)) 0)))
 
         line-height
         (if col?
           (:height frame)
           (+ line-height margin-y
              (if col?
-               (* layout-gap-col (dec num-children))
+               (* layout-gap-row (dec num-children))
                0)))
 
         box-x
@@ -122,7 +122,7 @@
                 (:width frame)
 
                 :else
-                (+ line-width (- box-x prev-x) (/ layout-gap-row 2)))
+                (+ line-width (- box-x prev-x) (/ layout-gap-col 2)))
 
         height (cond
                  (and row? last?)
@@ -132,7 +132,7 @@
                  (:height frame)
 
                  :else
-                 (+ line-height (- box-y prev-y) (/ layout-gap-col 2)))]
+                 (+ line-height (- box-y prev-y) (/ layout-gap-row 2)))]
     (gsr/make-rect x y width height)))
 
 (defn layout-drop-areas
diff --git a/common/src/app/common/geom/shapes/flex_layout/lines.cljc b/common/src/app/common/geom/shapes/flex_layout/lines.cljc
index 7e445ab9fd..48f922856d 100644
--- a/common/src/app/common/geom/shapes/flex_layout/lines.cljc
+++ b/common/src/app/common/geom/shapes/flex_layout/lines.cljc
@@ -77,8 +77,8 @@
               next-max-width   (+ child-margin-width (if fill-width? child-max-width child-width))
               next-max-height  (+ child-margin-height (if fill-height? child-max-height child-height))
 
-              next-line-min-width  (+ line-min-width  next-min-width  (* layout-gap-row num-children))
-              next-line-min-height (+ line-min-height next-min-height (* layout-gap-col num-children))]
+              next-line-min-width  (+ line-min-width  next-min-width  (* layout-gap-col num-children))
+              next-line-min-height (+ line-min-height next-min-height (* layout-gap-row num-children))]
 
           (if (and (some? line-data)
                    (or (not wrap?)
@@ -168,20 +168,20 @@
       (let [[total-min-width total-min-height total-max-width total-max-height]
             (->> layout-lines (reduce add-ranges [0 0 0 0]))
 
-            get-layout-width (fn [{:keys [num-children]}] (- layout-width (* layout-gap-row (dec num-children))))
-            get-layout-height (fn [{:keys [num-children]}] (- layout-height (* layout-gap-col (dec num-children))))
+            get-layout-width (fn [{:keys [num-children]}] (- layout-width (* layout-gap-col (dec num-children))))
+            get-layout-height (fn [{:keys [num-children]}] (- layout-height (* layout-gap-row (dec num-children))))
 
             num-lines (count layout-lines)
 
             ;; When align-items is stretch we need to adjust the main axis size to grow for the full content
             stretch-width-fix
             (if (and col? (ctl/content-stretch? parent))
-              (/ (- layout-width (* layout-gap-row (dec num-lines)) total-max-width) num-lines)
+              (/ (- layout-width (* layout-gap-col (dec num-lines)) total-max-width) num-lines)
               0)
 
             stretch-height-fix
             (if (and row? (ctl/content-stretch? parent))
-              (/ (- layout-height (* layout-gap-col (dec num-lines)) total-max-height) num-lines)
+              (/ (- layout-height (* layout-gap-row (dec num-lines)) total-max-height) num-lines)
               0)
 
             ;; Distributes the space between the layout lines based on its max/min constraints
@@ -200,7 +200,7 @@
               (map #(assoc % :line-height (+ (:line-max-height %) stretch-height-fix)))
 
               (and row? (< total-min-height layout-height total-max-height))
-              (distribute-space :line-height :line-min-height :line-max-height total-min-height (- layout-height (* (dec num-lines) layout-gap-col)))
+              (distribute-space :line-height :line-min-height :line-max-height total-min-height (- layout-height (* (dec num-lines) layout-gap-row)))
 
               (and col? (>= total-min-width layout-width))
               (map #(assoc % :line-width (:line-min-width %)))
@@ -209,7 +209,7 @@
               (map #(assoc % :line-width (+ (:line-max-width %) stretch-width-fix)))
 
               (and col? (< total-min-width layout-width total-max-width))
-              (distribute-space :line-width :line-min-width :line-max-width total-min-width (- layout-width (* (dec num-lines) layout-gap-row))))
+              (distribute-space :line-width :line-min-width :line-max-width total-min-width (- layout-width (* (dec num-lines) layout-gap-col))))
 
             [total-width total-height] (->> layout-lines (reduce add-lines [0 0]))
 
@@ -231,7 +231,7 @@
 
         [layout-gap-row layout-gap-col] (ctl/gaps shape)
 
-        layout-gap-row
+        layout-gap-col
         (cond (and row? space-around?)
               0
 
@@ -239,9 +239,9 @@
               (/ (- width line-width) (dec num-children))
 
               :else
-              layout-gap-row)
+              layout-gap-col)
 
-        layout-gap-col
+        layout-gap-row
         (cond (and col? space-around?)
               0
 
@@ -249,7 +249,7 @@
               (/ (- height line-height) (dec num-children))
 
               :else
-              layout-gap-col)
+              layout-gap-row)
 
         margin-x
         (if (and row? space-around?)
diff --git a/common/src/app/common/geom/shapes/flex_layout/positions.cljc b/common/src/app/common/geom/shapes/flex_layout/positions.cljc
index cd5cff837b..1ad30c891d 100644
--- a/common/src/app/common/geom/shapes/flex_layout/positions.cljc
+++ b/common/src/app/common/geom/shapes/flex_layout/positions.cljc
@@ -29,8 +29,8 @@
         lines-gap-row (* (dec num-lines) layout-gap-row)
         lines-gap-col (* (dec num-lines) layout-gap-col)
 
-        free-width-gap (- layout-width total-width lines-gap-row)
-        free-height-gap (- layout-height total-height lines-gap-col)
+        free-width-gap (- layout-width total-width lines-gap-col)
+        free-height-gap (- layout-height total-height lines-gap-row)
         free-width (- layout-width total-width)
         free-height (- layout-height total-height)]
 
@@ -87,7 +87,7 @@
           (/ free-width (inc num-lines))
 
           :else
-          layout-gap-row)
+          layout-gap-col)
 
         line-gap-col
         (cond
@@ -101,14 +101,14 @@
           (/ free-height (inc num-lines))
 
           :else
-          layout-gap-col)]
+          layout-gap-row)]
 
     (cond-> base-p
       row?
-      (gpt/add (vv (+ line-height (max layout-gap-col line-gap-col))))
+      (gpt/add (vv (+ line-height (max layout-gap-row line-gap-col))))
 
       col?
-      (gpt/add (hv (+ line-width (max layout-gap-row line-gap-row)))))))
+      (gpt/add (hv (+ line-width (max layout-gap-col line-gap-row)))))))
 
 (defn get-start-line
   "Cross axis line. It's position is fixed along the different lines"
@@ -128,8 +128,8 @@
         content-stretch?    (ctl/content-stretch? parent)
         hv                  (partial gpo/start-hv layout-bounds)
         vv                  (partial gpo/start-vv layout-bounds)
-        children-gap-width  (* layout-gap-row (dec num-children))
-        children-gap-height (* layout-gap-col (dec num-children))
+        children-gap-width  (* layout-gap-col (dec num-children))
+        children-gap-height (* layout-gap-row (dec num-children))
 
         line-height
         (if (and row? content-stretch?)
@@ -257,12 +257,12 @@
         next-p
         (cond-> start-p
           row?
-          (-> (gpt/add (hv (+ child-width layout-gap-row)))
+          (-> (gpt/add (hv (+ child-width layout-gap-col)))
               (gpt/add (hv (+ margin-left margin-right))))
 
           col?
           (-> (gpt/add (vv (+ margin-top margin-bottom)))
-              (gpt/add (vv (+ child-height layout-gap-col))))
+              (gpt/add (vv (+ child-height layout-gap-row))))
           
           (some? margin-x)
           (gpt/add (hv margin-x))
diff --git a/common/src/app/common/types/shape/layout.cljc b/common/src/app/common/types/shape/layout.cljc
index 534174444c..6213668aa1 100644
--- a/common/src/app/common/types/shape/layout.cljc
+++ b/common/src/app/common/types/shape/layout.cljc
@@ -148,11 +148,9 @@
   (or (= :row layout-flex-dir) (= :reverse-row layout-flex-dir)))
 
 (defn gaps
-  [{:keys [layout-gap layout-gap-type]}]
+  [{:keys [layout-gap]}]
   (let [layout-gap-row (or (-> layout-gap :row-gap) 0)
-        layout-gap-col (if (= layout-gap-type :simple)
-                         layout-gap-row
-                         (or (-> layout-gap :column-gap) 0))]
+        layout-gap-col (or (-> layout-gap :column-gap) 0)]
     [layout-gap-row layout-gap-col]))
 
 (defn child-min-width
diff --git a/frontend/resources/styles/main/partials/modal.scss b/frontend/resources/styles/main/partials/modal.scss
index 174e300b85..37dc692e7d 100644
--- a/frontend/resources/styles/main/partials/modal.scss
+++ b/frontend/resources/styles/main/partials/modal.scss
@@ -626,6 +626,7 @@
   border-radius: $br-medium;
   height: 664px;
   width: 920px;
+  max-height: 100%;
 
   .modal-content {
     display: flex;
diff --git a/frontend/resources/styles/main/partials/sidebar.scss b/frontend/resources/styles/main/partials/sidebar.scss
index b94fa06e94..7979ba2e16 100644
--- a/frontend/resources/styles/main/partials/sidebar.scss
+++ b/frontend/resources/styles/main/partials/sidebar.scss
@@ -119,6 +119,19 @@
             }
           }
         }
+
+        & .view-only-mode {
+          color: $color-primary;
+          border: 1px solid $color-primary;
+          border-radius: 3px;
+          font-size: 10px;
+          text-transform: uppercase;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          margin-left: auto;
+          padding: 0.25rem;
+        }
       }
 
       & .focus-title {
diff --git a/frontend/resources/styles/main/partials/viewer-header.scss b/frontend/resources/styles/main/partials/viewer-header.scss
index b8b3a5ccc4..f1dd412ce5 100644
--- a/frontend/resources/styles/main/partials/viewer-header.scss
+++ b/frontend/resources/styles/main/partials/viewer-header.scss
@@ -76,6 +76,11 @@
           display: none;
         }
       }
+      &:hover {
+        svg {
+          fill: $color-gray-20;
+        }
+      }
     }
 
     .view-options {
diff --git a/frontend/src/app/main/data/workspace.cljs b/frontend/src/app/main/data/workspace.cljs
index e01bc88f9a..ff5ba2a521 100644
--- a/frontend/src/app/main/data/workspace.cljs
+++ b/frontend/src/app/main/data/workspace.cljs
@@ -812,11 +812,14 @@
             layouts-to-update
             (into #{}
                   (filter (partial ctl/layout? objects))
-                  (concat [parent-id] (cph/get-parent-ids objects parent-id)))]
+                  (concat [parent-id] (cph/get-parent-ids objects parent-id)))
+            undo-id (js/Symbol)]
 
-        (rx/of (dch/commit-changes changes)
+        (rx/of (dwu/start-undo-transaction undo-id)
+               (dch/commit-changes changes)
                (dwco/expand-collapse parent-id)
-               (ptk/data-event :layout/update layouts-to-update))))))
+               (ptk/data-event :layout/update layouts-to-update)
+               (dwu/commit-undo-transaction undo-id))))))
 
 (defn relocate-selected-shapes
   [parent-id to-index]
@@ -1558,11 +1561,14 @@
                                  (filter #(= (:type %) :add-obj))
                                  (filter #(selected (:old-id %)))
                                  (map #(get-in % [:obj :id]))
-                                 (into (d/ordered-set)))]
+                                 (into (d/ordered-set)))
+                  undo-id (js/Symbol)]
 
-              (rx/of (dch/commit-changes changes)
+              (rx/of (dwu/start-undo-transaction undo-id) 
+                     (dch/commit-changes changes)
                      (dws/select-shapes selected)
-                     (ptk/data-event :layout/update [frame-id]))))]
+                     (ptk/data-event :layout/update [frame-id])
+                     (dwu/commit-undo-transaction undo-id))))]
 
     (ptk/reify ::paste-shape
       ptk/WatchEvent
@@ -1582,8 +1588,10 @@
                         (map str/trim)
                         (mapv #(hash-map :type "paragraph"
                                          :children [(merge txt/default-text-attrs {:text %})])))]
-    {:type "root"
-     :children [{:type "paragraph-set" :children paragraphs}]}))
+    ;; if text is composed only by line breaks paragraphs is an empty list and should be nil
+    (when (d/not-empty? paragraphs)
+      {:type "root"
+       :children [{:type "paragraph-set" :children paragraphs}]})))
 
 (defn calculate-paste-position [state]
   (cond
@@ -1618,7 +1626,7 @@
                    :height height
                    :grow-type (if (> (count text) 100) :auto-height :auto-width)
                    :content (as-content text)}
-            undo-id (uuid/next)]
+            undo-id (js/Symbol)]
 
         (rx/of (dwu/start-undo-transaction undo-id)
                (dwsh/create-and-add-shape :text x y shape)
diff --git a/frontend/src/app/main/data/workspace/groups.cljs b/frontend/src/app/main/data/workspace/groups.cljs
index fde89eb0cb..509589ba76 100644
--- a/frontend/src/app/main/data/workspace/groups.cljs
+++ b/frontend/src/app/main/data/workspace/groups.cljs
@@ -16,6 +16,7 @@
    [app.main.data.workspace.changes :as dch]
    [app.main.data.workspace.selection :as dws]
    [app.main.data.workspace.state-helpers :as wsh]
+   [app.main.data.workspace.undo :as dwu]
    [beicon.core :as rx]
    [potok.core :as ptk]))
 
@@ -188,10 +189,13 @@
 
             changes {:redo-changes (vec (mapcat :redo-changes changes-list))
                      :undo-changes (vec (mapcat :undo-changes changes-list))
-                     :origin it}]
+                     :origin it}
+            undo-id (js/Symbol)]
 
-        (rx/of (dch/commit-changes changes)
-               (ptk/data-event :layout/update parents))))))
+        (rx/of (dwu/start-undo-transaction undo-id)
+               (dch/commit-changes changes)
+               (ptk/data-event :layout/update parents)
+               (dwu/commit-undo-transaction undo-id))))))
 
 (def mask-group
   (ptk/reify ::mask-group
diff --git a/frontend/src/app/main/data/workspace/interactions.cljs b/frontend/src/app/main/data/workspace/interactions.cljs
index ce22d5aec5..3eefbff6c2 100644
--- a/frontend/src/app/main/data/workspace/interactions.cljs
+++ b/frontend/src/app/main/data/workspace/interactions.cljs
@@ -246,7 +246,7 @@
 
                 :always
                 (ctsi/set-destination (:id target-frame))))
-            undo-id (uuid/next)]
+            undo-id (js/Symbol)]
 
         (rx/of
           (dwu/start-undo-transaction undo-id)
diff --git a/frontend/src/app/main/data/workspace/libraries.cljs b/frontend/src/app/main/data/workspace/libraries.cljs
index 7a028d0ac6..a4ce6a4a5d 100644
--- a/frontend/src/app/main/data/workspace/libraries.cljs
+++ b/frontend/src/app/main/data/workspace/libraries.cljs
@@ -154,7 +154,7 @@
                         (pcb/with-library-data data)
                         (pcb/update-color color))
         
-        undo-id (uuid/next)]
+        undo-id (js/Symbol)]
     (rx/of (dwu/start-undo-transaction undo-id)
            (dch/commit-changes changes)
            (sync-file (:current-file-id state) file-id :colors (:id color))
@@ -259,7 +259,7 @@
         changes     (-> (pcb/empty-changes it)
                         (pcb/with-library-data data)
                         (pcb/update-typography typography))
-        undo-id (uuid/next)]
+        undo-id (js/Symbol)]
     (rx/of (dwu/start-undo-transaction undo-id)
            (dch/commit-changes changes)
            (sync-file (:current-file-id state) file-id :typographies (:id typography))
@@ -650,7 +650,7 @@
       (let [current-file-id (:current-file-id state)
             page            (wsh/lookup-page state)
             shape           (ctn/get-shape page shape-id)
-            undo-id (uuid/next)]
+            undo-id (js/Symbol)]
         (rx/of
          (dwu/start-undo-transaction undo-id)
          (update-component shape-id)
@@ -664,7 +664,7 @@
   (ptk/reify ::update-component-in-bulk
     ptk/WatchEvent
     (watch [_ _ _]
-      (let [undo-id (uuid/next)]
+      (let [undo-id (js/Symbol)]
        (rx/concat
        (rx/of (dwu/start-undo-transaction undo-id))
        (rx/map #(update-component-sync (:id %) file-id) (rx/from shapes))
diff --git a/frontend/src/app/main/data/workspace/modifiers.cljs b/frontend/src/app/main/data/workspace/modifiers.cljs
index 4df2a1353c..79f1fb2db6 100644
--- a/frontend/src/app/main/data/workspace/modifiers.cljs
+++ b/frontend/src/app/main/data/workspace/modifiers.cljs
@@ -18,7 +18,6 @@
    [app.common.types.modifiers :as ctm]
    [app.common.types.shape :as cts]
    [app.common.types.shape.layout :as ctl]
-   [app.common.uuid :as uuid]
    [app.main.data.workspace.changes :as dch]
    [app.main.data.workspace.comments :as-alias dwcm]
    [app.main.data.workspace.guides :as-alias dwg]
@@ -343,7 +342,7 @@
              shapes            (map (d/getf objects) ids)
              ignore-tree       (->> (map #(get-ignore-tree object-modifiers objects %) shapes)
                                     (reduce merge {}))
-             undo-id (uuid/next)]
+             undo-id (js/Symbol)]
 
          (rx/concat
           (if undo-transation?
diff --git a/frontend/src/app/main/data/workspace/selection.cljs b/frontend/src/app/main/data/workspace/selection.cljs
index 838f218126..8ff0d66683 100644
--- a/frontend/src/app/main/data/workspace/selection.cljs
+++ b/frontend/src/app/main/data/workspace/selection.cljs
@@ -561,7 +561,7 @@
                   frames (into #{}
                                (map #(get-in objects [% :frame-id]))
                                selected)
-                  undo-id (uuid/next)]
+                  undo-id (js/Symbol)]
 
               (rx/concat
                (->> (rx/from dup-frames)
diff --git a/frontend/src/app/main/data/workspace/shape_layout.cljs b/frontend/src/app/main/data/workspace/shape_layout.cljs
index ab1a180706..8ca06bd2d5 100644
--- a/frontend/src/app/main/data/workspace/shape_layout.cljs
+++ b/frontend/src/app/main/data/workspace/shape_layout.cljs
@@ -67,10 +67,13 @@
     ptk/WatchEvent
     (watch [_ state _]
       (let [objects (wsh/lookup-page-objects state)
-            children-ids (into [] (mapcat #(get-in objects [% :shapes])) ids)]
-        (rx/of (dwc/update-shapes ids (get-layout-initializer type))
+            children-ids (into [] (mapcat #(get-in objects [% :shapes])) ids)
+            undo-id (js/Symbol)]
+        (rx/of (dwu/start-undo-transaction undo-id)
+               (dwc/update-shapes ids (get-layout-initializer type))
                (ptk/data-event :layout/update ids)
-               (dwc/update-shapes children-ids #(dissoc % :constraints-h :constraints-v)))))))
+               (dwc/update-shapes children-ids #(dissoc % :constraints-h :constraints-v))
+               (dwu/commit-undo-transaction undo-id))))))
 
 
 ;; Never call this directly but through the data-event `:layout/update`
@@ -155,7 +158,7 @@
                 parent-id    (:parent-id (first selected-shapes))
                 shapes-ids   (:shapes (first selected-shapes))
                 ordered-ids  (into (d/ordered-set) shapes-ids)
-                undo-id      (uuid/next)]
+                undo-id      (js/Symbol)]
             (rx/of
              (dwu/start-undo-transaction undo-id)
              (dwse/select-shapes ordered-ids)
@@ -175,7 +178,7 @@
              (dwu/commit-undo-transaction undo-id)))
 
           (let [new-shape-id (uuid/next)
-                undo-id      (uuid/next)
+                undo-id      (js/Symbol)
                 flex-params     (shapes->flex-params objects selected-shapes)]
             (rx/of
              (dwu/start-undo-transaction undo-id)
@@ -199,7 +202,7 @@
   (ptk/reify ::remove-layout
     ptk/WatchEvent
     (watch [_ _ _]
-      (let [undo-id (uuid/next)]
+      (let [undo-id (js/Symbol)]
         (rx/of
          (dwu/start-undo-transaction undo-id)
          (dwc/update-shapes ids #(apply dissoc % layout-keys))
@@ -217,7 +220,7 @@
             selected-shapes  (map (d/getf objects) selected)
             single?          (= (count selected-shapes) 1)
             is-frame?        (= :frame (:type (first selected-shapes)))
-            undo-id          (uuid/next)]
+            undo-id          (js/Symbol)]
 
         (if (and single? is-frame?)
           (rx/of
@@ -251,8 +254,11 @@
   (ptk/reify ::update-layout
     ptk/WatchEvent
     (watch [_ _ _]
-      (rx/of (dwc/update-shapes ids #(d/deep-merge % changes))
-             (ptk/data-event :layout/update ids)))))
+      (let [undo-id (js/Symbol)]
+        (rx/of (dwu/start-undo-transaction undo-id)
+               (dwc/update-shapes ids #(d/deep-merge % changes))
+               (ptk/data-event :layout/update ids)
+               (dwu/commit-undo-transaction undo-id))))))
 
 (defn update-layout-child
   [ids changes]
@@ -261,6 +267,9 @@
     (watch [_ state _]
       (let [objects (wsh/lookup-page-objects state)
             parent-ids (->> ids (map #(cph/get-parent-id objects %)))
-            layout-ids (->> ids (filter (comp ctl/layout? (d/getf objects))))]
-        (rx/of (dwc/update-shapes ids #(d/deep-merge (or % {}) changes))
-               (ptk/data-event :layout/update (d/concat-vec layout-ids parent-ids)))))))
+            layout-ids (->> ids (filter (comp ctl/layout? (d/getf objects))))
+            undo-id (js/Symbol)]
+        (rx/of (dwu/start-undo-transaction undo-id)
+               (dwc/update-shapes ids #(d/deep-merge (or % {}) changes))
+               (ptk/data-event :layout/update (d/concat-vec layout-ids parent-ids))
+               (dwu/commit-undo-transaction undo-id))))))
diff --git a/frontend/src/app/main/data/workspace/shapes.cljs b/frontend/src/app/main/data/workspace/shapes.cljs
index de4af3244d..94ab70ebdd 100644
--- a/frontend/src/app/main/data/workspace/shapes.cljs
+++ b/frontend/src/app/main/data/workspace/shapes.cljs
@@ -92,21 +92,27 @@
                           (ctst/generate-unique-name (:name attrs)))
 
              shape (make-new-shape
-                     (assoc attrs :id id :name name)
-                     objects
-                     selected)
+                    (assoc attrs :id id :name name)
+                    objects
+                    selected)
 
              changes  (-> (pcb/empty-changes it page-id)
                           (pcb/with-objects objects)
-                          (pcb/add-object shape)
+                          (cond-> (some? (:index (meta attrs)))
+                            (pcb/add-object shape {:index (:index (meta attrs))}))
+                          (cond-> (nil? (:index (meta attrs)))
+                            (pcb/add-object shape))
                           (cond-> (some? (:parent-id attrs))
-                            (pcb/change-parent (:parent-id attrs) [shape])))]
+                            (pcb/change-parent (:parent-id attrs) [shape])))
+             undo-id (js/Symbol)]
 
          (rx/concat
-          (rx/of (dch/commit-changes changes)
+          (rx/of (dwu/start-undo-transaction undo-id)
+                 (dch/commit-changes changes)
                  (ptk/data-event :layout/update [(:parent-id shape)])
                  (when-not no-select?
-                   (dws/select-shapes (d/ordered-set id))))
+                   (dws/select-shapes (d/ordered-set id)))
+                 (dwu/commit-undo-transaction undo-id))
           (when (= :text (:type attrs))
             (->> (rx/of (dwe/start-edition-mode id))
                  (rx/observe-on :async)))))))))
@@ -304,12 +310,15 @@
                     (cond-> (seq starting-flows)
                       (pcb/update-page-option :flows (fn [flows]
                                                        (->> (map :id starting-flows)
-                                                            (reduce ctp/remove-flow flows))))))]
+                                                            (reduce ctp/remove-flow flows))))))
+        undo-id (js/Symbol)]
 
-    (rx/of (dc/detach-comment-thread ids)
+    (rx/of (dwu/start-undo-transaction undo-id)
+           (dc/detach-comment-thread ids)
            (ptk/data-event :layout/update all-parents)
            (dch/commit-changes changes)
-           (ptk/data-event :layout/update layout-ids))))
+           (ptk/data-event :layout/update layout-ids)
+           (dwu/commit-undo-transaction undo-id))))
 
 (defn create-and-add-shape
   [type frame-x frame-y data]
@@ -357,7 +366,13 @@
        (let [page-id       (:current-page-id state)
              objects       (wsh/lookup-page-objects state page-id)
              selected      (wsh/lookup-selected state)
-             selected-objs (map #(get objects %) selected)]
+             selected      (cph/clean-loops objects selected)
+             selected-objs (map #(get objects %) selected)
+             new-index     (->> selected
+                                (cph/order-by-indexed-shapes objects)
+                                first
+                                (cph/get-position-on-parent objects)
+                                inc)]
          (when (d/not-empty? selected)
            (let [srect     (gsh/selection-rect selected-objs)
                  frame-id  (get-in objects [(first selected) :frame-id])
@@ -367,10 +382,11 @@
                                (cond-> id
                                  (assoc :id id))
                                (assoc :frame-id frame-id :parent-id parent-id)
+                               (with-meta {:index new-index})
                                (cond-> (not= frame-id uuid/zero)
                                  (assoc :fills [] :hide-in-viewer true))
                                (cts/setup-rect-selrect))
-                 undo-id (uuid/next)]
+                 undo-id (js/Symbol)]
              (rx/of
               (dwu/start-undo-transaction undo-id)
               (add-shape shape)
diff --git a/frontend/src/app/main/data/workspace/texts.cljs b/frontend/src/app/main/data/workspace/texts.cljs
index da24c5b22b..22759b24bf 100644
--- a/frontend/src/app/main/data/workspace/texts.cljs
+++ b/frontend/src/app/main/data/workspace/texts.cljs
@@ -323,7 +323,8 @@
   (ptk/reify ::resize-text
     ptk/WatchEvent
     (watch [_ state _]
-      (let [shape (wsh/lookup-shape state id)]
+      (let [shape (wsh/lookup-shape state id)
+            undo-id (js/Symbol)]
         (letfn [(update-fn [shape]
                   (let [{:keys [selrect grow-type]} shape
                         {shape-width :width shape-height :height} selrect
@@ -335,17 +336,19 @@
 
                         shape
                         (cond-> shape
-                         (and (not-changed? shape-height new-height)
-                              (or (= grow-type :auto-height) (= grow-type :auto-width)))
-                         (gsh/transform-shape (ctm/change-dimensions-modifiers shape :height new-height {:ignore-lock? true})))]
+                          (and (not-changed? shape-height new-height)
+                               (or (= grow-type :auto-height) (= grow-type :auto-width)))
+                          (gsh/transform-shape (ctm/change-dimensions-modifiers shape :height new-height {:ignore-lock? true})))]
 
                     shape))]
 
           (when (or (and (not-changed? (:width shape) new-width) (= (:grow-type shape) :auto-width))
                     (and (not-changed? (:height shape) new-height)
                          (or (= (:grow-type shape) :auto-height) (= (:grow-type shape) :auto-width))))
-            (rx/of (dch/update-shapes [id] update-fn {:reg-objects? true :save-undo? true})
-                   (ptk/data-event :layout/update [id]))))))))
+            (rx/of (dwu/start-undo-transaction undo-id)
+                   (dch/update-shapes [id] update-fn {:reg-objects? true :save-undo? true})
+                   (ptk/data-event :layout/update [id])
+                   (dwu/commit-undo-transaction undo-id))))))))
 
 
 (defn save-font
diff --git a/frontend/src/app/main/data/workspace/transforms.cljs b/frontend/src/app/main/data/workspace/transforms.cljs
index 371ddd7313..ce9798f770 100644
--- a/frontend/src/app/main/data/workspace/transforms.cljs
+++ b/frontend/src/app/main/data/workspace/transforms.cljs
@@ -20,7 +20,6 @@
    [app.common.types.modifiers :as ctm]
    [app.common.types.shape-tree :as ctst]
    [app.common.types.shape.layout :as ctl]
-   [app.common.uuid :as uuid]
    [app.main.data.workspace.changes :as dch]
    [app.main.data.workspace.collapse :as dwc]
    [app.main.data.workspace.modifiers :as dwm]
@@ -509,7 +508,7 @@
                    (rx/last)
                    (rx/mapcat
                     (fn [[_ target-frame drop-index]]
-                      (let [undo-id (uuid/next)]
+                      (let [undo-id (js/Symbol)]
                         (rx/of (dwu/start-undo-transaction undo-id)
                                (move-shapes-to-frame ids target-frame drop-index)
                                (dwm/apply-modifiers {:undo-transation? false})
@@ -571,10 +570,14 @@
                                                index))
                           changes)))
                   (-> (pcb/empty-changes it page-id)
-                      (pcb/with-objects objects))))]
+                      (pcb/with-objects objects))))
+            undo-id (js/Symbol)]
 
-        (rx/of (dch/commit-changes changes)
-               (ptk/data-event :layout/update selected))))))
+        (rx/of
+         (dwu/start-undo-transaction undo-id)
+         (dch/commit-changes changes)
+         (ptk/data-event :layout/update selected)
+         (dwu/commit-undo-transaction undo-id))))))
 
 (defn nudge-selected-shapes
   "Move shapes a fixed increment in one direction, from a keyboard action."
diff --git a/frontend/src/app/main/ui/shapes/frame.cljs b/frontend/src/app/main/ui/shapes/frame.cljs
index 7b87e065f8..702f956b78 100644
--- a/frontend/src/app/main/ui/shapes/frame.cljs
+++ b/frontend/src/app/main/ui/shapes/frame.cljs
@@ -113,9 +113,10 @@
     {::mf/wrap-props false}
     [props]
 
-    (let [childs     (unchecked-get props "childs")]
+    (let [childs (unchecked-get props "childs")]
       [:> frame-container props
        [:g.frame-children
         (for [item childs]
-          [:& shape-wrapper {:key (dm/str (:id item)) :shape item}])]])))
+            [:& shape-wrapper {:key (dm/str (:id item)) :shape item}]
+            )]])))
 
diff --git a/frontend/src/app/main/ui/viewer/header.cljs b/frontend/src/app/main/ui/viewer/header.cljs
index 2af7d3dc9b..c70a5cab98 100644
--- a/frontend/src/app/main/ui/viewer/header.cljs
+++ b/frontend/src/app/main/ui/viewer/header.cljs
@@ -118,7 +118,7 @@
         i/full-screen)]
 
      (when (:is-admin permissions)
-       [:span.btn-primary {:on-click open-share-dialog} i/export [:span (tr "labels.share-prototype")]])
+       [:span.btn-primary.tooltip.tooltip-bottom-left {:on-click open-share-dialog :alt (tr "labels.share-prototype")} i/export [:span (tr "labels.share-prototype")]])
 
      (when (:can-edit permissions)
        [:span.btn-text-dark {:on-click go-to-workspace} (tr "labels.edit-file")])
diff --git a/frontend/src/app/main/ui/viewer/inspect/attributes.cljs b/frontend/src/app/main/ui/viewer/inspect/attributes.cljs
index b956d8af88..cb43f937b8 100644
--- a/frontend/src/app/main/ui/viewer/inspect/attributes.cljs
+++ b/frontend/src/app/main/ui/viewer/inspect/attributes.cljs
@@ -39,7 +39,7 @@
         type    (if (= (count shapes) 1) (-> shapes first :type) :multiple)
         options (type->options type)]
     [:div.element-options
-     (for [option options]
+     (for [[idx option] (map-indexed vector options)]
        [:> (case option
              :layout           layout-panel
              :layout-flex      layout-flex-panel
@@ -51,7 +51,8 @@
              :image            image-panel
              :text             text-panel
              :svg              svg-panel)
-        {:shapes shapes
+        {:key idx
+         :shapes shapes
          :frame frame
          :from from}])
      [:& exports
diff --git a/frontend/src/app/main/ui/viewer/inspect/attributes/text.cljs b/frontend/src/app/main/ui/viewer/inspect/attributes/text.cljs
index 64e6b9790e..4d600a4f97 100644
--- a/frontend/src/app/main/ui/viewer/inspect/attributes/text.cljs
+++ b/frontend/src/app/main/ui/viewer/inspect/attributes/text.cljs
@@ -106,9 +106,9 @@
         [:& copy-button {:data (copy-style-data style)}]])
 
      (when (:fills style)
-       (for [fill (:fills style)]
-
-         [:& color-row {:format @color-format
+       (for [[idx fill] (map-indexed vector (:fills style))]
+         [:& color-row {:key idx
+                        :format @color-format
                         :color (shape->color fill)
                         :copy-data (copy-style-data fill :fill-color :fill-color-gradient)
                         :on-change-format #(reset! color-format %)}]))
@@ -175,8 +175,9 @@
                                (remove (fn [[_ text]] (str/empty? (str/trim text))))
                                (mapv (fn [[style text]] (vector (merge txt/default-text-attrs style) text))))]
 
-    (for [[_ [full-style text]] (map-indexed vector style-text-blocks)]
-      [:& typography-block {:shape shape
+    (for [[idx [full-style text]] (map-indexed vector style-text-blocks)]
+      [:& typography-block {:key idx 
+                            :shape shape
                             :style full-style
                             :text text}])))
 
diff --git a/frontend/src/app/main/ui/viewer/inspect/right_sidebar.cljs b/frontend/src/app/main/ui/viewer/inspect/right_sidebar.cljs
index 4d548806c9..c8a4964097 100644
--- a/frontend/src/app/main/ui/viewer/inspect/right_sidebar.cljs
+++ b/frontend/src/app/main/ui/viewer/inspect/right_sidebar.cljs
@@ -60,7 +60,7 @@
                                                (reset! expanded false)
                                                (reset! section %)
                                                (when (= from :workspace)
-                                                 (dw/set-inspect-expanded false)))
+                                                 (st/emit! (dw/set-inspect-expanded false))))
                              :selected @section}
            [:& tab-element {:id :info :title (tr "inspect.tabs.info")}
             [:& attributes {:page-id page-id
diff --git a/frontend/src/app/main/ui/workspace/sidebar.cljs b/frontend/src/app/main/ui/workspace/sidebar.cljs
index 3c37c0defc..cf61c1e9ec 100644
--- a/frontend/src/app/main/ui/workspace/sidebar.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar.cljs
@@ -80,17 +80,33 @@
   {::mf/wrap-props false
    ::mf/wrap [mf/memo]}
   [props]
-  (let [layout (obj/get props "layout")
-        drawing-tool (:tool (mf/deref refs/workspace-drawing))
-        expanded (mf/deref refs/inspect-expanded)]
+  (let [layout          (obj/get props "layout")
+        section         (obj/get props "section")
+        drawing-tool    (:tool (mf/deref refs/workspace-drawing))
 
-    [:aside.settings-bar.settings-bar-right {:class (when expanded "expanded")}
+        is-comments?    (= drawing-tool :comments)
+        is-history?     (contains? layout :document-history)
+        is-inspect?     (= section :inspect)
+
+        expanded?        (mf/deref refs/inspect-expanded)
+        can-be-expanded? (and
+                          (not is-comments?)
+                          (not is-history?)
+                          is-inspect?)]
+
+    (mf/use-effect
+     (mf/deps can-be-expanded?)
+     (fn []
+      (when (not can-be-expanded?)
+        (st/emit! (dw/set-inspect-expanded false)))))
+
+    [:aside.settings-bar.settings-bar-right {:class (when (and can-be-expanded? expanded?) "expanded")}
      [:div.settings-bar-inside
       (cond
-        (= drawing-tool :comments)
+        is-comments?
         [:& comments-sidebar]
 
-        (contains? layout :document-history)
+        is-history?
         [:& history-toolbox]
 
         :else
diff --git a/frontend/src/app/main/ui/workspace/sidebar/assets.cljs b/frontend/src/app/main/ui/workspace/sidebar/assets.cljs
index d29c5c903a..6a287f5804 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/assets.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/assets.cljs
@@ -12,7 +12,6 @@
    [app.common.pages.helpers :as cph]
    [app.common.spec :as us]
    [app.common.text :as txt]
-   [app.common.uuid :as uuid]
    [app.config :as cf]
    [app.main.data.events :as ev]
    [app.main.data.modal :as modal]
@@ -182,7 +181,7 @@
 
 (defn- create-assets-group
   [rename components-to-group group-name]
-  (let [undo-id (uuid/next)]
+  (let [undo-id (js/Symbol)]
   (st/emit! (dwu/start-undo-transaction undo-id))
   (apply st/emit!
          (->> components-to-group
@@ -594,7 +593,7 @@
         (mf/use-fn
          (mf/deps @state)
          (fn []
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (if (empty? selected-components)
              (st/emit! (dwl/duplicate-component {:id (:component-id @state)}))
              (do
@@ -606,7 +605,7 @@
         (mf/use-fn
          (mf/deps @state file-id multi-components? multi-assets?)
          (fn []
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (if (or multi-components? multi-assets?)
              (on-assets-delete)
              (st/emit! (dwu/start-undo-transaction undo-id)
@@ -653,7 +652,7 @@
          (mf/deps components selected-components on-clear-selection)
          (fn [group-name]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> components
@@ -670,7 +669,7 @@
          (mf/deps components)
          (fn [path last-path]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> components
@@ -701,7 +700,7 @@
          (mf/deps components)
          (fn [path]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> components
@@ -1029,7 +1028,7 @@
          (mf/deps objects selected-objects on-clear-selection)
          (fn [group-name]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> objects
@@ -1046,7 +1045,7 @@
          (mf/deps objects)
          (fn [path last-path]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> objects
@@ -1076,7 +1075,7 @@
          (mf/deps objects)
          (fn [path]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> objects
@@ -1193,7 +1192,7 @@
          (fn []
            (if (or multi-colors? multi-assets?)
              (on-assets-delete)
-             (let [undo-id (uuid/next)]
+             (let [undo-id (js/Symbol)]
                (st/emit! (dwu/start-undo-transaction undo-id)
                          (dwl/delete-color color)
                          (dwl/sync-file file-id file-id :colors (:id color))
@@ -1458,7 +1457,7 @@
          (fn [color-id]
            (fn [group-name]
              (on-clear-selection)
-             (let [undo-id (uuid/next)]
+             (let [undo-id (js/Symbol)]
                (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> colors
@@ -1476,7 +1475,7 @@
          (mf/deps colors)
          (fn [path last-path]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> colors
@@ -1508,7 +1507,7 @@
          (mf/deps colors)
          (fn [path]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> colors
@@ -1757,7 +1756,7 @@
          (mf/deps typographies selected-typographies on-clear-selection file-id)
          (fn [group-name]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> typographies
@@ -1775,7 +1774,7 @@
          (mf/deps typographies)
          (fn [path last-path]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> typographies
@@ -1806,7 +1805,7 @@
          (mf/deps typographies)
          (fn [path]
            (on-clear-selection)
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit!
                     (->> typographies
@@ -1844,7 +1843,7 @@
         (mf/use-fn
          (mf/deps @state multi-typographies? multi-assets?)
          (fn []
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (if (or multi-typographies? multi-assets?)
                (on-assets-delete)
                (st/emit! (dwu/start-undo-transaction undo-id)
@@ -2088,7 +2087,7 @@
         (mf/use-fn
          (mf/deps selected-assets)
          (fn []
-           (let [undo-id (uuid/next)]
+           (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
              (apply st/emit! (map #(dwl/delete-component {:id %})
                                   (:components selected-assets)))
diff --git a/frontend/src/app/main/ui/workspace/sidebar/layers.cljs b/frontend/src/app/main/ui/workspace/sidebar/layers.cljs
index b5e93f97dd..81f5a89701 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/layers.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/layers.cljs
@@ -582,7 +582,6 @@
          [:button.back-button i/arrow-slide]
          [:div.focus-name (or title (tr "workspace.focus.selection"))]
          [:div.focus-mode (tr "workspace.focus.focus-mode")]]]
-
        filter-component)
 
      (if (some? filtered-objects)
@@ -599,8 +598,8 @@
                           :key (dm/str (:id page))
                           :filtered? true}]]]
 
-     [:div.tool-window-content {:on-scroll on-scroll
-                                :style {:display (when (some? filtered-objects) "none")}}
-      [:& layers-tree {:objects objects
-                       :key (dm/str (:id page))
-                       :filtered? false}]])]))
+       [:div.tool-window-content {:on-scroll on-scroll
+                                  :style {:display (when (some? filtered-objects) "none")}}
+        [:& layers-tree {:objects objects
+                         :key (dm/str (:id page))
+                         :filtered? false}]])]))
diff --git a/frontend/src/app/main/ui/workspace/sidebar/options.cljs b/frontend/src/app/main/ui/workspace/sidebar/options.cljs
index 9cdfdcf154..00a136f1c7 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/options.cljs
@@ -72,7 +72,8 @@
         shape-parent-frame   (cph/get-frame objects (:frame-id first-selected-shape))
         on-change-tab
         (fn [options-mode]
-          (st/emit! (udw/set-options-mode options-mode))
+          (st/emit! (udw/set-options-mode options-mode)
+                    (udw/set-inspect-expanded false))
           (if (= options-mode :inspect) ;;TODO maybe move this logic to set-options-mode
             (st/emit! :interrupt (udw/set-workspace-read-only true))
             (st/emit! :interrupt (udw/set-workspace-read-only false))))]
diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs
index cb216fd4de..66d8f8e05b 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.cljs
@@ -250,12 +250,12 @@
      [:> numeric-input {:no-validate true
                         :placeholder "--"
                         :on-click (fn [event]
-                                    (reset! gap-selected? :row-gap)
+                                    (reset! gap-selected? :column-gap)
                                     (dom/select-target event))
-                        :on-change (partial set-gap (= :no-wrap wrap-type) :row-gap)
+                        :on-change (partial set-gap (= :no-wrap wrap-type) :column-gap)
                         :on-blur #(reset! gap-selected? :none)
-                        :value (:row-gap gap-value)
-                        :disabled (and (= :no-wrap wrap-type) (not is-col?))}]]
+                        :value (:column-gap gap-value)
+                        :disabled (and (= :no-wrap wrap-type) is-col?)}]]
 
     [:div.gap-row.tooltip.tooltip-bottom-left
      {:alt "Row gap"}
@@ -264,12 +264,12 @@
      [:> numeric-input {:no-validate true
                         :placeholder "--"
                         :on-click (fn [event]
-                                    (reset! gap-selected? :column-gap)
+                                    (reset! gap-selected? :row-gap)
                                     (dom/select-target event))
-                        :on-change (partial set-gap (= :no-wrap wrap-type) :column-gap)
+                        :on-change (partial set-gap (= :no-wrap wrap-type) :row-gap)
                         :on-blur #(reset! gap-selected? :none)
-                        :value (:column-gap gap-value)
-                        :disabled (and (= :no-wrap wrap-type) is-col?)}]]]])
+                        :value (:row-gap gap-value)
+                        :disabled (and (= :no-wrap wrap-type) (not is-col?))}]]]])
 
 (mf/defc layout-container-menu
   {::mf/wrap [#(mf/memo' % (mf/check-props ["ids" "values" "type" "multiple"]))]}
@@ -364,67 +364,68 @@
      [:div.element-set-title
       [:*
        [:span "Layout"]
-       (if (and (not multiple)(:layout values))
+       (if (and (not multiple) (:layout values))
          [:div.title-actions
           #_[:div.layout-btns
-           [:button {:on-click set-flex
-                     :class (dom/classnames
-                             :active (= :flex layout-type))} "Flex"]
-           [:button {:on-click set-grid
-                     :class (dom/classnames
-                             :active (= :grid layout-type))} "Grid"]]
+             [:button {:on-click set-flex
+                       :class (dom/classnames
+                               :active (= :flex layout-type))} "Flex"]
+             [:button {:on-click set-grid
+                       :class (dom/classnames
+                               :active (= :grid layout-type))} "Grid"]]
           [:button.remove-layout {:on-click on-remove-layout} i/minus]]
 
          [:button.add-page {:on-click on-add-layout} i/close])]]
 
      (when (:layout values)
-       (if (= :flex layout-type)
-         [:div.element-set-content.layout-menu
-          [:div.layout-row
-           [:div.direction-wrap.row-title "Direction"]
-           [:div.btn-wrapper
-            [:div.direction
-             [:*
-              (for [dir [:row :reverse-row :column :reverse-column]]
-                [:& direction-btn {:key (d/name dir)
-                                   :dir dir
-                                   :saved-dir saved-dir
-                                   :set-direction set-direction}])]]
-
-            [:div.wrap-type
-             [:& wrap-row {:wrap-type wrap-type
-                           :set-wrap set-wrap}]]]]
-
-          (when (= :wrap wrap-type)
+       (when (not= :multiple layout-type)
+         (if (= :flex layout-type)
+           [:div.element-set-content.layout-menu
             [:div.layout-row
-             [:div.align-content.row-title "Content"]
+             [:div.direction-wrap.row-title "Direction"]
              [:div.btn-wrapper
-              [:& align-content-row {:is-col? is-col?
-                                     :align-content align-content
-                                     :set-align-content set-align-content}]]])
+              [:div.direction
+               [:*
+                (for [dir [:row :reverse-row :column :reverse-column]]
+                  [:& direction-btn {:key (d/name dir)
+                                     :dir dir
+                                     :saved-dir saved-dir
+                                     :set-direction set-direction}])]]
 
-          [:div.layout-row
-           [:div.align-items.row-title "Align"]
-           [:div.btn-wrapper
-            [:& align-row {:is-col? is-col?
-                           :align-items align-items
-                           :set-align set-align-items}]]]
+              [:div.wrap-type
+               [:& wrap-row {:wrap-type wrap-type
+                             :set-wrap set-wrap}]]]]
 
-          [:div.layout-row
-           [:div.justify-content.row-title "Justify"]
-           [:div.btn-wrapper.justify-content
-            [:& justify-content-row {:is-col? is-col?
-                                     :justify-content justify-content
-                                     :set-justify set-justify-content}]]]
-          [:& gap-section {:is-col? is-col?
-                           :wrap-type wrap-type
-                           :gap-selected? gap-selected?
-                           :set-gap set-gap
-                           :gap-value (:layout-gap values)}]
+            (when (= :wrap wrap-type)
+              [:div.layout-row
+               [:div.align-content.row-title "Content"]
+               [:div.btn-wrapper
+                [:& align-content-row {:is-col? is-col?
+                                       :align-content align-content
+                                       :set-align-content set-align-content}]]])
+
+            [:div.layout-row
+             [:div.align-items.row-title "Align"]
+             [:div.btn-wrapper
+              [:& align-row {:is-col? is-col?
+                             :align-items align-items
+                             :set-align set-align-items}]]]
+
+            [:div.layout-row
+             [:div.justify-content.row-title "Justify"]
+             [:div.btn-wrapper.justify-content
+              [:& justify-content-row {:is-col? is-col?
+                                       :justify-content justify-content
+                                       :set-justify set-justify-content}]]]
+            [:& gap-section {:is-col? is-col?
+                             :wrap-type wrap-type
+                             :gap-selected? gap-selected?
+                             :set-gap set-gap
+                             :gap-value (:layout-gap values)}]
 
 
-          [:& padding-section {:values values
-                               :on-change-style change-padding-type
-                               :on-change on-padding-change}]]
+            [:& padding-section {:values values
+                                 :on-change-style change-padding-type
+                                 :on-change on-padding-change}]]
 
-         [:div "GRID TO COME"]))]))
+           [:div "GRID TO COME"])))]))
diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs
index 937e8be362..5a5c584f9b 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/measures.cljs
@@ -10,7 +10,6 @@
    [app.common.geom.shapes :as gsh]
    [app.common.types.shape.layout :as ctl]
    [app.common.types.shape.radius :as ctsr]
-   [app.common.uuid :as uuid]
    [app.main.constants :refer [size-presets]]
    [app.main.data.workspace :as udw]
    [app.main.data.workspace.changes :as dch]
@@ -250,7 +249,7 @@
          (mf/deps ids)
          (fn [event]
            (let [value (-> event dom/get-target dom/checked?)
-                 undo-id (uuid/next)]
+                 undo-id (js/Symbol)]
              (do
                (st/emit! (dwu/start-undo-transaction undo-id)
                          (dch/update-shapes ids (fn [shape] (assoc shape :hide-in-viewer (not value)))))
diff --git a/frontend/src/app/main/ui/workspace/sidebar/sitemap.cljs b/frontend/src/app/main/ui/workspace/sidebar/sitemap.cljs
index e4235954b4..673773162b 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/sitemap.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/sitemap.cljs
@@ -222,7 +222,8 @@
                                :style #js {"--height" (str size "px")}}
      [:div.tool-window-bar
       [:span (tr "workspace.sidebar.sitemap")]
-      (when-not workspace-read-only?
+      (if workspace-read-only?
+        [:div.view-only-mode (tr "labels.view-only")]
         [:div.add-page {:on-click create} i/close])
       [:div.collapse-pages {:on-click toggle-pages
                             :style {:transform (when (not @show-pages?) "rotate(-90deg)")}} i/arrow-slide]]
diff --git a/frontend/translations/en.po b/frontend/translations/en.po
index df93215b00..fd0e84acea 100644
--- a/frontend/translations/en.po
+++ b/frontend/translations/en.po
@@ -1549,6 +1549,9 @@ msgstr "Active"
 msgid "labels.inactive"
 msgstr "Inactive"
 
+msgid "labels.view-only"
+msgstr "VIEW ONLY"
+
 #: src/app/main/data/workspace/persistence.cljs, src/app/main/data/workspace/persistence.cljs, src/app/main/data/media.cljs
 msgid "media.loading"
 msgstr "Loading image…"
diff --git a/frontend/translations/es.po b/frontend/translations/es.po
index 049f79aa86..6edd78b812 100644
--- a/frontend/translations/es.po
+++ b/frontend/translations/es.po
@@ -1742,6 +1742,9 @@ msgstr "Activo"
 msgid "labels.inactive"
 msgstr "Inactivo"
 
+msgid "labels.view-only"
+msgstr "SOLO LECTURA"
+
 #: src/app/main/data/workspace/persistence.cljs, src/app/main/data/media.cljs
 msgid "media.loading"
 msgstr "Cargando imagen…"