Skip to content

Commit fdf0716

Browse files
taylor-stevetaylor-steve
authored
Merge pull request #3209 from sul-dlss/requests-turbo
Wrap the edit form in a modal and use turbo to update the origin page
2 parents 782e504 + a464c1c commit fdf0716

File tree

6 files changed

+85
-60
lines changed

6 files changed

+85
-60
lines changed

‎app/components/aeon/request_actions_component.html.erb‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
</form>
66
<% else %>
77
<% if helpers.can? :edit, request %>
8-
<%= link_to edit_aeon_request_path(request), class: 'btn btn-link su-underline p-0 me-sm-2' do %>
8+
<%= link_to edit_aeon_request_path(request), class: 'btn btn-link su-underline p-0 me-sm-2', data: { action: 'modal#open' } do %>
99
<i class="bi bi-pencil-fill me-1 align-middle"></i><span class="d-none d-sm-inline">Edit request</span>
1010
<% end %>
1111
<% end %>
@@ -30,9 +30,9 @@
3030
</div>
3131
<div class="modal-footer">
3232
<button type="button" class="btn btn-outline-primary" data-bs-dismiss="modal">No</button>
33-
<form action="<%= aeon_request_path(transaction_number) %>" method="DELETE">
33+
<%= form_with url: aeon_request_path(transaction_number), method: 'delete' do %>
3434
<button type="submit" class="btn btn-primary" data-bs-dismiss="modal">Yes - Delete</button>
35-
</form>
35+
<% end %>
3636
</div>
3737
</div>
3838
</div>

‎app/components/aeon/request_component.html.erb‎

Lines changed: 44 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,50 @@
1-
<div id="request-<%= transaction_number %>" class="request card mb-4">
2-
<div class="card-header fw-semibold p-3 ps-2 d-flex gap-1 flex-row align-items-md-center justify-content-between">
3-
<div class="d-flex flex-wrap gap-1">
4-
<span>
5-
<span class="rounded-pill <%= status_class %>">
6-
<i class="bi bi-<%= status_icon %> align-middle me-1"></i><%= status_text %>
1+
<%= helpers.turbo_frame_tag request do %>
2+
<div id="request-<%= transaction_number %>" class="request card mb-4">
3+
<div class="card-header fw-semibold p-3 ps-2 d-flex gap-1 flex-row align-items-md-center justify-content-between">
4+
<div class="d-flex flex-wrap gap-1">
5+
<span>
6+
<span class="rounded-pill <%= status_class %>">
7+
<i class="bi bi-<%= status_icon %> align-middle me-1"></i><%= status_text %>
8+
</span>
9+
</span>
10+
<% if show_appointment? %>
11+
<span class="appointment-details ms-1">
12+
<span class="fw-bold text-green"><%= appointment_date %></span>
13+
<span class="fw-normal text-nowrap text-green"><%= appointment_time_range %></span>
14+
<span class="fw-normal text-nowrap text-green"><%= appointment_reading_room_name %></span>
715
</span>
8-
</span>
9-
<% if show_appointment? %>
10-
<span class="appointment-details ms-1">
11-
<span class="fw-bold text-green"><%= appointment_date %></span>
12-
<span class="fw-normal text-nowrap text-green"><%= appointment_time_range %></span>
13-
<span class="fw-normal text-nowrap text-green"><%= appointment_reading_room_name %></span>
14-
</span>
15-
<% end %>
16-
</div>
17-
<%= render Aeon::RequestActionsComponent.new(request:) %>
18-
</div>
19-
<div class="card-body d-flex justify-content-between">
20-
<div class="metadata">
21-
<h2 class="h3"><%= title %></h2>
22-
<div class="d-flex gap-sm-3 flex-sm-row flex-wrap flex-column mb-2">
23-
<div>
24-
<%= render Icons::DocumentBox1Component.new %><%= document_type %><% if date %> (<%= date %>)<% end %>
25-
</div>
26-
<% unless request.multi_item_selector? %>
27-
<div>Call number: <%= call_number %></div>
28-
<% end %>
29-
<% if searchworks_url %>
30-
<div><a href="<%= searchworks_url %>" class="su-underline">View in SearchWorks<i class="ms-1 bi bi-arrow-up-right"></i></a></div>
3116
<% end %>
3217
</div>
33-
<div class="d-flex gap-3">
34-
<%= render Aeon::RequestItemIdentifierComponent.new(request:) %>
35-
<%= render Aeon::RequestItemDetailComponent.new(request:) %>
36-
</div>
18+
<%= render Aeon::RequestActionsComponent.new(request:) %>
3719
</div>
38-
<% if thumbnail? %>
39-
<div>
40-
<img src="" style="background-color: gray; height: 110px; width: 80px;">
20+
<div class="card-body d-flex justify-content-between">
21+
<div class="metadata">
22+
<h2 class="h3"><%= title %></h2>
23+
<div class="d-flex gap-sm-3 flex-sm-row flex-wrap flex-column mb-2">
24+
<div>
25+
<%= render Icons::DocumentBox1Component.new %><%= document_type %><% if date %> (<%= date %>)<% end %>
26+
</div>
27+
<% unless request.multi_item_selector? %>
28+
<div>Call number: <%= call_number %></div>
29+
<% end %>
30+
<% if searchworks_url %>
31+
<div><a href="<%= searchworks_url %>" class="su-underline">View in SearchWorks<i class="ms-1 bi bi-arrow-up-right"></i></a></div>
32+
<% end %>
33+
</div>
34+
<div class="d-flex gap-3">
35+
<%= render Aeon::RequestItemIdentifierComponent.new(request:) %>
36+
<%= render Aeon::RequestItemDetailComponent.new(request:) %>
37+
</div>
4138
</div>
42-
<% end %>
43-
</div>
44-
<div class="card-footer border-0 bg-white fs-14 d-flex gap-sm-3 flex-sm-row flex-column">
45-
<div>Request #<%= transaction_number %></div>
46-
<div>Date added/modified: <%= transaction_date.strftime("%B %-d, %Y %I:%M %p") %></div>
39+
<% if thumbnail? %>
40+
<div>
41+
<img src="" style="background-color: gray; height: 110px; width: 80px;">
42+
</div>
43+
<% end %>
44+
</div>
45+
<div class="card-footer border-0 bg-white fs-14 d-flex gap-sm-3 flex-sm-row flex-column">
46+
<div>Request #<%= transaction_number %></div>
47+
<div>Date added/modified: <%= transaction_date.strftime("%B %-d, %Y %I:%M %p") %></div>
48+
</div>
4749
</div>
48-
</div>
50+
<% end %>

