🐛 Fix alert for bad formula not showing in copies of variants (#7126)

* 🐛 Fix alert for bad formula not showing in copies of variants

* ✨ MR changes

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

@@ -686,7 +686,10 @@
         (rx/of (rt/nav :workspace params ::rt/new-window true))))))
 
 (defn go-to-local-component
-  [& {:keys [id] :as options}]
+  ;; id is the id of the component to go
+  ;; additional-ids are ids of additional components on the same page
+  ;; that will be selected and zoomed along the main one
+  [& {:keys [id additional-ids] :as options}]
   (ptk/reify ::go-to-local-component
     ptk/WatchEvent
     (watch [_ state stream]
@@ -694,27 +697,36 @@
             data            (dsh/lookup-file-data state)
 
             select-and-zoom
-            (fn [shape-id]
+            (fn [ids]
-              (rx/of (dws/select-shapes (d/ordered-set shape-id))
+              (rx/of (dws/select-shapes ids)
                      dwz/zoom-to-selected-shape))
 
             redirect-to-page
-            (fn [page-id shape-id]
+            (fn [page-id ids]
               (rx/merge
                (->> stream
                     (rx/filter (ptk/type? ::dwpg/initialize-page))
                     (rx/take 1)
                     (rx/observe-on :async)
-                    (rx/mapcat (fn [_] (select-and-zoom shape-id))))
+                    (rx/mapcat (fn [_] (select-and-zoom ids))))
-               (rx/of (dcm/go-to-workspace :page-id page-id))))]
+               (rx/of (dcm/go-to-workspace :page-id page-id))))
+
+            get-main-instance-id
+            (fn [id page-id]
+              (let [component (dm/get-in data [:components id])]
+                (when (= (:main-instance-page component) page-id)
+                  (:main-instance-id component))))]
 
         (when-let [component (dm/get-in data [:components id])]
           (let [page-id  (:main-instance-page component)
-                shape-id (:main-instance-id component)]
+                shape-id (:main-instance-id component)
+                additional-shape-ids (keep #(get-main-instance-id % page-id)
+                                           additional-ids)
+                ids (into (d/ordered-set shape-id) additional-shape-ids)]
             (when (some? page-id)
               (if (= page-id current-page-id)
-                (select-and-zoom shape-id)
+                (select-and-zoom ids)
-                (redirect-to-page page-id shape-id)))))))))
+                (redirect-to-page page-id ids)))))))))
 
 (defn library-thumbnails-fetched
   [thumbnails]

frontend/src/app/main/ui/workspace/sidebar/assets/components.cljs

@@ -86,7 +86,7 @@
          (fn [event]
            (dom/stop-propagation event)
            (if is-local
-             (st/emit! (dwl/go-to-local-component component-id))
+             (st/emit! (dwl/go-to-local-component :id component-id))
              (st/emit! (dwl/go-to-component-file file-id component)))))
 
         on-drop

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

@@ -242,15 +242,15 @@
 (defn- get-variant-malformed-warning-message
   "Receive a list of booleans, one for each selected variant, indicating if that variant
    is malformed, and generate a warning message accordingly"
-  [malformed-map]
+  [malformed-list]
   (cond
-    (and (= (count malformed-map) 1) (some? (first malformed-map)))
+    (and (= (count malformed-list) 1) (some? (first malformed-list)))
     (tr "workspace.options.component.variant.malformed.single.one")
 
-    (and (seq malformed-map) (every? some? malformed-map))
+    (and (seq malformed-list) (every? some? malformed-list))
     (tr "workspace.options.component.variant.malformed.single.all")
 
-    (and (seq malformed-map) (some some? malformed-map))
+    (and (seq malformed-list) (some some? malformed-list))
     (tr "workspace.options.component.variant.malformed.single.some")
 
     :else nil))
@@ -259,22 +259,22 @@
 (defn- get-variant-duplicated-warning-message
   "Receive a list of booleans, one for each selected variant, indicating if that variant
    is duplicated, and generate a warning message accordingly"
-  [duplicated-map]
+  [duplicated-list]
   (cond
-    (and (= (count duplicated-map) 1) (some? (first duplicated-map)))
+    (and (= (count duplicated-list) 1) (some? (first duplicated-list)))
     (tr "workspace.options.component.variant.duplicated.single.one")
 
-    (and (seq duplicated-map) (every? some? duplicated-map))
+    (and (seq duplicated-list) (every? some? duplicated-list))
     (tr "workspace.options.component.variant.duplicated.single.all")
 
-    (and (seq duplicated-map) (some some? duplicated-map))
+    (and (seq duplicated-list) (some some? duplicated-list))
     (tr "workspace.options.component.variant.duplicated.single.some")
 
     :else nil))
 
 
