LibGUI: Create the emoji buttons only once for EmojiInputDialog

To prevent lag when the displayed code points are redrawn in support of
a search box, only create the GUI::Button objects for the emoji a single
time. Re-use those buttons when adding them to the dialog.

Userland/Libraries/LibGUI/EmojiInputDialog.cpp

@@ -20,27 +20,6 @@
 
 namespace GUI {
 
-static Vector<u32> supported_emoji_code_points()
-{
-    Vector<u32> code_points;
-    Core::DirIterator dt("/res/emoji", Core::DirIterator::SkipDots);
-    while (dt.has_next()) {
-        auto filename = dt.next_path();
-        auto lexical_path = LexicalPath(filename);
-        if (lexical_path.extension() != "png")
-            continue;
-        auto basename = lexical_path.basename();
-        if (!basename.starts_with("U+"sv))
-            continue;
-        // FIXME: Handle multi code point emojis.
-        if (basename.contains('_'))
-            continue;
-        u32 code_point = strtoul(basename.to_string().characters() + 2, nullptr, 16);
-        code_points.append(code_point);
-    }
-    return code_points;
-}
-
 EmojiInputDialog::EmojiInputDialog(Window* parent_window)
     : Dialog(parent_window)
 {
@@ -53,7 +32,7 @@ EmojiInputDialog::EmojiInputDialog(Window* parent_window)
 
     auto& scrollable_container = *main_widget.find_descendant_of_type_named<GUI::ScrollableContainerWidget>("scrollable_container"sv);
     m_emojis_widget = main_widget.find_descendant_of_type_named<GUI::Widget>("emojis"sv);
-    m_code_points = supported_emoji_code_points();
+    m_emojis = supported_emoji();
 
     scrollable_container.horizontal_scrollbar().set_visible(false);
     update_displayed_emoji();
@@ -64,19 +43,26 @@ EmojiInputDialog::EmojiInputDialog(Window* parent_window)
     };
 }
 
-void EmojiInputDialog::update_displayed_emoji()
+auto EmojiInputDialog::supported_emoji() -> Vector<Emoji>
 {
     constexpr int button_size = 20;
-    constexpr size_t columns = 18;
-    size_t rows = ceil_div(m_code_points.size(), columns);
-    size_t index = 0;
 
-    for (size_t row = 0; row < rows && index < m_code_points.size(); ++row) {
+    Vector<Emoji> code_points;
-        auto& horizontal_container = m_emojis_widget->add<Widget>();
+    Core::DirIterator dt("/res/emoji", Core::DirIterator::SkipDots);
-        auto& horizontal_layout = horizontal_container.set_layout<HorizontalBoxLayout>();
+    while (dt.has_next()) {
-        horizontal_layout.set_spacing(0);
+        auto filename = dt.next_path();
-        for (size_t column = 0; column < columns; ++column) {
+        auto lexical_path = LexicalPath(filename);
-            if (index < m_code_points.size()) {
+        if (lexical_path.extension() != "png")
+            continue;
+        auto basename = lexical_path.basename();
+        if (!basename.starts_with("U+"sv))
+            continue;
+        // FIXME: Handle multi code point emojis.
+        if (basename.contains('_'))
+            continue;
+
+        u32 code_point = strtoul(basename.to_string().characters() + 2, nullptr, 16);
+
         // FIXME: Also emit U+FE0F for single code point emojis, currently
         // they get shown as text glyphs if available.
         // This will require buttons to don't calculate their length as 2,
@@ -84,15 +70,37 @@ void EmojiInputDialog::update_displayed_emoji()
         // tweaking of the mechanism that is currently being used to insert
         // which is a key event with a single code point.
         StringBuilder builder;
-                builder.append(Utf32View(&m_code_points[index++], 1));
+        builder.append(Utf32View(&code_point, 1));
         auto emoji_text = builder.to_string();
-                auto& button = horizontal_container.add<Button>(emoji_text);
+
-                button.set_fixed_size(button_size, button_size);
+        auto button = Button::construct(move(emoji_text));
-                button.set_button_style(Gfx::ButtonStyle::Coolbar);
+        button->set_fixed_size(button_size, button_size);
-                button.on_click = [this, button = &button](auto) {
+        button->set_button_style(Gfx::ButtonStyle::Coolbar);
+        button->on_click = [this, button = button](auto) {
             m_selected_emoji_text = button->text();
             done(ExecResult::OK);
         };
+
+        code_points.empend(code_point, move(button));
+    }
+
+    return code_points;
+}
+
+void EmojiInputDialog::update_displayed_emoji()
+{
+    constexpr size_t columns = 18;
+    size_t rows = ceil_div(m_emojis.size(), columns);
+    size_t index = 0;
+
+    for (size_t row = 0; row < rows && index < m_emojis.size(); ++row) {
+        auto& horizontal_container = m_emojis_widget->add<Widget>();
+        auto& horizontal_layout = horizontal_container.set_layout<HorizontalBoxLayout>();
+        horizontal_layout.set_spacing(0);
+        for (size_t column = 0; column < columns; ++column) {
+            if (index < m_emojis.size()) {
+                auto& emoji = m_emojis[index++];
+                horizontal_container.add_child(*emoji.button);
             } else {
                 horizontal_container.add<Widget>();
             }

Userland/Libraries/LibGUI/EmojiInputDialog.h

@@ -13,6 +13,11 @@ namespace GUI {
 class EmojiInputDialog final : public Dialog {
     C_OBJECT(EmojiInputDialog);
 
+    struct Emoji {
+        u32 code_point { 0 };
+        RefPtr<Button> button;
+    };
+
 public:
     String const& selected_emoji_text() const { return m_selected_emoji_text; }
 
@@ -20,10 +25,11 @@ private:
     virtual void event(Core::Event&) override;
     explicit EmojiInputDialog(Window* parent_window);
 
+    Vector<Emoji> supported_emoji();
     void update_displayed_emoji();
 
     RefPtr<Widget> m_emojis_widget;
-    Vector<u32> m_code_points;
+    Vector<Emoji> m_emojis;
     String m_selected_emoji_text;
 };