Skip to content

Commit b1308e5

Browse files
Add TACOS suggestions
Why are these changes being introduced: * Displaying panels with TACOS suggestions on the search results and pages when they are available will help users access the resources they need more quickly. Relevant ticket(s): * https://mitlibraries.atlassian.net/browse/USE-65 How does this address that need: * Brings in the draft TACOS styles and views that Dave build in TACOS and modifies them to fit into the existing application styles and views. * Extracts the suggestions from the tacos response and displays them in a panel on the search results and analyze pages. Document any side effects to this change: * Only added to non-GDT searches at this time. Co-Authored-By: djanelle-mit <181018533+djanelle-mit@users.noreply.github.com>
1 parent dc49d09 commit b1308e5

File tree

9 files changed

+292
-6
lines changed

9 files changed

+292
-6
lines changed

app/assets/stylesheets/application.css.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,3 +19,4 @@
1919
@import "partials/_shared";
2020
@import "partials/_results";
2121
@import "partials/_typography";
22+
@import "partials/_suggestion-panel";
Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
/* Color Variables */
2+
3+
// Core
4+
$blue-500: #0000FF;
5+
6+
$purple-700: #990099;
7+
8+
$white: #fff;
9+
$gray-100: #F2F2F2;
10+
$black: #111;
11+
12+
@mixin focus-outline {
13+
&:focus {
14+
outline: 3px solid $blue-500;
15+
}
16+
}
17+
18+
@mixin hover-transition {
19+
transition: all .25s ease-in-out 0s;
20+
}
21+
22+
// Semantic
23+
$color-suggestion-border: $purple-700;
24+
$color-suggestion-accent-text: $purple-700;
25+
26+
/* Suggestion Panel */
27+
.mitlib-suggestion-panel {
28+
border: 4px solid $color-suggestion-border;
29+
30+
display: flex;
31+
column-gap: 24px;
32+
33+
padding: 20px 24px;
34+
position: relative;
35+
36+
.panel-type {
37+
color: $color-suggestion-accent-text;
38+
font-size: 14px;
39+
font-weight: 600;
40+
margin-bottom: 8px;
41+
}
42+
43+
h3 {
44+
font-size: 20px;
45+
font-weight: 600;
46+
line-height: 1.25;
47+
margin-bottom: 8px;
48+
}
49+
50+
p {
51+
font-size: 16px;
52+
}
53+
54+
ul.metadata {
55+
font-size: 14px;
56+
list-style: none inside;
57+
padding-left: 0;
58+
margin-bottom: 20px;
59+
}
60+
61+
// This would need to be extracted into an Icon Button in the future.
62+
button.dismiss {
63+
//Temporarily hiding until we can move to a prop
64+
display: none;
65+
66+
width: 48px;
67+
height: 48px;
68+
position: absolute;
69+
top: 0;
70+
right: 0;
71+
72+
background-color: $white;
73+
border: none;
74+
color: $black;
75+
cursor: pointer;
76+
font-weight: 600;
77+
78+
@include hover-transition;
79+
80+
@include focus-outline;
81+
82+
&:hover {
83+
background-color: $gray-100;
84+
}
85+
}
86+
}
87+
88+
/* Button styles to be extracted into button component */
89+
.button.secondary {
90+
border: 1px solid $black;
91+
border-radius: 0;
92+
display: inline-block;
93+
padding: 6px 12px;
94+
text-decoration: none;
95+
font-size: 16px;
96+
font-weight: 600;
97+
98+
@include hover-transition;
99+
100+
@include focus-outline;
101+
102+
&:hover {
103+
color: $white;
104+
background-color: $black;
105+
}
106+
}

app/controllers/tacos_controller.rb

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ class TacosController < ApplicationController
44
def analyze
55
return unless ApplicationHelper.tacos_enabled?
66

7-
Tacos.analyze(params[:q])
7+
tacos_response = Tacos.analyze(params[:q])
8+
9+
# Suggestions return as an array but we don't want to display more than one.
10+
# We may want to have a "priority" system in the future to determine which suggestion to show.
11+
@suggestions = tacos_response['data']['logSearchEvent']['detectors']['suggestedResources'].first
812
end
913
end

app/views/search/results.html.erb

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010

1111
<%= render partial: "form" %>
1212
<%= render partial: "search_summary" %>
13+
<%= render(partial: 'trigger_tacos') if tacos_enabled? %>
1314

1415
<%= render(partial: 'shared/error', collection: @errors) %>
1516

@@ -55,6 +56,4 @@
5556
<% end %>
5657
</div>
5758

58-
<%= render(partial: 'trigger_tacos') if tacos_enabled? %>
59-
6059
<%= javascript_include_tag "filters" %>

app/views/tacos/analyze.html.erb

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,18 @@
1-
<!-- Result of TACOS analysis would go here -->
1+
<% if @suggestions.present? %>
2+
<div id="hint" aria-live="polite">
3+
<aside class="mitlib-suggestion-panel">
4+
<div class="image-wrapper">
5+
<i class="fa fa-info-circle" aria-hidden="true"></i>
6+
</div>
7+
<div class="panel-content">
8+
<p class="panel-type">Suggested resource</p>
9+
<h3><%= @suggestions['title'] %></h3>
10+
<p>
11+
<%= link_to(
12+
@suggestions['url'], @suggestions['url']
13+
) %>
14+
</p>
15+
</div>
16+
</aside>
17+
</div>
18+
<% end %>
Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,31 @@
11
require 'test_helper'
22

33
class TacosControllerTest < ActionDispatch::IntegrationTest
4-
test 'analyze route exists but returns an HTML comment for now' do
4+
test 'analyze route exists' do
55
VCR.use_cassette('tacos direct') do
66
get '/analyze?q=direct'
77

88
assert_response :success
9-
assert_equal "<!-- Result of TACOS analysis would go here -->\n", response.body
9+
end
10+
end
11+
12+
test 'tacos with suggested resource' do
13+
VCR.use_cassette('tacos suggested resource') do
14+
get '/analyze?q=hours'
15+
16+
assert_response :success
17+
assert_includes response.body, 'MIT Libraries Hours'
18+
assert_includes response.body, 'https://libraries.mit.edu/hours'
19+
end
20+
end
21+
22+
test 'tacos with suggested pattern' do
23+
VCR.use_cassette('tacos pattern iso') do
24+
get '/analyze?q=iso 9001'
25+
26+
assert_response :success
27+
assert_includes response.body, 'Looking for Standards?'
28+
assert_includes response.body, 'https://libguides.mit.edu/standards'
1029
end
1130
end
1231
end

test/test_helper.rb

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@
2727
config.filter_sensitive_data('FAKE_TIMDEX_INDEX') { ENV.fetch('TIMDEX_INDEX').to_s }
2828
config.filter_sensitive_data('FAKE_PRIMO_API_KEY') { ENV.fetch('PRIMO_API_KEY').to_s }
2929
config.filter_sensitive_data('FAKE_TACOS_HOST') { ENV.fetch('TACOS_HOST').to_s }
30+
config.filter_sensitive_data('FAKE_TACOS_SOURCE') { ENV.fetch('TACOS_SOURCE').to_s }
3031
config.filter_sensitive_data('http://FAKE_TACOS_HOST/graphql/') { ENV.fetch('TACOS_URL').to_s }
3132
end
3233

test/vcr_cassettes/tacos_pattern_iso.yml

Lines changed: 70 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

test/vcr_cassettes/tacos_suggested_resource.yml

Lines changed: 69 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)