-(defn- get-component-ids-with-duplicated-variant-props-and-values
+(defn- get-components-with-duplicated-variant-props-and-values
-  "Get a list of component ids whose property names and values are duplicated"
+  "Get a list of components whose property names and values are duplicated"
   [components]
   (let [duplicated-props (->> components
                               (map :variant-properties)
@@ -283,8 +283,14 @@
                               keys
                               set)]
     (->> components
-         (filter #(duplicated-props (:variant-properties %)))
+         (filter #(duplicated-props (:variant-properties %))))))
-         (map :main-instance-id))))
+
+(defn- get-main-ids-with-duplicated-variant-props-and-values
+  "Get a list of component main ids whose property names and values are duplicated"
+  [components]
+  (->> components
+       get-components-with-duplicated-variant-props-and-values
+       (map :main-instance-id)))
 
 
 (defn- get-variant-options
@@ -306,22 +312,22 @@
         objects        (-> (dsh/get-page data (:main-instance-page component))
                            (get :objects))
 
-        properties-map (mapv :variant-properties components)
+        props-list     (map :variant-properties components)
-        component-ids  (mapv :id components)
+        component-ids  (map :id components)
         properties     (if (> (count component-ids) 1)
-                         (ctv/compare-properties properties-map false)
+                         (ctv/compare-properties props-list false)
-                         (first properties-map))
+                         (first props-list))
 
-        malformed-map   (mapv :variant-error shapes)
+        malformed-list  (map :variant-error shapes)
-        malformed-msg   (get-variant-malformed-warning-message malformed-map)
+        malformed-msg   (get-variant-malformed-warning-message malformed-list)
 
         duplicated-ids  (->> (cfv/find-variant-components data objects variant-id)
-                             get-component-ids-with-duplicated-variant-props-and-values
+                             get-main-ids-with-duplicated-variant-props-and-values
                              set)
-        duplicated-map  (->> components
+        duplicated-list (->> components
-                             (mapv :main-instance-id)
+                             (map :main-instance-id)
-                             (mapv duplicated-ids))
+                             (map duplicated-ids))
-        duplicated-msg  (get-variant-duplicated-warning-message duplicated-map)
+        duplicated-msg  (get-variant-duplicated-warning-message duplicated-list)
 
         prop-vals       (mf/with-memo [data objects variant-id]
                           (cfv/extract-properties-values data objects variant-id))
@@ -387,25 +393,31 @@
           [:> icon* {:icon-id "msg-neutral"
                      :class (stl/css :variant-warning-darken)}]
           [:div {:class (stl/css :variant-warning-highlight)}
-           (str duplicated-msg " " "Adjust the values so they can be retrieved.")]]))]))
+           (str duplicated-msg)]]))]))
 
 
 (mf/defc component-variant-copy*
-  [{:keys [component shape data]}]
+  [{:keys [component shape data current-file-id]}]
   (let [component-id (:id component)
         properties   (:variant-properties component)
         variant-id   (:variant-id component)
         objects      (-> (dsh/get-page data (:main-instance-page component))
                          (get :objects))
+        variant-comps    (mf/with-memo [data objects variant-id]
+                           (cfv/find-variant-components data objects variant-id))
 
-        variant-components (cfv/find-variant-components data objects variant-id)
+        duplicated-comps (mf/with-memo [variant-comps]
+                           (->> variant-comps
+                                get-components-with-duplicated-variant-props-and-values))
 
-        duplicated-ids     (->> (cfv/find-variant-components data objects variant-id)
+        malformed-comps  (mf/with-memo [variant-comps]
-                                get-component-ids-with-duplicated-variant-props-and-values)
+                           (->> variant-comps
-        duplicated?        (d/not-empty? duplicated-ids)
+                                (filter #(->> (:main-instance-id %)
+                                              (get objects)
+                                              :variant-error))))
 
-        prop-vals          (mf/with-memo [data objects variant-id]
+        prop-vals        (mf/with-memo [data objects variant-id]
-                             (cfv/extract-properties-values data objects variant-id))
+                           (cfv/extract-properties-values data objects variant-id))
 
         get-options
         (mf/use-fn
@@ -413,19 +425,33 @@
          (fn [prop-name]
            (get-variant-options prop-name prop-vals)))
 
-        select-shapes-with-duplicated
+        select-duplicated-comps
         (mf/use-fn
-         (mf/deps duplicated-ids)
+         (mf/deps current-file-id shape duplicated-comps)
-         #(st/emit! (dw/select-shapes (into (d/ordered-set) duplicated-ids))))
+         #(let [ids (map :id duplicated-comps)]
+            (if (= current-file-id (:component-file shape))
+              (st/emit! (dwl/go-to-local-component {:id (first ids)
+                                                    :additional-ids (rest ids)}))
+              (st/emit! (dwl/go-to-component-file (:component-file shape)
+                                                  (first duplicated-comps))))))
+
+        select-malformed-comps
+        (mf/use-fn
+         (mf/deps current-file-id shape malformed-comps)
+         (fn []
+           (let [ids (map :id malformed-comps)]
+             (if (= current-file-id (:component-file shape))
+               (st/emit! (dwl/go-to-local-component :id (first ids) :additional-ids (rest ids)))
+               (st/emit! (dwl/go-to-component-file (:component-file shape) (first malformed-comps)))))))
 
         switch-component
         (mf/use-fn
-         (mf/deps shape)
+         (mf/deps shape component component-id variant-comps)
          (fn [pos val]
            (when (not= val (dm/get-in component [:variant-properties pos :value]))
              (let [target-props (-> (:variant-properties component)
                                     (update pos assoc :value val))
-                   valid-comps  (->> variant-components
+                   valid-comps  (->> variant-comps
                                      (remove #(= (:id %) component-id))
                                      (filter #(= (dm/get-in % [:variant-properties pos :value]) val))
                                      (reverse))
@@ -445,15 +471,25 @@
                        :empty-to-end true
                        :on-change (partial switch-component pos)}]]])]
 
-     (when duplicated?
+     (if (seq malformed-comps)
        [:div {:class (stl/css :variant-warning-wrapper)}
         [:> icon* {:icon-id "msg-neutral"
                    :class (stl/css :variant-warning-darken)}]
         [:div {:class (stl/css :variant-warning-highlight)}
-         (tr "workspace.options.component.variant.duplicated.copy.title")]
+         (tr "workspace.options.component.variant.malformed.copy")]
         [:button {:class (stl/css :variant-warning-button)
-                  :on-click select-shapes-with-duplicated}
+                  :on-click select-malformed-comps}
-         (tr "workspace.options.component.variant.duplicated.copy.locate")]])]))
+         (tr "workspace.options.component.variant.malformed.locate")]]
+
+       (when (seq duplicated-comps)
+         [:div {:class (stl/css :variant-warning-wrapper)}
+          [:> icon* {:icon-id "msg-neutral"
+                     :class (stl/css :variant-warning-darken)}]
+          [:div {:class (stl/css :variant-warning-highlight)}
+           (tr "workspace.options.component.variant.duplicated.copy.title")]
+          [:button {:class (stl/css :variant-warning-button)
+                    :on-click select-duplicated-comps}
+           (tr "workspace.options.component.variant.duplicated.copy.locate")]]))]))
 
 
 (mf/defc component-swap-item
@@ -936,7 +972,8 @@
                      (not (:deleted component))
                      (not swap-opened?)
                      (not multi))
