Browse Source
* Tweak search result caption component * Add log summary component * Add tests for log summary component * Indentation Co-authored-by: baarkerlounger <db@slothlife.xyz>pull/796/head
Paul Robert Lloyd
2 years ago
committed by
GitHub
12 changed files with 185 additions and 84 deletions
@ -0,0 +1,67 @@
|
||||
<article class="app-log-summary"> |
||||
<div class="govuk-grid-row"> |
||||
<div class="govuk-grid-column-one-half"> |
||||
<header class="app-log-summary__header"> |
||||
<h2 class="app-log-summary__title"> |
||||
<%= govuk_link_to case_log_path(log) do %> |
||||
<span class="govuk-visually-hidden">Log </span><%= log.id %> |
||||
<% end %> |
||||
</h2> |
||||
<% if log.tenancycode? or log.propcode? %> |
||||
<dl class="app-metadata app-metadata--inline"> |
||||
<% if log.tenancycode? %> |
||||
<div class="app-metadata__item"> |
||||
<dt class="app-metadata__term">Tenant</dt> |
||||
<dd class="app-metadata__definition"><%= log.tenancycode %></dd> |
||||
</div> |
||||
<% end %> |
||||
<% if log.propcode? %> |
||||
<div class="app-metadata__item"> |
||||
<dt class="app-metadata__term">Property</dt> |
||||
<dd class="app-metadata__definition"><%= log.propcode %></dd> |
||||
</div> |
||||
<% end %> |
||||
</dl> |
||||
<% end %> |
||||
</header> |
||||
|
||||
<% if log.needstype? or log.startdate? %> |
||||
<p class="govuk-body govuk-!-margin-bottom-2"> |
||||
<% if log.needstype? %> |
||||
<%= log.is_general_needs? ? "General needs" : "Supported housing" %><br> |
||||
<% end %> |
||||
<% if log.startdate? %> |
||||
Tenancy starts <time datetime="<%= log.startdate.iso8601 %>"><%= log.startdate.to_formatted_s(:govuk_date) %></time> |
||||
<% end %> |
||||
</p> |
||||
<% end %> |
||||
|
||||
<% if current_user.support? %> |
||||
<% if log.owning_organisation or log.managing_organisation %> |
||||
<dl class="app-metadata"> |
||||
<div class="app-metadata__item"> |
||||
<dt class="app-metadata__term">Owned by</dt> |
||||
<dd class="app-metadata__definition"><%= log.owning_organisation&.name %></dd> |
||||
</div> |
||||
<div class="app-metadata__item"> |
||||
<dt class="app-metadata__term">Managed by</dt> |
||||
<dd class="app-metadata__definition"><%= log.managing_organisation&.name %></dd> |
||||
</div> |
||||
</dl> |
||||
<% end %> |
||||
<% end %> |
||||
</div> |
||||
|
||||
<footer class="govuk-grid-column-one-half app-log-summary__footer"> |
||||
<p class="govuk-body govuk-!-margin-bottom-2"> |
||||
<%= log_status %> |
||||
</p> |
||||
<p class="govuk-body"> |
||||
Created <time datetime="<%= log.created_at.iso8601 %>"><%= log.created_at.to_formatted_s(:govuk_date) %></time> |
||||
<% if log.created_by %> |
||||
<span class="app-log-summary__footer--actor">by <%= log.created_by.name || log.created_by.email %></span> |
||||
<% end %> |
||||
</p> |
||||
</footer> |
||||
</div> |
||||
</article> |
||||
@ -0,0 +1,13 @@
|
||||
class LogSummaryComponent < ViewComponent::Base |
||||
attr_reader :current_user, :log |
||||
|
||||
def initialize(current_user:, log:) |
||||
@current_user = current_user |
||||
@log = log |
||||
super |
||||
end |
||||
|
||||
def log_status |
||||
helpers.status_tag(log.status) |
||||
end |
||||
end |
||||
@ -1,7 +1,7 @@
|
||||
<span class="govuk-!-margin-right-4"> |
||||
<span class="govuk-!-margin-right-4"> |
||||
<% if searched.present? %> |
||||
<strong><%= count %></strong> <%= item_label %> found matching ‘<%= searched %>’ of <strong><%= total_count %></strong> total <%= item %>. <%= govuk_link_to("Clear search", path) %> |
||||
<% else %> |
||||
<strong><%= count %></strong> total <%= item %>. |
||||
<strong><%= count %></strong> total <%= item %> |
||||
<% end %> |
||||
</span> |
||||
|
||||
@ -0,0 +1,23 @@
|
||||
.app-log-summary { |
||||
border-top: 1px solid $govuk-border-colour; |
||||
padding-top: govuk-spacing(3); |
||||
} |
||||
|
||||
.app-log-summary__header { |
||||
align-items: baseline; |
||||
display: flex; |
||||
} |
||||
|
||||
.app-log-summary__title { |
||||
margin: 0 govuk-spacing(3) govuk-spacing(2) 0; |
||||
} |
||||
|
||||
@include govuk-media-query(tablet) { |
||||
.app-log-summary__footer { |
||||
text-align: right; |
||||
} |
||||
|
||||
.app-log-summary__footer--actor { |
||||
display: block; |
||||
} |
||||
} |
||||
@ -0,0 +1,23 @@
|
||||
.app-metadata { |
||||
@include govuk-font($size: 16, $tabular: true); |
||||
color: $govuk-secondary-text-colour; |
||||
margin-top: 0; |
||||
|
||||
&--inline { |
||||
display: flex; |
||||
gap: govuk-spacing(3); |
||||
margin: 0; |
||||
} |
||||
|
||||
&__item { |
||||
display: flex; |
||||
} |
||||
|
||||
&__term { |
||||
margin-right: govuk-spacing(1); |
||||
} |
||||
|
||||
&__definition { |
||||
margin-left: 0; |
||||
} |
||||
} |
||||
@ -1,68 +1,8 @@
|
||||
<section class="app-table-group" tabindex="0" aria-labelledby="<%= title.dasherize %>"> |
||||
<%= govuk_table do |table| %> |
||||
<%= table.caption(classes: %w[govuk-!-font-size-19 govuk-!-font-weight-regular], id: title.dasherize) do |caption| %> |
||||
<h2 class="govuk-body"> |
||||
<%= render(SearchResultCaptionComponent.new(searched:, count: pagy.count, item_label:, total_count:, item: "logs", path: request.path)) %> |
||||
<%= govuk_link_to "Download (CSV)", "#{request.path}.csv", type: "text/csv" %> |
||||
<% end %> |
||||
<%= table.head do |head| %> |
||||
<%= head.row do |row| %> |
||||
<% row.cell(header: true, text: "Log", html_attributes: { |
||||
scope: "col", |
||||
}) %> |
||||
<% row.cell(header: true, text: "Tenant", html_attributes: { |
||||
scope: "col", |
||||
}) %> |
||||
<% row.cell(header: true, text: "Property", html_attributes: { |
||||
scope: "col", |
||||
}) %> |
||||
<% row.cell(header: true, text: "Tenancy starts", html_attributes: { |
||||
scope: "col", |
||||
}) %> |
||||
<% row.cell(header: true, text: "Log created", html_attributes: { |
||||
scope: "col", |
||||
}) %> |
||||
<% row.cell(header: true, text: "Log status", html_attributes: { |
||||
scope: "col", |
||||
}) %> |
||||
<% if current_user.support? %> |
||||
<% row.cell(header: true, text: "Owning organisation", html_attributes: { |
||||
scope: "col", |
||||
}) %> |
||||
<% row.cell(header: true, text: "Managing organisation", html_attributes: { |
||||
scope: "col", |
||||
}) %> |
||||
<% end %> |
||||
<% end %> |
||||
<% end %> |
||||
<%= table.body do |body| %> |
||||
<% case_logs.map do |log| %> |
||||
<%= body.row do |row| %> |
||||
<% row.cell(header: true, html_attributes: { |
||||
scope: "row", |
||||
}) do %> |
||||
<%= govuk_link_to case_log_path(log) do %> |
||||
<span class="govuk-visually-hidden">Log </span><%= log.id %> |
||||
<% end %> |
||||
<% end %> |
||||
<% row.cell( |
||||
text: log.tenancycode? ? log.tenancycode : "–", |
||||
classes: "app-!-font-tabular", |
||||
) %> |
||||
<% row.cell( |
||||
text: log.propcode? ? log.propcode : "–", |
||||
classes: "app-!-font-tabular", |
||||
) %> |
||||
<% row.cell(text: log.startdate.present? ? log.startdate.to_formatted_s(:govuk_date) : "–") %> |
||||
<% row.cell(text: log.created_at.to_formatted_s(:govuk_date)) %> |
||||
<% row.cell do %> |
||||
<%= status_tag(log.status) %> |
||||
<% end %> |
||||
<% if current_user.support? %> |
||||
<% row.cell(text: log.owning_organisation&.name) %> |
||||
<% row.cell(text: log.managing_organisation&.name) %> |
||||
<% end %> |
||||
<% end %> |
||||
<% end %> |
||||
<% end %> |
||||
<% end %> |
||||
</section> |
||||
</h2> |
||||
|
||||
<% case_logs.map do |log| %> |
||||
<%= render(LogSummaryComponent.new(current_user:, log:)) %> |
||||
<% end %> |
||||
|
||||
@ -0,0 +1,33 @@
|
||||
require "rails_helper" |
||||
|
||||
RSpec.describe LogSummaryComponent, type: :component do |
||||
let(:support_user) { FactoryBot.create(:user, :support) } |
||||
let(:coordinator_user) { FactoryBot.create(:user) } |
||||
let!(:log) { FactoryBot.create(:case_log, needstype: 1, startdate: Time.utc(2022, 1, 1)) } |
||||
|
||||
context "when rendering log for a support user" do |
||||
it "show the log summary with organisational relationships" do |
||||
result = render_inline(described_class.new(current_user: support_user, log:)) |
||||
|
||||
expect(result).to have_link(log.id.to_s) |
||||
expect(result).to have_text(log.tenancycode) |
||||
expect(result).to have_text(log.propcode) |
||||
expect(result).to have_text(log.propcode) |
||||
expect(result).to have_text("General needs") |
||||
expect(result).to have_text("Tenancy starts 1 January 2022") |
||||
expect(result).to have_text("Created 8 February 2022") |
||||
expect(result).to have_text("by Danny Rojas") |
||||
expect(result).to have_content("Owned by\n DLUHC") |
||||
expect(result).to have_content("Managed by\n DLUHC") |
||||
end |
||||
end |
||||
|
||||
context "when rendering log for a data coordinator user" do |
||||
it "show the log summary" do |
||||
result = render_inline(described_class.new(current_user: coordinator_user, log:)) |
||||
|
||||
expect(result).not_to have_content("Owned by\n DLUHC") |
||||
expect(result).not_to have_content("Managed by\n DLUHC") |
||||
end |
||||
end |
||||
end |
||||
Loading…
Reference in new issue