FEATURE: Use event category's color for calendar event

app/serializers/discourse_post_event/event_serializer.rb

@@ -27,6 +27,7 @@ class EventSerializer < ApplicationSerializer
     attributes :reminders
     attributes :recurrence
     attributes :minimal
+    attributes :category_color
 
     def can_act_on_discourse_post_event
       scope.can_act_on_discourse_post_event?(object)
@@ -128,5 +129,9 @@ def should_display_invitees
       (object.public? && object.invitees.count > 0) ||
         (object.private? && object.raw_invitees.count > 0)
     end
+
+    def category_color
+      object.post.topic.category.color
+    end
   end
 end

assets/javascripts/discourse/components/upcoming-events-calendar.js

@@ -48,6 +48,7 @@ export default Component.extend({
           end: ends_at || starts_at,
           allDay: !isNotFullDayEvent(moment(starts_at), moment(ends_at)),
           url: getURL(`/t/-/${post.topic.id}/${post.post_number}`),
+          backgroundColor: `#${event.category_color}`,
         });
       });
 

assets/javascripts/discourse/initializers/discourse-calendar.js

@@ -141,6 +141,7 @@ function initializeDiscourseCalendar(api) {
                 end: ends_at || starts_at,
                 allDay: !isNotFullDayEvent(moment(starts_at), moment(ends_at)),
                 url: getURL(`/t/-/${post.topic.id}/${post.post_number}`),
+                backgroundColor: `#${browsedCategory.color}`,
               });
             });
 

assets/stylesheets/common/upcoming-events-calendar.scss

@@ -98,7 +98,6 @@
   .fc-event,
   .fc-event-dot {
     color: var(--secondary);
-    background-color: var(--tertiary);
     border: 1px solid transparent;
 
     .fc-time {

spec/serializers/discourse_post_event/event_serializer_spec.rb

@@ -12,30 +12,42 @@
     SiteSetting.discourse_post_event_enabled = true
   end
 
-  let(:post_1) { Fabricate(:post) }
-  let(:event_1) { Fabricate(:event, post: post_1, status: Event.statuses[:private]) }
-  let(:invitee_1) { Fabricate(:user) }
-  let(:invitee_2) { Fabricate(:user) }
-  let(:group_1) do
-    Fabricate(:group).tap do |g|
-      g.add(invitee_1)
-      g.add(invitee_2)
-      g.save!
-    end
-  end
+  fab!(:category) { Fabricate(:category, color: "b878e2") }
+  fab!(:topic) { Fabricate(:topic, category: category) }
+  fab!(:post) { Fabricate(:post, topic: topic) }
 
   context "with a private event" do
+    fab!(:private_event) { Fabricate(:event, post: post, status: Event.statuses[:private]) }
+    fab!(:invitee_1) { Fabricate(:user) }
+    fab!(:invitee_2) { Fabricate(:user) }
+    fab!(:group_1) do
+      Fabricate(:group).tap do |g|
+        g.add(invitee_1)
+        g.add(invitee_2)
+        g.save!
+      end
+    end
+
     context "when some invited users have not rsvp-ed yet" do
       before do
-        event_1.update_with_params!(raw_invitees: [group_1.name])
-        Invitee.create_attendance!(invitee_1.id, event_1.id, :going)
-        event_1.reload
+        private_event.update_with_params!(raw_invitees: [group_1.name])
+        Invitee.create_attendance!(invitee_1.id, private_event.id, :going)
+        private_event.reload
       end
 
       it "returns the correct stats" do
-        json = EventSerializer.new(event_1, scope: Guardian.new).as_json
+        json = EventSerializer.new(private_event, scope: Guardian.new).as_json
         expect(json[:event][:stats]).to eq(going: 1, interested: 0, invited: 2, not_going: 0)
       end
     end
   end
+
+  context "with a public event" do
+    fab!(:event) { Fabricate(:event, post: post) }
+
+    it "returns the event category's color" do
+      json = EventSerializer.new(event, scope: Guardian.new).as_json
+      expect(json[:event][:category_color]).to eq(category.color)
+    end
+  end
 end