‎app/controllers/aeon_requests_controller.rb‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -39,12 +39,14 @@ def resubmit
3939

4040
def edit
4141
authorize! :update, @aeon_request
42+
43+
request.variant = :modal if params[:modal]
4244
end
4345

4446
def update # rubocop:disable Metrics/AbcSize,Metrics/MethodLength
4547
authorize! :update, @aeon_request
4648

47-
AeonClient.new.update_request(
49+
new_request = AeonClient.new.update_request(
4850
@aeon_request.transaction_number,
4951
AeonClient::RequestData.with_defaults.with(
5052
appointment_id: aeon_request_params[:appointment_id]&.to_i,
@@ -54,16 +56,21 @@ def update # rubocop:disable Metrics/AbcSize,Metrics/MethodLength
5456
)
5557
)
5658

57-
aeon_requests_path = @aeon_request.draft? ? drafts_aeon_requests_path : submitted_aeon_requests_path
58-
redirect_to aeon_requests_path, notice: 'Request was successfully updated.'
59+
respond_to do |format|
60+
format.turbo_stream { render turbo_stream: turbo_stream.replace(new_request, Aeon::RequestComponent.new(request: new_request)) }
61+
format.html do
62+
aeon_requests_path = new_request.draft? ? drafts_aeon_requests_path : submitted_aeon_requests_path
63+
redirect_to aeon_requests_path, notice: 'Request was successfully updated.'
64+
end
65+
end
5966
end
6067

6168
def destroy
6269
authorize! :destroy, @aeon_request
6370

6471
AeonClient.new.update_request_route(transaction_number: params[:id], status: 'Cancelled by User')
6572
respond_to do |format|
66-
format.turbo_stream { render turbo_stream: turbo_stream.remove("request-#{params[:id]}") }
73+
format.turbo_stream { render turbo_stream: turbo_stream.remove(@aeon_request) }
6774
end
6875
end
6976

‎app/views/aeon_requests/_form.html.erb‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<%= form_with(model: @aeon_request, data: { turbo: true }) do |f| %>
2+
<div class="modal-body">
3+
<% if f.object.digital? %>
4+
<%= render Aeon::DigitizationFormItemComponent.new(title: f.object.volume, dom_id: 'edit_aeon_item_request', object: f.object, base_name: 'aeon_request', series: nil, subseries: nil, collapsed: false) %>
5+
<% else %>
6+
<ul id="reading" class="appointments-container list-unstyled">
7+
<%= render Aeon::AppointmentFormItemComponent.new(title: f.object.call_number, dom_id: 'edit_aeon_item_request', object: f.object, base_name: 'aeon_request', series: nil, subseries: nil, reading_room_id: f.object.reading_room.id, appointments: current_user.aeon.appointments_for(site: f.object.site)) %>
8+
</ul>
9+
<% end %>
10+
</div>
11+
12+
13+
<div class="modal-footer">
14+
<%= link_to 'Cancel', aeon_appointments_path, class: 'btn btn-outline-primary', data: { 'bs-dismiss': 'modal' } %>
15+
<%= f.submit class: 'btn btn-primary', data: { 'bs-dismiss': 'modal' } %>
16+
</div>
17+
<% end %>

‎app/views/aeon_requests/edit.html+modal.erb‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<turbo-frame id="modal-contents">
2+
<div class="modal-header">
3+
<h1 class="mb-0">Edit request</h1>
4+
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
5+
</div>
6+
<div class="modal-body">
7+
<%= render 'form' %>
8+
</div>
9+
</turbo-frame>

‎app/views/aeon_requests/edit.html.erb‎

Lines changed: 1 addition & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1 @@
1-
<%= form_with(model: @aeon_request) do |f| %>
2-
<% if f.object.digital? %>
3-
<%= render Aeon::DigitizationFormItemComponent.new(title: f.object.volume, dom_id: 'edit_aeon_item_request', object: f.object, base_name: 'aeon_request', series: nil, subseries: nil, collapsed: false) %>
4-
<% else %>
5-
<ul id="reading" class="appointments-container list-unstyled">
6-
<%= render Aeon::AppointmentFormItemComponent.new(title: f.object.call_number, dom_id: 'edit_aeon_item_request', object: f.object, base_name: 'aeon_request', series: nil, subseries: nil, reading_room_id: f.object.reading_room.id, appointments: current_user.aeon.appointments_for(site: f.object.site)) %>
7-
</ul>
8-
<% end %>
9-
10-
<%= f.submit class: 'btn btn-primary' %>
11-
<% end %>
1+
<%= render 'form' %>

0 commit comments

Comments
 (0)