Add css styling for launcher buttons.

apps/dashboard/app/assets/stylesheets/projects.scss

@@ -38,3 +38,9 @@
   font-size: 1.4em;
   float: right;
 }
+
+.launcher-button {
+  color: white;
+  width: 100%;
+  margin: 0.25rem;
+}

apps/dashboard/app/controllers/projects_controller.rb

@@ -15,11 +15,11 @@ def show
     else
       @scripts = Launcher.all(@project.directory)
       @valid_project = Launcher.clusters?
-      valid_scripts = Launcher.scripts?(@project.directory)
+      @valid_scripts = Launcher.scripts?(@project.directory)
 
       alert_messages = []
       alert_messages << I18n.t('dashboard.jobs_project_invalid_configuration_clusters') unless @valid_project
-      alert_messages << I18n.t('dashboard.jobs_project_invalid_configuration_scripts') if @scripts.any? && !valid_scripts
+      alert_messages << I18n.t('dashboard.jobs_project_invalid_configuration_scripts') if @scripts.any? && !@valid_scripts
       flash.now[:alert] = alert_messages.join(' ') if alert_messages.any?
       respond_to do |format|
         format.html

apps/dashboard/app/views/projects/_launcher_buttons.html.erb

@@ -6,53 +6,54 @@
 -%>
 
 <div class="row">
-
   <div class="col">
     <%= button_to(
       submit_project_launcher_path(@project.id, launcher.id),
-      class: 'btn btn-success',
+      class: 'btn btn-success launcher-button',
       title: 'Launch script with cached or default values',
       disabled: disabled,
       params: launcher.quick_launch_params,
       id: "launch_#{launcher.id}"
     ) do
     %>
-      <i class="fa fa-play"></i>
+      Launch
     <%- end %>
   </div>
 
   <div class="col">
     <%= link_to(
       project_launcher_path(@project.id, launcher.id),
-      class: "btn btn-success #{disabled_class}",
+      class: "btn btn-info launcher-button #{disabled_class}",
       id: "show_#{launcher.id}"
       ) do
     %>
-      <i class="fa fa-bars"></i>
+      Options
     <%- end -%>
-  </div>
 
+  </div>
+</div>
+<div class="row">
   <div class="col">
     <%= link_to(
       edit_project_launcher_path(@project.id, launcher.id),
-      class: "btn btn-primary #{disabled_class}",
+      class: "btn btn-primary launcher-button #{disabled_class}",
       id: "edit_#{launcher.id}",
       title: edit_title) do
     %>
-      <i class="fa fa-pencil"></i>
+      Edit
     <%- end %>
   </div>
 
   <div class="col">
     <%= button_to(
       project_launcher_path(@project.id, launcher.id),
       id: "delete_#{launcher.id}",
-      class: "btn btn-danger",
+      class: "btn btn-danger launcher-button",
       title: delete_title,
       data: { confirm: I18n.t('dashboard.jobs_scripts_delete_script_confirmation') },
       method: :delete) do
     %>
-      <i class="fa fa-trash"></i>
+      Delete
     <%- end -%>
   </div>
 </div>

apps/dashboard/app/views/projects/show.html.erb

@@ -31,13 +31,62 @@
 </div>
 
 <div class="row mb-3">
-  <div class="col-md-2">
-    <%= render(partial: 'launchers', locals: { launchers: @scripts, project: @project }) %>
+  <div class="col-md-3">
+    <div class="list-group">
+      <a class="list-group-item list-group-item-action bg-light font-weight-bold list-toggler"
+          data-bs-toggle="collapse" data-bs-target="#launcher_list"
+          aria-expanded="true" aria-controls="launcher_list">
+        <span><%= t('dashboard.jobs_launchers') %></span>
+      </a>
+
+      <div id="launcher_list" class="collapse show">
+        <%- @scripts.each do |launcher| -%>
+        <div class="list-group-item list-group-item-action" id="launcher_<%= launcher.id %>">
+          <div class="row launcher-item">
+            <div class="col">
+              <%= launcher.title %>
+            </div>
+          </div>
+
+          <%= render(partial: 'launcher_buttons', locals: { launcher: launcher }) %>
+        </div>
+        <%- end -%>
+      </div>
+
+      <a class="list-group-item list-group-item-action text-info font-weight-bold"
+        href="<%= new_project_launcher_path(@project.id) %>">
+        <%= t('dashboard.jobs_new_launcher') %>
+      </a>
+    </div>
   </div>
-  <div class="col-md-8">
-    <%= render(partial: 'jobs', locals: { project: @project }) %>
+
+  <div class="col-md-7">
+    <div class="row">
+      <h2 class="d-flex justify-content-center">Active Jobs</h2>
+      <%= render(partial: 'job_details', collection: @project.active_jobs, as: :job) %>
+    </div>
+
+    <div class="row">
+      <h2 class="h3 d-flex justify-content-center">Completed Jobs</h2>
+      <div id="completed_jobs" class="row">
+        <%- @project.completed_jobs.each do |job| -%>
+        <div class="col-md-4" id="<%= "job_#{job.cluster}_#{job.id}" %>">
+          <%= render(partial: 'job_details_content', locals: { job: job }) %>
+        </div>
+        <%- end -%>
+      </div>
+    </div>
   </div>
 </div>
+
 <% unless @project.readme_path.nil? %>
-  <%= render(partial: 'readme', locals: { project: @project }) %>
+  <div class="card">
+    <div class="card-header">
+      <button class="btn btn-default fa fa-chevron-right" type="button" data-bs-toggle="collapse" data-bs-target="#readme" aria-expanded="true" aria-controls="readme"></button>
+      <%= File.basename(@project.readme_path) %>
+    </div>
+    <div class="card-body collapse show" id="readme">
+      <%= render_readme(@project.readme_path)  %>
+    </div>
+  </div>
 <% end %>