Add membership perks

Gemfile

@@ -80,6 +80,11 @@ gem "flamegraph"
 
 gem "skylight"
 
+gem "airrecord"
+
+# For activity logging
+gem "public_activity"
+
 group :development, :test do
   # See https://guides.rubyonrails.org/debugging_rails_applications.html#debugging-with-the-debug-gem
   gem "debug", platforms: %i[ mri windows ], require: "debug/prelude"

Gemfile.lock

@@ -79,6 +79,10 @@ GEM
       uri (>= 0.13.1)
     addressable (2.8.7)
       public_suffix (>= 2.0.2, < 7.0)
+    airrecord (1.0.12)
+      faraday (>= 1.0, < 3.0)
+      faraday-net_http_persistent
+      net-http-persistent
     ast (2.4.2)
     avo (3.19.3)
       actionview (>= 6.1)
@@ -108,7 +112,7 @@ GEM
     brakeman (7.0.2)
       racc
     builder (3.3.0)
-    bullet (8.0.3)
+    bullet (8.0.4)
       activesupport (>= 3.0.0)
       uniform_notifier (~> 1.11)
     capybara (3.40.0)
@@ -123,7 +127,7 @@ GEM
     childprocess (5.1.0)
       logger (~> 1.5)
     concurrent-ruby (1.3.5)
-    connection_pool (2.5.0)
+    connection_pool (2.5.1)
     crass (1.0.6)
     date (3.4.1)
     debug (1.10.0)
@@ -151,6 +155,9 @@ GEM
       multipart-post (~> 2.0)
     faraday-net_http (3.4.0)
       net-http (>= 0.5.0)
+    faraday-net_http_persistent (2.3.0)
+      faraday (~> 2.5)
+      net-http-persistent (>= 4.0.4, < 5)
     ffi (1.17.1-aarch64-linux-gnu)
     ffi (1.17.1-aarch64-linux-musl)
     ffi (1.17.1-arm-linux-gnu)
@@ -252,6 +259,8 @@ GEM
     multipart-post (2.4.1)
     net-http (0.6.0)
       uri
+    net-http-persistent (4.0.5)
+      connection_pool (~> 2.2)
     net-imap (0.5.6)
       date
       net-protocol
@@ -304,6 +313,11 @@ GEM
     psych (5.2.3)
       date
       stringio
+    public_activity (3.0.1)
+      actionpack (>= 6.1.0)
+      activerecord (>= 6.1)
+      i18n (>= 0.5.0)
+      railties (>= 6.1.0)
     public_suffix (6.0.1)
     puma (6.6.0)
       nio4r (~> 2.0)
@@ -491,6 +505,7 @@ PLATFORMS
 
 DEPENDENCIES
   activerecord-import
+  airrecord
   avo (>= 3.2.1)
   avo-record_link_field (~> 0.0.2)
   bootsnap
@@ -511,6 +526,7 @@ DEPENDENCIES
   paper_trail
   pg
   propshaft
+  public_activity
   puma (>= 5.0)
   query_count
   rack-cors

app/assets/stylesheets/application.css

@@ -11,15 +11,21 @@
 
 @import "https://uchu.style/color.css";
 @import "https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css";
+@import "membership.css";
 
 /* colors */
 
 :root {
   --muted-color: var(--uchu-gray);
   --black: rgb(42, 42, 42);
   --smoke: rgb(242, 242, 242);
-  /* color: var(--black); */
-  /* background-color: var(--smoke); */
+
+  /* Status colors */
+  --basic-color: #1fa0eb;
+  --bronze-color: #CD7F32;
+  --silver-color: #E8E8E8;
+  --gold-color: #FFD700;
+  --diamond-color: #B9F2FF;
 }
 
 :root.development {
@@ -295,19 +301,40 @@
 
 .avatar-container {
   position: relative;
-  cursor: pointer;
-  transition: transform 0.2s ease;
-  z-index: 1;
-  margin-left: -15px;
+  display: inline-block;
 }
 
-.avatar-container:first-child {
-  margin-left: 0;
+.avatar-container .status-icon {
+  position: absolute;
+  bottom: -3px;
+  right: -3px;
+  width: 16px;
+  height: 16px;
+  margin: 0;
+}
+
+.avatar-container .status-icon.basic { 
+  fill: var(--basic-color);
 }
 
-.avatar-container:hover {
-  transform: translateY(-3px);
-  z-index: 5;
+.avatar-container .status-icon.bronze { 
+  fill: var(--bronze-color);
+}
+
+.avatar-container .status-icon.silver { 
+  fill: var(--silver-color);
+}
+
+.avatar-container .status-icon.gold { 
+  fill: var(--gold-color);
+}
+
+.avatar-container .status-icon.diamond { 
+  fill: var(--diamond-color);
+}
+
+.avatar-container:first-child {
+  margin-left: 0;
 }
 
 .setup-avatar {
@@ -477,3 +504,33 @@
 code {
   word-break: break-word;
 }
+
+/* Status icons in membership index */
+.status-card .status-icon {
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  margin-bottom: 1rem;
+  border: 2px solid white;
+  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+}
+
+.status-card .status-icon.basic { 
+  background: var(--basic-color);
+}
+
+.status-card .status-icon.bronze { 
+  background: var(--bronze-color);
+}
+
+.status-card .status-icon.silver { 
+  background: var(--silver-color);
+}
+
+.status-card .status-icon.gold { 
+  background: var(--gold-color);
+}
+
+.status-card .status-icon.diamond { 
+  background: var(--diamond-color);
+}

app/assets/stylesheets/flash.css

@@ -52,8 +52,7 @@ footer a:hover {
 }
 
 .impersonate-link {
-  color: #cc5555 !important;
-  font-weight: bold;
+  color: var(--primary-color) !important;
 }
 
 @media (prefers-color-scheme: dark) {
@@ -64,8 +63,4 @@ footer a:hover {
   footer:hover {
     color: rgba(220, 220, 220, 0.9);
   }
-
-  .impersonate-link {
-    color: #ff9999 !important;
-  }
 }