fix: community tag emoji size

src/quo/components/tags/tag.cljs

@@ -5,7 +5,8 @@
     [quo.components.tags.base-tag :as base-tag]
     [quo.foundations.colors :as colors]
     [quo.theme]
-    [react-native.core :as rn]))
+    [react-native.core :as rn]
+    [status-im.ui.components.react :as react]))
 
 (def themes
   {:light {:default  {:border-color         colors/neutral-20
@@ -47,13 +48,22 @@
                           24 12)
        :color           icon-color}])
    (when (= type :emoji)
-     [text/text
-      {:style {:margin-right 4}
-       :size  (case size
-                32 :paragraph-1
-                24 :paragraph-2
-                nil)}
-      resource])
+     (let [image-emoji? (int? resource)]
+       (if image-emoji?
+         [react/image
+          {:source resource
+           :style  (merge {:margin-right 4}
+                          (case size
+                            32 {:width 20 :height 20}
+                            24 {:width 12 :height 12}
+                            nil))}]
+         [rn/text
+          {:style {:margin-right 4
+                   :font-size    (case size
+                                   32 20
+                                   24 12
+                                   nil)}}
+          resource])))
    (when labelled?
      [text/text
       (merge {:size            (case size
@@ -73,7 +83,7 @@
     :size         32/24
     :on-press     fn
     :blurred?     true/false
-    :resource     icon/image
+    :resource     icon/image/text(emojis)
     :labelled?    true/false
     :disabled?    true/false}
 

src/status_im/contexts/communities/overview/view.cljs

@@ -36,10 +36,11 @@
       (utils/join-existing-users-string user-list)]]))
 
 (defn add-category-height
-  [categories-heights category height]
-  (swap! categories-heights
-    (fn [heights]
-      (assoc heights category height))))
+  [categories-heights category category-id height]
+  (when-not (= constants/empty-category-id category-id)
+    (swap! categories-heights
+      (fn [heights]
+        (assoc heights category height)))))
 
 (defn collapse-category
   [community-id category-id collapsed?]
@@ -89,7 +90,7 @@
       {:key       category-id
        ;; on-layout fires only when the component re-renders, so
        ;; in case the category hasn't changed, it will not be fired
-       :on-layout #(on-category-layout name (int (layout-y %)))}
+       :on-layout #(on-category-layout name category-id (int (layout-y %)))}
       (when-not (= constants/empty-category-id category-id)
         [quo/divider-label
          {:on-press        #(collapse-category community-id category-id collapsed?)
@@ -329,10 +330,14 @@
         ;; user is on this page
         initial-joined?      joined]
     (fn [{:keys [id name images] :as community} pending?]
-      (let [cover          {:uri (get-in images [:banner :uri])}
-            logo           {:uri (get-in images [:thumbnail :uri])}
-            collapsed?     (and initial-joined? (:joined community))
-            overlay-shown? (boolean (:sheets (rf/sub [:bottom-sheet])))]
+      (let [cover                 {:uri (get-in images [:banner :uri])}
+            logo                  {:uri (get-in images [:thumbnail :uri])}
+            collapsed?            (and initial-joined? (:joined community))
+            first-category-height (->> @categories-heights
+                                       vals
+                                       (apply min)
+                                       (+ @first-channel-height))
+            overlay-shown?        (boolean (:sheets (rf/sub [:bottom-sheet])))]
         [scroll-page/scroll-page
          {:cover-image      cover
           :collapsed?       collapsed?
@@ -348,7 +353,8 @@
                              :community-name name
                              :community-logo logo}
           :sticky-header    [sticky-category-header
-                             {:enabled (> @scroll-height @first-channel-height)
+                             {:enabled (> @scroll-height
+                                          first-category-height)
                               :label   (pick-first-category-by-height
                                         @scroll-height
                                         @first-channel-height

src/status_im/contexts/preview/quo/community/community_card_view.cljs

@@ -15,15 +15,15 @@
    :community-icon (resources/get-mock-image :status-logo)
    :customization-color :blue
    :tokens [{:id 1 :group [{:id 1 :token-icon (resources/get-mock-image :status-logo)}]}]
-   :tags [{:id        1
-           :tag-label (i18n/label :t/music)
-           :emoji     (resources/get-image :music)}
-          {:id        2
-           :tag-label (i18n/label :t/lifestyle)
-           :emoji     (resources/get-image :lifestyle)}
-          {:id        3
-           :tag-label (i18n/label :t/podcasts)
-           :emoji     (resources/get-image :podcasts)}]})
+   :tags [{:id    1
+           :name  (i18n/label :t/music)
+           :emoji (resources/get-image :music)}
+          {:id    2
+           :name  (i18n/label :t/lifestyle)
+           :emoji "🧩"}
+          {:id    3
+           :name  (i18n/label :t/podcasts)
+           :emoji "🎶"}]})
 
 (def descriptor
   [{:key     :status