Improve selection box (#1049)

scalacenter · Feb 14, 2024 · fa65e47 · fa65e47
1 parent d1cccb6
commit fa65e47
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 6 deletions.
diff --git a/api/src/main/scala/com.olegych.scastie.api/ScalaVersions.scala b/api/src/main/scala/com.olegych.scastie.api/ScalaVersions.scala
@@ -16,10 +16,10 @@ object ScalaVersions {
     val versions = tpe match {
       case ScalaTargetType.Scala3 =>
         List(
-          BuildInfo.stableLTS,
-          // BuildInfo.stableNext,
-          BuildInfo.latestLTS,
           BuildInfo.latestNext,
+          BuildInfo.stableNext,
+          BuildInfo.latestLTS,
+          BuildInfo.stableLTS,
           "3.3.0",
           "3.2.2",
           "3.2.1",

diff --git a/client/src/main/resources/sass/build-settings-theme.scss b/client/src/main/resources/sass/build-settings-theme.scss
@@ -56,6 +56,10 @@
         }
       }
 
+      .selected-option {
+        outline: 2px solid $selected-radio-color;
+      }
+
       .search .search-input {
         background-color: $input-background-color;
         .close {

diff --git a/client/src/main/scala/com.olegych.scastie.client/components/VersionSelector.scala b/client/src/main/scala/com.olegych.scastie.client/components/VersionSelector.scala
@@ -44,25 +44,32 @@ object VersionSelector {
                   onChange --> props.onChange(versionSelectors(suggestedVersion)),
                   checked := props.scalaTarget.scalaVersion == suggestedVersion
                 ),
-                label(`for` := s"scala-$suggestedVersion", cls := "radio", role := "button", renderRecommended3Versions(suggestedVersion))
+                label(`for` := s"scala-$suggestedVersion", className := "radio", role := "button", renderRecommended3Versions(suggestedVersion))
               )
             }
             .toTagMod,
           li(
             label(
-              div(cls := "select-wrapper")(
+              div(cls := "select-wrapper"){
+                val isRecommended = ScalaVersions
+                    .suggestedScalaVersions(props.scalaTarget.targetType)
+                    .contains(props.scalaTarget.scalaVersion)
+
                 select(
                   name := "scalaVersion",
                   onChange ==> { (e: ReactEventFromInput) =>
                     props.onChange(versionSelectors(e.target.value))
                   },
+                  value := {if (isRecommended) "Other" else props.scalaTarget.scalaVersion},
+                  TagMod.when(!isRecommended)(className := "selected-option")
                 )(
                   ScalaVersions
                     .allVersions(props.scalaTarget.targetType)
                     .map(version => option(version))
+                    .prepended(option("Other")(hidden := true, disabled := true))
                     .toTagMod
                 )
-              )
+              }
             )
           )
         )