feat: wip add lettings, sales and schemes sections with correct text, counts, links and colouring

app/frontend/styles/_data_box.scss

@@ -0,0 +1,25 @@
+.app-data-box__pair {
+  @include govuk-font($size: 19);
+  font-weight: bold;
+}
+
+.app-data-box__upper {
+  @include govuk-responsive-margin(4, "right");
+  @include govuk-responsive-margin(2, "bottom");
+  @include govuk-responsive-padding(4);
+
+  background-color: govuk-colour("light-grey");
+  color: govuk-colour("blue");
+}
+
+.app-data-box__lower {
+  @include govuk-responsive-margin(4, "right");
+  @include govuk-responsive-padding(4);
+
+  background-color: govuk-colour("blue");
+}
+
+.app-data-box__count {
+  font-size: 48px;
+  color: govuk-colour("blue");
+}

app/frontend/styles/application.scss

@@ -25,6 +25,7 @@ $govuk-breakpoints: (
 @import "accessible-autocomplete";
 @import "button";
 @import "card";
+@import "data_box";
 @import "document-list";
 @import "feedback";
 @import "filter";

app/helpers/home_helper.rb

@@ -0,0 +1,41 @@
+module HomeHelper
+
+  def in_progress_count(user, type)
+    case type
+    when "lettings" then user.lettings_logs.in_progress.count
+    when "sales" then user.sales_logs.in_progress.count
+    when "schemes" then user.schemes.incomplete.count
+    end
+  end
+
+  def heading_for_user_role(user)
+    case user.role
+    when "data_provider" then "Complete your logs"
+    when "data_coordinator" then "Manage your data"
+    when "support" then "Manage all data"
+    end
+  end
+
+  def in_progress_subheading(user, type)
+    if type == "schemes"
+      return"Incomplete schemes"
+    end
+    "#{user.role == "data_provider" ? :"Your " : nil}#{type} in progress".capitalize
+  end
+
+  def in_progress_path(type)
+    case type
+    when "lettings" then lettings_logs_path(status: [:in_progress])
+    when "sales" then sales_logs_path(status: [:in_progress])
+    when "schemes" then schemes_path(status: [:incomplete])
+    end
+  end
+
+  def clear_filter_path_for_type(type)
+    case type
+    when "lettings" then clear_filters_path(filter_type: "lettings_logs")
+    when "sales" then clear_filters_path(filter_type: "sales_logs")
+    when "schemes" then clear_filters_path(filter_type: "schemes")
+    end
+  end
+end

app/views/home/_data_box.html.erb

@@ -0,0 +1,9 @@
+<div class="app-data-box__pair">
+  <div class="app-data-box__upper">
+    <div class="app-data-box__count"><%= in_progress_count(@current_user, type) %></div>
+    <a><%= govuk_link_to in_progress_subheading(@current_user, type), in_progress_path(type), class: "govuk-link--no-visited-state" %></a>
+  </div>
+  <div class="app-data-box__lower">
+    <%= govuk_link_to "View all #{type}", clear_filter_path_for_type(type), class: "govuk-link--inverse" %>
+  </div>
+</div>

app/views/home/index.html.erb

@@ -1 +1,28 @@
-<p class="govuk-body-l"><%= "Welcome back, #{@current_user.name}" %></p>
+<div class="govuk-grid-row">
+  <div class="govuk-grid-column-two-thirds">
+    <div class="govuk-!-margin-bottom-7">
+      <span class="govuk-body-l"><%= "Welcome back, #{@current_user.name}" %></span>
+      <h1 class="govuk-heading-l"><%= heading_for_user_role(@current_user) %></h1>
+    </div>
+    <div class="govuk-grid-row">
+      <% if @current_user.support? %>
+        <div class="govuk-grid-column-one-third">
+          <span><%= render partial: "home/data_box", locals: {type: "lettings"} %></span>
+        </div>
+        <div class="govuk-grid-column-one-third">
+          <span><%= render partial: "home/data_box", locals: {type: "sales"} %></span>
+        </div>
+        <div class="govuk-grid-column-one-third">
+          <span><%= render partial: "home/data_box", locals: {type: "schemes"} %></span>
+        </div>
+      <% else %>
+        <div class="govuk-grid-column-one-half">
+          <span><%= render partial: "home/data_box", locals: {type: "lettings"} %></span>
+        </div>
+        <div class="govuk-grid-column-one-half">
+          <span><%= render partial: "home/data_box", locals: {type: "sales"} %></span>
+        </div>
+      <% end %>
+    </div>
+  </div>
+</div>