Repository: penpot/penpot
File: frontend/src/app/main/ui/ds/controls/shared/options_dropdown.cljs (ClojureScript)

Code before:
      {:icon-id icon
       :size "s"
       :class (stl/css :option-icon)
       :aria-hidden (when label true)
       :aria-label  (when (not label) aria-label)}])

   [:span {:class (stl/css-case :option-text true
                                :option-text-dimmed dimmed)} label]
   (when selected
     [:> icon*
      {:icon-id i/tick
       :size "s"
       :class (stl/css :option-check)
       :aria-hidden (when label true)}])])

(mf/defc options-dropdown*
  {::mf/props :obj}
  [{:keys [set-ref on-click options selected focused empty-to-end] :rest props}]
  (let [props (mf/spread-props props
                               {:class (stl/css :option-list)
                                :tab-index "-1"
                                :role "listbox"})]

    (if empty-to-end

      (let [with-id       (array/filter #((complement str/blank?) (obj/get % "id")) options)
            with-blank-id (array/filter #(str/blank? (obj/get % "id")) options)]
        [:> "ul" props
         (for [option ^js with-id]
           (let [id    (obj/get option "id")
                 label (obj/get option "label")
                 aria-label (obj/get option "aria-label")
                 icon (obj/get option "icon")]
             [:> option* {:selected (= id selected)
                          :key id
                          :id id
                          :label label
                          :icon icon
                          :aria-label aria-label
                          :set-ref set-ref
                          :focused (= id focused)
                          :dimmed false
                          :on-click on-click}]))

         (when (seq with-blank-id)
           [:hr {:class (stl/css :option-separator)}])

         (for [option ^js with-blank-id]
           (let [id    (obj/get option "id")
                 label (obj/get option "label")
                 aria-label (obj/get option "aria-label")

Review comment (suggestion):
If you set here the if here instead of on line 60, you can have only one block, and avoid code repetition (removing all the block on line 100)...

```
options       (if empty-to-end (array/filter #((complement str/blank?) (obj/get % "id")) options) options)
with-blank-id (when empty-to-end (array/filter #(str/blank? (obj/get % "id")) options))
```




Code after:
      {:icon-id icon
       :size "s"
       :class (stl/css :option-icon)
       :aria-hidden (when label true)
       :aria-label  (when (not label) aria-label)}])

   [:span {:class (stl/css-case :option-text true
                                :option-text-dimmed dimmed)} label]
   (when selected
     [:> icon*
      {:icon-id i/tick
       :size "s"
       :class (stl/css :option-check)
       :aria-hidden (when label true)}])])

(mf/defc options-dropdown*
  {::mf/props :obj}
  [{:keys [set-ref on-click options selected focused empty-to-end] :rest props}]
  (let [props (mf/spread-props props
                               {:class (stl/css :option-list)
                                :tab-index "-1"
                                :role "listbox"})

        options-blank (when empty-to-end
                        (array/filter #(str/blank? (obj/get % "id")) options))
        options       (if empty-to-end
                        (array/filter #((complement str/blank?) (obj/get % "id")) options)
                        options)]

    [:> "ul" props
     (for [option ^js options]
       (let [id    (obj/get option "id")
             label (obj/get option "label")
             aria-label (obj/get option "aria-label")
             icon (obj/get option "icon")]
         [:> option* {:selected (= id selected)
                      :key id
                      :id id
                      :label label
                      :icon icon
                      :aria-label aria-label
                      :set-ref set-ref
                      :focused (= id focused)
                      :dimmed false
                      :on-click on-click}]))

     (when (seq options-blank)
       [:*
        (when (seq options)
          [:hr {:class (stl/css :option-separator)}])