From 1f42b2f72d8ae3e5c01aac5a8f4806f9181772fd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marina=20L=C3=B3pez?= <marina.lopez.yap@gmail.com>
Date: Tue, 29 Jul 2025 12:33:11 +0200
Subject: [PATCH] :sparkles: Show preset name when an option is selected

---
 .../sidebar/options/drawing/frame.cljs        | 21 ++++++++++++-------
 .../sidebar/options/drawing/frame.scss        |  2 +-
 2 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/drawing/frame.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/drawing/frame.cljs
index 654ae7654e..6f88e54675 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options/drawing/frame.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/options/drawing/frame.cljs
@@ -21,8 +21,10 @@
 (mf/defc options*
   [{:keys [drawing-state]}]
 
-  (let [show*          (mf/use-state false)
-        show?          (deref show*)
+  (let [show*                 (mf/use-state false)
+        show?                 (deref show*)
+        selected-preset-name* (mf/use-state nil)
+        selected-preset-name  (deref selected-preset-name*)
 
         on-open
         (mf/use-fn
@@ -35,12 +37,16 @@
         on-preset-selected
         (mf/use-fn
          (fn [event]
-           (let [width (-> (dom/get-current-target event)
-                           (dom/get-data "width")
-                           (d/read-string))
+           (let [width  (-> (dom/get-current-target event)
+                            (dom/get-data "width")
+                            (d/read-string))
                  height (-> (dom/get-current-target event)
                             (dom/get-data "height")
-                            (d/read-string))]
+                            (d/read-string))
+                 name   (-> (dom/get-current-target event)
+                            (dom/get-data "name"))]
+
+             (reset! selected-preset-name* name)
              (st/emit! (dwd/set-default-size width height)))))
 
         orientation
@@ -59,7 +65,7 @@
      [:div {:class (stl/css-case  :presets-wrapper true
                                   :opened show?)
             :on-click on-open}
-      [:span {:class (stl/css :select-name)} (tr "workspace.options.size-presets")]
+      [:span {:class (stl/css :select-name)} (or selected-preset-name (tr "workspace.options.size-presets"))]
       [:span {:class (stl/css :collapsed-icon)} i/arrow]
       [:& dropdown {:show show?
                     :on-close on-close}
@@ -78,6 +84,7 @@
                                          :match preset-match)
                     :data-width (str (:width preset))
                     :data-height (str (:height preset))
+                    :data-name (:name preset)
                     :on-click on-preset-selected}
                [:div {:class (stl/css :name-wrapper)}
                 [:span {:class (stl/css :preset-name)} (:name preset)]
diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/drawing/frame.scss b/frontend/src/app/main/ui/workspace/sidebar/options/drawing/frame.scss
index fdedbc7d83..e90125569c 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options/drawing/frame.scss
+++ b/frontend/src/app/main/ui/workspace/sidebar/options/drawing/frame.scss
@@ -17,7 +17,7 @@
 .presets-wrapper {
   @extend .asset-element;
   position: relative;
-  grid-column: span 5;
+  grid-column: span 6;
   display: flex;
   height: $s-32;
   padding: $s-8;