From c23691284c11060fa63df70235b88fe2d5230df9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9s=20Moya?= <andres.moya@kaleidos.net>
Date: Wed, 12 Jan 2022 16:58:40 +0100
Subject: [PATCH] :bug: Show correctly group types label in handoff

---
 CHANGES.md                                          |  1 +
 .../app/main/ui/viewer/handoff/right_sidebar.cljs   | 13 +++++++++++--
 frontend/translations/en.po                         |  6 ++++++
 frontend/translations/es.po                         |  6 ++++++
 4 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/CHANGES.md b/CHANGES.md
index 284101a4a..0cda7c469 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -65,6 +65,7 @@
 - Fix thumbnail not taking frame blending mode [Taiga #2301](https://tree.taiga.io/project/penpot/issue/2301)
 - Fix import/export with SVG edge cases [Taiga #2389](https://tree.taiga.io/project/penpot/issue/2389)
 - Avoid modifying component when moving into a group [Taiga #2534](https://tree.taiga.io/project/penpot/issue/2534)
+- Show correctly group types label in handoff [Taiga #2482](https://tree.taiga.io/project/penpot/issue/2482)
 
 ### :arrow_up: Deps updates
 
diff --git a/frontend/src/app/main/ui/viewer/handoff/right_sidebar.cljs b/frontend/src/app/main/ui/viewer/handoff/right_sidebar.cljs
index 2169bab30..0cbf82a79 100644
--- a/frontend/src/app/main/ui/viewer/handoff/right_sidebar.cljs
+++ b/frontend/src/app/main/ui/viewer/handoff/right_sidebar.cljs
@@ -22,7 +22,16 @@
         section       (mf/use-state :info #_:code)
 
         shapes        (resolve-shapes (:objects page) selected)
-        selected-type (or (-> shapes first :type) :not-found)]
+        first-shape   (first shapes)
+
+        selected-type (or (:type first-shape) :not-found)
+        selected-type (if (= selected-type :group)
+                        (if (some? (:component-id first-shape))
+                          :component
+                          (if (:masked-group? first-shape)
+                            :mask
+                            :group))
+                        selected-type)]
 
     [:aside.settings-bar.settings-bar-right {:class (when @expanded "expanded")}
      [:div.settings-bar-inside
@@ -35,7 +44,7 @@
              [:span.tool-window-bar-title (tr "handoff.tabs.code.selected.multiple" (count shapes))]]
             [:*
              [:span.tool-window-bar-icon
-              [:& element-icon {:shape (-> shapes first)}]]
+              [:& element-icon {:shape first-shape}]]
              [:span.tool-window-bar-title (->> selected-type d/name (str "handoff.tabs.code.selected.") (tr))]])
           ]
          [:div.tool-window-content
diff --git a/frontend/translations/en.po b/frontend/translations/en.po
index 6607fff14..0778497b5 100644
--- a/frontend/translations/en.po
+++ b/frontend/translations/en.po
@@ -937,6 +937,12 @@ msgstr "Group"
 msgid "handoff.tabs.code.selected.image"
 msgstr "Image"
 
+msgid "handoff.tabs.code.selected.component"
+msgstr "Component"
+
+msgid "handoff.tabs.code.selected.mask"
+msgstr "Mask"
+
 #: src/app/main/ui/handoff/right_sidebar.cljs
 msgid "handoff.tabs.code.selected.multiple"
 msgstr "%s Selected"
diff --git a/frontend/translations/es.po b/frontend/translations/es.po
index 9c53e4337..154b27447 100644
--- a/frontend/translations/es.po
+++ b/frontend/translations/es.po
@@ -938,6 +938,12 @@ msgstr "Grupo"
 msgid "handoff.tabs.code.selected.image"
 msgstr "Imagen"
 
+msgid "handoff.tabs.code.selected.component"
+msgstr "Componente"
+
+msgid "handoff.tabs.code.selected.mask"
+msgstr "Máscara"
+
 #: src/app/main/ui/handoff/right_sidebar.cljs
 msgid "handoff.tabs.code.selected.multiple"
 msgstr "%s Seleccionado"