refactor component loops

src/renderer/attribute/views.cljs

@@ -28,9 +28,8 @@
   [:<>
    [:h4.font-bold.mb-1 "Browser compatibility"]
    [:div.flex.mb-4
-    (map (fn [[browser {:keys [version_added]}]]
-           ^{:key browser}
-           [browser-support browser version_added]) support-data)]])
+    (for [[browser {:keys [version_added]}] support-data]
+      ^{:key browser} [browser-support browser version_added])]])
 
 (defn mdn-button
   [mdn_url attr]
@@ -133,12 +132,12 @@
       [:> Select/ScrollUpButton {:class "select-scroll-button"}
        [comp/icon "chevron-up"]]
       [:> Select/Viewport {:class "select-viewport"}
-       (map (fn [item]
-              ^{:key item}
-              [:> Select/Item {:value (:value item) :class "menu-item "}
-               (when (:icon item)
-                 [:div.absolute.left-2 [comp/icon (:icon item)]])
-               [:> Select/ItemText (:label item)]]) items)]
+       (for [item items]
+         ^{:key item}
+         [:> Select/Item {:value (:value item) :class "menu-item "}
+          (when (:icon item)
+            [:div.absolute.left-2 [comp/icon (:icon item)]])
+          [:> Select/ItemText (:label item)]])]
       [:> Select/ScrollDownButton {:class "select-scroll-button"}
        [comp/icon "chevron-down"]]]]]])
 
@@ -252,5 +251,6 @@
          (when (empty? (rest selected-tags))
            [tag-info tag])]
         [:div.attribute-grid
-         (map (fn [[k v]] ^{:key k} [row k v locked? tag]) selected-attrs)]])
+         (for [[k v] selected-attrs]
+           ^{:key k} [row k v locked? tag])]])
      [:div.level-1.grow.w-full.flex]]))

src/renderer/document/views.cljs

@@ -135,10 +135,9 @@
         active-document @(rf/subscribe [:active-document])]
     [:div.flex.drag.justify-between {:style {:flex "0 0 40px"}}
      [:div.flex {:style {:flex "1 0 auto"}}
-      (map (fn [document]
-             ^{:key document}
-             [tab document (document documents) (= document active-document)])
-           document-tabs)]
+      (for [document document-tabs]
+        ^{:key document}
+        [tab document (document documents) (= document active-document)])]
      [:div.toolbar
       [:button.p-1.icon-button {:title "Document Actions"}
        [comp/icon "ellipsis-h"]]]]))

src/renderer/statusbar.cljs

@@ -127,11 +127,12 @@
           {:value "No a11y filter"
            :class "menu-item select-item"}
           [:> Select/ItemText "No a11y filter"]]
-         (map (fn [{:keys [id]}] ^{:key id}
-                [:> Select/Item
-                 {:value (name id)
-                  :class "menu-item select-item"}
-                 [:> Select/ItemText (name id)]]) filters/accessibility)]]
+         (for [{:keys [id]} filters/accessibility]
+           ^{:key id}
+           [:> Select/Item
+            {:value (name id)
+             :class "menu-item select-item"}
+            [:> Select/ItemText (name id)]])]]
        [:> Select/ScrollDownButton
         {:class "select-scroll-button"}
         [comp/icon "chevron-down"]]]]]))
@@ -175,9 +176,7 @@
          {:class "menu-content rounded"
           :side "top"
           :align "end"}
-         (map (fn [item]
-                ^{:key (:key item)}
-                [comp/dropdown-menu-item item])
-              zoom-menu)
+         (for [item zoom-menu]
+           ^{:key (:key item)} [comp/dropdown-menu-item item])
          [:> DropdownMenu/Arrow {:class "menu-arrow"}]]]]]
      [coordinates]]))

src/renderer/timeline/views.cljs

