Refactor leaderboard to segmented variant and used it on 3 pages

core/bundles/link/lib/onboarding/wizard_page.ex

@@ -108,7 +108,7 @@ defmodule Link.Onboarding.WizardPage do
   @impl true
   def render(assigns) do
     ~H"""
-    <.stripped user={@current_user} menus={@menus}>
+    <.stripped menus={@menus}>
       <Navigation.action_bar>
         <Tabbar.container id={@tabbar_id} tabs={@tabs} initial_tab={:welcome} />
       </Navigation.action_bar>

core/bundles/next/lib/user/signin.ex

@@ -44,7 +44,7 @@ defmodule Next.User.Signin do
   @impl true
   def render(assigns) do
     ~H"""
-    <.stripped user={@current_user} menus={@menus}>
+    <.stripped menus={@menus}>
       <div id="signup_content" phx-hook="LiveContent" data-show-errors={true}>
         <Area.content>
         <Margin.y id={:page_top} />

core/frameworks/pixel/components/selector.ex

@@ -12,9 +12,14 @@ defmodule Frameworks.Pixel.Selector do
   defp grid_options(_, grid_options) when grid_options != "", do: grid_options
   defp grid_options(:radio, _), do: "flex flex-col gap-3"
   defp grid_options(:checkbox, _), do: "flex flex-row flex-wrap gap-x-8 gap-y-3 items-center"
+
+  defp grid_options(:segmented, _),
+    do: "flex flex-row flex-wrap gap-0 items-center rounded-full overflow-hidden"
+
   defp grid_options(_, _), do: "flex flex-row flex-wrap gap-3 items-center"
 
   defp multiselect?(:radio), do: false
+  defp multiselect?(:segmented), do: false
   defp multiselect?(_), do: true
 
   @impl true
@@ -142,6 +147,7 @@ defmodule Frameworks.Pixel.Selector do
 
   defp item_component(:radio), do: &Frameworks.Pixel.Selector.Item.radio/1
   defp item_component(:checkbox), do: &Frameworks.Pixel.Selector.Item.checkbox/1
+  defp item_component(:segmented), do: &Frameworks.Pixel.Selector.Item.segment/1
   defp item_component(_), do: &Frameworks.Pixel.Selector.Item.label/1
 
   @impl true
@@ -246,6 +252,21 @@ defmodule Frameworks.Pixel.Selector.Item do
   attr(:multiselect?, :boolean, default: true)
   attr(:background, :atom, default: :light)
 
+  def segment(assigns) do
+    ~H"""
+    <div
+      x-bind:class="{ 'bg-primary text-white': active, 'bg-grey5 text-grey2': !active}"
+      class="px-6 py-3 text-label font-label select-none"
+    >
+      <%= @item.value %>
+    </div>
+    """
+  end
+
+  attr(:item, :map, required: true)
+  attr(:multiselect?, :boolean, default: true)
+  attr(:background, :atom, default: :light)
+
   def checkbox(%{item: %{value: value} = item, multiselect?: multiselect?} = assigns) do
     accent = Map.get(item, :accent)
 

core/lib/core/authorization.ex

@@ -60,6 +60,7 @@ defmodule Core.Authorization do
   grant_access(Systems.Project.NodePage, [:researcher, :owner])
   grant_access(Systems.Project.ItemContentPage, [:researcher, :owner])
   grant_access(Systems.Benchmark.ToolPage, [:member, :owner])
+  grant_access(Systems.Benchmark.LeaderboardPage, [:visitor, :member])
 
   grant_access(CoreWeb.User.Signin, [:visitor])
   grant_access(CoreWeb.User.Signup, [:visitor])

core/lib/core_web/controllers/layouts/stripped/component.ex

@@ -44,7 +44,6 @@ defmodule CoreWeb.Layouts.Stripped.Component do
   end
 
   attr(:title, :string, default: nil)
-  attr(:user, :string, required: true)
   attr(:menus, :map, required: true)
   slot(:inner_block, required: true)
 

core/lib/core_web/live/user/await_confirmation.ex

@@ -40,7 +40,7 @@ defmodule CoreWeb.User.AwaitConfirmation do
   @impl true
   def render(assigns) do
     ~H"""
-    <.stripped user={@current_user} menus={@menus}>
+    <.stripped menus={@menus}>
       <div>
         <Area.sheet>
         <Margin.y id={:page_top} />

core/lib/core_web/live/user/reset_password.ex

@@ -49,7 +49,7 @@ defmodule CoreWeb.User.ResetPassword do
   @impl true
   def render(assigns) do
     ~H"""
-    <.stripped user={@current_user} menus={@menus}>
+    <.stripped menus={@menus}>
       <Area.content>
       <Margin.y id={:page_top} />
       <Area.form>

core/lib/core_web/live/user/reset_password_token.ex

@@ -46,7 +46,7 @@ defmodule CoreWeb.User.ResetPasswordToken do
   @impl true
   def render(assigns) do
     ~H"""
-    <.stripped user={@current_user} menus={@menus}>
+    <.stripped menus={@menus}>
       <Area.content>
         <Margin.y id={:page_top} />
         <Area.form>

core/lib/core_web/live/user/signup.ex

@@ -50,7 +50,7 @@ defmodule CoreWeb.User.Signup do
   @impl true
   def render(assigns) do
     ~H"""
-    <.stripped user={@current_user} menus={@menus}>
+    <.stripped menus={@menus}>
       <div id="signup_content" phx-hook="LiveContent" data-show-errors={true}>
         <Area.content>
         <Margin.y id={:page_top} />

core/priv/gettext/en/LC_MESSAGES/eyra-benchmark.po

