diff --git a/storybook/src/Models/ChannelsModel.qml b/storybook/src/Models/ChannelsModel.qml
index b2ebdf07a3..a1e0fda15d 100644
--- a/storybook/src/Models/ChannelsModel.qml
+++ b/storybook/src/Models/ChannelsModel.qml
@@ -2,66 +2,84 @@ import QtQuick 2.14
 
 ListModel {
     ListElement {
-        itemId: 0
+        itemId: "1"
+        isCategory: false
+        categoryId: ""
         name: "welcome"
-        isCategory: false
+        emoji: ""
         color: ""
         colorId: 1
-        icon: ""
     }
     ListElement {
-        itemId: 1
+        itemId: "2"
+        isCategory: false
+        categoryId: ""
         name: "announcements"
-        isCategory: false
+        emoji: ""
         color: ""
         colorId: 1
-        icon: ""
     }
     ListElement {
-        name: "Discussion"
+        itemId: "0"
         isCategory: true
-
-        subItems: [
-            ListElement {
-                itemId: 2
-                name: "general"
-                icon: ""
-                emoji: "👋"
-            },
-            ListElement {
-                itemId: 3
-                name: "help"
-                icon: ""
-                color: ""
-                colorId: 1
-                emoji: "⚽"
-            }
-        ]
+        categoryId: "1"
+        name: "discussion"
+        emoji: ""
+        color: ""
+        colorId: 1
     }
     ListElement {
-        name: "Support"
-        isCategory: true
-
-        subItems: [
-            ListElement {
-                itemId: 4
-                name: "faq"
-                icon: ""
-                color: ""
-                colorId: 5
-            },
-            ListElement {
-                itemId: 5
-                name: "report-scam"
-                icon: ""
-                color: ""
-                colorId: 4
-            }
-        ]
+        itemId: "3"
+        isCategory: false
+        categoryId: "1"
+        name: "general"
+        emoji: "👋"
+        color: ""
+        colorId: 1
     }
     ListElement {
-        name: "Empty"
+        itemId: "4"
+        isCategory: false
+        categoryId: "1"
+        name: "help"
+        emoji: "⚽"
+        color: ""
+        colorId: 1
+    }
+    ListElement {
+        itemId: "0"
         isCategory: true
-        subItems: []
+        categoryId: "2"
+        name: "support"
+        emoji: ""
+        color: ""
+        colorId: 1
+    }
+    ListElement {
+        itemId: "5"
+        isCategory: false
+        categoryId: "2"
+        name: "faq"
+        emoji: ""
+        color: ""
+        colorId: 5
+    }
+    ListElement {
+        itemId: "6"
+        isCategory: false
+        categoryId: "2"
+        name: "report-scam"
+        emoji: ""
+        color: ""
+        colorId: 4
+    }
+    ListElement {
+        itemId: "0"
+        isCategory: true
+        categoryId: "3"
+        name: "faq"
+        emoji: ""
+        color: ""
+        colorId: 5
     }
 }