-            [:> component-variant-copy* {:component component
+            [:> component-variant-copy* {:current-file-id current-file-id
+                                         :component component
                                          :shape shape
                                          :data data}])
 
@@ -986,7 +1023,7 @@
         malformed?         (d/not-empty? malformed-ids)
 
         duplicated-ids     (->> (cfv/find-variant-components data objects variant-id)
-                                get-component-ids-with-duplicated-variant-props-and-values)
+                                get-main-ids-with-duplicated-variant-props-and-values)
         duplicated?        (d/not-empty? duplicated-ids)
 
         properties         (mf/with-memo [data objects variant-id]

frontend/translations/en.po

@@ -5492,27 +5492,23 @@ msgstr "This component has conflicting variants. Make sure each variation has a
 
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:443
 msgid "workspace.options.component.variant.duplicated.copy.locate"
-msgstr "Go to main component"
+msgstr "Locate conflicting variants"
 
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:954
 msgid "workspace.options.component.variant.duplicated.group.title"
 msgstr "Some variants have identical properties and values"
 
-#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:309
-msgid "workspace.options.component.variant.duplicated.single.adjust"
-msgstr "Adjust the values so they can be retrieved."
-
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:309
 msgid "workspace.options.component.variant.duplicated.single.all"
-msgstr "These variants have identical properties and values."
+msgstr "These variants have identical properties and values. Adjust the values so they can be retrieved."
 
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:309
 msgid "workspace.options.component.variant.duplicated.single.one"
-msgstr "This variant has identical properties and values to another variant."
+msgstr "This variant has identical properties and values to another variant. Adjust the values so they can be retrieved."
 
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:309
 msgid "workspace.options.component.variant.duplicated.single.some"
-msgstr "Some of these variants have identical properties and values."
+msgstr "Some of these variants have identical properties and values. Adjust the values so they can be retrieved."
 
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:957
 msgid "workspace.options.component.variant.malformed.group.locate"
@@ -5542,6 +5538,17 @@ msgstr "[property]=[value], [property]=[value]"
 msgid "workspace.options.component.variant.malformed.structure.title"
 msgstr "Try using the following structure:"
 
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:475
+msgid "workspace.options.component.variant.malformed.copy"
+msgstr "This component has variants with invalid names. Make sure every variant is following the correct structure."
+
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:478
+msgid "workspace.options.component.variant.malformed.locate"
+msgstr "Locate invalid variants"
+
+
+
+
 msgid "workspace.options.component.variants-help-modal.title"
 msgstr "How variants stay connected"
 

frontend/translations/es.po

@@ -5492,7 +5492,7 @@ msgstr "Este componente tiene variantes en conflicto. Comprueba que cada variant
 
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:443
 msgid "workspace.options.component.variant.duplicated.copy.locate"
-msgstr "Ir al componente principal"
+msgstr "Localizar variantes en conflicto"
 
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:957
 msgid "workspace.options.component.variant.duplicated.group.locate"
@@ -5502,21 +5502,17 @@ msgstr "Localizar variantes duplicadas"
 msgid "workspace.options.component.variant.duplicated.group.title"
 msgstr "Algunas variantes tienen propiedades y valores idénticos"
 
-#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:309
-msgid "workspace.options.component.variant.duplicated.single.adjust"
-msgstr "Ajusta los valores para que puedan ser encontradas."
-
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:309
 msgid "workspace.options.component.variant.duplicated.single.all"
-msgstr "Estas variantes tienen propiedades y valores idénticos."
+msgstr "Estas variantes tienen propiedades y valores idénticos. Ajusta los valores para que puedan ser encontradas"
 
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:309
 msgid "workspace.options.component.variant.duplicated.single.one"
-msgstr "Esta variante tiene propiedades y valores idénticos a los de otra variante."
+msgstr "Esta variante tiene propiedades y valores idénticos a los de otra variante. Ajusta los valores para que puedan ser encontradas"
 
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:309
 msgid "workspace.options.component.variant.duplicated.single.some"
-msgstr "Algunas de estas variantes tienen propiedades y valores idénticos."
+msgstr "Algunas de estas variantes tienen propiedades y valores idénticos. Ajusta los valores para que puedan ser encontradas"
 
 #: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:957
 msgid "workspace.options.component.variant.malformed.group.locate"
@@ -5546,6 +5542,14 @@ msgstr "[propiedad]=[valor], [propiedad]=[valor]"
 msgid "workspace.options.component.variant.malformed.structure.title"
 msgstr "Prueba a utilizar la siguiente estructura:"
 
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:475
+msgid "workspace.options.component.variant.malformed.copy"
+msgstr "Este componente tiene variantes con nombres no válidos. Asegúrate de que cada variante siga la estructura correcta."
+
+#: src/app/main/ui/workspace/sidebar/options/menus/component.cljs:478
+msgid "workspace.options.component.variant.malformed.locate"
+msgstr "Localizar variantes inválidas"
+
 #: src/app/main/ui/workspace/sidebar/options/menus/constraints.cljs:163
 msgid "workspace.options.constraints"
 msgstr "Restricciones"