@@ -63,10 +63,6 @@ msgstr "Please note that you are allowed to submit up to three methods."
 msgid "submissions.title"
 msgstr "Submissions"
 
-#, elixir-autogen, elixir-format, fuzzy
-msgid "expectations.subhead"
-msgstr "Please note that only top submissions will be made publicly available on the platform."
-
 #, elixir-autogen, elixir-format
 msgid "highlight.deadline.title"
 msgstr "Days untill deadline"
@@ -173,10 +169,6 @@ msgstr "Submissions"
 msgid "import.leaderboard.title"
 msgstr "Import"
 
-#, elixir-autogen, elixir-format
-msgid "leaderboard.latest.title"
-msgstr "Latest version"
-
 #, elixir-autogen, elixir-format
 msgid "csv-import-button"
 msgstr "Import selected file"
@@ -192,3 +184,31 @@ msgstr "Select file"
 #, elixir-autogen, elixir-format
 msgid "csv-select-placeholder"
 msgstr "Select a leaderboard csv file"
+
+#, elixir-autogen, elixir-format
+msgid "challenge.forward.button"
+msgstr "Go to challenge"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.forward.button"
+msgstr "Public"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.github.label"
+msgstr "Github"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.method.label"
+msgstr "Method"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.position.label"
+msgstr "Position"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.score.label"
+msgstr "Score"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.team.label"
+msgstr "Team"

core/priv/gettext/eyra-benchmark.pot

@@ -63,10 +63,6 @@ msgstr ""
 msgid "submissions.title"
 msgstr ""
 
-#, elixir-autogen, elixir-format
-msgid "expectations.subhead"
-msgstr ""
-
 #, elixir-autogen, elixir-format
 msgid "highlight.deadline.title"
 msgstr ""
@@ -173,10 +169,6 @@ msgstr ""
 msgid "import.leaderboard.title"
 msgstr ""
 
-#, elixir-autogen, elixir-format
-msgid "leaderboard.latest.title"
-msgstr ""
-
 #, elixir-autogen, elixir-format
 msgid "csv-import-button"
 msgstr ""
@@ -192,3 +184,31 @@ msgstr ""
 #, elixir-autogen, elixir-format
 msgid "csv-select-placeholder"
 msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "challenge.forward.button"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.forward.button"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.github.label"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.method.label"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.position.label"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.score.label"
+msgstr ""
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.team.label"
+msgstr ""

core/priv/gettext/nl/LC_MESSAGES/eyra-benchmark.po

@@ -63,10 +63,6 @@ msgstr "Let op, je kan maximaal drie methodes indienen."
 msgid "submissions.title"
 msgstr "Indienen"
 
-#, elixir-autogen, elixir-format, fuzzy
-msgid "expectations.subhead"
-msgstr " Let op, alleen de hoogst scorende methodes worden getoond op het publieke scoreboard op het platform."
-
 #, elixir-autogen, elixir-format
 msgid "highlight.deadline.title"
 msgstr "Dagen tot deadline"
@@ -173,10 +169,6 @@ msgstr "Methodes"
 msgid "import.leaderboard.title"
 msgstr "Importeren"
 
-#, elixir-autogen, elixir-format
-msgid "leaderboard.latest.title"
-msgstr "Laatste versie"
-
 #, elixir-autogen, elixir-format
 msgid "csv-import-button"
 msgstr "Importeer gekozen bestand"
@@ -192,3 +184,31 @@ msgstr "Kies bestand"
 #, elixir-autogen, elixir-format
 msgid "csv-select-placeholder"
 msgstr "Kies een ranglijst csv bestand"
+
+#, elixir-autogen, elixir-format
+msgid "challenge.forward.button"
+msgstr "Naar de challenge"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.forward.button"
+msgstr "Publiek"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.github.label"
+msgstr "Github"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.method.label"
+msgstr "Methode"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.position.label"
+msgstr "Poisitie"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.score.label"
+msgstr "Score"
+
+#, elixir-autogen, elixir-format
+msgid "leaderboard.team.label"
+msgstr "Team"

core/systems/admin/login_page.ex

@@ -25,7 +25,7 @@ defmodule Systems.Admin.LoginPage do
   @impl true
   def render(assigns) do
     ~H"""
-    <.stripped user={@current_user} menus={@menus}>
+    <.stripped menus={@menus}>
       <Area.content>
         <Margin.y id={:page_top} />
         <Area.form>

core/systems/benchmark/_public.ex

@@ -11,6 +11,9 @@ defmodule Systems.Benchmark.Public do
     Benchmark
   }
 
+  # FIXME: should come from CMS
+  @main_category "f1_score"
+
   def get_tool!(id, preload \\ []) do
     from(tool in Benchmark.ToolModel, preload: ^preload)
     |> Repo.get!(id)
@@ -198,11 +201,15 @@ defmodule Systems.Benchmark.Public do
         preload: ^preload
       )
       |> Repo.all()
+      |> Enum.sort(&sort_categories/2)
     else
       []
     end
   end
 
+  defp sort_categories(%{name: @main_category}, _), do: true
+  defp sort_categories(_, _), do: false
+
   def count_leaderboard_versions() do
     list =
       from(leaderboard in Benchmark.LeaderboardModel,

core/systems/benchmark/_routes.ex

@@ -8,6 +8,11 @@ defmodule Systems.Benchmark.Routes do
         live("/:id/:spot", ToolPage)
         get("/:id/export/submissions", ExportController, :submissions)
       end
+
+      scope "/benchmark", Systems.Benchmark do
+        pipe_through([:browser])
+        live("/:id/public/leaderboard", LeaderboardPage)
+      end
     end
   end
 end