From 00f4abbad90b682382f314381d23077fb2e91d84 Mon Sep 17 00:00:00 2001
From: Andrey Antukh <niwi@niwi.nz>
Date: Thu, 13 Jul 2023 15:34:28 +0200
Subject: [PATCH] :zap: Improve css handling performance on title-bar component

---
 .../src/app/main/ui/components/title_bar.cljs | 32 +++++++++----------
 1 file changed, 15 insertions(+), 17 deletions(-)

diff --git a/frontend/src/app/main/ui/components/title_bar.cljs b/frontend/src/app/main/ui/components/title_bar.cljs
index 303b80e5a..b94667206 100644
--- a/frontend/src/app/main/ui/components/title_bar.cljs
+++ b/frontend/src/app/main/ui/components/title_bar.cljs
@@ -5,14 +5,14 @@
 ;; Copyright (c) KALEIDOS INC
 
 (ns app.main.ui.components.title-bar
-  (:require-macros [app.main.style :refer [css]])
+  (:require-macros [app.main.style :as stl])
   (:require
+   [app.common.data.macros :as dm]
    [app.main.ui.icons :as i]
-   [app.util.dom :as dom]
    [rumext.v2 :as mf]))
 
 (mf/defc title-bar
-    {::mf/wrap-props false}
+  {::mf/wrap-props false}
   [props]
   (let [collapsable? (unchecked-get props "collapsable?")
         collapsed?   (unchecked-get props "collapsed?")
@@ -21,22 +21,20 @@
         children     (unchecked-get props "children")
         on-btn-click (unchecked-get props "on-btn-click")
         btn-children (unchecked-get props "btn-children")
-        klass        (unchecked-get props "klass")]
- 
-    [:div {:class (dom/classnames (css :title-bar) true
-                                   klass true)}
+        klass        (dm/str (stl/css :title-bar) " "
+                             (unchecked-get props "klass"))]
+
+    [:div {:class klass}
      (if collapsable?
-       [:button {:class (dom/classnames (css :toggle-btn) true)
-                 :on-click on-collapsed}
-        [:span {:class (dom/classnames (css :collased-icon) true
-                                       (css :rotated) collapsed?)}
+       [:button {:class (stl/css :toggle-btn) :on-click on-collapsed}
+        [:span {:class (stl/css-case
+                        :collased-icon true
+                        :rotated collapsed?)}
          i/arrow-refactor]
-        [:div {:class (dom/classnames (css :title) true)}
-         title]]
-       [:div {:class (dom/classnames (css :title-only) true)}
-        title])
+        [:div {:class (stl/css :title)} title]]
+       [:div {:class (stl/css :title-only)} title])
      children
      (when (some? on-btn-click)
-       [:button {:class (dom/classnames (css :title-button) true)
+       [:button {:class (stl/css :title-button)
                  :on-click on-btn-click}
-        btn-children])]))
\ No newline at end of file
+        btn-children])]))