🐛 Fix some errors on flex layout

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)]
+            children-ids (into [] (mapcat #(get-in objects [% :shapes])) ids)
-        (rx/of (dwc/update-shapes ids (get-layout-initializer type))
+            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

frontend/src/app/main/data/workspace/shapes.cljs

@@ -98,7 +98,10 @@
 
              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])))]
 
@@ -357,7 +360,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,6 +376,7 @@
                                (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))

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

@@ -255,7 +255,7 @@
                         :on-change (partial set-gap (= :no-wrap wrap-type) :row-gap)
                         :on-blur #(reset! gap-selected? :none)
                         :value (:row-gap gap-value)
-                        :disabled (and (= :no-wrap wrap-type) (not is-col?))}]]
+                        :disabled (and (= :no-wrap wrap-type) is-col?)}]]
 
     [:div.gap-row.tooltip.tooltip-bottom-left
      {:alt "Row gap"}
@@ -269,7 +269,7 @@
                         :on-change (partial set-gap (= :no-wrap wrap-type) :column-gap)
                         :on-blur #(reset! gap-selected? :none)
                         :value (:column-gap gap-value)
-                        :disabled (and (= :no-wrap wrap-type) is-col?)}]]]])
+                        :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,7 +364,7 @@
      [: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
@@ -378,6 +378,7 @@
          [:button.add-page {:on-click on-add-layout} i/close])]]
 
      (when (:layout values)
+       (when (not= :multiple layout-type)
          (if (= :flex layout-type)
            [:div.element-set-content.layout-menu
             [:div.layout-row
@@ -427,4 +428,4 @@
                                  :on-change-style change-padding-type
                                  :on-change on-padding-change}]]
 
-         [:div "GRID TO COME"]))]))
+           [:div "GRID TO COME"])))]))