Key emoji for statuses

Gemfile

@@ -52,6 +52,7 @@ gem "jwt"
 gem "lastfm", "~> 1.27"
 gem "mail"
 gem "que"
+gem "unicode-emoji"
 gem "connection_pool"
 gem "omdb-api", "1.4.3", require: false
 gem "image_processing", "~> 1.0"

Gemfile.lock

@@ -488,6 +488,9 @@ GEM
     tzinfo (2.0.6)
       concurrent-ruby (~> 1.0)
     unicode-display_width (2.5.0)
+    unicode-emoji (3.4.0)
+      unicode-version (~> 1.0)
+    unicode-version (1.4.0)
     uri (0.13.0)
     version_gem (1.1.3)
     warning (1.3.0)
@@ -573,6 +576,7 @@ DEPENDENCIES
   standardrb
   time_math2
   timecop
+  unicode-emoji
   warning
   whenever
 

slices/main/decorators/posts/decorator.rb

@@ -5,6 +5,7 @@
 require "rexml/parsers/pullparser"
 require "sanitize"
 require "nokogiri"
+require "unicode/emoji"
 
 module Main
   module Decorators
@@ -54,11 +55,15 @@ module Main
 
         def prefix_emoji
           if name
-            ""
+            nil
           elsif photos? && content == ""
             "📷"
           else
-            "💬"
+            @prefix_emoji ||= if (match = content.match(Unicode::Emoji::REGEX))
+                                match
+                              else
+                                "💬"
+            end
           end
         end
 
@@ -80,7 +85,8 @@ module Main
         end
 
         def raw_content
-          Sanitize.fragment(content)
+          res = Sanitize.fragment(content)
+          res.gsub(prefix_emoji[0], "") if prefix_emoji
         end
 
         def excerpt

slices/main/decorators/statuses/decorator.rb

@@ -11,9 +11,11 @@ module Main
     module Statuses
       class Decorator < Main::Decorators::Posts::Decorator
         def raw_content
-          Sanitize.fragment(content,
+          res = Sanitize.fragment(content,
             elements: ["img", "p"],
             attributes: {"img" => ["alt", "src", "title"]})
+
+          res.gsub(prefix_emoji[0], "") if prefix_emoji
         end
       end
     end

slices/main/templates/shared/_status.html.slim

@@ -1,10 +1,17 @@
 div class="mb-8 h-entry border border-gray-200 m-2 p-4 bg-gray-50 hover:bg-gray-100 dark:border-slate-800 dark:bg-slate-900 dark:hover:bg-slate-950 hover:dark:border-slate-900 rounded"
   a class="border-b-2 border-transparent hover:border-blue-600 hover:border-b-2" href="/post/#{post.slug}"
     div class="e-content prose-p:mb-0 prose-img:my-2 prose-a:text-blue-600 prose-a:no-underline hover:prose-a:underline p-name text-base prose prose-ul:list-none prose-ul:pl-0 prose-li:pl-0 text-gray-800 dark:text-gray-200 prose-a:dark:text-gray-100 mb-4 prose-img:rounded"
-      == " 💬 #{post.raw_content}"
-      div class="grid gap-4 grid-flow-row grid-cols-4 grid-rows-1"
-        -post.photos.each do |photo|
-          img loading="lazy" class="w-32 h-32 object-cover rounded" src=photo["value"]
+      - if post.photos.count == 0 && post.key_image.nil?
+        div class="flex"
+          div class="text-8xl px-8"
+            = post.prefix_emoji
+          div class=""
+            == post.raw_content
+      -else
+        == " #{post.prefix_emoji} #{post.raw_content}"
+        div class="grid gap-4 grid-flow-row grid-cols-4 grid-rows-1"
+          - post.photos.each do |photo|
+            img loading="lazy" class="w-32 h-32 object-cover rounded" src=photo["value"]
     == render "shared/tags", tags: post.tags
 
   div class="mb-8"

slices/main/templates/shared/_tags.html.slim

@@ -1,5 +1,5 @@
 - if tags.count > 0
-  p class="mb-2"
+  p class="mb-2 dark:text-gray-200"
     = "Tagged"
   div class="mb-2 justify-end gap-x-1.5"
     - tags.each do |post_tag|

tailwind.config.js

@@ -25,6 +25,7 @@ module.exports = {
       '3xl': '1.953rem',
       '4xl': '2.441rem',
       '5xl': '3.052rem',
+      '8xl': '6rem',
     },
     extend: {
       gridTemplateColumns: {