Reusable Monthly Calendar

app/controllers/calendar_controller.rb

@@ -0,0 +1,7 @@
+class CalendarController < ApplicationController
+  def month
+    @date = Date.parse(params.fetch(:date, Date.today.to_s))
+    # @events = Event.where(start_date: @date.all_month)
+    @events = Event.where(start_date: @date.all_month).group_by { |e| e.start_date.to_date }
+  end
+end

app/helpers/application_helper.rb

@@ -1,2 +1,13 @@
 module ApplicationHelper
+  def month_offset(date)
+    date.beginning_of_month.wday - 1
+  end
+
+  def today?(date)
+    date == Date.today
+  end
+
+  def today_class(date)
+    "bg-rose-200" if today?(date)
+  end
 end

app/views/calendar/_month.html.erb

@@ -0,0 +1,21 @@
+<%= link_to "<", calendar_month_path(date: date - 1.month) %>
+<%= link_to "Today", calendar_month_path %>
+<%= link_to ">", calendar_month_path(date: date + 1.month) %>
+
+<%= date.strftime('%B %Y')%>
+
+<div class="grid grid-cols-7">
+  <% Date::ABBR_DAYNAMES.rotate.each do |weekday| %>
+    <div>
+      <%= weekday %>
+    </div>
+  <% end %>
+  <% month_offset(date).times do %>
+    <div></div>
+  <% end %>
+<% date.all_month.each do |day| %>
+  <div class="border min-h-24 <%= today_class(day) %>">
+    <%= yield day %>
+  </div>
+<% end %>
+</div>

app/views/calendar/month.html.erb

@@ -0,0 +1,9 @@
+<%= render 'calendar/month', date: @date do |day| %>
+  <%= day.strftime('%d') %>
+  <% @events[day]&.each do |event| %>
+    <div class="rounded-md bg-rose-400 m-1">
+      <%= event.name %>
+      <%= event.location %>
+    </div>
+  <% end %>
+<% end %>

config/routes.rb

@@ -8,4 +8,5 @@
 
   # Defines the root path route ("/")
   root "events#index"
+  get "calendar/month", to: 'calendar#month'
 end