🐛 Fix focus new added property (#7065)

common/src/app/common/files/variant.cljc

@@ -30,13 +30,16 @@
 
 
 (defn extract-properties-values
+  "Get a map of properties associated to their possible values"
   [data objects variant-id]
   (->> (find-variant-components data objects variant-id)
        (mapcat :variant-properties)
        (group-by :name)
-       (map (fn [[k v]]
-              {:name k
-               :value (->> v (map :value) distinct)}))))
+       (mapv (fn [[k v]]
+               (let [mdata (reduce merge {} (map meta v))]
+                 (with-meta {:name k
+                             :value (->> v (map :value) distinct)}
+                   mdata))))))
 
 (defn get-variant-mains
   [component data]

common/src/app/common/logic/variant_properties.cljc

@@ -27,7 +27,12 @@
     (reduce (fn [changes component]
               (pcb/update-component
                changes (:id component)
-               #(assoc-in % [:variant-properties pos :name] new-name)
+               (fn [component]
+                 (d/update-in-when component [:variant-properties pos]
+                                   (fn [property]
+                                     (-> property
+                                         (assoc :name new-name)
+                                         (with-meta nil)))))
                {:apply-changes-local-library? true}))
             changes
             related-components)))
@@ -77,7 +82,7 @@
 
 
 (defn generate-add-new-property
-  [changes variant-id & {:keys [fill-values? property-name property-value]}]
+  [changes variant-id & {:keys [fill-values? editing? property-name property-value]}]
   (let [data               (pcb/get-library-data changes)
         objects            (pcb/get-objects changes)
         related-components (cfv/find-variant-components data objects variant-id)
@@ -89,15 +94,18 @@
         prop-names         (mapv :name props)
         property-name      (ctv/update-number-in-repeated-item prop-names property-name)
 
+        mdata              (if editing? {:editing? true} nil)
+
         [_ changes]
         (reduce (fn [[num changes] component]
                   (let [main-id      (:main-instance-id component)
 
                         update-props #(-> (d/nilv % [])
-                                          (conj {:name property-name
+                                          (conj (with-meta {:name property-name
                                                             :value (cond fill-values?   (str ctv/value-prefix num)
                                                                          property-value property-value
-                                                              :else          "")}))
+                                                                         :else          "")}
+                                                  mdata)))
 
                         update-name #(cond fill-values?   (if (str/empty? %)
                                                             (str ctv/value-prefix num)

frontend/src/app/main/ui/ds/product/input_with_meta.cljs

@@ -24,8 +24,8 @@
 
 (mf/defc input-with-meta*
   {::mf/schema schema:input-with-meta}
-  [{:keys [value meta max-length on-blur] :rest props}]
-  (let [editing*  (mf/use-state false)
+  [{:keys [value meta max-length is-editing on-blur] :rest props}]
+  (let [editing*  (mf/use-state (d/nilv is-editing false))
         editing?  (deref editing*)
 
         input-ref (mf/use-ref)

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

@@ -443,7 +443,8 @@
              (st/emit! (dwv/transform-in-variant id))))
 
         do-add-new-property
-        #(st/emit! (dwv/add-new-property variant-id {:property-value "Value 1"}))
+        #(st/emit! (dwv/add-new-property variant-id {:property-value "Value 1"
+                                                     :editing? true}))
 
         do-show-local-component
         #(st/emit! (dwl/go-to-local-component :id component-id))

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

@@ -359,6 +359,7 @@
          [:*
           [:div {:class (stl/css :variant-property-name-wrapper)}
            [:> input-with-meta* {:value (:name prop)
+                                 :is-editing (:editing? (meta prop))
                                  :max-length ctv/property-max-length
                                  :data-position pos
                                  :on-blur update-property-name}]]
@@ -995,7 +996,8 @@
         menu-open?         (deref menu-open*)
 
         menu-entries       [{:title (tr "workspace.shape.menu.add-variant-property")
-                             :action #(st/emit! (dwv/add-new-property variant-id {:property-value "Value 1"}))}
+                             :action #(st/emit! (dwv/add-new-property variant-id {:property-value "Value 1"
+                                                                                  :editing? true}))}
                             {:title (tr "workspace.shape.menu.add-variant")
                              :action #(st/emit! (dwv/add-new-variant (:id shape)))}]
 
@@ -1101,14 +1103,16 @@
           [:div {:class (stl/css :variant-property-list)}
            (for [[pos property] (map-indexed vector properties)]
              (let [last-prop? (<= (count properties) 1)
-                   meta       (->> (:value property)
+                   values     (->> (:value property)
                                    (move-empty-items-to-end)
                                    (replace {"" "--"})
-                                   (str/join ", "))]
+                                   (str/join ", "))
+                   is-editing (:editing? (meta property))]
                [:div {:key (str (:id shape) pos)
                       :class (stl/css :variant-property-row)}
                 [:> input-with-meta* {:value (:name property)
-                                      :meta meta
+                                      :meta values
+                                      :is-editing is-editing
                                       :max-length ctv/property-max-length
                                       :data-position pos
                                       :on-blur update-property-name}]