@@ -50,11 +50,11 @@
          [comp/icon "chevron-up"]]
         [:> Select/Viewport {:class "select-viewport"}
          [:> Select/Group
-          (map (fn [{:keys [id value label]}] ^{:key id}
-                 [:> Select/Item
-                  {:value value
-                   :class "menu-item select-item"}
-                  [:> Select/ItemText label]]) speed-options)]]
+          (for [{:keys [id value label]} speed-options]
+            ^{:key id} [:> Select/Item
+                        {:value value
+                         :class "menu-item select-item"}
+                        [:> Select/ItemText label]])]]
         [:> Select/ScrollDownButton
          {:class "select-scroll-button"}
          [comp/icon "chevron-down"]]]]]]))

src/renderer/tools/animation.cljs

@@ -11,6 +11,7 @@
   (let [child-elements @(rf/subscribe [:element/filter-visible children])]
     [tag
      attrs
-     (map (fn [el] ^{:key (:key el)} [tools/render el]) child-elements)]))
+     (for [el child-elements]
+       ^{:key (:key el)} [tools/render el])]))
 
 (defmethod tools/bounds ::tools/animation [] nil)

src/renderer/tools/canvas.cljs

@@ -45,7 +45,7 @@
            :on-double-click pointer-handler
            :on-key-up keyb/event-handler
            :on-key-down keyb/event-handler
-           :tab-index 0 ; Enable keyboard events on the svg element 
+           :tab-index 0 ; Enable keyboard events 
            :viewBox (str/join " " viewbox)
            :on-drop pointer-handler
            :on-drag-over #(.preventDefault %)
@@ -56,27 +56,22 @@
            :id "canvas"
            :style {:background (:fill attrs)
                    :outline "none"}}
-     (map (fn [el]
-            ^{:key (str (:key el))}
-            [tools/render el])
-          child-elements)
+     (for [el child-elements]
+       ^{:key (str (:key el))} [tools/render el])
 
      [:defs
       (map (fn [{:keys [id tag attrs]}]
              [:filter {:id id :key id} [tag attrs]])
            filters/accessibility)]
 
      (when debug-info?
-       (into [:g] (map (fn [snapping-point]
-                         [overlay/point-of-interest snapping-point])
-                       snapping-points)))
+       (into [:g] (map overlay/point-of-interest snapping-points)))
 
      (when (and select? (contains? #{:default :select :scale} state))
        [:<>
-        (map (fn [el]
-               ^{:key (str (:key el) "-bounds")}
-               [overlay/bounding-box (tools/adjusted-bounds el elements)])
-             hovered-or-selected)
+        (for [el hovered-or-selected]
+          ^{:key (str (:key el) "-bounds")}
+          [overlay/bounding-box (tools/adjusted-bounds el elements)])
 
         (when (pos? elements-area)
           [overlay/area elements-area bounds])
@@ -91,13 +86,12 @@
 
      (when (or (= tool :edit)
                (= primary-tool :edit))
-       (map (fn [el]
-              ^{:key (str (:key el) "-edit-points")}
-              [:g
-               [tools/render-edit el]
-               ^{:key (str (:key el) "-centroid")}
-               [overlay/centroid el]])
-            selected-elements))
+       (for [el selected-elements]
+         ^{:key (str (:key el) "-edit-points")}
+         [:g
+          [tools/render-edit el]
+          ^{:key (str (:key el) "-centroid")}
+          [overlay/centroid el]]))
 
      [tools/render temp-element]
 

src/renderer/tools/container.cljs

@@ -18,10 +18,8 @@
 (defmethod tools/render ::tools/container
   [{:keys [children tag attrs]}]
   (let [child-elements @(rf/subscribe [:element/filter-visible children])]
-    [tag attrs (map (fn [el]
-                      ^{:key (:key el)}
-                      [tools/render el])
-                    child-elements)]))
+    [tag attrs (for [el child-elements]
+                 ^{:key (:key el)} [tools/render el])]))
 
 (defmethod tools/render-to-string ::tools/container
   [{:keys [tag attrs title children]}]

src/renderer/tools/element.cljs

@@ -87,10 +87,8 @@
                    (into {}))
           (when title [:title title])
           content
-          (map (fn [child]
-                 ^{:key (:key child)}
-                 [tools/render child])
-               child-elements)]
+          (for [child child-elements]
+            ^{:key (:key child)} [tools/render child])]
 
          (when default-state?
            (let [pointer-handler #(pointer/event-handler % el)]