Merge pull request #1064 from gemini-hlsw/unify-tables

Unify sequence table logic
gemini-hlsw · Mar 26, 2024 · 477368d · 477368d
2 parents 3b98f8c + 4dc525d
commit 477368d
Show file tree

Hide file tree

Showing 11 changed files with 366 additions and 56 deletions.
diff --git a/build.sbt b/build.sbt
@@ -1,6 +1,6 @@
 import org.scalajs.linker.interface.ModuleSplitStyle
 
-ThisBuild / tlBaseVersion       := "0.95"
+ThisBuild / tlBaseVersion       := "0.96"
 ThisBuild / tlCiReleaseBranches := Seq("master")
 
 val Versions = new {

diff --git a/modules/ui/src/main/resources/lucuma-css/lucuma-ui-sequence.scss b/modules/ui/src/main/resources/lucuma-css/lucuma-ui-sequence.scss
@@ -7,13 +7,37 @@
 .pl-react-table.p-datatable.lucuma-sequence-table {
   .p-datatable-thead > tr > th {
     text-align: center;
+
+    &.lucuma-sequence-hidden-col-table-header {
+      padding: 0;
+      border: 0;
+    }
   }
 
-  .p-datatable-tbody > tr > td {
-    padding-top: 0;
-    padding-bottom: 0;
-    border-left: 0;
-    text-align: center;
+  .p-datatable-tbody > tr {
+    &:not(.lucuma-sequence-row-has-extra) {
+      height: 25px;
+    }
+
+    &.lucuma-sequence-row-has-extra {
+      height: 60px;
+      vertical-align: top;
+    }
+
+    & > td {
+      padding-top: 0;
+      padding-bottom: 0;
+      border-left: 0;
+      text-align: center;
+
+      &.lucuma-sequence-extra-row-shown {
+        display: inline-block;
+        position: relative;
+        top: 24px;
+        padding: 0;
+        border: 0;
+      }
+    }
   }
 
   .p-datatable-tbody > tr:last-of-type > td {
@@ -45,20 +69,26 @@
   color: var(--gray-900);
 }
 
-.lucuma-table-header {
+.lucuma-sequence-header {
   display: flex;
 
-  &.lucuma-table-header-expandable {
+  &.lucuma-sequence-header-expandable {
     cursor: pointer;
   }
 
-  .lucuma-table-header-content {
+  .lucuma-sequence-header-content {
     flex-grow: 1;
     padding: 0 10px;
+    font-size: 15px;
+    font-weight: bolder;
+
+    .lucuma-sequence-current-header {
+      display: flex;
+    }
   }
 }
 
-.lucuma-visit-header {
+.lucuma-sequence-visit-header {
   display: flex;
   justify-content: space-between;
   color: var(--gray-600);
@@ -81,29 +111,31 @@
   }
 }
 
-table tr .lucuma-visit-step-extra {
-  width: 100%;
-  display: flex;
-  justify-content: space-between;
-  padding-left: 5%;
+table tr {
+  .lucuma-sequence-visit-extraRow {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    padding-left: 5%;
 
-  .lucuma-visit-step-extra-datetime {
-    width: 20%;
-  }
+    .lucuma-sequence-visit-extraRow-datetime {
+      width: 20%;
+    }
 
-  .lucuma-visit-step-extra-datasets {
-    flex-grow: 1;
-    text-align: left;
+    .lucuma-sequence-visit-extraRow-datasets {
+      flex-grow: 1;
+      text-align: left;
 
-    .lucuma-visit-step-extra-dataset-item {
-      margin-right: 2.5dvw;
+      .lucuma-sequence-visit-extraRow-dataset-item {
+        margin-right: 2.5dvw;
 
-      .lucuma-visit-step-extra-dataset-status-icon {
-        padding-left: 0.5dvw;
-      }
+        .lucuma-sequence-visit-extraRow-dataset-status-icon {
+          padding-left: 0.5dvw;
+        }
 
-      .lucuma-visit-step-extra-dataset-status-label {
-        padding-left: 0.2dvw;
+        .lucuma-sequence-visit-extraRow-dataset-status-label {
+          padding-left: 0.2dvw;
+        }
       }
     }
   }

diff --git a/modules/ui/src/main/resources/lucuma-css/lucuma-ui-table.scss b/modules/ui/src/main/resources/lucuma-css/lucuma-ui-table.scss
@@ -82,7 +82,6 @@
       // Hover on this row, or in the next one if this one has subcomponent.
       &:hover,
       &.has-subcomponent:has(+ :hover) {
-        position: relative;
         background-color: var(--surface-100);
 
         &:not(.has-subcomponent) {
@@ -94,7 +93,6 @@
           box-shadow: inset 0 1px 0 0 var(--green-500);
 
           & + tr {
-            position: relative;
             background-color: var(--surface-100);
             box-shadow: inset 0 -1px 0 0 var(--green-500);
           }

diff --git a/modules/ui/src/main/scala/lucuma/ui/LucumaIcons.scala b/modules/ui/src/main/scala/lucuma/ui/LucumaIcons.scala
@@ -0,0 +1,20 @@
+// Copyright (c) 2016-2023 Association of Universities for Research in Astronomy, Inc. (AURA)
+// For license information see LICENSE or https://opensource.org/licenses/BSD-3-Clause
+
+package lucuma.ui
+
+import lucuma.react.fa.*
+
+import scala.scalajs.js
+import scala.scalajs.js.annotation.*
+
+object LucumaIcons:
+  @js.native
+  @JSImport("@fortawesome/pro-regular-svg-icons", "faCircle")
+  private val faCircle: FAIcon = js.native
+
+  FontAwesome.library.add(
+    faCircle
+  )
+
+  inline def Circle = FontAwesomeIcon(faCircle)
diff --git a/modules/ui/src/main/scala/lucuma/ui/react/givens.scala b/modules/ui/src/main/scala/lucuma/ui/react/givens.scala
@@ -0,0 +1,16 @@
+// Copyright (c) 2016-2023 Association of Universities for Research in Astronomy, Inc. (AURA)
+// For license information see LICENSE or https://opensource.org/licenses/BSD-3-Clause
+
+package lucuma.ui.react
+
+import cats.Monoid
+import japgolly.scalajs.react.React
+import japgolly.scalajs.react.vdom.html_<^.*
+
+given Monoid[VdomNode] = new Monoid[VdomNode]:
+  val empty: VdomNode = EmptyVdom
+  def combine(x: VdomNode, y: VdomNode): VdomNode = React.Fragment(x, y)
+
+given Monoid[TagMod] = new Monoid[TagMod]:
+  val empty: TagMod = TagMod.empty
+  def combine(x: TagMod, y: TagMod): TagMod = TagMod(x, y)
diff --git a/modules/ui/src/main/scala/lucuma/ui/sequence/SequenceColumns.scala b/modules/ui/src/main/scala/lucuma/ui/sequence/SequenceColumns.scala
@@ -7,11 +7,11 @@ import cats.syntax.all.*
 import japgolly.scalajs.react.*
 import japgolly.scalajs.react.vdom.html_<^.*
 import lucuma.react.common.*
+import lucuma.react.syntax.*
 import lucuma.react.table.*
 import lucuma.ui.syntax.all.*
-import lucuma.ui.table.HeaderOrRow
-import lucuma.ui.table.TableIcons
-import lucuma.ui.table.TableStyles
+import lucuma.ui.table.*
+import lucuma.ui.table.ColumnSize.*
 import lucuma.ui.utils.formatSN
 
 import SequenceRowFormatters.*
@@ -31,6 +31,38 @@ object SequenceColumns:
   val ROIColumnId: ColumnId          = ColumnId("roi")
   val SNColumnId: ColumnId           = ColumnId("sn")
 
+  val BaseColumnSizes: Map[ColumnId, ColumnSize] = Map(
+    IndexAndTypeColumnId -> FixedSize(60.toPx),
+    ExposureColumnId     -> Resizable(77.toPx, min = 77.toPx.some, max = 130.toPx.some),
+    GuideColumnId        -> FixedSize(33.toPx),
+    PColumnId            -> FixedSize(75.toPx),
+    QColumnId            -> FixedSize(75.toPx),
+    WavelengthColumnId   -> Resizable(75.toPx, min = 75.toPx.some, max = 130.toPx.some),
+    FPUColumnId          -> Resizable(132.toPx, min = 132.toPx.some, max = 180.toPx.some),
+    GratingColumnId      -> Resizable(120.toPx, min = 120.toPx.some, max = 180.toPx.some),
+    FilterColumnId       -> Resizable(90.toPx, min = 90.toPx.some, max = 150.toPx.some),
+    XBinColumnId         -> FixedSize(60.toPx),
+    YBinColumnId         -> FixedSize(60.toPx),
+    ROIColumnId          -> Resizable(75.toPx, min = 75.toPx.some, max = 130.toPx.some),
+    SNColumnId           -> Resizable(75.toPx, min = 75.toPx.some, max = 130.toPx.some)
+  )
+
+  // The order in which they are removed by overflow. The ones at the beginning go first.
+  // Missing columns are not removed by overflow. (We declare them in reverse order)
+  val BaseColumnPriorities: List[ColumnId] = List(
+    PColumnId,
+    QColumnId,
+    GuideColumnId,
+    ExposureColumnId,
+    SNColumnId,
+    ROIColumnId,
+    XBinColumnId,
+    YBinColumnId,
+    FilterColumnId,
+    GratingColumnId,
+    FPUColumnId
+  ).reverse
+
   def headerCell[T, R](
     colId:  ColumnId,
     colDef: ColumnDef.Applied[Expandable[HeaderOrRow[T]]]

diff --git a/modules/ui/src/main/scala/lucuma/ui/sequence/SequenceIndexedRow.scala b/modules/ui/src/main/scala/lucuma/ui/sequence/SequenceIndexedRow.scala
@@ -0,0 +1,6 @@
+// Copyright (c) 2016-2023 Association of Universities for Research in Astronomy, Inc. (AURA)
+// For license information see LICENSE or https://opensource.org/licenses/BSD-3-Clause
+
+package lucuma.ui.sequence
+
+case class SequenceIndexedRow[+D](step: SequenceRow[D], index: StepIndex)