display by category

src/main.rs

@@ -13,6 +13,7 @@ use rocket::{get, routes, Request, Response, State};
 use serde::Deserialize;
 use std::io::Cursor;
 use std::str::FromStr;
+use std::collections::BTreeMap;
 
 #[rocket::launch]
 fn rocket() -> _ {
@@ -54,6 +55,8 @@ impl<T: Template> Responder<'_, 'static> for Html<T> {
 struct Emojo {
     shortcode: String,
     url: String,
+    #[serde(default)]
+    category: Option<String>,
     static_url: String,
     visible_in_picker: Option<bool>,
 }
@@ -63,7 +66,7 @@ struct Emojo {
 struct Output {
     instance: String,
     show_animated: bool,
-    emojo: Vec<Emojo>,
+    emojo: BTreeMap<String, Vec<Emojo>>,
 }
 
 #[get("/<instance>?<show_all>&<show_animated>")]
@@ -97,10 +100,16 @@ async fn instance(
         emojo.retain(|x| x.visible_in_picker.unwrap_or(true));
     }
 
+    let mut emojo_by_category: BTreeMap<String, Vec<Emojo>> = BTreeMap::new();
+    for emoj in emojo {
+        let category = emoj.category.clone().unwrap_or("(No category)".to_string());
+        emojo_by_category.entry(category).or_default().push(emoj);
+    }
+
     Ok(Html(Output {
         instance,
         show_animated,
-        emojo,
+        emojo: emojo_by_category,
     }))
 }
 

templates/emojo.html

@@ -5,23 +5,24 @@
     <b>{{ instance }}</b> emojo list<br>
     click/touch to copy to clipboard
 </p>
-<dl class="emojo">
-    {% if show_animated %}
-        {% for emoj in emojo %}
-        <div>
-            <dt><img src="{{ emoj.url }}" alt=":{{ emoj.shortcode }}:" loading=lazy></dt>
-            <dd>:{{ emoj.shortcode }}:</dd>
-        </div>
+{% for category in emojo.keys() %}
+    <h2 id={{ category }}>{{ category }}</h2>
+    <dl class="emojo">
+        {% for emoj in emojo[category] %}
+            {% if show_animated %}
+            <div>
+                <dt><img src="{{ emoj.url }}" alt=":{{ emoj.shortcode }}:" loading=lazy></dt>
+                <dd>:{{ emoj.shortcode }}:</dd>
+            </div>
+            {% else %}
+            <div>
+                <dt><img src="{{ emoj.static_url }}" alt=":{{ emoj.shortcode }}:" loading=lazy></dt>
+                <dd>:{{ emoj.shortcode }}:</dd>
+            </div>
+            {% endif %}
         {% endfor %}
-    {% else %}
-        {% for emoj in emojo %}
-        <div>
-            <dt><img src="{{ emoj.static_url }}" alt=":{{ emoj.shortcode }}:" loading=lazy></dt>
-            <dd>:{{ emoj.shortcode }}:</dd>
-        </div>
-        {% endfor %}
-    {% endif %}
-</dl>
+    </dl>
+{% endfor %}
 {% endblock body %}
 {% block script %}
 <script src="/static/copy.js"></script>