diff --git a/lib/exmr_web/live/exam_live/index.ex b/lib/exmr_web/live/exam_live/index.ex
index 501ec7a..bc05f1f 100644
--- a/lib/exmr_web/live/exam_live/index.ex
+++ b/lib/exmr_web/live/exam_live/index.ex
@@ -46,6 +46,7 @@ defmodule ExmrWeb.ExamLive.Index do
     socket =
       socket
       |> assign(:exams, [exam | socket.assigns.exams])
+      |> assign(events: Enum.group_by(Exams.list_exams(), & &1.date))
 
     {:noreply, socket}
   end
@@ -60,6 +61,7 @@ defmodule ExmrWeb.ExamLive.Index do
       |> update(:exams, fn exams ->
         Enum.reject(exams, fn l -> l.id == exam.id end)
       end)
+      |> assign(events: Enum.group_by(Exams.list_exams(), & &1.date))
 
     {:noreply, socket}
   end
diff --git a/lib/exmr_web/live/exam_live/index.html.heex b/lib/exmr_web/live/exam_live/index.html.heex
index d51dfb1..eca1b7a 100644
--- a/lib/exmr_web/live/exam_live/index.html.heex
+++ b/lib/exmr_web/live/exam_live/index.html.heex
@@ -79,15 +79,15 @@
   <!-- </div> -->
 
   <!-- Calendar -->
-  <div class="grid grid-cols-7 gap-1">
+  <div class="grid grid-cols-7 gap-1" id="calendar-container" phx-update="replace">
     <!-- Weekdays -->
-    <%= for day <- ~w(#{gettext("Sun")} #{gettext("Mon")} #{gettext("Tue")} #{gettext("Wed")} #{gettext("Thu")}
+    <%= for weekday <- ~w(#{gettext("Sun")} #{gettext("Mon")} #{gettext("Tue")} #{gettext("Wed")} #{gettext("Thu")}
       #{gettext("Fri")} #{gettext("Sat")}) do %>
-      <div class="font-bold text-center">{day}</div>
+      <div class="font-bold text-center">{weekday}</div>
     <% end %>
     
 <!-- Empty spaces for previous month -->
-    <%= for _ <- 1..(Date.day_of_week(@current_month)) do %>
+    <%= for _ <- 1..(Date.day_of_week(Date.new!(@current_month.year, @current_month.month, 1))) do %>
       <div></div>
     <% end %>
     
@@ -95,26 +95,25 @@
     <%= for day <- 1..Date.days_in_month(@current_month) do %>
       <% {:ok, date} = Date.new(@current_month.year, @current_month.month, day) %>
 
-      <div class={[
-        "border rounded p-0.5 md:p-2 lg:p-3 w-full h-12 md:h-20 hover:scale-125 transition-transform ease-in-out duration-100",
-        @current_month == date &&
-          "bg-zinc-200 dark:bg-zinc-800  border-green-500 dark:border-green-300",
-        @current_month != date &&
-          "bg-white dark:bg-zinc-950 dark:border-zinc-400 "
-      ]}>
+      <div
+        id={"day-#{Date.to_string(date)}"}
+        class={[
+          "border rounded p-0.5 md:p-2 lg:p-3 w-full h-12 md:h-20 hover:scale-125 transition-transform ease-in-out duration-100",
+          @current_month == date &&
+            "bg-zinc-200 dark:bg-zinc-800  border-green-500 dark:border-green-300",
+          @current_month != date &&
+            "bg-white dark:bg-zinc-950 dark:border-zinc-400 "
+        ]}
+      >
         <div class="text-xs md:text-sm lg:text-base font-bold">{day}</div>
-        
-<!-- Render events for the current day -->
+        <!-- Render events for the current day -->
 
-        <%= case Map.get(@events, date) do %>
-          <% nil -> %>
-            <!-- No events for this day -->
-          <% events -> %>
-            <ul class="mt-2 text-xs">
-              <%= for event <- events do %>
-                <li>{event.subject}</li>
-              <% end %>
-            </ul>
+        <%= if Map.has_key?(@events, date) do %>
+          <ul class="text-xs">
+            <%= for event <- @events[date] do %>
+              <li id={"event-#{event.id}"}>{event.subject}</li>
+            <% end %>
+          </ul>
         <% end %>
       </div>
     <% end %>