From 05e437ee06299fe00d4c64b650160b1b246d0fbe Mon Sep 17 00:00:00 2001
From: Pablo Alba <pablo.alba@kaleidos.net>
Date: Mon, 12 Dec 2022 16:56:25 +0100
Subject: [PATCH] :bug: Fix flex elemen info doesn't show on inspect tab

---
 frontend/src/app/main/refs.cljs                       | 11 +++++++++++
 .../src/app/main/ui/viewer/handoff/attributes.cljs    |  5 +++--
 .../handoff/attributes/layout_flex_element.cljs       |  8 ++++----
 frontend/src/app/main/ui/viewer/handoff/code.cljs     |  8 +++++---
 .../src/app/main/ui/viewer/handoff/right_sidebar.cljs |  3 ++-
 5 files changed, 25 insertions(+), 10 deletions(-)

diff --git a/frontend/src/app/main/refs.cljs b/frontend/src/app/main/refs.cljs
index 6998b831e..df141a2d3 100644
--- a/frontend/src/app/main/refs.cljs
+++ b/frontend/src/app/main/refs.cljs
@@ -384,6 +384,17 @@
 (def workspace-focus-selected
   (l/derived :workspace-focus-selected st/state))
 
+(defn workspace-get-flex-child
+  [ids]
+  (l/derived
+   (fn [state]
+     (let [objects  (wsh/lookup-page-objects state)]
+       (into []
+             (comp (map (d/getf objects))
+                   (filter (partial ctl/layout-child? objects)))
+             ids)))
+   st/state =))
+
 ;; Remove this when deprecating components-v2
 (def remove-graphics
   (l/derived :remove-graphics st/state))
diff --git a/frontend/src/app/main/ui/viewer/handoff/attributes.cljs b/frontend/src/app/main/ui/viewer/handoff/attributes.cljs
index 91e803da1..610ed323f 100644
--- a/frontend/src/app/main/ui/viewer/handoff/attributes.cljs
+++ b/frontend/src/app/main/ui/viewer/handoff/attributes.cljs
@@ -32,7 +32,7 @@
    :text     [:layout :text :shadow :blur :stroke :layout-flex-item]})
 
 (mf/defc attributes
-  [{:keys [page-id file-id shapes frame]}]
+  [{:keys [page-id file-id shapes frame from]}]
   (let [shapes  (hooks/use-equal-memo shapes)
         shapes  (mf/with-memo [shapes]
                   (mapv #(gsh/translate-to-frame % frame) shapes))
@@ -52,7 +52,8 @@
              :text             text-panel
              :svg              svg-panel)
         {:shapes shapes
-         :frame frame}])
+         :frame frame
+         :from from}])
      [:& exports
       {:shapes shapes
        :type type
diff --git a/frontend/src/app/main/ui/viewer/handoff/attributes/layout_flex_element.cljs b/frontend/src/app/main/ui/viewer/handoff/attributes/layout_flex_element.cljs
index 9cdb46a02..9b6edd928 100644
--- a/frontend/src/app/main/ui/viewer/handoff/attributes/layout_flex_element.cljs
+++ b/frontend/src/app/main/ui/viewer/handoff/attributes/layout_flex_element.cljs
@@ -90,7 +90,7 @@
         [:div.attributes-label "Margin"]
         [:& manage-margin {:margin merged-margin :type "margin"}]
         [:& copy-button {:data (copy-data shape :layout-item-margin)}]])
-     
+
      (when (:layout-item-h-sizing shape)
        [:div.attributes-unit-row
         [:div.attributes-label "Horizontal sizing"]
@@ -102,7 +102,7 @@
         [:div.attributes-label "Vertical sizing"]
         [:div.attributes-value (manage-sizing (:layout-item-v-sizing shape) :v)]
         [:& copy-button {:data (copy-data shape :layout-item-v-sizing)}]])
-     
+
      (when (= :fill (:layout-item-h-sizing shape))
        [:*
         (when (some? (:layout-item-max-w shape))
@@ -132,10 +132,10 @@
            [:& copy-button {:data (copy-data shape :layout-item-min-h)}]])])]))
 
 (mf/defc layout-flex-element-panel
-  [{:keys [shapes]}]
+  [{:keys [shapes from]}]
   (let [route        (mf/deref refs/route)
         page-id      (:page-id (:query-params route))
-        mod-shapes   (cd/get-flex-elements page-id shapes)
+        mod-shapes   (cd/get-flex-elements page-id shapes from)
         shape        (first mod-shapes)
         has-margin?  (some? (:layout-item-margin shape))
         has-values?  (or (some? (:layout-item-max-w shape))
diff --git a/frontend/src/app/main/ui/viewer/handoff/code.cljs b/frontend/src/app/main/ui/viewer/handoff/code.cljs
index 1f4a9e7f7..02a425a4a 100644
--- a/frontend/src/app/main/ui/viewer/handoff/code.cljs
+++ b/frontend/src/app/main/ui/viewer/handoff/code.cljs
@@ -46,10 +46,12 @@
     (cond-> code
       (= type "svg") (beautify/html #js {"indent_size" 2}))))
 
-(defn get-flex-elements [page-id shapes]
+(defn get-flex-elements [page-id shapes from]
   (let [ids (mapv :id shapes)
         ids (hooks/use-equal-memo ids)
-        get-layout-children-refs (mf/use-memo (mf/deps ids page-id) #(refs/get-flex-child-viewer ids page-id))]
+        get-layout-children-refs (mf/use-memo (mf/deps ids page-id from) #(if (= from :workspace)
+                                                                            (refs/workspace-get-flex-child ids)
+                                                                            (refs/get-flex-child-viewer ids page-id)))]
 
     (mf/deref get-layout-children-refs)))
 
@@ -61,7 +63,7 @@
                          (map #(gsh/translate-to-frame % frame)))
         route      (mf/deref refs/route)
         page-id    (:page-id (:query-params route))
-        flex-items (get-flex-elements page-id shapes)
+        flex-items (get-flex-elements page-id shapes from)
         shapes     (map #(assoc % :flex-items flex-items) shapes)
         style-code (-> (cg/generate-style-code @style-type shapes)
                        (format-code "css"))
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 63db1d487..aa1c23986 100644
--- a/frontend/src/app/main/ui/viewer/handoff/right_sidebar.cljs
+++ b/frontend/src/app/main/ui/viewer/handoff/right_sidebar.cljs
@@ -65,7 +65,8 @@
             [:& attributes {:page-id page-id
                             :file-id file-id
                             :frame frame
-                            :shapes shapes}]]
+                            :shapes shapes
+                            :from from}]]
 
            [:& tab-element {:id :code :title (tr "handoff.tabs.code")}
             [:& code {:frame frame