Merge remote-tracking branch 'origin/staging' into develop

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

@@ -341,7 +341,7 @@
 (defn- add-component2
   "This is the second step of the component creation."
   ([selected components-v2]
-   (add-component2 selected components-v2))
+   (add-component2 nil selected components-v2))
   ([id-ref selected components-v2]
    (ptk/reify ::add-component2
      ev/Event

frontend/src/app/main/ui/viewer/header.cljs

@@ -256,6 +256,10 @@
        [:span {:class (stl/css :frame-name)} frame-name]
        [:span {:class (stl/css :icon)} i/arrow]]]]))
 
+(def ^:private penpot-logo-icon
+  (i/icon-xref :penpot-logo-icon (stl/css :logo-icon)))
+
+
 (mf/defc header
   [{:keys [project file page frame zoom section permissions index interactions-mode shown-thumbnails]}]
   (let [go-to-dashboard
@@ -303,10 +307,10 @@
       ;; If the user doesn't have permission we disable the link
       [:a {:class (stl/css :home-link)
            :on-click go-to-dashboard
+           :data-testid "penpot-logo-link"
            :style {:cursor (when-not (:in-team permissions) "auto")
                    :pointer-events (when-not (:in-team permissions) "none")}}
-       [:span {:class (stl/css :logo-icon)}
-        i/logo-icon]]
+       penpot-logo-icon]
 
       [:& header-sitemap {:project project
                           :file file

frontend/src/app/main/ui/viewer/header.scss

@@ -34,16 +34,14 @@
 
 .home-link {
   padding: 0;
+  display: grid;
+  place-content: center;
 }
 
 .logo-icon {
-  @include flexCenter;
-  width: $s-32;
-  height: $s-32;
-  svg {
-    width: $s-28;
-    fill: var(--icon-foreground-hover);
-  }
+  width: $s-28;
+  height: $s-28;
+  fill: var(--icon-foreground-hover);
 }
 
 .sitemap-zone {

frontend/src/app/main/ui/workspace/sidebar/layers.cljs

@@ -69,7 +69,7 @@
         highlighted    (mf/deref refs/highlighted-shapes)
         highlighted    (hooks/use-equal-memo highlighted)
         root           (get objects uuid/zero)]
-    [:div {:class (stl/css :element-list)}
+    [:div {:class (stl/css :element-list) :data-testid "layer-item"}
      [:& hooks/sortable-container {}
       (for [[index id] (reverse (d/enumerate (:shapes root)))]
         (when-let [obj (get objects id)]
@@ -510,7 +510,7 @@
         (mf/use-fn
          #(st/emit! (dw/toggle-focus-mode)))]
 
-    [:div#layers {:class (stl/css :layers)}
+    [:div#layers {:class (stl/css :layers) :data-testid "layers"}
      (if (d/not-empty? focus)
        [:div {:class (stl/css :tool-window-bar)}
         [:button {:class (stl/css :focus-title)

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

@@ -207,14 +207,14 @@
                       :on-click on-constraint-button-clicked}
              [:span {:class (stl/css :resalted-area)}]]]]
           [:div {:class (stl/css :contraints-selects)}
-           [:div {:class (stl/css :horizontal-select)}
+           [:div {:class (stl/css :horizontal-select) :data-testid "constraint-h-select"}
             [:& select
-             {:default-value (d/nilv (d/name constraints-h) "scale")
+             {:default-value (if (not= constraints-h :multiple) (d/nilv (d/name constraints-h) "scale") "")
               :options options-h
               :on-change on-constraint-h-select-changed}]]
-           [:div {:class (stl/css :vertical-select)}
+           [:div {:class (stl/css :vertical-select) :data-testid "constraint-v-select"}
             [:& select
-             {:default-value (d/nilv (d/name constraints-v) "scale")
+             {:default-value (if (not= constraints-v :multiple) (d/nilv (d/name constraints-v) "scale") "")
               :options options-v
               :on-change on-constraint-v-select-changed}]]
            (when first-level?