From b833fc5ddc2ff9245c71a436f2493e2aad2d902a Mon Sep 17 00:00:00 2001
From: Thibault Duplessis <t@lichess.org>
Date: Tue, 15 Oct 2024 13:02:36 +0200
Subject: [PATCH] mod timeline wip

---
 app/controllers/User.scala                  |  2 +-
 app/views/mod/communication.scala           |  2 +-
 modules/api/src/main/ModTimeline.scala      |  6 +++++-
 modules/api/src/main/ui/ModTimelineUi.scala | 16 ++++++++++++----
 ui/mod/css/_mod-timeline.scss               |  8 ++++++--
 5 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/app/controllers/User.scala b/app/controllers/User.scala
index 7a671573bb6a..1415ed4c0170 100644
--- a/app/controllers/User.scala
+++ b/app/controllers/User.scala
@@ -356,7 +356,7 @@ final class User(
 
         val timeline = env.api
           .modTimeline(user, withPlayBans = false)
-          .map(views.mod.timeline.render)
+          .map(views.mod.timeline.renderGeneral)
           .map(lila.mod.ui.mzSection("timeline")(_))
 
         val modLog = for
diff --git a/app/views/mod/communication.scala b/app/views/mod/communication.scala
index 7a1ef4e9928f..748dce86096a 100644
--- a/app/views/mod/communication.scala
+++ b/app/views/mod/communication.scala
@@ -81,7 +81,7 @@ def communication(
             )
           )
         ),
-        views.mod.timeline.render(timeline),
+        views.mod.timeline.renderComm(timeline),
         timeline.reports.nonEmpty.option(
           frag(
             h2("Comm reports"),
diff --git a/modules/api/src/main/ModTimeline.scala b/modules/api/src/main/ModTimeline.scala
index 6d1f3251beca..92d267be29bc 100644
--- a/modules/api/src/main/ModTimeline.scala
+++ b/modules/api/src/main/ModTimeline.scala
@@ -68,7 +68,7 @@ object ModTimeline:
         case _: ReportNewAtom => "symbols.exclamation-mark"
         case _: ReportClose   => "objects.package"
         case _: TempBan       => "objects.hourglass-not-done"
-        case _: PublicLine    => "symbols.triangular-flag"
+        case _: PublicLine    => "symbols.exclamation-mark"
     def at: Instant = e match
       case e: Modlog               => e.date
       case e: AppealMsg            => e.at
@@ -85,6 +85,10 @@ object ModTimeline:
   // latest first
   given Ordering[Event] = Ordering.by(at).reverse
 
+  enum Angle:
+    case None
+    case Comm
+
 final class ModTimelineApi(
     modLogApi: ModlogApi,
     appealApi: AppealApi,
diff --git a/modules/api/src/main/ui/ModTimelineUi.scala b/modules/api/src/main/ui/ModTimelineUi.scala
index 3e4b1291cef9..0005e1a93985 100644
--- a/modules/api/src/main/ui/ModTimelineUi.scala
+++ b/modules/api/src/main/ui/ModTimelineUi.scala
@@ -23,10 +23,16 @@ final class ModTimelineUi(helpers: Helpers)(
   import helpers.{ *, given }
   import ModTimeline.*
 
+  def renderGeneral(t: ModTimeline)(using Translate) = render(t)(using Angle.None)
+  def renderComm(t: ModTimeline)(using Translate)    = render(t)(using Angle.Comm)
+
   private val eventOrdering = summon[Ordering[Instant]].reverse
 
-  def render(t: ModTimeline)(using Translate) = div(cls := "mod-timeline"):
+  private def render(t: ModTimeline)(using angle: Angle)(using Translate) = div(cls := "mod-timeline"):
     t.all
+      .filter:
+        case _: TempBan if angle != Angle.Comm => false
+        case _                                 => true
       .map: e =>
         daysFromNow(e.at.date) -> e
       .groupBy(_._1)
@@ -45,9 +51,9 @@ final class ModTimelineUi(helpers: Helpers)(
   private def renderEvent(t: ModTimeline)(e: Event)(using Translate) =
     div(cls := s"mod-timeline__event mod-timeline__event--${e.key}")(
       a(cls := "mod-timeline__event__flair", href := e.url(t.user)):
-        img(src := flairSrc(e.flair), title := e.key)
+        img(src := flairSrc(e.flair), title := s"${e.key} ${showInstant(e.at)}")
       ,
-      showTime(e.at),
+      // showInstant(e.at),
       div(cls := "mod-timeline__event__body")(renderEventBody(t)(e))
     )
 
@@ -115,7 +121,9 @@ final class ModTimelineUi(helpers: Helpers)(
       else renderMod(e.mod)
     frag(
       author,
-      actionTag(cls := "mod-timeline__event__action")(e.showAction),
+      actionTag(cls := s"mod-timeline__event__action mod-timeline__event__action--${e.action}")(
+        e.showAction
+      ),
       div(cls := "mod-timeline__text"):
         e.gameId.fold[Frag](e.details.orZero: String) { gameId =>
           a(href := s"${routes.Round.watcher(gameId, Color.white).url}?pov=${e.user.so(_.value)}")(
diff --git a/ui/mod/css/_mod-timeline.scss b/ui/mod/css/_mod-timeline.scss
index 17a695d9bfb4..e54335a25f89 100644
--- a/ui/mod/css/_mod-timeline.scss
+++ b/ui/mod/css/_mod-timeline.scss
@@ -1,10 +1,9 @@
 .mod-timeline {
   @extend %flex-column, %box-neat;
   gap: 4em;
-  @extend %box-neat;
   background: $c-bg-zebra;
   padding: 2em 4em;
-  max-height: 50vh;
+  max-height: 70vh;
   overflow-y: auto;
   overflow-x: hidden;
 }
@@ -25,6 +24,11 @@
 .mod-timeline__event {
   @extend %flex-center-nowrap;
   gap: 1em;
+  padding: 0 1em;
+}
+.mod-timeline__event:has(.mod-timeline__event__action--modMessage) {
+  background: $c-bg-zebra2;
+  padding: 1em;
 }
 .mod-timeline__event__from {
   white-space: nowrap;