From e6bdaac6fe2858968fe47c1a87c96b332c2dc27f Mon Sep 17 00:00:00 2001
From: Alexander Mohr <git@mohr.io>
Date: Wed, 21 May 2025 20:42:47 +0200
Subject: [PATCH] improve emoji browser

---
 styles/emoji/config         |  9 +++++
 styles/emoji/style.css      | 69 +++++++++++++++++++++++++++++++++++++
 worf/src/lib/config.rs      |  9 +++++
 worf/src/lib/modes/emoji.rs | 12 ++++---
 4 files changed, 95 insertions(+), 4 deletions(-)
 create mode 100644 styles/emoji/config
 create mode 100644 styles/emoji/style.css

diff --git a/styles/emoji/config b/styles/emoji/config
new file mode 100644
index 0000000..217d52a
--- /dev/null
+++ b/styles/emoji/config
@@ -0,0 +1,9 @@
+image_size=64
+columns=6
+orientation="Vertical"
+row_bow_orientation="Vertical"
+content_halign="Center"
+height="70%"
+width="60%"
+valign="Start"
+emoji_hide_label=true
diff --git a/styles/emoji/style.css b/styles/emoji/style.css
new file mode 100644
index 0000000..115dce8
--- /dev/null
+++ b/styles/emoji/style.css
@@ -0,0 +1,69 @@
+* {
+  font-family: DejaVu;
+}
+
+#window {
+  all: unset;
+  background-color: rgba(33, 33, 33, 0.8); /* Matches #212121BB */
+  border-radius: 0;
+}
+
+#window #outer-box {
+  /* The name of the search bar */
+  /* The name of the scrolled window containing all of the entries */
+  border: 2px solid rgba(63, 81, 181, 1);
+  border-radius: 6px;
+}
+
+#window #outer-box #input {
+  background-color: rgba(32, 32, 32, 0.6);
+  color: #f2f2f2;
+  border-bottom: 2px solid rgba(214, 174, 0, 1);
+  padding: 0.8rem 1rem;
+  font-size: 1rem;
+}
+
+#window #outer-box #input:focus, #window #outer-box #input:focus-visible, #window #outer-box #input:active {
+  all: unset;
+  background-color: rgba(32, 32, 32, 0.6);
+  color: #f2f2f2;
+  border-bottom: 2px solid rgba(214, 174, 2, 1);
+  font-size: 1rem;
+}
+
+#window #outer-box #scroll #inner-box #entry {
+  color: #fff;
+  background-color: rgba(32, 32, 32, 0.1);
+  padding: 1rem;
+  margin: 1rem;
+  border-radius: 0.5rem;
+  border-bottom: 5px solid rgba(32, 32, 32, 0.1);
+  font-size: 4rem;
+
+}
+#window #outer-box #scroll #inner-box #entry #img {
+  margin-right: 0.5rem;
+}
+
+#window #outer-box #scroll #inner-box #entry:selected {
+  color: #fff;
+  background-color: rgba(255, 255, 255, 0.1);
+  outline: none;
+  border-bottom: 5px solid rgba(214, 174, 0, 1);
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
+#row:hover {
+  background-color:  rgba(255, 255, 255, 0);
+  outline: inherit;
+}
+#window #outer-box #scroll #inner-box #entry:hover {
+  background-color: rgba(255, 255, 255, 0.1);
+  outline: inherit;
+}
+
+#text {
+  margin-top: 1rem;
+  margin-bottom: 0;
+}
diff --git a/worf/src/lib/config.rs b/worf/src/lib/config.rs
index 4a05a6d..34501a4 100644
--- a/worf/src/lib/config.rs
+++ b/worf/src/lib/config.rs
@@ -333,6 +333,10 @@ pub struct Config {
 
     #[clap(long = "line-wrap")]
     line_wrap: Option<WrapMode>,
+
+    /// Display only icon in emoji mode
+    #[clap(long = "emoji-hide-string")]
+    emoji_hide_label: Option<bool>,
 }
 
 impl Config {
@@ -510,6 +514,11 @@ impl Config {
     pub fn sort_order(&self) -> SortOrder {
         self.sort_order.clone().unwrap_or(SortOrder::Alphabetical)
     }
+
+    #[must_use]
+    pub fn emoji_hide_label(&self) -> bool {
+        self.emoji_hide_label.unwrap_or(false)
+    }
 }
 
 fn default_false() -> bool {
diff --git a/worf/src/lib/modes/emoji.rs b/worf/src/lib/modes/emoji.rs
index 16f12a0..6485ab1 100644
--- a/worf/src/lib/modes/emoji.rs
+++ b/worf/src/lib/modes/emoji.rs
@@ -11,15 +11,19 @@ pub(crate) struct EmojiProvider<T: Clone> {
 }
 
 impl<T: Clone> EmojiProvider<T> {
-    pub(crate) fn new(data: T, sort_order: &SortOrder) -> Self {
+    pub(crate) fn new(data: T, sort_order: &SortOrder, hide_label: &bool) -> Self {
         let emoji = emoji::search::search_annotation_all("");
         let mut menus = emoji
             .into_iter()
             .map(|e| {
                 MenuItem::new(
-                    format!("{} — Category: {} — Name: {}", e.glyph, e.group, e.name),
+                    if *hide_label {
+                      e.glyph.to_string()
+                    } else {
+                        format!("{} — Category: {} — Name: {}", e.glyph, e.group, e.name)
+                    },
                     None,
-                    Some(format!("emoji {}", e.glyph)),
+                    Some(format!("emoji {} — Category: {} — Name: {}", e.glyph, e.group, e.name)),
                     vec![],
                     None,
                     0.0,
@@ -51,7 +55,7 @@ impl<T: Clone> ItemProvider<T> for EmojiProvider<T> {
 ///
 /// Forwards errors from the gui. See `gui::show` for details.
 pub fn show(config: &Config) -> Result<(), Error> {
-    let provider = EmojiProvider::new(0, &config.sort_order());
+    let provider = EmojiProvider::new(0, &config.sort_order(), &config.emoji_hide_label());
     let selection_result = gui::show(config.clone(), provider, true, None, None)?;
     match selection_result.menu.action {
         None => Err(Error::MissingAction),