Comletely redo emoticon handling

autotests/texthandlertest.cpp

@@ -11,7 +11,6 @@
 #include <qnamespace.h>
 
 #include "enums/messagecomponenttype.h"
-#include "models/customemojimodel.h"
 #include "neochatconnection.h"
 
 #include "testutils.h"
@@ -77,7 +76,6 @@ void TextHandlerTest::initTestCase()
                                                          QJsonObject{{"body"_ls, "Test custom emoji"_ls},
                                                                      {"url"_ls, "mxc://example.org/test"_ls},
                                                                      {"usage"_ls, QJsonArray{"emoticon"_ls}}}}}}});
-    CustomEmojiModel::instance().setConnection(static_cast<NeoChatConnection *>(connection));
 
     room = new TestUtils::TestRoom(connection, QStringLiteral("#myroom:kde.org"), QLatin1String("test-texthandler-sync.json"));
 }

src/CMakeLists.txt

@@ -10,12 +10,6 @@ endif()
 add_library(neochat STATIC
     controller.cpp
     controller.h
-    models/emojimodel.cpp
-    models/emojimodel.h
-    emojitones.cpp
-    emojitones.h
-    models/customemojimodel.cpp
-    models/customemojimodel.h
     clipboard.cpp
     clipboard.h
     models/messageeventmodel.cpp
@@ -26,8 +20,6 @@ add_library(neochat STATIC
     models/roomlistmodel.h
     models/sortfilterspacelistmodel.cpp
     models/sortfilterspacelistmodel.h
-    models/accountemoticonmodel.cpp
-    models/accountemoticonmodel.h
     spacehierarchycache.cpp
     spacehierarchycache.h
     roommanager.cpp
@@ -50,8 +42,6 @@ add_library(neochat STATIC
     models/userdirectorylistmodel.h
     models/pushrulemodel.cpp
     models/pushrulemodel.h
-    models/emoticonfiltermodel.cpp
-    models/emoticonfiltermodel.h
     notificationsmanager.cpp
     notificationsmanager.h
     models/sortfilterroomlistmodel.cpp
@@ -101,10 +91,6 @@ add_library(neochat STATIC
     texthandler.h
     logger.cpp
     logger.h
-    models/stickermodel.cpp
-    models/stickermodel.h
-    models/imagepacksmodel.cpp
-    models/imagepacksmodel.h
     events/imagepackevent.cpp
     events/imagepackevent.h
     events/joinrulesevent.cpp
@@ -194,6 +180,32 @@ add_library(neochat STATIC
     models/threadmodel.h
     enums/messagetype.h
     messagecomponent.h
+    imagecontentmanager.h
+    imagecontentmanager.cpp
+    models/imagecontentmodel.cpp
+    models/imagecontentmodel.h
+    models/emojipacksmodel.cpp
+    models/emojipacksmodel.h
+    models/accountimagepackmodel.cpp
+    models/accountimagepackmodel.h
+    models/historyimagepackmodel.cpp
+    models/historyimagepackmodel.h
+    models/imagepacksproxymodel.cpp
+    models/imagepacksproxymodel.h
+    models/imagepacksmodel.cpp
+    models/imagepacksmodel.h
+    models/recentimagecontentmodel.h
+    models/recentimagecontentmodel.cpp
+    models/recentimagecontentproxymodel.h
+    models/recentimagecontentproxymodel.cpp
+    models/allimagecontentmodel.h
+    models/allimagecontentmodel.cpp
+    models/roomimagepacksmodel.h
+    models/roomimagepacksmodel.cpp
+    models/imagepackroomsmodel.h
+    models/imagepackroomsmodel.cpp
+    models/imagecontentfiltermodel.h
+    models/imagecontentfiltermodel.cpp
 )
 
 set_source_files_properties(qml/OsmLocationPlugin.qml PROPERTIES
@@ -282,6 +294,9 @@ ecm_add_qml_module(neochat URI org.kde.neochat GENERATE_PLUGIN_SOURCE
         qml/ConfirmLeaveDialog.qml
         qml/CodeMaximizeComponent.qml
         qml/EditStateDialog.qml
+        qml/EmojiPickerTypeHeader.qml
+        qml/EmojiPickerPackHeader.qml
+        qml/QuickReaction.qml
         qml/ConsentDialog.qml
         qml/AskDirectChatConfirmation.qml
         qml/HoverLinkIndicator.qml
@@ -298,6 +313,12 @@ ecm_add_qml_module(neochat URI org.kde.neochat GENERATE_PLUGIN_SOURCE
         org.kde.neochat.chatbar
 )
 
+qt_add_resources(neochat "emoji"
+    PREFIX "/"
+    FILES
+        data/emojis.json
+)
+
 add_subdirectory(settings)
 add_subdirectory(timeline)
 add_subdirectory(devtools)

src/chatbar/ChatBar.qml

@@ -519,7 +519,6 @@ QQC2.Control {
         y: -implicitHeight
 
         modal: false
-        includeCustom: true
         closeOnChosen: false
 
         currentRoom: root.currentRoom

src/chatbar/EmojiDelegate.qml

@@ -5,59 +5,30 @@ import QtQuick
 import QtQuick.Controls as QQC2
 import org.kde.kirigami as Kirigami
 
-QQC2.ItemDelegate {
+QQC2.Button {
     id: root
 
-    property string name
-    property string emoji
+    required property string toolTip
     property bool showTones: false
-    property bool isImage: false
 
-    QQC2.ToolTip.text: root.name
-    QQC2.ToolTip.visible: hovered && root.name !== ""
+    QQC2.ToolTip.text: toolTip
+    QQC2.ToolTip.visible: hovered
     QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
-    leftInset: Kirigami.Units.smallSpacing
-    topInset: Kirigami.Units.smallSpacing
-    rightInset: Kirigami.Units.smallSpacing
-    bottomInset: Kirigami.Units.smallSpacing
 
-    contentItem: Item {
-        Kirigami.Heading {
-            anchors.fill: parent
-            visible: !root.emoji.startsWith("mxc") && !root.isImage
-            text: root.emoji
-            horizontalAlignment: Text.AlignHCenter
-            verticalAlignment: Text.AlignVCenter
-            font.family: "emoji"
+    flat: true
 
-            Kirigami.Icon {
-                width: Kirigami.Units.gridUnit * 0.5
-                height: Kirigami.Units.gridUnit * 0.5
-                source: "arrow-down-symbolic"
-                anchors.bottom: parent.bottom
-                anchors.right: parent.right
-                visible: root.showTones
-            }
-        }
-        Image {
-            anchors.fill: parent
-            visible: root.emoji.startsWith("mxc") || root.isImage
-            source: visible ? root.emoji : ""
-            fillMode: Image.PreserveAspectFit
-            sourceSize.width: width
-            sourceSize.height: height
-        }
-    }
+    contentItem: Kirigami.Heading {
+        text: root.text
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
 
-    background: Rectangle {
-        color: root.checked ? Kirigami.Theme.highlightColor : Kirigami.Theme.backgroundColor
-        radius: Kirigami.Units.cornerRadius
-
-        Rectangle {
-            radius: Kirigami.Units.cornerRadius
-            anchors.fill: parent
-            color: Kirigami.Theme.highlightColor
-            opacity: root.hovered && !root.pressed ? 0.2 : 0
+        Kirigami.Icon {
+            width: Kirigami.Units.gridUnit * 0.5
+            height: Kirigami.Units.gridUnit * 0.5
+            source: "arrow-down-symbolic"
+            anchors.bottom: parent.bottom
+            anchors.right: parent.right
+            visible: root.showTones
         }
     }
 }

src/chatbar/EmojiDialog.qml

@@ -16,9 +16,7 @@ QQC2.Popup {
      */
     property NeoChatRoom currentRoom
 
-    property bool includeCustom: false
     property bool closeOnChosen: true
-    property bool showQuickReaction: false
 
     signal chosen(string emoji)
 
@@ -64,15 +62,15 @@ QQC2.Popup {
     padding: 2
 
     implicitHeight: Kirigami.Units.gridUnit * 20 + 2 * padding
-    width: Math.min(contentItem.categoryIconSize * 11 + 2 * padding, applicationWindow().width)
+    width: Math.min(contentItem.implicitWidth + 2 * padding, applicationWindow().width)
+
     contentItem: EmojiPicker {
         id: emojiPicker
         height: 400
         currentRoom: root.currentRoom
-        includeCustom: root.includeCustom
-        showQuickReaction: root.showQuickReaction
         onChosen: emoji => {
             root.chosen(emoji);
+            ImageContentManager.emojiUsed(emoji)
             if (root.closeOnChosen) {
                 root.close();
             }

src/chatbar/EmojiGrid.qml

@@ -1,20 +1,17 @@
-// SPDX-FileCopyrightText: 2022 Tobias Fella
+// SPDX-FileCopyrightText: 2024 Tobias Fella <tobias.fella@kde.org>
 // SPDX-License-Identifier: GPL-2.0-or-later
 
 import QtQuick
 import QtQuick.Controls as QQC2
 import org.kde.kirigami as Kirigami
+
 import org.kde.neochat
+import org.kde.textaddons.emoticons
 
 QQC2.ScrollView {
     id: root
 
-    property alias model: emojis.model
-    property alias count: emojis.count
-    required property int targetIconSize
-    readonly property int emojisPerRow: emojis.width / targetIconSize
-    required property bool withCustom
-    readonly property var searchCategory: withCustom ? EmojiModel.Search : EmojiModel.SearchNoCustom
+    readonly property int emojisPerRow: emojis.width / Kirigami.Units.iconSizes.large
     required property QtObject header
     property bool stickers: false
 
@@ -25,6 +22,8 @@ QQC2.ScrollView {
         emojis.forceActiveFocus();
     }
 
+    width: Kirigami.Units.gridUnit * 24
+
     GridView {
         id: emojis
 
@@ -41,7 +40,9 @@ QQC2.ScrollView {
         onModelChanged: currentIndex = -1
 
         cellWidth: emojis.width / root.emojisPerRow
-        cellHeight: root.targetIconSize
+        cellHeight: Kirigami.Units.iconSizes.large
+
+        model: EmojiModelManager.emojiModel
 
         KeyNavigation.up: root.header
 
@@ -49,50 +50,49 @@ QQC2.ScrollView {
 
         delegate: EmojiDelegate {
             id: emojiDelegate
-            checked: emojis.currentIndex === model.index
-            emoji: !!modelData ? modelData.unicode : model.url
-            name: !!modelData ? modelData.shortName : model.body
+
+            required property string unicode
+            required property string identifier
+            required property int index
+
+            text: emojiDelegate.unicode
+            toolTip: emojiDelegate.identifier
+            checked: emojis.currentIndex === emojiDelegate.index
 
             width: emojis.cellWidth
             height: emojis.cellHeight
 
-            isImage: root.stickers
             Keys.onEnterPressed: clicked()
             Keys.onReturnPressed: clicked()
-            onClicked: {
-                if (root.stickers) {
-                    root.stickerChosen(model.index);
-                }
-                root.chosen(modelData.isCustom ? modelData.shortName : modelData.unicode);
-                EmojiModel.emojiUsed(modelData);
-            }
-            Keys.onSpacePressed: pressAndHold()
-            onPressAndHold: {
-                if (EmojiModel.tones(modelData.shortName).length === 0) {
-                    return;
-                }
-                let tones = tonesPopupComponent.createObject(emojiDelegate, {
-                    shortName: modelData.shortName,
-                    unicode: modelData.unicode,
-                    categoryIconSize: root.targetIconSize
-                });
-                tones.open();
-                tones.forceActiveFocus();
-            }
-            showTones: !!modelData && EmojiModel.tones(modelData.shortName).length > 0
+            // onClicked: {
+            //     if (root.stickers) {
+            //         root.stickerChosen(model.index);
+            //     }
+            //     root.chosen(modelData.isCustom ? modelData.shortName : modelData.unicode);
+            //     EmojiModel.emojiUsed(modelData);
+            // }
+            // Keys.onSpacePressed: pressAndHold()
+            // onPressAndHold: {
+            //     if (!showTones) {
+            //         return;
+            //     }
+            //     let tones = Qt.createComponent("org.kde.neochat", "EmojiTonesPicker").createObject(emojiDelegate, {
+            //         shortName: modelData.shortName,
+            //         unicode: modelData.unicode,
+            //         categoryIconSize: root.targetIconSize,
+            //         onChosen: root.chosen(emoji => root.chosen(emoji))
+            //     });
+            //     tones.open();
+            //     tones.forceActiveFocus();
+            // }
+            // showTones: model.hasTones
         }
 
         Kirigami.PlaceholderMessage {
             anchors.centerIn: parent
             icon.name: root.stickers ? "stickers" : "preferences-desktop-emoticons"
-            text: root.stickers ? i18n("No stickers") : i18n("No emojis")
+            text: root.stickers ? i18nc("@info", "No stickers") : i18nc("@info", "No emojis")
             visible: emojis.count === 0
         }
     }
-    Component {
-        id: tonesPopupComponent
-        EmojiTonesPicker {
-            onChosen: root.chosen(emoji)
-        }
-    }
 }

src/chatbar/EmojiPicker.qml

@@ -1,4 +1,4 @@
-// SPDX-FileCopyrightText: 2022 Tobias Fella <tobias.fella@kde.org>
+// SPDX-FileCopyrightText: 2022-2023 Tobias Fella <tobias.fella@kde.org>
 // SPDX-License-Identifier: GPL-2.0-or-later
 
 import QtQuick
@@ -6,6 +6,7 @@ import QtQuick.Controls as QQC2
 import QtQuick.Layouts
 import org.kde.kirigami as Kirigami
 import org.kde.neochat
+import org.kde.textaddons.emoticons
 
 ColumnLayout {
     id: root
@@ -13,87 +14,29 @@ ColumnLayout {
     /**
      * @brief The current room that user is viewing.
      */
-    property NeoChatRoom currentRoom
-
-    property bool includeCustom: false
-    property bool showQuickReaction: false
-
-    readonly property var currentEmojiModel: {
-        if (includeCustom) {
-            EmojiModel.categoriesWithCustom;
-        } else {
-            EmojiModel.categories;
-        }
-    }
-
-    readonly property int categoryIconSize: Math.round(Kirigami.Units.gridUnit * 2.5)
-    readonly property var currentCategory: currentEmojiModel[categories.currentIndex].category
-    readonly property alias categoryCount: categories.count
-    property int selectedType: 0
+    required property NeoChatRoom currentRoom
 
     signal chosen(string emoji)
 
+    spacing: 0
+
     onActiveFocusChanged: if (activeFocus) {
         searchField.forceActiveFocus();
     }
 
-    spacing: 0
+    EmojiPickerTypeHeader {
+        id: emoticonPickerTypeHeader
 
-    Kirigami.NavigationTabBar {
-        id: types
         Layout.fillWidth: true
-        Kirigami.Theme.colorSet: Kirigami.Theme.View
-
-        background: null
-        actions: [
-            Kirigami.Action {
-                id: emojis
-                icon.name: "smiley"
-                text: i18n("Emojis")
-                checked: true
-                onTriggered: root.selectedType = 0
-            },
-            Kirigami.Action {
-                id: stickers
-                icon.name: "stickers"
-                text: i18n("Stickers")
-                onTriggered: root.selectedType = 1
-            }
-        ]
+        onSelectedTypeChanged: emoticonPickerCategoryHeader.currentIndex = 0
     }
 
-    QQC2.ScrollView {
+    EmojiPickerPackHeader {
+        id: emoticonPickerCategoryHeader
+
         Layout.fillWidth: true
-        Layout.preferredHeight: root.categoryIconSize + QQC2.ScrollBar.horizontal.height
-        QQC2.ScrollBar.horizontal.height: QQC2.ScrollBar.horizontal.visible ? QQC2.ScrollBar.horizontal.implicitHeight : 0
-        visible: categories.count !== 0
 
-        ListView {
-            id: categories
-            clip: true
-            focus: true
-            orientation: ListView.Horizontal
-
-            Keys.onReturnPressed: if (emojiGrid.count > 0) {
-                emojiGrid.focus = true;
-            }
-            Keys.onEnterPressed: if (emojiGrid.count > 0) {
-                emojiGrid.focus = true;
-            }
-
-            KeyNavigation.down: emojiGrid.count > 0 ? emojiGrid : categories
-            KeyNavigation.tab: emojiGrid.count > 0 ? emojiGrid : categories
-
-            keyNavigationEnabled: true
-            keyNavigationWraps: true
-            Keys.forwardTo: searchField
-            interactive: width !== contentWidth
-
-            model: root.selectedType === 0 ? root.currentEmojiModel : stickerPackModel
-            Component.onCompleted: categories.forceActiveFocus()
-
-            delegate: root.selectedType === 0 ? emojiDelegate : stickerDelegate
-        }
+        model: UnicodeEmoticonManager.categories
     }
 
     Kirigami.Separator {
@@ -105,119 +48,34 @@ ColumnLayout {
         id: searchField
         Layout.margins: Kirigami.Units.smallSpacing
         Layout.fillWidth: true
-        visible: selectedType === 0
 
-        /**
-         * The focus is manged by the parent and we don't want to use the standard
-         * shortcut as it could block other SearchFields from using it.
-         */
         focusSequence: ""
     }
 
     EmojiGrid {
         id: emojiGrid
-        targetIconSize: root.currentCategory === EmojiModel.Custom ? Kirigami.Units.gridUnit * 3 : root.categoryIconSize  // Custom emojis are bigger
-        model: root.selectedType === 1 ? emoticonFilterModel : searchField.text.length === 0 ? EmojiModel.emojis(root.currentCategory) : (root.includeCustom ? EmojiModel.filterModel(searchField.text, false) : EmojiModel.filterModelNoCustom(searchField.text, false))
+
         Layout.fillWidth: true
         Layout.fillHeight: true
-        withCustom: root.includeCustom
         onChosen: unicode => root.chosen(unicode)
-        header: categories
+        header: emoticonPickerCategoryHeader
         Keys.forwardTo: searchField
-        stickers: root.selectedType === 1
+        stickers: emoticonPickerTypeHeader.selectedType === EmojiPickerTypeHeader.EmoticonType.Sticker
         onStickerChosen: stickerModel.postSticker(emoticonFilterModel.mapToSource(emoticonFilterModel.index(index, 0)).row)
     }
 
     Kirigami.Separator {
-        visible: showQuickReaction
         Layout.fillWidth: true
         Layout.preferredHeight: 1
     }
 
-    QQC2.ScrollView {
-        visible: showQuickReaction
+    QuickReaction {
+        id: quickReaction
+        onChosen: root.chosen(text)
         Layout.fillWidth: true
-        Layout.preferredHeight: root.categoryIconSize + QQC2.ScrollBar.horizontal.height
-        QQC2.ScrollBar.horizontal.height: QQC2.ScrollBar.horizontal.visible ? QQC2.ScrollBar.horizontal.implicitHeight : 0
-
-        ListView {
-            id: quickReactions
-            Layout.fillWidth: true
-
-            model: ["👍", "👎", "😄", "🎉", "😕", "❤", "🚀", "👀"]
-
-            delegate: EmojiDelegate {
-                emoji: modelData
-
-                height: root.categoryIconSize
-                width: height
-
-                onClicked: root.chosen(modelData)
-            }
-
-            orientation: Qt.Horizontal
-        }
-    }
-
-    ImagePacksModel {
-        id: stickerPackModel
-        room: root.currentRoom
-        showStickers: true
-        showEmoticons: false
-    }
-
-    StickerModel {
-        id: stickerModel
-        model: stickerPackModel
-        packIndex: 0
-        room: root.currentRoom
-    }
-
-    EmoticonFilterModel {
-        id: emoticonFilterModel
-        sourceModel: stickerModel
-        showStickers: true
-    }
-
-    Component {
-        id: emojiDelegate
-        Kirigami.NavigationTabButton {
-            width: root.categoryIconSize
-            height: width
-            checked: categories.currentIndex === model.index
-            text: modelData ? modelData.emoji : ""
-            QQC2.ToolTip.text: modelData ? modelData.name : ""
-            QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
-            QQC2.ToolTip.visible: hovered
-            onClicked: {
-                categories.currentIndex = index;
-                categories.focus = true;
-            }
-        }
-    }
-
-    Component {
-        id: stickerDelegate
-        Kirigami.NavigationTabButton {
-            width: root.categoryIconSize
-            height: width
-            checked: stickerModel.packIndex === model.index
-            padding: Kirigami.Units.largeSpacing
-
-            contentItem: Image {
-                source: model.avatarUrl
-                fillMode: Image.PreserveAspectFit
-                sourceSize.width: width
-                sourceSize.height: height
-            }
-            QQC2.ToolTip.text: model.name
-            QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
-            QQC2.ToolTip.visible: hovered && !!model.name
-            onClicked: stickerModel.packIndex = model.index
-        }
     }
 
     function clearSearchField() {
-        searchField.text = "";
+        searchField.text = ""
     }
 }

src/chatbar/EmojiTonesPicker.qml

@@ -1,4 +1,4 @@
-// SPDX-FileCopyrightText: 2022 Tobias Fella <tobias.fella@kde.org>
+// SPDX-FileCopyrightText: 2024 Tobias Fella <tobias.fella@kde.org>
 // SPDX-License-Identifier: GPL-2.0-or-later
 
 import QtQuick
@@ -54,8 +54,8 @@ QQC2.Popup {
         delegate: EmojiDelegate {
             id: emojiDelegate
             checked: tonesList.currentIndex === model.index
-            emoji: modelData.unicode
-            name: modelData.shortName
+            text: modelData.unicode
+            toolTip: modelData.shortName
 
             width: root.categoryIconSize
             height: width

src/data/emojis.json.license

@@ -0,0 +1,2 @@
+SPDX-FileCopyrightText: 2024 Emojibase
+SPDX-License-Identifier: MIT

src/emojitones.cpp

@@ -1,9 +0,0 @@
-// SPDX-FileCopyrightText: None
-// SPDX-License-Identifier: LGPL-2.0-or-later
-
-#include "emojitones.h"
-#include "models/emojimodel.h"
-
-QMultiHash<QString, QVariant> EmojiTones::_tones = {
-#include "emojitones_data.h"
-};

src/emojitones.h

@@ -1,21 +0,0 @@
-// SPDX-FileCopyrightText: None
-// SPDX-License-Identifier: LGPL-2.0-or-later
-
-#pragma once
-
-#include <QVariant>
-
-/**
- * @class EmojiTones
- *
- * This class provides a _tones variable with the available emoji tones to EmojiModel.
- *
- * @sa EmojiModel
- */
-class EmojiTones
-{
-private:
-    static QMultiHash<QString, QVariant> _tones;
-
-    friend class EmojiModel;
-};

src/imagecontentmanager.cpp

@@ -0,0 +1,334 @@
+// SPDX-FileCopyrightText: 2024 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "imagecontentmanager.h"
+
+#include <QDebug>
+#include <QFile>
+
+#include <KConfigGroup>
+#include <KSharedConfig>
+
+#include "controller.h"
+#include "events/imagepackevent.h"
+#include "neochatroom.h"
+
+#include <Quotient/connection.h>
+
+#define connection Controller::instance().activeConnection()
+
+using namespace Quotient;
+
+ImageContentManager::ImageContentManager(QObject *parent)
+    : QObject(parent)
+{
+    connect(&Controller::instance(), &Controller::activeConnectionChanged, this, [this]() {
+        static Connection *oldActiveConnection = nullptr;
+        disconnect(oldActiveConnection, nullptr, this, nullptr);
+        oldActiveConnection = Controller::instance().activeConnection();
+        setupConnection();
+    });
+
+    loadEmojis();
+    loadEmojiHistory();
+
+    setupConnection();
+}
+
+void ImageContentManager::loadEmojis()
+{
+    QFile file(":/data/emojis.json"_ls);
+    file.open(QFile::ReadOnly);
+    Q_ASSERT(file.isOpen());
+    auto data = QJsonDocument::fromJson(file.readAll()).array();
+
+    for (const auto &emoji : data) {
+        // TODO
+        // m_emojiPacks += ImagePackDescription{
+        //     .description = parts[1],
+        //     .attribution = {},
+        //     .icon = parts[0],
+        //     .type = ImagePackDescription::Emoji,
+        //     .roomId = {},
+        //     .stateKey = parts[2],
+        // };
+
+        m_emojis[u"TODO"_s] += Emoji{
+            .text = emoji[u"icon"_s].toString(),
+            .displayName = emoji[u"label"_s].toString(),
+            .shortName = emoji[u"label"_s].toString(), // TODO
+        };
+    }
+}
+
+void ImageContentManager::loadEmojiHistory()
+{
+    auto config = KSharedConfig::openStateConfig();
+    auto group = config->group("RecentEmojis"_ls);
+    for (const auto &key : group.keyList()) {
+        m_usages[key] = group.readEntry(key).toInt();
+    }
+}
+
+void ImageContentManager::setupConnection()
+{
+    if (!connection) {
+        return;
+    }
+    connect(Controller::instance().activeConnection(), &Connection::accountDataChanged, this, [this](const QString &type) {
+        if (type == "im.ponies.user_emotes"_ls) {
+            loadAccountImages();
+        }
+        if (type == "im.ponies.emote_rooms"_ls) {
+            loadGlobalPacks();
+        }
+    });
+    loadAccountImages();
+    loadGlobalPacks();
+
+    m_roomPacks.clear();
+
+    for (const auto &room : connection->allRooms()) {
+        setupRoom(static_cast<NeoChatRoom *>(room));
+    }
+    connect(connection, &Connection::joinedRoom, this, [this](const auto &room) {
+        setupRoom(static_cast<NeoChatRoom *>(room));
+    });
+    connect(connection, &Connection::leftRoom, this, [this](const auto &room) {
+        cleanupRoom(static_cast<NeoChatRoom *>(room));
+    });
+}
+
+const QVector<ImagePackDescription> &ImageContentManager::emojiPacks() const
+{
+    return m_emojiPacks;
+}
+
+const QHash<QString, QVector<Emoji>> &ImageContentManager::emojis() const
+{
+    return m_emojis;
+}
+
+void ImageContentManager::loadAccountImages()
+{
+    m_accountImages.clear();
+    if (connection->hasAccountData("im.ponies.user_emotes"_ls)) {
+        m_accountImages = ImagePackEventContent(connection->accountData("im.ponies.user_emotes"_ls)->contentJson()).images;
+    }
+    Q_EMIT accountImagesChanged();
+}
+
+const QVector<ImagePackEventContent::ImagePackImage> &ImageContentManager::accountImages() const
+{
+    return m_accountImages;
+}
+
+void ImageContentManager::emojiUsed(const QString &text)
+{
+    if (!m_usages.contains(text)) {
+        m_usages[text] = 0;
+    }
+    m_usages[text]++;
+    Q_EMIT recentEmojisChanged();
+    auto config = KSharedConfig::openStateConfig();
+    auto group = config->group("RecentEmojis"_ls);
+    for (const auto &key : m_usages.keys()) {
+        group.writeEntry(key, m_usages[key]);
+    }
+}
+
+Emoji ImageContentManager::emojiForText(const QString &text)
+{
+    for (const auto &category : m_emojis.values()) {
+        for (const auto &emoji : category) {
+            if (emoji.text == text) {
+                return emoji;
+            }
+        }
+    }
+    const auto &withSelector = QString::fromUtf8(text.toUtf8() + QByteArrayLiteral("\xEF\xB8\x8F"));
+    for (const auto &category : m_emojis.values()) {
+        for (const auto &emoji : category) {
+            if (emoji.text == withSelector) {
+                return emoji;
+            }
+        }
+    }
+    return {};
+}
+
+const QMap<QString, uint32_t> &ImageContentManager::recentEmojis() const
+{
+    return m_usages;
+}
+
+const QMap<QString, QMap<QString, ImagePackDescription>> &ImageContentManager::roomImagePacks() const
+{
+    return m_roomPacks;
+}
+
+void ImageContentManager::loadRoomImagePacks(NeoChatRoom *room)
+{
+    const auto &events = room->currentState().eventsOfType("im.ponies.room_emotes"_ls);
+    m_roomPacks[room->id()].clear();
+    for (const auto &event : events) {
+        auto content = ImagePackEventContent(event->contentJson());
+        auto avatarMxc = event->contentPart<QJsonObject>("pack"_ls)["avatar_url"_ls].toString();
+        if (avatarMxc.isEmpty()) {
+            const auto &images = event->contentPart<QJsonObject>("images"_ls);
+            if (images.size() > 0) {
+                avatarMxc = images[images.keys()[0]]["url"_ls].toString();
+            }
+        }
+        const auto &avatarUrl = avatarMxc.isEmpty() ? QString() : Controller::instance().activeConnection()->makeMediaUrl(QUrl(avatarMxc)).toString();
+
+        ImagePackDescription::Type type = ImagePackDescription::Both;
+        if (!content.pack || !content.pack->usage || content.pack->usage->isEmpty()
+            || (content.pack->usage->contains("emoticon"_ls) && content.pack->usage->contains("sticker"_ls))) {
+            type = ImagePackDescription::Both;
+        } else if (content.pack->usage->contains("sticker"_ls)) {
+            type = ImagePackDescription::Sticker;
+        } else {
+            type = ImagePackDescription::CustomEmoji;
+        }
+
+        m_roomPacks[room->id()][event->stateKey()] = ImagePackDescription{
+            .description = event->contentPart<QJsonObject>("pack"_ls)["display_name"_ls].toString(),
+            .attribution = {},
+            .icon = QStringLiteral("<img src=\"%1\" width=\"32\" height=\"32\"/>").arg(avatarUrl),
+            .type = type,
+            .roomId = room->id(),
+            .stateKey = event->stateKey(),
+        };
+        m_roomImages[{room->id(), event->stateKey()}] = content.images;
+    }
+    Q_EMIT roomImagePacksChanged(room);
+}
+
+const RoomImages &ImageContentManager::roomImages() const
+{
+    return m_roomImages;
+}
+
+const QVector<std::pair<QString, QString>> &ImageContentManager::globalPacks() const
+{
+    return m_globalPacks;
+}
+
+void ImageContentManager::loadGlobalPacks()
+{
+    if (!connection->hasAccountData("im.ponies.emote_rooms"_ls)) {
+        return;
+    }
+    m_globalPacks.clear();
+    const auto &rooms = Controller::instance().activeConnection()->accountData("im.ponies.emote_rooms"_ls)->contentPart<QJsonObject>("rooms"_ls);
+    for (const auto &roomId : rooms.keys()) {
+        for (const auto &stateKey : rooms[roomId].toObject().keys()) {
+            m_globalPacks += {roomId, stateKey};
+        }
+    }
+    Q_EMIT globalPacksChanged();
+}
+
+void ImageContentManager::setupRoom(NeoChatRoom *room)
+{
+    connect(room, &Room::changed, this, [this, room]() {
+        loadRoomImagePacks(room);
+    });
+    loadRoomImagePacks(room);
+}
+
+void ImageContentManager::cleanupRoom(NeoChatRoom *room)
+{
+    m_roomPacks.remove(room->id());
+    Q_EMIT roomImagePacksChanged(room);
+}
+
+QString ImageContentManager::mxcForShortCode(const QString &shortcode) const
+{
+    for (const auto &image : m_accountImages) {
+        if (image.shortcode == shortcode) {
+            return Controller::instance().activeConnection()->makeMediaUrl(image.url).toString();
+        }
+    }
+    for (const auto &id : m_roomImages.keys()) {
+        for (const auto &image : m_roomImages[id]) {
+            if (image.shortcode == shortcode) {
+                return Controller::instance().activeConnection()->makeMediaUrl(image.url).toString();
+            }
+        }
+    }
+    return {};
+}
+
+QString ImageContentManager::bodyForShortCode(const QString &shortcode) const
+{
+    for (const auto &image : m_accountImages) {
+        if (image.shortcode == shortcode) {
+            return image.body.value_or(QString());
+        }
+    }
+    for (const auto &id : m_roomImages.keys()) {
+        for (const auto &image : m_roomImages[id]) {
+            if (image.shortcode == shortcode) {
+                return image.body.value_or(QString());
+            }
+        }
+    }
+    return {};
+}
+
+bool ImageContentManager::isEmojiShortCode(const QString &shortCode) const
+{
+    for (const auto &image : m_accountImages) {
+        if (image.shortcode == shortCode) {
+            return !image.usage || image.usage->isEmpty() || image.usage->contains("emoticon"_ls);
+        }
+    }
+    for (const auto &id : m_roomImages.keys()) {
+        for (const auto &image : m_roomImages[id]) {
+            if (image.shortcode == shortCode) {
+                const auto pack = m_roomPacks[id.first][id.second];
+                return pack.type == ImagePackDescription::Emoji || pack.type == ImagePackDescription::Both;
+            }
+        }
+    }
+    return true;
+}
+
+bool ImageContentManager::isStickerShortCode(const QString &shortCode) const
+{
+    for (const auto &image : m_accountImages) {
+        if (image.shortcode == shortCode) {
+            return !image.usage || image.usage->isEmpty() || image.usage->contains("sticker"_ls);
+        }
+    }
+    for (const auto &id : m_roomImages.keys()) {
+        for (const auto &image : m_roomImages[id]) {
+            if (image.shortcode == shortCode) {
+                const auto pack = m_roomPacks[id.first][id.second];
+                return pack.type == ImagePackDescription::Sticker || pack.type == ImagePackDescription::Both;
+            }
+        }
+    }
+    return true;
+}
+
+QString ImageContentManager::accountImagesAvatar() const
+{
+    if (!connection->hasAccountData("im.ponies.user_emotes"_ls)) {
+        return {};
+    }
+    const auto &event = ImagePackEventContent(connection->accountData("im.ponies.user_emotes"_ls)->contentJson());
+    QString avatarUrl;
+    if (event.pack) {
+        avatarUrl = event.pack->avatarUrl.value_or(QUrl()).toString();
+    }
+    if (avatarUrl.isEmpty()) {
+        //TODO avatarUrl = Controller::instance().activeConnection()->user()->avatarUrl().toString();
+    }
+    if (avatarUrl.isEmpty()) {
+        avatarUrl = event.images[0].url.toString();
+    }
+    return QStringLiteral("👤");
+}

src/imagecontentmanager.h

@@ -0,0 +1,172 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include <QHash>
+#include <QObject>
+#include <QQmlEngine>
+
+#include "events/imagepackevent.h"
+#include "neochatroom.h"
+
+#define imageContentManager ImageContentManager::instance()
+
+class ImageContentRole : public QObject
+{
+    Q_OBJECT
+public:
+    enum ImageRoles {
+        DisplayNameRole = Qt::DisplayRole, /**< The name of the emoji. */
+        EmojiRole, /**< The unicode character of the emoji. */
+        ShortCodeRole,
+        IsCustomRole,
+        IsStickerRole,
+        IsEmojiRole,
+        UsageCountRole,
+        HasTonesRole,
+    };
+    Q_ENUM(ImageRoles);
+};
+
+class ImageContentPackRole : public QObject
+{
+    Q_OBJECT
+    QML_ELEMENT
+    QML_UNCREATABLE("")
+
+public:
+    //! Roles for the various models providing image packs.
+    enum ImagePackRoles {
+        DisplayNameRole = Qt::DisplayRole, //! Textual desription of the pack.
+        IconRole, //! Icon for the pack. For emojis, this is a unicode emoji; For custom emojis and stickers, this is a HTML image.
+        IdentifierRole, //! An internal, mostly opaque identifier for the model.
+        IsEmojiRole, //! Whether this pack contains emojis (including custom). For the account pack, this is true if the pack contains any emojis; for room
+                     //! packs, this *only* considers the pack-level usage parameter
+        IsStickerRole, //! Equivalent to IsEmojiRole, but for stickers.
+        IsEmptyRole, //! Whether this image pack is empty.
+        IsGlobalPackRole, //! Whether this pack is enabled globally.
+    };
+    Q_ENUM(ImagePackRoles);
+};
+
+using RoomImages = QMap<std::pair<QString, QString>, QVector<Quotient::ImagePackEventContent::ImagePackImage>>;
+
+struct Emoji {
+    Q_GADGET
+    Q_PROPERTY(QString text MEMBER text)
+    Q_PROPERTY(QString displayName MEMBER displayName)
+    Q_PROPERTY(QString shortName MEMBER shortName)
+public:
+    QString text;
+    QString displayName;
+    QString shortName;
+};
+Q_DECLARE_METATYPE(Emoji)
+
+struct ImagePackDescription {
+    enum Type {
+        Emoji,
+        CustomEmoji,
+        Sticker,
+        Both,
+    };
+    QString description;
+    QString attribution;
+    QString icon;
+    Type type;
+    // Only relevant for packs coming from rooms
+    QString roomId;
+    QString stateKey;
+};
+
+/**
+ * This class manages emojis, custom emojis, and stickers. Because naming things is hard, it has the most generic name possible.
+ */
+class ImageContentManager : public QObject
+{
+    Q_OBJECT
+    QML_ELEMENT
+    QML_SINGLETON
+
+public:
+    // Returns the global instance of ImageContentManager.
+    static ImageContentManager &instance()
+    {
+        static ImageContentManager _instance;
+        return _instance;
+    }
+
+    //! Returns a list of emoji packs (categories, e.g., food, smileys, etc.)
+    const QVector<ImagePackDescription> &emojiPacks() const;
+    //! Returns a map roomId -> stateKey -> description for all image packs that exist in rooms.
+    const QMap<QString, QMap<QString, ImagePackDescription>> &roomImagePacks() const;
+    //! Returns an list (roomId, stateKey) for all globally enabled room packs.
+    //! This is not filtered for rooms or stateKeys that do not exist. This is left to ImagePacksProxyModel
+    const QVector<std::pair<QString, QString>> &globalPacks() const;
+
+    //! Returns a map pack key -> [emoji] for all (normal) emojis.
+    const QHash<QString, QVector<Emoji>> &emojis() const;
+
+    //! Returns a list of all account images.
+    const QVector<Quotient::ImagePackEventContent::ImagePackImage> &accountImages() const;
+
+    //! Returns a map roomId -> stateKey -> [image] of all images part of a room image pack.
+    const RoomImages &roomImages() const;
+
+    //! Returns a map emoji -> usage count to be used as an emoji history.
+    const QMap<QString, uint32_t> &recentEmojis() const;
+
+    //! Returns the emoji object for the given unicode symbol.
+    Emoji emojiForText(const QString &text);
+
+    //! Updates the history when an emoji is used.
+    Q_INVOKABLE void emojiUsed(const QString &text);
+
+    QString mxcForShortCode(const QString &shortcode) const;
+    QString bodyForShortCode(const QString &shortcode) const;
+    bool isEmojiShortCode(const QString &shortCode) const;
+    bool isStickerShortCode(const QString &shortCode) const;
+
+    QString accountImagesAvatar() const;
+
+Q_SIGNALS:
+    void accountImagesChanged();
+    void recentEmojisChanged();
+    void roomImagePacksChanged(NeoChatRoom *room);
+    void globalPacksChanged();
+
+private:
+    // Packs
+    QVector<ImagePackDescription> m_emojiPacks;
+    // [roomId, stateKey]
+    QVector<std::pair<QString, QString>> m_globalPacks;
+    // roomId -> stateKey -> description
+    QMap<QString, QMap<QString, ImagePackDescription>> m_roomPacks;
+
+    // Emojis
+    // pack name -> emojis
+    QHash<QString, QVector<Emoji>> m_emojis;
+    QVector<Quotient::ImagePackEventContent::ImagePackImage> m_accountImages;
+    RoomImages m_roomImages;
+
+    // History
+    // emoji -> usage count
+    QMap<QString, uint32_t> m_usages;
+
+    // Loads both emojis and emoji packs
+    void loadEmojis();
+    void loadGlobalPacks();
+    void loadRoomImagePacks(NeoChatRoom *room);
+
+    void loadEmojiHistory();
+
+    void loadAccountImages();
+    void loadRoomImages();
+
+    ImageContentManager(QObject *parent = nullptr);
+
+    void setupConnection();
+    void setupRoom(NeoChatRoom *room);
+    void cleanupRoom(NeoChatRoom *room);
+};

src/main.cpp

@@ -62,6 +62,8 @@
 #include "fakerunner.h"
 #endif
 
+#include "imagecontentmanager.h"
+
 #ifdef Q_OS_WINDOWS
 #include <Windows.h>
 #endif

src/models/accountemoticonmodel.h

@@ -1,104 +0,0 @@
-// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
-// SPDX-License-Identifier: LGPL-2.0-or-later
-
-#pragma once
-
-#include "events/imagepackevent.h"
-
-#include <QAbstractListModel>
-#include <QCoroTask>
-#include <QList>
-#include <QObject>
-#include <QPointer>
-#include <QQmlEngine>
-
-class NeoChatConnection;
-
-/**
- * @class AccountEmoticonModel
- *
- * This class defines the model for visualising the account stickers and emojis.
- *
- * This is based upon the im.ponies.user_emotes spec (MSC2545).
- */
-class AccountEmoticonModel : public QAbstractListModel
-{
-    Q_OBJECT
-    QML_ELEMENT
-
-    /**
-     * @brief The connection to get emoticons from.
-     */
-    Q_PROPERTY(NeoChatConnection *connection READ connection WRITE setConnection NOTIFY connectionChanged)
-
-public:
-    enum Roles {
-        UrlRole = Qt::UserRole + 1, /**< The URL for the emoticon. */
-        ShortCodeRole, /**< The shortcode for the emoticon. */
-        BodyRole, //**< A textual description of the emoticon */
-        IsStickerRole, //**< Whether this emoticon is a sticker */
-        IsEmojiRole, //**< Whether this emoticon is an emoji */
-    };
-
-    explicit AccountEmoticonModel(QObject *parent = nullptr);
-
-    /**
-     * @brief Number of rows in the model.
-     *
-     * @sa QAbstractItemModel::rowCount
-     */
-    [[nodiscard]] int rowCount(const QModelIndex &index) const override;
-
-    /**
-     * @brief Get the given role value at the given index.
-     *
-     * @sa QAbstractItemModel::data
-     */
-    [[nodiscard]] QVariant data(const QModelIndex &index, int role) const override;
-
-    /**
-     * @brief Returns a mapping from Role enum values to role names.
-     *
-     * @sa Roles, QAbstractItemModel::roleNames()
-     */
-    [[nodiscard]] QHash<int, QByteArray> roleNames() const override;
-
-    [[nodiscard]] NeoChatConnection *connection() const;
-    void setConnection(NeoChatConnection *connection);
-
-    /**
-     * @brief Deletes the emoticon at the given index.
-     */
-    Q_INVOKABLE void deleteEmoticon(int index);
-
-    /**
-     * @brief Changes the description for the emoticon at the given index.
-     */
-    Q_INVOKABLE void setEmoticonBody(int index, const QString &text);
-
-    /**
-     * @brief Changes the shortcode for the emoticon at the given index.
-     */
-    Q_INVOKABLE void setEmoticonShortcode(int index, const QString &shortCode);
-
-    /**
-     * @brief Changes the image for the emoticon at the given index.
-     */
-    Q_INVOKABLE void setEmoticonImage(int index, const QUrl &source);
-
-    /**
-     * @brief Add an emoticon with the given parameters.
-     */
-    Q_INVOKABLE void addEmoticon(const QUrl &source, const QString &shortcode, const QString &description, const QString &type);
-
-Q_SIGNALS:
-    void connectionChanged();
-
-private:
-    std::optional<Quotient::ImagePackEventContent> m_images;
-    QPointer<NeoChatConnection> m_connection;
-    QCoro::Task<void> doSetEmoticonImage(int index, QUrl source);
-    QCoro::Task<void> doAddEmoticon(QUrl source, QString shortcode, QString description, QString type);
-
-    void reloadEmoticons();
-};

src/models/accountimagepackmodel.cpp

@@ -0,0 +1,66 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "accountimagepackmodel.h"
+
+#include <KLocalizedString>
+
+#include "imagecontentmanager.h"
+
+QVariant AccountImagePackModel::data(const QModelIndex &index, int role) const
+{
+    Q_UNUSED(index);
+    if (role == ImageContentPackRole::DisplayNameRole) {
+        return i18n("Your Emojis");
+    }
+    if (role == ImageContentPackRole::IconRole) {
+        return imageContentManager.accountImagesAvatar();
+    }
+    if (role == ImageContentPackRole::IdentifierRole) {
+        return QStringLiteral("account");
+    }
+    if (role == ImageContentPackRole::IsEmojiRole) {
+        for (const auto &image : imageContentManager.accountImages()) {
+            if (!image.usage || image.usage->isEmpty() || image.usage->contains(QStringLiteral("emoticon"))) {
+                return true;
+            }
+        }
+        return false;
+    }
+    if (role == ImageContentPackRole::IsStickerRole) {
+        for (const auto &image : imageContentManager.accountImages()) {
+            if (!image.usage || image.usage->isEmpty() || image.usage->contains(QStringLiteral("sticker"))) {
+                return true;
+            }
+        }
+        return false;
+    }
+    if (role == ImageContentPackRole::IsEmptyRole) {
+        return imageContentManager.accountImages().size() == 0;
+    }
+    return {};
+}
+
+int AccountImagePackModel::rowCount(const QModelIndex &index) const
+{
+    Q_UNUSED(index);
+    return ImageContentManager::instance().accountImages().size() > 0 ? 1 : 0;
+}
+
+QHash<int, QByteArray> AccountImagePackModel::roleNames() const
+{
+    return {
+        {ImageContentPackRole::DisplayNameRole, "displayName"},
+        {ImageContentPackRole::IconRole, "emoji"},
+        {ImageContentPackRole::IdentifierRole, "identifier"},
+    };
+}
+
+AccountImagePackModel::AccountImagePackModel(QObject *parent)
+    : QAbstractListModel(parent)
+{
+    connect(&ImageContentManager::instance(), &ImageContentManager::accountImagesChanged, this, [this]() {
+        beginResetModel();
+        endResetModel();
+    });
+}

src/models/accountimagepackmodel.h

@@ -0,0 +1,38 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include <QAbstractListModel>
+
+class AccountImagePackModel : public QAbstractListModel
+{
+    Q_OBJECT
+
+    /**
+     * Note: This model uses the ImagePackRoles from ImageContentManager as roles.
+     */
+public:
+    explicit AccountImagePackModel(QObject *parent = nullptr);
+
+    /**
+     * @brief Get the given role value at the given index.
+     *
+     * @sa QAbstractItemModel::data
+     */
+    [[nodiscard]] QVariant data(const QModelIndex &index, int role) const override;
+
+    /**
+     * @brief Number of rows in the model.
+     *
+     * @sa QAbstractItemModel::rowCount
+     */
+    [[nodiscard]] int rowCount(const QModelIndex &index) const override;
+
+    /**
+     * @brief Returns a mapping from Role enum values to role names.
+     *
+     * @sa Roles, QAbstractItemModel::roleNames()
+     */
+    [[nodiscard]] QHash<int, QByteArray> roleNames() const override;
+};

src/models/allimagecontentmodel.cpp

@@ -0,0 +1,56 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "allimagecontentmodel.h"
+
+#include "imagecontentmanager.h"
+
+// TODO custom emojis
+
+AllImageContentModel::AllImageContentModel(QObject *parent)
+    : QAbstractListModel(parent)
+{
+    // TODO connect to custom emojis changing;
+}
+
+QVariant AllImageContentModel::data(const QModelIndex &index, int role) const
+{
+    auto row = index.row();
+    for (const auto &category : ImageContentManager::instance().emojis()) {
+        if (row >= category.size()) {
+            row -= category.size();
+            continue;
+        }
+        if (role == ImageContentRole::DisplayNameRole) {
+            return category[row].displayName;
+        }
+        if (role == ImageContentRole::EmojiRole) {
+            return category[row].text;
+        }
+        if (role == ImageContentRole::IsStickerRole) {
+            return false;
+        }
+        if (role == ImageContentRole::IsEmojiRole) {
+            return true;
+        }
+    }
+    return {};
+}
+
+int AllImageContentModel::rowCount(const QModelIndex &index) const
+{
+    Q_UNUSED(index);
+    auto sum = 0;
+    for (const auto &category : ImageContentManager::instance().emojis()) {
+        sum += category.size();
+    }
+    return sum;
+}
+
+QHash<int, QByteArray> AllImageContentModel::roleNames() const
+{
+    return {
+        {ImageContentRole::DisplayNameRole, "displayName"},
+        {ImageContentRole::EmojiRole, "text"},
+    };
+}

src/models/allimagecontentmodel.h

@@ -0,0 +1,35 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include <QAbstractListModel>
+
+class AllImageContentModel : public QAbstractListModel
+{
+    Q_OBJECT
+
+public:
+    explicit AllImageContentModel(QObject *parent = nullptr);
+
+    /**
+     * @brief Get the given role value at the given index.
+     *
+     * @sa QAbstractItemModel::data
+     */
+    [[nodiscard]] QVariant data(const QModelIndex &index, int role) const override;
+
+    /**
+     * @brief Number of rows in the model.
+     *
+     * @sa QAbstractItemModel::rowCount
+     */
+    [[nodiscard]] int rowCount(const QModelIndex &index) const override;
+
+    /**
+     * @brief Returns a mapping from Role enum values to role names.
+     *
+     * @sa Roles, QAbstractItemModel::roleNames()
+     */
+    [[nodiscard]] QHash<int, QByteArray> roleNames() const override;
+};

src/models/completionmodel.cpp

@@ -6,8 +6,7 @@
 
 #include "actionsmodel.h"
 #include "completionproxymodel.h"
-#include "customemojimodel.h"
-#include "emojimodel.h"
+// #include "emojimodel.h"
 #include "neochatroom.h"
 #include "roommanager.h"
 #include "userlistmodel.h"
@@ -16,11 +15,13 @@ CompletionModel::CompletionModel(QObject *parent)
     : QAbstractListModel(parent)
     , m_filterModel(new CompletionProxyModel())
     , m_userListModel(RoomManager::instance().userListModel())
-    , m_emojiModel(new QConcatenateTablesProxyModel(this))
+//, m_emojiModel(new QConcatenateTablesProxyModel(this))
 {
     connect(this, &CompletionModel::textChanged, this, &CompletionModel::updateCompletion);
-    m_emojiModel->addSourceModel(&CustomEmojiModel::instance());
-    m_emojiModel->addSourceModel(&EmojiModel::instance());
+    connect(this, &CompletionModel::roomChanged, this, [this]() {
+        m_userListModel->setRoom(m_room);
+    });
+    // TODO m_emojiModel->addSourceModel(&EmojiModel::instance());
 }
 
 QString CompletionModel::text() const
@@ -88,20 +89,20 @@ QVariant CompletionModel::data(const QModelIndex &index, int role) const
             return m_filterModel->data(filterIndex, RoomListModel::AvatarRole).toString();
         }
     }
-    if (m_autoCompletionType == Emoji) {
-        if (role == DisplayNameRole) {
-            return m_filterModel->data(filterIndex, CustomEmojiModel::DisplayRole);
-        }
-        if (role == IconNameRole) {
-            return m_filterModel->data(filterIndex, CustomEmojiModel::MxcUrl);
-        }
-        if (role == ReplacedTextRole) {
-            return m_filterModel->data(filterIndex, CustomEmojiModel::ReplacedTextRole);
-        }
-        if (role == SubtitleRole) {
-            return m_filterModel->data(filterIndex, EmojiModel::DescriptionRole);
-        }
-    }
+    // if (m_autoCompletionType == Emoji) {
+    //     if (role == DisplayNameRole) {
+    //         return m_filterModel->data(filterIndex, CustomEmojiModel::DisplayRole);
+    //     }
+    //     if (role == IconNameRole) {
+    //         return m_filterModel->data(filterIndex, CustomEmojiModel::MxcUrl);
+    //     }
+    //     if (role == ReplacedTextRole) {
+    //         return m_filterModel->data(filterIndex, CustomEmojiModel::ReplacedTextRole);
+    //     }
+    //     if (role == SubtitleRole) {
+    //         // TODO return m_filterModel->data(filterIndex, EmojiModel::DescriptionRole);
+    //     }
+    // }
 
     return {};
 }
@@ -147,8 +148,8 @@ void CompletionModel::updateCompletion()
                    || (m_fullText.indexOf(QLatin1Char(' ')) != -1 && m_fullText.indexOf(QLatin1Char(':'), 1) > m_fullText.indexOf(QLatin1Char(' '), 1)))) {
         m_filterModel->setSourceModel(m_emojiModel);
         m_autoCompletionType = Emoji;
-        m_filterModel->setFilterRole(CustomEmojiModel::Name);
-        m_filterModel->setSecondaryFilterRole(EmojiModel::DescriptionRole);
+        // m_filterModel->setFilterRole(CustomEmojiModel::Name);
+        //  TODO m_filterModel->setSecondaryFilterRole(EmojiModel::DescriptionRole);
         m_filterModel->setFullText(m_fullText);
         m_filterModel->setFilterText(m_text);
         m_filterModel->invalidate();

src/models/customemojimodel.h

@@ -1,116 +0,0 @@
-// SPDX-FileCopyrightText: 2021 Carson Black <uhhadd@gmail.com>
-// SPDX-License-Identifier: GPL-2.0-or-later
-
-#pragma once
-
-#include <QAbstractListModel>
-#include <QQmlEngine>
-#include <QRegularExpression>
-
-#include "neochatconnection.h"
-
-struct CustomEmoji {
-    QString name; // with :semicolons:
-    QString url; // mxc://
-    QRegularExpression regexp;
-
-    Q_GADGET
-    Q_PROPERTY(QString unicode MEMBER url)
-    Q_PROPERTY(QString name MEMBER name)
-};
-
-/**
- * @class CustomEmojiModel
- *
- * This class defines the model for custom user emojis.
- *
- * This is based upon the im.ponies.user_emotes spec (MSC2545).
- */
-class CustomEmojiModel : public QAbstractListModel
-{
-    Q_OBJECT
-    QML_ELEMENT
-    QML_SINGLETON
-
-    Q_PROPERTY(NeoChatConnection *connection READ connection WRITE setConnection NOTIFY connectionChanged)
-
-public:
-    /**
-     * @brief Defines the model roles.
-     */
-    enum Roles {
-        Name = Qt::DisplayRole, /**< The name of the emoji. */
-        ImageURL, /**< The URL for the custom emoji. */
-        ModelData, /**< for emulating the regular emoji model's usage, otherwise the UI code would get too complicated. */
-        MxcUrl = 50, /**< The mxc source URL for the custom emoji. */
-        DisplayRole = 51, /**< The name of the emoji. For compatibility with EmojiModel. */
-        ReplacedTextRole = 52, /**< The name of the emoji. For compatibility with EmojiModel. */
-        DescriptionRole = 53, /**< Invalid, reserved. For compatibility with EmojiModel. */
-    };
-    Q_ENUM(Roles)
-
-    static CustomEmojiModel &instance()
-    {
-        static CustomEmojiModel _instance;
-        return _instance;
-    }
-    static CustomEmojiModel *create(QQmlEngine *engine, QJSEngine *)
-    {
-        engine->setObjectOwnership(&instance(), QQmlEngine::CppOwnership);
-        return &instance();
-    }
-
-    /**
-     * @brief Get the given role value at the given index.
-     *
-     * @sa QAbstractItemModel::data
-     */
-    QVariant data(const QModelIndex &idx, int role = Qt::DisplayRole) const override;
-
-    /**
-     * @brief Number of rows in the model.
-     *
-     * @sa  QAbstractItemModel::rowCount
-     */
-    int rowCount(const QModelIndex &parent = QModelIndex()) const override;
-
-    /**
-     * @brief Returns a mapping from Role enum values to role names.
-     *
-     * @sa Roles, QAbstractItemModel::roleNames()
-     */
-    QHash<int, QByteArray> roleNames() const override;
-
-    /**
-     * @brief Substitute any custom emojis for an image in the input text.
-     */
-    Q_INVOKABLE QString preprocessText(QString text);
-
-    /**
-     * @brief Return a list of custom emojis where the name contains the filter text.
-     */
-    Q_INVOKABLE QVariantList filterModel(const QString &filter);
-
-    /**
-     * @brief Add a new emoji to the model.
-     */
-    Q_INVOKABLE void addEmoji(const QString &name, const QUrl &location);
-
-    /**
-     * @brief Remove an emoji from the model.
-     */
-    Q_INVOKABLE void removeEmoji(const QString &name);
-
-    void setConnection(NeoChatConnection *connection);
-    NeoChatConnection *connection() const;
-
-Q_SIGNALS:
-    void connectionChanged();
-
-private:
-    explicit CustomEmojiModel(QObject *parent = nullptr);
-    QList<CustomEmoji> m_emojis;
-    QPointer<NeoChatConnection> m_connection;
-
-    void fetchEmojis();
-};

src/models/emojipacksmodel.cpp

@@ -0,0 +1,56 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "emojipacksmodel.h"
+
+#include <QDebug>
+
+#include <KLocalizedString>
+
+#include "imagecontentmanager.h"
+
+EmojiPacksModel::EmojiPacksModel(QObject *parent)
+    : QAbstractListModel(parent)
+{
+}
+
+QVariant EmojiPacksModel::data(const QModelIndex &index, int role) const
+{
+    const auto row = index.row();
+
+    const auto &category = ImageContentManager::instance().emojiPacks()[row];
+    if (role == ImageContentPackRole::DisplayNameRole) {
+        return category.description;
+    }
+    if (role == ImageContentPackRole::IconRole) {
+        return category.icon;
+    }
+    if (role == ImageContentPackRole::IdentifierRole) {
+        return category.stateKey;
+    }
+    if (role == ImageContentPackRole::IsStickerRole) {
+        return false;
+    }
+    if (role == ImageContentPackRole::IsEmojiRole) {
+        return true;
+    }
+    if (role == ImageContentPackRole::IsEmptyRole) {
+        return false;
+    }
+    return {};
+}
+
+int EmojiPacksModel::rowCount(const QModelIndex &index) const
+{
+    Q_UNUSED(index);
+    return ImageContentManager::instance().emojiPacks().count();
+}
+
+QHash<int, QByteArray> EmojiPacksModel::roleNames() const
+{
+    return {
+        {ImageContentPackRole::DisplayNameRole, "displayName"},
+        {ImageContentPackRole::IconRole, "icon"},
+        {ImageContentPackRole::IdentifierRole, "identifier"},
+    };
+}

src/models/emojipacksmodel.h

@@ -0,0 +1,35 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include <QAbstractListModel>
+
+class EmojiPacksModel : public QAbstractListModel
+{
+    Q_OBJECT
+
+public:
+    explicit EmojiPacksModel(QObject *parent = nullptr);
+
+    /**
+     * @brief Get the given role value at the given index.
+     *
+     * @sa QAbstractItemModel::data
+     */
+    [[nodiscard]] QVariant data(const QModelIndex &index, int role) const override;
+
+    /**
+     * @brief Number of rows in the model.
+     *
+     * @sa QAbstractItemModel::rowCount
+     */
+    [[nodiscard]] int rowCount(const QModelIndex &index) const override;
+
+    /**
+     * @brief Returns a mapping from Role enum values to role names.
+     *
+     * @sa Roles, QAbstractItemModel::roleNames()
+     */
+    [[nodiscard]] QHash<int, QByteArray> roleNames() const override;
+};

src/models/emoticonfiltermodel.cpp

@@ -1,57 +0,0 @@
-// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
-// SPDX-License-Identifier: GPL-2.0-or-later
-
-#include "emoticonfiltermodel.h"
-
-#include "accountemoticonmodel.h"
-#include "stickermodel.h"
-
-EmoticonFilterModel::EmoticonFilterModel(QObject *parent)
-    : QSortFilterProxyModel(parent)
-{
-    connect(this, &EmoticonFilterModel::sourceModelChanged, this, [this]() {
-        if (dynamic_cast<StickerModel *>(sourceModel())) {
-            m_stickerRole = StickerModel::IsStickerRole;
-            m_emojiRole = StickerModel::IsEmojiRole;
-        } else {
-            m_stickerRole = AccountEmoticonModel::IsStickerRole;
-            m_emojiRole = AccountEmoticonModel::IsEmojiRole;
-        }
-    });
-}
-
-bool EmoticonFilterModel::filterAcceptsRow(int sourceRow, const QModelIndex &sourceParent) const
-{
-    Q_UNUSED(sourceParent);
-    auto stickerUsage = sourceModel()->data(sourceModel()->index(sourceRow, 0), m_stickerRole).toBool();
-    auto emojiUsage = sourceModel()->data(sourceModel()->index(sourceRow, 0), m_emojiRole).toBool();
-    return (stickerUsage && m_showStickers) || (emojiUsage && m_showEmojis);
-}
-
-bool EmoticonFilterModel::showStickers() const
-{
-    return m_showStickers;
-}
-
-void EmoticonFilterModel::setShowStickers(bool showStickers)
-{
-    beginResetModel();
-    m_showStickers = showStickers;
-    endResetModel();
-    Q_EMIT showStickersChanged();
-}
-
-bool EmoticonFilterModel::showEmojis() const
-{
-    return m_showEmojis;
-}
-
-void EmoticonFilterModel::setShowEmojis(bool showEmojis)
-{
-    beginResetModel();
-    m_showEmojis = showEmojis;
-    endResetModel();
-    Q_EMIT showEmojisChanged();
-}
-
-#include "moc_emoticonfiltermodel.cpp"

src/models/historyimagepackmodel.cpp

@@ -0,0 +1,53 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "historyimagepackmodel.h"
+
+#include <KLocalizedString>
+
+#include "imagecontentmanager.h"
+
+QVariant HistoryImagePackModel::data(const QModelIndex &index, int role) const
+{
+    Q_UNUSED(index);
+    if (role == ImageContentPackRole::DisplayNameRole) {
+        return i18n("History");
+    }
+    if (role == ImageContentPackRole::IconRole) {
+        return QStringLiteral("⌛");
+    }
+    if (role == ImageContentPackRole::IdentifierRole) {
+        return QStringLiteral("history");
+    }
+    if (role == ImageContentPackRole::IsStickerRole) {
+        return true;
+    }
+    if (role == ImageContentPackRole::IsEmojiRole) {
+        return true;
+    }
+    if (role == ImageContentPackRole::IsEmptyRole) {
+        //TODO listen?
+        return imageContentManager.recentEmojis().size() == 0;
+    }
+    return {};
+}
+
+int HistoryImagePackModel::rowCount(const QModelIndex &index) const
+{
+    Q_UNUSED(index);
+    return 1;
+}
+
+QHash<int, QByteArray> HistoryImagePackModel::roleNames() const
+{
+    return {
+        {ImageContentPackRole::DisplayNameRole, "displayName"},
+        {ImageContentPackRole::IconRole, "emoji"},
+        {ImageContentPackRole::IdentifierRole, "identifier"},
+    };
+}
+
+HistoryImagePackModel::HistoryImagePackModel(QObject *parent)
+    : QAbstractListModel(parent)
+{
+}

src/models/historyimagepackmodel.h

@@ -0,0 +1,35 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include <QAbstractListModel>
+
+class HistoryImagePackModel : public QAbstractListModel
+{
+    Q_OBJECT
+
+public:
+    explicit HistoryImagePackModel(QObject *parent = nullptr);
+
+    /**
+     * @brief Get the given role value at the given index.
+     *
+     * @sa QAbstractItemModel::data
+     */
+    [[nodiscard]] QVariant data(const QModelIndex &index, int role) const override;
+
+    /**
+     * @brief Number of rows in the model.
+     *
+     * @sa QAbstractItemModel::rowCount
+     */
+    [[nodiscard]] int rowCount(const QModelIndex &index) const override;
+
+    /**
+     * @brief Returns a mapping from Role enum values to role names.
+     *
+     * @sa Roles, QAbstractItemModel::roleNames()
+     */
+    [[nodiscard]] QHash<int, QByteArray> roleNames() const override;
+};

src/models/imagecontentfiltermodel.cpp

@@ -0,0 +1,91 @@
+// SPDX-FileCopyrightText: 2024 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "imagecontentfiltermodel.h"
+
+#include "imagecontentmanager.h"
+
+ImageContentFilterModel::ImageContentFilterModel(QObject *parent)
+    : QSortFilterProxyModel(parent)
+{
+    updateSourceModel();
+}
+
+bool ImageContentFilterModel::filterAcceptsRow(int sourceRow, const QModelIndex &sourceParent) const
+{
+    Q_UNUSED(sourceParent);
+    auto index = sourceModel()->index(sourceRow, 0);
+    return ((index.data(ImageContentRole::IsEmojiRole).toBool() && emojis()) || (index.data(ImageContentRole::IsStickerRole).toBool() && stickers()))
+        && sourceModel()->index(sourceRow, 0).data(ImageContentRole::DisplayNameRole).toString().contains(m_searchText, Qt::CaseInsensitive);
+}
+
+bool ImageContentFilterModel::stickers() const
+{
+    return m_stickers;
+}
+
+void ImageContentFilterModel::setStickers(bool stickers)
+{
+    m_stickers = stickers;
+    Q_EMIT stickersChanged();
+    invalidateFilter();
+}
+
+bool ImageContentFilterModel::emojis() const
+{
+    return m_emojis;
+}
+
+void ImageContentFilterModel::setEmojis(bool emojis)
+{
+    m_emojis = emojis;
+    Q_EMIT emojisChanged();
+    invalidateFilter();
+}
+
+void ImageContentFilterModel::setCategory(const QString &category)
+{
+    if (category == m_category) {
+        return;
+    }
+    m_category = category;
+    Q_EMIT categoryChanged();
+    updateSourceModel();
+}
+
+QString ImageContentFilterModel::category() const
+{
+    return m_category;
+}
+
+void ImageContentFilterModel::setSearchText(const QString &searchText)
+{
+    if (searchText == m_searchText) {
+        return;
+    }
+    m_searchText = searchText;
+    Q_EMIT searchTextChanged();
+    invalidateFilter();
+    updateSourceModel();
+}
+
+QString ImageContentFilterModel::searchText() const
+{
+    return m_searchText;
+}
+
+void ImageContentFilterModel::updateSourceModel()
+{
+    if (!m_searchText.isEmpty()) {
+        if (sourceModel() != &m_allImageContentModel) {
+            setSourceModel(&m_allImageContentModel);
+        }
+    } else if (m_category == QStringLiteral("history")) {
+        setSourceModel(&m_recentImageContentProxyModel);
+    } else {
+        if (sourceModel() != &m_imageContentModel) {
+            setSourceModel(&m_imageContentModel);
+        }
+        m_imageContentModel.setCategory(m_category);
+    }
+}

src/models/imagecontentfiltermodel.h

@@ -0,0 +1,57 @@
+// SPDX-FileCopyrightText: 2024 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include <QSortFilterProxyModel>
+#include <QQmlEngine>
+
+#include "allimagecontentmodel.h"
+#include "imagecontentmodel.h"
+#include "recentimagecontentproxymodel.h"
+
+class ImageContentFilterModel : public QSortFilterProxyModel
+{
+    Q_OBJECT
+    QML_ELEMENT
+
+    Q_PROPERTY(bool stickers READ stickers WRITE setStickers NOTIFY stickersChanged)
+    Q_PROPERTY(bool emojis READ emojis WRITE setEmojis NOTIFY emojisChanged)
+    Q_PROPERTY(QString category READ category WRITE setCategory NOTIFY categoryChanged)
+    Q_PROPERTY(QString searchText READ searchText WRITE setSearchText NOTIFY searchTextChanged)
+
+public:
+    explicit ImageContentFilterModel(QObject *parent = nullptr);
+
+    bool filterAcceptsRow(int sourceRow, const QModelIndex &sourceParent) const override;
+
+    [[nodiscard]] bool stickers() const;
+    void setStickers(bool stickers);
+
+    [[nodiscard]] bool emojis() const;
+    void setEmojis(bool emojis);
+
+    QString category() const;
+    void setCategory(const QString &category);
+
+    QString searchText() const;
+    void setSearchText(const QString &text);
+
+Q_SIGNALS:
+    void stickersChanged();
+    void emojisChanged();
+    void categoryChanged();
+    void searchTextChanged();
+
+private:
+    bool m_stickers = true;
+    bool m_emojis = true;
+    QString m_category;
+    QString m_searchText;
+
+    AllImageContentModel m_allImageContentModel;
+    RecentImageContentProxyModel m_recentImageContentProxyModel;
+    ImageContentModel m_imageContentModel;
+
+    void updateSourceModel();
+};

src/models/imagecontentmodel.cpp

@@ -0,0 +1,164 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "imagecontentmodel.h"
+
+#include <QDebug>
+
+#include <Quotient/connection.h>
+
+#include "controller.h"
+#include "imagecontentmanager.h"
+
+ImageContentModel::ImageContentModel(QObject *parent)
+    : QAbstractListModel(parent)
+{
+}
+
+int ImageContentModel::rowCount(const QModelIndex &parent) const
+{
+    Q_UNUSED(parent);
+    if (m_category == QStringLiteral("account")) {
+        return imageContentManager.accountImages().size();
+    }
+    if (m_category.contains(u'@')) {
+        return imageContentManager.roomImages()[{m_roomId, m_stateKey}].size();
+    }
+    return imageContentManager.emojis()[m_category].count();
+}
+
+QVariant ImageContentModel::emojiData(int row, int role) const
+{
+    const auto emoji = imageContentManager.emojis()[m_category][row];
+    if (role == ImageContentRole::DisplayNameRole) {
+        return emoji.displayName;
+    }
+    if (role == ImageContentRole::EmojiRole) {
+        return emoji.text;
+    }
+    if (role == ImageContentRole::IsCustomRole) {
+        return false;
+    }
+    if (role == ImageContentRole::IsEmojiRole) {
+        return true;
+    }
+    if (role == ImageContentRole::IsStickerRole) {
+        return false;
+    }
+    if (role == ImageContentRole::HasTonesRole) {
+        return true; // TODO
+    }
+    return {};
+}
+
+QVariant ImageContentModel::accountData(int row, int role) const
+{
+    const auto &image = imageContentManager.accountImages()[row];
+    if (role == ImageContentRole::DisplayNameRole) {
+        return image.shortcode;
+    }
+    if (role == ImageContentRole::EmojiRole) {
+        return QStringLiteral("<img src=\"%1\" height=\"32\" width=\"32\"/>")
+            .arg(Controller::instance().activeConnection()->makeMediaUrl(image.url).toString());
+    }
+    if (role == ImageContentRole::ShortCodeRole) {
+        return image.shortcode;
+    }
+    if (role == ImageContentRole::IsCustomRole) {
+        return true;
+    }
+    if (role == ImageContentRole::IsEmojiRole) {
+        return !image.usage || image.usage->isEmpty() || image.usage->contains(QStringLiteral("emoticon"));
+    }
+    if (role == ImageContentRole::IsStickerRole) {
+        return !image.usage || image.usage->isEmpty() || image.usage->contains(QStringLiteral("sticker"));
+    }
+    return {};
+}
+
+QVariant ImageContentModel::roomData(int row, int role) const
+{
+    const auto image = imageContentManager.roomImages()[{m_roomId, m_stateKey}][row];
+    if (role == ImageContentRole::DisplayNameRole) {
+        return image.shortcode;
+    }
+    if (role == ImageContentRole::EmojiRole) {
+        return QStringLiteral("<img src=\"%1\" height=\"32\" width=\"32\"/>")
+            .arg(Controller::instance().activeConnection()->makeMediaUrl(image.url).toString());
+    }
+    if (role == ImageContentRole::ShortCodeRole) {
+        return image.shortcode;
+    }
+    if (role == ImageContentRole::IsCustomRole) {
+        return true;
+    }
+    if (role == ImageContentRole::IsEmojiRole) {
+        return true; // For room image packs, we're ignoring the usage of the individual images.
+    }
+    if (role == ImageContentRole::IsStickerRole) {
+        return true;
+    }
+    return {};
+}
+
+QVariant ImageContentModel::data(const QModelIndex &index, int role) const
+{
+    const auto &row = index.row();
+    if (m_category == QStringLiteral("account")) {
+        return accountData(row, role);
+    }
+    if (m_category.contains(u'@')) {
+        return roomData(row, role);
+    }
+    return emojiData(row, role);
+}
+
+QHash<int, QByteArray> ImageContentModel::roleNames() const
+{
+    return {
+        {ImageContentRole::DisplayNameRole, "displayName"},
+        {ImageContentRole::EmojiRole, "text"},
+        {ImageContentRole::ShortCodeRole, "shortCode"},
+        {ImageContentRole::IsCustomRole, "isCustom"},
+        {ImageContentRole::IsStickerRole, "isSticker"},
+        {ImageContentRole::IsEmojiRole, "isEmoji"},
+        {ImageContentRole::HasTonesRole, "hasTones"},
+    };
+}
+
+QString ImageContentModel::category() const
+{
+    return m_category;
+}
+
+void ImageContentModel::setCategory(const QString &category)
+{
+    if (category == m_category) {
+        return;
+    }
+
+    beginResetModel();
+    m_category = category;
+    if (m_category.contains(u'@')) {
+        const auto &split = m_category.split(u'@');
+        m_roomId = split[0];
+        m_stateKey = split[1];
+    } else {
+        m_roomId = QString();
+        m_stateKey = QString();
+    }
+    endResetModel();
+
+    if (m_category == QStringLiteral("account")) {
+        connect(&ImageContentManager::instance(), &ImageContentManager::accountImagesChanged, this, [this]() {
+            beginResetModel();
+            endResetModel();
+        });
+    } else {
+        disconnect(&ImageContentManager::instance(), &ImageContentManager::accountImagesChanged, this, nullptr);
+    }
+
+    Q_EMIT categoryChanged();
+}
+
+#include "moc_imagecontentmodel.cpp"

src/models/imagecontentmodel.h

@@ -0,0 +1,60 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include <QAbstractListModel>
+#include <QObject>
+#include <QQmlEngine>
+
+/**
+ * @class ImageContentModel
+ *
+ * This class defines the model for visualising a list of emojis.
+ */
+class ImageContentModel : public QAbstractListModel
+{
+    Q_OBJECT
+    QML_ELEMENT
+
+    Q_PROPERTY(QString category READ category WRITE setCategory NOTIFY categoryChanged)
+
+public:
+    ImageContentModel(QObject *parent = nullptr);
+
+    /**
+     * @brief Get the given role value at the given index.
+     *
+     * @sa QAbstractItemModel::data
+     */
+    [[nodiscard]] QVariant data(const QModelIndex &idx, int role = Qt::DisplayRole) const override;
+
+    /**
+     * @brief Number of rows in the model.
+     *
+     * @sa  QAbstractItemModel::rowCount
+     */
+    [[nodiscard]] int rowCount(const QModelIndex &parent = QModelIndex()) const override;
+
+    /**
+     * @brief Returns a mapping from Role enum values to role names.
+     *
+     * @sa RoleNames, QAbstractItemModel::roleNames()
+     */
+    [[nodiscard]] QHash<int, QByteArray> roleNames() const override;
+
+    [[nodiscard]] QString category() const;
+    void setCategory(const QString &category);
+
+    QVariant emojiData(int row, int role) const;
+    QVariant accountData(int row, int role) const;
+    QVariant roomData(int row, int role) const;
+
+Q_SIGNALS:
+    void categoryChanged();
+
+private:
+    QString m_category;
+    QString m_roomId;
+    QString m_stateKey;
+};

src/models/imagepackroomsmodel.cpp

@@ -0,0 +1,68 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "imagepackroomsmodel.h"
+
+#include <Quotient/connection.h>
+#include <Quotient/room.h>
+
+#include "controller.h"
+#include "imagecontentmanager.h"
+
+using namespace Quotient;
+
+ImagePackRoomsModel::ImagePackRoomsModel(QObject *parent)
+    : QAbstractListModel(parent)
+{
+    connect(&imageContentManager, &ImageContentManager::globalPacksChanged, this, [this]() {
+        beginResetModel();
+        endResetModel();
+    });
+}
+
+QVariant ImagePackRoomsModel::data(const QModelIndex &index, int role) const
+{
+    const auto &row = index.row();
+    const auto &packKey = imageContentManager.globalPacks()[row];
+    if (!imageContentManager.roomImagePacks().contains(packKey.first) || !imageContentManager.roomImagePacks()[packKey.first].contains(packKey.second)) {
+        return false;
+    }
+    const auto &pack = imageContentManager.roomImagePacks()[packKey.first][packKey.second];
+    if (role == ImageContentPackRole::DisplayNameRole) {
+        return pack.description;
+    }
+    if (role == ImageContentPackRole::IconRole) {
+        return pack.icon;
+    }
+    if (role == ImageContentPackRole::IdentifierRole) {
+        return QStringLiteral("%1@%2").arg(pack.roomId, pack.stateKey);
+    }
+    if (role == ImageContentPackRole::IsStickerRole) {
+        return pack.type == ImagePackDescription::Sticker;
+    }
+    if (role == ImageContentPackRole::IsEmojiRole) {
+        return pack.type == ImagePackDescription::Emoji || pack.type == ImagePackDescription::CustomEmoji;
+    }
+    if (role == ImageContentPackRole::IsEmptyRole) {
+        return imageContentManager.roomImages()[packKey].size() == 0;
+    }
+    if (role == ImageContentPackRole::IsGlobalPackRole) {
+        return true;
+    }
+    return {};
+}
+
+int ImagePackRoomsModel::rowCount(const QModelIndex &index) const
+{
+    Q_UNUSED(index);
+    return imageContentManager.globalPacks().size();
+}
+
+QHash<int, QByteArray> ImagePackRoomsModel::roleNames() const
+{
+    return {
+        {ImageContentPackRole::DisplayNameRole, "displayName"},
+        {ImageContentPackRole::IconRole, "emoji"}, // TODO rename
+        {ImageContentPackRole::IdentifierRole, "identifier"},
+    };
+}

src/models/imagepackroomsmodel.h

@@ -0,0 +1,42 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include "imagecontentmanager.h"
+#include <QAbstractListModel>
+
+/**
+ * Lists the custom emoji/sticker packs from other rooms as marked in the account data.
+ * Not to be confused with the packs for this room (-> RoomEmoticonsCategoryModel)
+ *
+ * Note: This model uses the ImagePackRoles from ImageContentManager as roles.
+ */
+class ImagePackRoomsModel : public QAbstractListModel
+{
+    Q_OBJECT
+
+public:
+    explicit ImagePackRoomsModel(QObject *parent = nullptr);
+
+    /**
+     * @brief Get the given role value at the given index.
+     *
+     * @sa QAbstractItemModel::data
+     */
+    [[nodiscard]] QVariant data(const QModelIndex &index, int role) const override;
+
+    /**
+     * @brief Number of rows in the model.
+     *
+     * @sa QAbstractItemModel::rowCount
+     */
+    [[nodiscard]] int rowCount(const QModelIndex &index) const override;
+
+    /**
+     * @brief Returns a mapping from Role enum values to role names.
+     *
+     * @sa Roles, QAbstractItemModel::roleNames()
+     */
+    [[nodiscard]] QHash<int, QByteArray> roleNames() const override;
+};

src/models/imagepacksmodel.cpp

@@ -1,170 +1,43 @@
-// SPDX-FileCopyrightText: 2021 Tobias Fella <tobias.fella@kde.org>
-// SPDX-License-Identifier: LGPL-2.0-or-later
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
 
 #include "imagepacksmodel.h"
-#include "neochatroom.h"
 
-#include <KLocalizedString>
-
-using namespace Quotient;
+#include "models/accountimagepackmodel.h"
+#include "models/emojipacksmodel.h"
+#include "models/historyimagepackmodel.h"
+#include "models/imagepackroomsmodel.h"
+#include "models/roomimagepacksmodel.h"
 
 ImagePacksModel::ImagePacksModel(QObject *parent)
-    : QAbstractListModel(parent)
+    : QConcatenateTablesProxyModel(parent)
 {
+    addSourceModel(new HistoryImagePackModel(parent));
+    addSourceModel(new AccountImagePackModel(parent));
+    m_roomImagePacksModel = new RoomImagePacksModel(parent);
+    addSourceModel(m_roomImagePacksModel);
+    addSourceModel(new ImagePackRoomsModel(parent));
+    addSourceModel(new EmojiPacksModel(parent));
 }
 
-int ImagePacksModel::rowCount(const QModelIndex &index) const
-{
-    Q_UNUSED(index);
-    return m_events.count();
-}
-
-QVariant ImagePacksModel::data(const QModelIndex &index, int role) const
-{
-    const auto row = index.row();
-    if (row < 0 || row >= m_events.size()) {
-        return {};
-    }
-    const auto &event = m_events[row];
-    if (role == DisplayNameRole) {
-        if (event.pack->displayName) {
-            return *event.pack->displayName;
-        }
-    }
-    if (role == AvatarUrlRole) {
-        if (event.pack->avatarUrl) {
-            return m_room->connection()->makeMediaUrl(*event.pack->avatarUrl);
-        } else if (!event.images.empty()) {
-            return m_room->connection()->makeMediaUrl(event.images[0].url);
-        }
-    }
-    return {};
-}
-
+// TODO required?
 QHash<int, QByteArray> ImagePacksModel::roleNames() const
 {
     return {
-        {DisplayNameRole, "displayName"},
-        {AvatarUrlRole, "avatarUrl"},
-        {AttributionRole, "attribution"},
-        {IdRole, "id"},
+        {ImageContentPackRole::DisplayNameRole, "displayName"},
+        {ImageContentPackRole::IconRole, "icon"},
+        {ImageContentPackRole::IdentifierRole, "identifier"},
     };
 }
 
-NeoChatRoom *ImagePacksModel::room() const
+NeoChatRoom *ImagePacksModel::currentRoom() const
 {
-    return m_room;
+    return m_roomImagePacksModel->currentRoom();
 }
 
-void ImagePacksModel::setRoom(NeoChatRoom *room)
+void ImagePacksModel::setCurrentRoom(NeoChatRoom *currentRoom)
 {
-    if (m_room) {
-        disconnect(m_room, nullptr, this, nullptr);
-        disconnect(m_room->connection(), nullptr, this, nullptr);
-    }
-    m_room = room;
-
-    if (m_room) {
-        connect(m_room->connection(), &Connection::accountDataChanged, this, [this](const QString &type) {
-            if (type == "im.ponies.user_emotes"_ls) {
-                reloadImages();
-            }
-        });
-    }
-    // TODO listen to packs changing
-    reloadImages();
-    Q_EMIT roomChanged();
+    m_roomImagePacksModel->setCurrentRoom(currentRoom);
+    Q_EMIT currentRoomChanged();
 }
 
-void ImagePacksModel::reloadImages()
-{
-    if (!m_room) {
-        return;
-    }
-    beginResetModel();
-    m_events.clear();
-
-    // Load emoticons from the account data
-    if (m_room->connection()->hasAccountData("im.ponies.user_emotes"_ls)) {
-        auto json = m_room->connection()->accountData("im.ponies.user_emotes"_ls)->contentJson();
-        json["pack"_ls] = QJsonObject{
-            {"display_name"_ls,
-             m_showStickers ? i18nc("As in 'The user's own Stickers'", "Own Stickers") : i18nc("As in 'The user's own emojis", "Own Emojis")},
-        };
-        const auto &content = ImagePackEventContent(json);
-        if (!content.images.isEmpty()) {
-            m_events += ImagePackEventContent(json);
-        }
-    }
-
-    // Load emoticons from the saved rooms
-    const auto &accountData = m_room->connection()->accountData("im.ponies.emote_rooms"_ls);
-    if (accountData) {
-        const auto &rooms = accountData->contentJson()["rooms"_ls].toObject();
-        for (const auto &roomId : rooms.keys()) {
-            if (roomId == m_room->id()) {
-                continue;
-            }
-            auto packs = rooms[roomId].toObject();
-            const auto &stickerRoom = m_room->connection()->room(roomId);
-            if (!stickerRoom) {
-                continue;
-            }
-            for (const auto &packKey : packs.keys()) {
-                if (const auto &pack = stickerRoom->currentState().get<ImagePackEvent>(packKey)) {
-                    const auto packContent = pack->content();
-                    if ((!packContent.pack || !packContent.pack->usage || (packContent.pack->usage->contains("emoticon"_ls) && showEmoticons())
-                         || (packContent.pack->usage->contains("sticker"_ls) && showStickers()))
-                        && !packContent.images.isEmpty()) {
-                        m_events += packContent;
-                    }
-                }
-            }
-        }
-    }
-
-    // Load emoticons from the current room
-    auto events = m_room->currentState().eventsOfType("im.ponies.room_emotes"_ls);
-    for (const auto &event : events) {
-        auto packContent = eventCast<const ImagePackEvent>(event)->content();
-        if (packContent.pack.has_value()) {
-            if (!packContent.pack->usage || (packContent.pack->usage->contains("emoticon"_ls) && showEmoticons())
-                || (packContent.pack->usage->contains("sticker"_ls) && showStickers())) {
-                m_events += packContent;
-            }
-        }
-    }
-    Q_EMIT imagesLoaded();
-    endResetModel();
-}
-
-bool ImagePacksModel::showStickers() const
-{
-    return m_showStickers;
-}
-
-void ImagePacksModel::setShowStickers(bool showStickers)
-{
-    m_showStickers = showStickers;
-    Q_EMIT showStickersChanged();
-}
-
-bool ImagePacksModel::showEmoticons() const
-{
-    return m_showEmoticons;
-}
-
-void ImagePacksModel::setShowEmoticons(bool showEmoticons)
-{
-    m_showEmoticons = showEmoticons;
-    Q_EMIT showEmoticonsChanged();
-}
-QList<Quotient::ImagePackEventContent::ImagePackImage> ImagePacksModel::images(int index)
-{
-    if (index < 0 || index >= m_events.size()) {
-        return {};
-    }
-    return m_events[index].images;
-}
-
-#include "moc_imagepacksmodel.cpp"

src/models/imagepacksmodel.h

@@ -1,7 +1,7 @@
-// SPDX-FileCopyrightText: 2021-2023 Tobias Fella <tobias.fella@kde.org>
-// SPDX-License-Identifier: LGPL-2.0-or-later
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
 
-#pragma once
+#include <QConcatenateTablesProxyModel>
 
 #include "events/imagepackevent.h"
 #include <QAbstractListModel>
@@ -9,95 +9,26 @@
 #include <QPointer>
 #include <QQmlEngine>
 
-class NeoChatRoom;
+#include "neochatroom.h"
 
-/**
- * @class ImagePacksModel
- *
- * Defines the model for visualising image packs.
- *
- * See Matrix MSC2545 for more details on image packs.
- * https://github.com/Sorunome/matrix-doc/blob/soru/emotes/proposals/2545-emotes.md
- */
-class ImagePacksModel : public QAbstractListModel
+class RoomImagePacksModel;
+
+class ImagePacksModel : public QConcatenateTablesProxyModel
 {
     Q_OBJECT
     QML_ELEMENT
 
-    /**
-     * @brief The current room that the model is being used in.
-     */
-    Q_PROPERTY(NeoChatRoom *room READ room WRITE setRoom NOTIFY roomChanged)
-
-    /**
-     * @brief Whether sticker image packs should be shown.
-     */
-    Q_PROPERTY(bool showStickers READ showStickers WRITE setShowStickers NOTIFY showStickersChanged)
-
-    /**
-     * @brief Whether emoticon image packs should be shown.
-     */
-    Q_PROPERTY(bool showEmoticons READ showEmoticons WRITE setShowEmoticons NOTIFY showEmoticonsChanged)
+    Q_PROPERTY(NeoChatRoom *currentRoom READ currentRoom WRITE setCurrentRoom NOTIFY currentRoomChanged)
 
 public:
-    /**
-     * @brief Defines the model roles.
-     */
-    enum Roles {
-        DisplayNameRole = Qt::DisplayRole, /**< The display name of the image pack. */
-        AvatarUrlRole, /**< The source mxc URL for the pack avatar. */
-        AttributionRole, /**< The attribution for the pack author(s). */
-        IdRole, /**< The ID of the image pack. */
-    };
-    Q_ENUM(Roles)
-
-    explicit ImagePacksModel(QObject *parent = nullptr);
-
-    /**
-     * @brief Get the given role value at the given index.
-     *
-     * @sa QAbstractItemModel::data
-     */
-    [[nodiscard]] QVariant data(const QModelIndex &index, int role) const override;
-
-    /**
-     * @brief Number of rows in the model.
-     *
-     * @sa QAbstractItemModel::rowCount
-     */
-    [[nodiscard]] int rowCount(const QModelIndex &index) const override;
-
-    /**
-     * @brief Returns a mapping from Role enum values to role names.
-     *
-     * @sa Roles, QAbstractItemModel::roleNames()
-     */
-    [[nodiscard]] QHash<int, QByteArray> roleNames() const override;
-
-    [[nodiscard]] NeoChatRoom *room() const;
-    void setRoom(NeoChatRoom *room);
-
-    [[nodiscard]] bool showStickers() const;
-    void setShowStickers(bool showStickers);
-
-    [[nodiscard]] bool showEmoticons() const;
-    void setShowEmoticons(bool showEmoticons);
-
-    /**
-     * @brief Return a vector of the images in the pack at the given index.
-     */
-    [[nodiscard]] QList<Quotient::ImagePackEventContent::ImagePackImage> images(int index);
+    ImagePacksModel(QObject *parent = nullptr);
+    QHash<int, QByteArray> roleNames() const override;
+    [[nodiscard]] NeoChatRoom *currentRoom() const;
+    void setCurrentRoom(NeoChatRoom *currentRoom);
 
 Q_SIGNALS:
-    void roomChanged();
-    void showStickersChanged();
-    void showEmoticonsChanged();
-    void imagesLoaded();
+    void currentRoomChanged();
 
 private:
-    QPointer<NeoChatRoom> m_room;
-    QList<Quotient::ImagePackEventContent> m_events;
-    bool m_showStickers = true;
-    bool m_showEmoticons = true;
-    void reloadImages();
+    RoomImagePacksModel *m_roomImagePacksModel = nullptr;
 };

src/models/imagepacksproxymodel.cpp

@@ -0,0 +1,67 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "imagepacksproxymodel.h"
+
+#include "imagecontentmanager.h"
+#include "imagepacksmodel.h"
+#include "neochatroom.h"
+
+ImagePacksProxyModel::ImagePacksProxyModel(QObject *parent)
+    : QSortFilterProxyModel(parent)
+{
+    setSourceModel(new ImagePacksModel(this));
+}
+
+bool ImagePacksProxyModel::filterAcceptsRow(int sourceRow, const QModelIndex &sourceParent) const
+{
+    Q_UNUSED(sourceParent);
+    const auto &identifier = sourceModel()->data(sourceModel()->index(sourceRow, 0), ImageContentPackRole::IdentifierRole).toString();
+    if (identifier.contains(u'@')) {
+        const auto roomId = identifier.split(u'@')[0];
+        if (static_cast<ImagePacksModel *>(sourceModel())->currentRoom() && roomId == static_cast<ImagePacksModel *>(sourceModel())->currentRoom()->id()
+            && sourceModel()->data(sourceModel()->index(sourceRow, 0), ImageContentPackRole::IsGlobalPackRole).toBool()) {
+            // Hide this pack, as it's already exposed as a global pack
+            return false;
+        }
+    }
+    return ((sourceModel()->data(sourceModel()->index(sourceRow, 0), ImageContentPackRole::IsEmojiRole).toBool() && emojis())
+            || (sourceModel()->data(sourceModel()->index(sourceRow, 0), ImageContentPackRole::IsStickerRole).toBool() && stickers()));
+}
+
+bool ImagePacksProxyModel::stickers() const
+{
+    return m_stickers;
+}
+
+void ImagePacksProxyModel::setStickers(bool stickers)
+{
+    m_stickers = stickers;
+    Q_EMIT stickersChanged();
+    invalidateFilter();
+}
+
+bool ImagePacksProxyModel::emojis() const
+{
+    return m_emojis;
+}
+
+void ImagePacksProxyModel::setEmojis(bool emojis)
+{
+    m_emojis = emojis;
+    Q_EMIT emojisChanged();
+    invalidateFilter();
+}
+
+NeoChatRoom *ImagePacksProxyModel::currentRoom() const
+{
+    return static_cast<ImagePacksModel *>(sourceModel())->currentRoom();
+}
+
+void ImagePacksProxyModel::setCurrentRoom(NeoChatRoom *currentRoom)
+{
+    beginResetModel();
+    static_cast<ImagePacksModel *>(sourceModel())->setCurrentRoom(currentRoom);
+    endResetModel();
+    Q_EMIT currentRoomChanged();
+}

src/models/imagepacksproxymodel.h

@@ -0,0 +1,43 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include <QSortFilterProxyModel>
+#include <QQmlEngine>
+
+class NeoChatRoom;
+
+/**
+ * Filters image packs on whether they contain stickers or emojis, depending on the respective properties
+ */
+class ImagePacksProxyModel : public QSortFilterProxyModel
+{
+    Q_OBJECT
+    QML_ELEMENT
+
+    Q_PROPERTY(bool stickers READ stickers WRITE setStickers NOTIFY stickersChanged)
+    Q_PROPERTY(bool emojis READ emojis WRITE setEmojis NOTIFY emojisChanged)
+    Q_PROPERTY(NeoChatRoom *currentRoom READ currentRoom WRITE setCurrentRoom NOTIFY currentRoomChanged)
+
+public:
+    explicit ImagePacksProxyModel(QObject *parent = nullptr);
+
+    bool filterAcceptsRow(int sourceRow, const QModelIndex &sourceParent) const override;
+
+    [[nodiscard]] bool stickers() const;
+    void setStickers(bool stickers);
+
+    [[nodiscard]] bool emojis() const;
+    void setEmojis(bool emojis);
+
+    [[nodiscard]] NeoChatRoom *currentRoom() const;
+    void setCurrentRoom(NeoChatRoom *currentRoom);
+
+Q_SIGNALS:
+    void stickersChanged();
+    void emojisChanged();
+    void currentRoomChanged();
+
+private:
+    bool m_stickers = true;
+    bool m_emojis = true;
+};

src/models/recentimagecontentmodel.cpp

@@ -0,0 +1,73 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "recentimagecontentmodel.h"
+
+#include "imagecontentmanager.h"
+
+RecentImageContentModel::RecentImageContentModel(QObject *parent)
+    : QAbstractListModel(parent)
+{
+    connect(&ImageContentManager::instance(), &ImageContentManager::recentEmojisChanged, this, [this]() {
+        beginResetModel();
+        endResetModel();
+    });
+}
+
+QVariant RecentImageContentModel::data(const QModelIndex &index, int role) const
+{
+    const auto &recent = ImageContentManager::instance().recentEmojis();
+    const auto row = index.row();
+    const bool isCustom = recent.keys()[row].startsWith(QLatin1Char(':'));
+
+    if (role == ImageContentRole::DisplayNameRole) {
+        if (isCustom) {
+            return imageContentManager.bodyForShortCode(recent.keys()[row].mid(1).chopped(1));
+        }
+        return ImageContentManager::instance().emojiForText(recent.keys()[row]).displayName;
+    }
+    if (role == ImageContentRole::EmojiRole) {
+        if (isCustom) {
+            return QStringLiteral("<img src=\"%1\" width=\"32\" height=\"32\"/>")
+                .arg(imageContentManager.mxcForShortCode(recent.keys()[row].mid(1).chopped(1)));
+        }
+        return recent.keys()[row];
+    }
+    if (role == ImageContentRole::UsageCountRole) {
+        return recent[recent.keys()[row]];
+    }
+    if (role == ImageContentRole::ShortCodeRole) {
+        return recent.keys()[row].mid(1).chopped(1);
+    }
+    if (role == ImageContentRole::IsCustomRole) {
+        return isCustom;
+    }
+    if (role == ImageContentRole::IsEmojiRole) {
+        if (!isCustom)
+            return true;
+        return imageContentManager.isEmojiShortCode(recent.keys()[row].mid(1).chopped(1));
+    }
+    if (role == ImageContentRole::IsStickerRole) {
+        if (!isCustom)
+            return false;
+        return imageContentManager.isStickerShortCode(recent.keys()[row].mid(1).chopped(1));
+    }
+    return {};
+}
+
+int RecentImageContentModel::rowCount(const QModelIndex &index) const
+{
+    Q_UNUSED(index);
+    return ImageContentManager::instance().recentEmojis().size();
+}
+
+QHash<int, QByteArray> RecentImageContentModel::roleNames() const
+{
+    return {
+        {ImageContentRole::DisplayNameRole, "displayName"},
+        {ImageContentRole::EmojiRole, "text"},
+        {ImageContentRole::UsageCountRole, "usageCount"},
+        {ImageContentRole::ShortCodeRole, "shortCode"},
+        {ImageContentRole::IsCustomRole, "isCustom"},
+    };
+}

src/models/recentimagecontentmodel.h

@@ -0,0 +1,38 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include <QAbstractListModel>
+
+/**
+ * Lists the previously used emojis in no specific order.
+ */
+class RecentImageContentModel : public QAbstractListModel
+{
+    Q_OBJECT
+
+public:
+    explicit RecentImageContentModel(QObject *parent = nullptr);
+
+    /**
+     * @brief Get the given role value at the given index.
+     *
+     * @sa QAbstractItemModel::data
+     */
+    [[nodiscard]] QVariant data(const QModelIndex &index, int role) const override;
+
+    /**
+     * @brief Number of rows in the model.
+     *
+     * @sa QAbstractItemModel::rowCount
+     */
+    [[nodiscard]] int rowCount(const QModelIndex &index) const override;
+
+    /**
+     * @brief Returns a mapping from Role enum values to role names.
+     *
+     * @sa Roles, QAbstractItemModel::roleNames()
+     */
+    [[nodiscard]] QHash<int, QByteArray> roleNames() const override;
+};

src/models/recentimagecontentproxymodel.cpp

@@ -0,0 +1,19 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "recentimagecontentproxymodel.h"
+
+#include "imagecontentmanager.h"
+#include "recentimagecontentmodel.h"
+
+RecentImageContentProxyModel::RecentImageContentProxyModel(QObject *parent)
+    : QSortFilterProxyModel(parent)
+{
+    setSourceModel(new RecentImageContentModel(this));
+    sort(0);
+}
+
+bool RecentImageContentProxyModel::lessThan(const QModelIndex &sourceLeft, const QModelIndex &sourceRight) const
+{
+    return sourceLeft.data(ImageContentRole::UsageCountRole).toInt() > sourceRight.data(ImageContentRole::UsageCountRole).toInt();
+}

src/models/recentimagecontentproxymodel.h

@@ -0,0 +1,18 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include <QSortFilterProxyModel>
+#include <QQmlEngine>
+
+class RecentImageContentProxyModel : public QSortFilterProxyModel
+{
+    Q_OBJECT
+    QML_ELEMENT
+
+public:
+    explicit RecentImageContentProxyModel(QObject *parent = nullptr);
+
+    bool lessThan(const QModelIndex &sourceLeft, const QModelIndex &sourceRight) const override;
+};

src/models/roomimagepacksmodel.cpp

@@ -0,0 +1,86 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#include "roomimagepacksmodel.h"
+#include "imagecontentmanager.h"
+
+#include "neochatroom.h"
+
+NeoChatRoom *RoomImagePacksModel::currentRoom() const
+{
+    return m_currentRoom;
+}
+
+void RoomImagePacksModel::setCurrentRoom(NeoChatRoom *currentRoom)
+{
+    if (m_currentRoom == currentRoom) {
+        return;
+    }
+    if (m_currentRoom) {
+        disconnect(m_currentRoom, nullptr, this, nullptr);
+    }
+    beginResetModel();
+    m_currentRoom = currentRoom;
+    endResetModel();
+    Q_EMIT currentRoomChanged();
+}
+
+QVariant RoomImagePacksModel::data(const QModelIndex &index, int role) const
+{
+    Q_UNUSED(index);
+    if (!m_currentRoom) {
+        return {};
+    }
+    const auto row = index.row();
+    const auto &packs = ImageContentManager::instance().roomImagePacks()[m_currentRoom->id()].values();
+    const auto &pack = packs[row];
+    if (role == ImageContentPackRole::DisplayNameRole) {
+        return pack.description;
+    }
+    if (role == ImageContentPackRole::IconRole) {
+        return pack.icon;
+    }
+    if (role == ImageContentPackRole::IdentifierRole) {
+        return QStringLiteral("%1@%2").arg(m_currentRoom->id(), pack.stateKey);
+    }
+    if (role == ImageContentPackRole::IsStickerRole) {
+        return pack.type == ImagePackDescription::Sticker || pack.type == ImagePackDescription::Both;
+    }
+    if (role == ImageContentPackRole::IsEmojiRole) {
+        return pack.type == ImagePackDescription::Emoji || pack.type == ImagePackDescription::CustomEmoji || pack.type == ImagePackDescription::Both;
+    }
+    if (role == ImageContentPackRole::IsEmptyRole) {
+        return imageContentManager.roomImages()[{m_currentRoom->id(), pack.stateKey}].isEmpty();
+    }
+    return {};
+}
+
+int RoomImagePacksModel::rowCount(const QModelIndex &index) const
+{
+    Q_UNUSED(index);
+    if (!m_currentRoom) {
+        return {};
+    }
+    return ImageContentManager::instance().roomImagePacks()[m_currentRoom->id()].size();
+}
+
+QHash<int, QByteArray> RoomImagePacksModel::roleNames() const
+{
+    return {
+        {ImageContentPackRole::DisplayNameRole, "displayName"},
+        {ImageContentPackRole::IconRole, "emoji"},
+        {ImageContentPackRole::IdentifierRole, "identifier"},
+    };
+}
+
+RoomImagePacksModel::RoomImagePacksModel(QObject *parent)
+    : QAbstractListModel(parent)
+{
+    connect(&ImageContentManager::instance(), &ImageContentManager::roomImagePacksChanged, this, [this](NeoChatRoom *room) {
+        if (room != m_currentRoom) {
+            return;
+        }
+        beginResetModel();
+        endResetModel();
+    });
+}

src/models/roomimagepacksmodel.h

@@ -0,0 +1,50 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+#pragma once
+
+#include <QAbstractListModel>
+#include <QPointer>
+
+class NeoChatRoom;
+
+/**
+ * Note: This model uses the ImagePackRoles from ImageContentManager as roles.
+ */
+class RoomImagePacksModel : public QAbstractListModel
+{
+    Q_OBJECT
+
+public:
+    explicit RoomImagePacksModel(QObject *parent = nullptr);
+
+    /**
+     * @brief Get the given role value at the given index.
+     *
+     * @sa QAbstractItemModel::data
+     */
+    [[nodiscard]] QVariant data(const QModelIndex &index, int role) const override;
+
+    /**
+     * @brief Number of rows in the model.
+     *
+     * @sa QAbstractItemModel::rowCount
+     */
+    [[nodiscard]] int rowCount(const QModelIndex &index) const override;
+
+    /**
+     * @brief Returns a mapping from Role enum values to role names.
+     *
+     * @sa Roles, QAbstractItemModel::roleNames()
+     */
+    [[nodiscard]] QHash<int, QByteArray> roleNames() const override;
+
+    [[nodiscard]] NeoChatRoom *currentRoom() const;
+    void setCurrentRoom(NeoChatRoom *currentRoom);
+
+Q_SIGNALS:
+    void currentRoomChanged();
+
+private:
+    QPointer<NeoChatRoom> m_currentRoom;
+};

src/qml/EmojiPickerPackHeader.qml

@@ -0,0 +1,60 @@
+// SPDX-FileCopyrightText: 2024 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+import QtQuick
+import QtQuick.Controls as QQC2
+import QtQuick.Layouts
+
+import org.kde.kirigami as Kirigami
+
+import org.kde.neochat
+
+QQC2.ScrollView {
+    id: root
+
+    QQC2.ScrollBar.horizontal.height: QQC2.ScrollBar.horizontal.visible ? QQC2.ScrollBar.horizontal.implicitHeight : 0
+
+    required property var model
+    property int currentIndex: 0
+    readonly property string category: root.model.data(root.model.index(root.currentIndex, 0), ImageContentPackRole.IdentifierRole)
+
+    implicitHeight: Kirigami.Units.iconSizes.large + root.QQC2.ScrollBar.horizontal.height
+
+    ListView {
+        id: categories
+        clip: true
+        focus: true
+        orientation: ListView.Horizontal
+        currentIndex: root.currentIndex
+
+        Keys.onReturnPressed: if (emojiGrid.count > 0) emojiGrid.focus = true
+        Keys.onEnterPressed: if (emojiGrid.count > 0) emojiGrid.focus = true
+
+        KeyNavigation.down: emojiGrid.count > 0 ? emojiGrid : categories
+        KeyNavigation.tab: emojiGrid.count > 0 ? emojiGrid : categories
+
+        keyNavigationEnabled: true
+        keyNavigationWraps: true
+        Keys.forwardTo: searchField
+        interactive: width !== contentWidth
+
+        Component.onCompleted: categories.forceActiveFocus()
+
+        model: root.model
+
+        delegate: EmojiDelegate {
+            id: packDelegate
+            required property string name
+            required property string i18nName
+            width: Kirigami.Units.iconSizes.large
+            height: width
+            checked: categories.currentIndex === model.index
+            toolTip: packDelegate.i18nName
+            text: packDelegate.name
+
+            onClicked: {
+                root.currentIndex = index;
+            }
+        }
+    }
+}

src/qml/EmojiPickerTypeHeader.qml

@@ -0,0 +1,39 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+import QtQuick
+import QtQuick.Controls as QQC2
+import QtQuick.Layouts
+
+import org.kde.kirigami as Kirigami
+
+Kirigami.NavigationTabBar {
+    id: root
+
+    enum EmoticonType {
+        Emoji,
+        Sticker
+    }
+
+    Kirigami.Theme.colorSet: Kirigami.Theme.View
+    property var selectedType: EmojiPickerTypeHeader.EmoticonType.Emoji
+
+    background: null
+    actions: [
+        Kirigami.Action {
+            id: emojis
+            icon.name: "smiley"
+            text: i18n("Emojis")
+            checked: root.selectedType === EmojiPickerTypeHeader.EmoticonType.Emoji
+
+            onTriggered: root.selectedType = EmojiPickerTypeHeader.EmoticonType.Emoji
+        },
+        Kirigami.Action {
+            id: stickers
+            icon.name: "stickers"
+            text: i18n("Stickers")
+            checked: root.selectedType === EmojiPickerTypeHeader.EmoticonType.Sticker
+            onTriggered: root.selectedType = EmojiPickerTypeHeader.EmoticonType.Sticker
+        }
+    ]
+}

src/qml/HoverActions.qml

@@ -156,7 +156,6 @@ QQC2.Control {
         EmojiDialog {
             id: emojiDialog
             currentRoom: root.currentRoom
-            showQuickReaction: true
             onChosen: emoji => {
                 root.currentRoom.toggleReaction(root.delegate.eventId, emoji);
                 if (!Kirigami.Settings.isMobile) {

src/qml/Main.qml

@@ -42,7 +42,6 @@ Kirigami.ApplicationWindow {
     }
 
     onConnectionChanged: {
-        CustomEmojiModel.connection = root.connection;
         SpaceHierarchyCache.connection = root.connection;
         NeoChatSettingsView.connection = root.connection;
         if (ShareHandler.text && root.connection) {
@@ -176,7 +175,6 @@ Kirigami.ApplicationWindow {
     }
 
     Component.onCompleted: {
-        CustomEmojiModel.connection = root.connection;
         SpaceHierarchyCache.connection = root.connection;
         RoomSettingsView.window = root;
         NeoChatSettingsView.window = root;

src/qml/QuickReaction.qml

@@ -0,0 +1,37 @@
+// SPDX-FileCopyrightText: 2023 Tobias Fella <tobias.fella@kde.org>
+// SPDX-License-Identifier: GPL-2.0-or-later
+
+import QtQuick
+import QtQuick.Controls as QQC2
+import QtQuick.Layouts
+
+import org.kde.kirigami as Kirigami
+
+import org.kde.neochat
+
+QQC2.ScrollView {
+    id: root
+
+    signal chosen(string text)
+
+    QQC2.ScrollBar.horizontal.height: QQC2.ScrollBar.horizontal.visible ? QQC2.ScrollBar.horizontal.implicitHeight : 0
+
+    implicitHeight: Kirigami.Units.iconSizes.large + QQC2.ScrollBar.horizontal.height
+
+    ListView {
+        id: quickReactions
+        Layout.fillWidth: true
+
+        model: ["👍", "👎", "😄", "🎉", "😕", "❤", "🚀", "👀"]
+
+        delegate: EmojiDelegate {
+            height: Kirigami.Units.iconSizes.large
+            width: height
+
+            text: modelData
+            onClicked: root.chosen(modelData)
+        }
+
+        orientation: Qt.Horizontal
+    }
+}

src/texthandler.cpp

@@ -18,7 +18,6 @@
 #include <Kirigami/Platform/PlatformTheme>
 
 #include "messagecomponenttype.h"
-#include "models/customemojimodel.h"
 #include "utils.h"
 
 using namespace Qt::StringLiterals;
@@ -81,7 +80,7 @@ QString TextHandler::handleSendText()
         switch (m_nextTokenType) {
         case Text:
             nextTokenBuffer = escapeHtml(nextTokenBuffer);
-            nextTokenBuffer = CustomEmojiModel::instance().preprocessText(nextTokenBuffer);
+            //TODO: nextTokenBuffer = CustomEmojiModel::instance().preprocessText(nextTokenBuffer);
             break;
         case TextCode:
             nextTokenBuffer = escapeHtml(nextTokenBuffer);

tools/update-emojis.py

@@ -1,102 +0,0 @@
-#!/bin/python
-
-# SPDX-FileCopyrightText: 2022 Tobias Fella <tobias.fella@kde.org>
-# SPDX-FileCopyrightText: 2022 Gary Wang <wzc782970009@gmail.com>
-# SPDX-License-Identifier: BSD-2-Clause
-
-import requests
-import re
-
-
-def escape_sequence(unicode_str: str, codepoint_spliter: str) -> str:
-    codepoints = unicode_str.split(codepoint_spliter)
-    escape_sequence = ""
-    for codepoint in codepoints:
-        escape_sequence += "\\U" + codepoint.rjust(8, "0")
-    return escape_sequence
-
-
-# GitLab uses the emoji shortnames from Gemojione
-# See also: https://docs.gitlab.com/ee/development/fe_guide/emojis.html
-gemojione = requests.get('https://raw.githubusercontent.com/bonusly/gemojione/master/config/index.json')
-emoji_unicode_shortname_map = {}
-gemojione_json = gemojione.json()
-for (shortcode, props) in gemojione_json.items():
-    escaped_sequence = escape_sequence(props['unicode'], "-")
-    emoji_unicode_shortname_map[escaped_sequence] = shortcode
-
-
-response = requests.get('https://unicode.org/Public/emoji/14.0/emoji-test.txt')
-group = ""
-file = open("../src/emojis.h", "w")
-# REUSE-IgnoreStart
-file.write("// SPDX-FileCopyrightText: None\n")
-file.write("// SPDX-License-Identifier: LGPL-2.0-or-later\n")
-# REUSE-IgnoreEnd
-file.write("// This file is auto-generated. All changes will be lost. See tools/update-emojis.py\n")
-file.write("// clang-format off\n")
-
-tones_file = open("../src/emojitones_data.h", "w")
-# REUSE-IgnoreStart
-tones_file.write("// SPDX-FileCopyrightText: None\n")
-tones_file.write("// SPDX-License-Identifier: LGPL-2.0-or-later\n")
-# REUSE-IgnoreEnd
-tones_file.write("// This file is auto-generated. All changes will be lost. See tools/update-emojis.py\n")
-tones_file.write("// clang-format off\n")
-
-for line in response.text.split("\n"):
-    if line.startswith("# group"):
-        raw_group = line.split(": ")[1]
-        if raw_group == "Activities":
-            group = "Activities"
-        elif raw_group == "Animals & Nature":
-            group = "Nature"
-        elif raw_group == "Component":
-            group = "Component"
-        elif raw_group == "Flags":
-            group = "Flags"
-        elif raw_group == "Food & Drink":
-            group = "Food"
-        elif raw_group == "Objects":
-            group = "Objects"
-        elif raw_group == "People & Body":
-            group = "People"
-        elif raw_group == "Smileys & Emotion":
-            group = "Smileys"
-        elif raw_group == "Symbols":
-            group = "Symbols"
-        elif raw_group == "Travel & Places":
-            group = "Travel"
-        else:
-            print("Unknown group:" + group)
-            group = ""
-    elif line.startswith("#") or line == "":
-        pass
-    else:
-        parts = line.split(";")
-        first = parts[0].strip()
-        escaped_sequence = escape_sequence(first, " ")
-
-        x = re.search(".*E[0-9]+.[0-9] ", parts[1])
-        description = parts[1].removeprefix(x.group())
-        shortcode = description
-        if "flag:" in description:
-            description = "Flag of " + description.split(": ")[1]
-
-        if "unqualified" in line or "minimally-qualified" in line:
-            continue
-
-        is_skin_tone = "skin tone" in description
-
-        if escaped_sequence in emoji_unicode_shortname_map:
-            shortcode = emoji_unicode_shortname_map[escaped_sequence]
-
-        emoji_args = 'QString::fromUtf8("{0}"), QStringLiteral("{1}"), QStringLiteral("{2}")'.format(escaped_sequence, shortcode, description)
-        emoji_qvariant = 'QVariant::fromValue(Emoji{' + emoji_args + '})'
-
-        if is_skin_tone:
-            tones_file.write("{QStringLiteral(\"" + description.split(":")[0] + "\"), " + emoji_qvariant + "},\n")
-            continue
-        file.write("_emojis[" + group + "].append(" + emoji_qvariant + ");\n")
-file.close()
-tones_file.close()