diff --git a/ui/app/AppLayouts/Chat/controls/community/CommunityListItem.qml b/ui/app/AppLayouts/Chat/controls/community/CommunityListItem.qml
index 7b4dde57ec..797783d737 100644
--- a/ui/app/AppLayouts/Chat/controls/community/CommunityListItem.qml
+++ b/ui/app/AppLayouts/Chat/controls/community/CommunityListItem.qml
@@ -20,7 +20,7 @@ StatusListItem {
 
     asset.isLetterIdenticon: true
     asset.letterSize: 12
-    asset.isImage: model.icon.includes("data")
+    asset.isImage: asset.name.includes("data")
     asset.width: 32
     asset.height: 32
 
diff --git a/ui/app/AppLayouts/Chat/controls/community/InDropdown.qml b/ui/app/AppLayouts/Chat/controls/community/InDropdown.qml
index b5af1fa784..198603553a 100644
--- a/ui/app/AppLayouts/Chat/controls/community/InDropdown.qml
+++ b/ui/app/AppLayouts/Chat/controls/community/InDropdown.qml
@@ -188,22 +188,44 @@ StatusDropdown {
 
                         sourceModel: root.model
 
+                        filters: AnyOf {
+                            ValueFilter {
+                                roleName: "categoryId"
+                                value: ""
+                            }
+                            ValueFilter {
+                                roleName: "isCategory"
+                                value: true
+                            }
+                        }
+
                         sorters: [
-                            RoleSorter { roleName: "isCategory" },
-                            RoleSorter { roleName: "position" }
+                            RoleSorter {
+                                roleName: "categoryPosition"
+                                priority: 2 // Higher number === higher priority
+                            },
+                            RoleSorter {
+                                roleName: "position"
+                                priority: 1
+                            }
                         ]
                     }
 
                     ColumnLayout {
                         id: column
-                        Layout.fillWidth: true
-                        spacing: 0
+
                         readonly property var topModel: model
                         readonly property alias checkBox: loader.item
                         property int checkedCount: 0
 
+                        readonly property bool isCategory: model.isCategory
+                        readonly property string categoryId: model.categoryId
+
+                        Layout.fillWidth: true
+                        spacing: 0
+
                         visible: {
-                            if (!model.isCategory)
+                            if (!isCategory)
                                 return d.search(model.name, searcher.text)
                                         || checkBox.checked
 
@@ -224,8 +246,8 @@ StatusDropdown {
 
                             Layout.fillWidth: true
                             Layout.preferredHeight: d.itemStandardHeight
-                            Layout.topMargin: model.isCategory ? d.defaultVMargin : 0
-                            sourceComponent: model.isCategory
+                            Layout.topMargin: isCategory ? d.defaultVMargin : 0
+                            sourceComponent: isCategory
                                              ? communityCategoryDelegate
                                              : communityDelegate
 
@@ -236,7 +258,6 @@ StatusDropdown {
                                     const checkBox = loader.item.checkBox
                                     checkBox.checked = false
                                     checkBox.onToggled()
-
                                 }
                             }
 
@@ -248,7 +269,7 @@ StatusDropdown {
 
                                     title: "#" + model.name
 
-                                    asset.name: model.icon
+                                    asset.name: model.icon ?? ""
                                     asset.emoji: d.resolveEmoji(model.emoji)
                                     asset.color: d.resolveColor(model.color,
                                                                 model.colorId)
@@ -283,7 +304,7 @@ StatusDropdown {
                                     title: model.name
 
                                     checkState: {
-                                        if (checkedCount === model.subItems.count)
+                                        if (checkedCount === subItems.count)
                                             return Qt.Checked
                                         else if (checkedCount === 0)
                                             return Qt.Unchecked
@@ -301,12 +322,31 @@ StatusDropdown {
                             }
                         }
 
+                        SortFilterProxyModel {
+                            id: subItems
+
+                            sourceModel: isCategory ? root.model : null
+
+                            filters: AllOf {
+                                ValueFilter {
+                                    roleName: "categoryId"
+                                    value: column.categoryId
+                                }
+                                ValueFilter {
+                                    roleName: "isCategory"
+                                    value: false
+                                }
+                            }
+
+                            sorters: RoleSorter {
+                                roleName: "position"
+                            }
+                        }
+
                         Repeater {
                             id: subItemsRepeater
-                            model: SortFilterProxyModel {
-                                sourceModel: topModel.isCategory ? topModel.subItems : null
-                                sorters: RoleSorter { roleName: "position" }
-                            }
+
+                            model: subItems
 
                             function setAll(checkState) {
                                 const subItemsCount = count
@@ -319,15 +359,16 @@ StatusDropdown {
                             CommunityListItem {
                                 id: communitySubItem
 
+                                readonly property bool show:
+                                    d.search(model.name, searcher.text) || checked
+
                                 Layout.fillWidth: true
-                                readonly property bool show: d.search(model.name, searcher.text)
-                                                             || checked
 
                                 visible: show
 
                                 title: "#" + model.name
 
-                                asset.name: model.icon
+                                asset.name: model.icon ?? ""
                                 asset.emoji: d.resolveEmoji(model.emoji)
                                 asset.color: d.resolveColor(model.color,
                                                             model.colorId)