Skip to content

Commit 8b2957a

Browse files
jmilljr24jmilljr24
authored
lazy load workshop show page (#680)
* lazy load workshop show page * clean up
1 parent 1c80358 commit 8b2957a

6 files changed

Lines changed: 99 additions & 18 deletions

File tree

‎app/controllers/workshops_controller.rb‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -89,8 +89,15 @@ def edit
8989
end
9090

9191
def show
92-
set_show
93-
@workshop.increment_view_count!(session: session, request: request)
92+
if turbo_frame_request?
93+
@workshop = Workshop.with_all_rich_text.find(params[:id]).decorate
94+
set_show
95+
render partial: "show_lazy", locals: { workshop: @workshop }
96+
else
97+
@workshop = Workshop.find(params[:id]).decorate
98+
@workshop.increment_view_count!(session: session, request: request)
99+
render :show
100+
end
94101
end
95102

96103
def update
@@ -155,13 +162,13 @@ def search
155162
private
156163

157164
def set_show
158-
@workshop = Workshop.find(params[:id]).decorate
159165
@quotes = Quote.where(workshop_id: @workshop.id).active
160166
@leader_spotlights = @workshop.associated_resources.leader_spotlights.where(inactive: false)
161167
@workshop_variations = @workshop.workshop_variations.active
162168
@sectors = @workshop.sectorable_items.published.map { |item| item.sector if item.sector.published }.compact if @workshop.sectorable_items.any?
163169
end
164170

171+
165172
def set_form_variables
166173
@workshop.build_primary_asset if @workshop.primary_asset.blank?
167174
@workshop.gallery_assets.build

‎app/views/workshops/_show.html.erb‎

Lines changed: 0 additions & 14 deletions
This file was deleted.

‎app/views/workshops/_show_body.html.erb‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@
4747
<li class="-mb-px mr-1 ml-auto">
4848
<a
4949
href="#workshopVariations"
50+
data-turbo="false"
5051
class="
5152
px-3 py-1 rounded bg-gray-200 text-gray-500 text-sm
5253
hover:bg-gray-300 hover:text-gray-700 transition-colors duration-200

‎app/views/workshops/_show_lazy.html.erb‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
<%= turbo_frame_tag "show_lazy" do %>
2+
<%= render "show_tags", workshop: workshop %>
3+
<%= render "show_body", workshop: workshop %>
4+
<%= render "show_associations", workshop: workshop %>
5+
<% end %>

‎app/views/workshops/_show_skeleton.html.erb‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
<div class="bg-white border border-gray-200 rounded-xl shadow p-6 animate-pulse mt-6">
2+
<!-- Top spacer -->
3+
<div class="mt-6 h-4 w-1/3 bg-gray-200 rounded"></div>
4+
5+
<!-- Tabs -->
6+
<div class="my-4">
7+
<ul class="flex border-b border-gray-300 pb-4 gap-2">
8+
<li>
9+
<div class="h-8 w-24 bg-gray-200 rounded"></div>
10+
</li>
11+
12+
<li class="ml-auto">
13+
<div class="h-7 w-40 bg-gray-200 rounded"></div>
14+
</li>
15+
</ul>
16+
17+
<!-- Content -->
18+
<div class="mt-6 ml-2 space-y-8">
19+
<!-- Section: Objective -->
20+
<div>
21+
<div class="h-5 w-32 bg-gray-300 rounded mb-2"></div>
22+
<div class="border-t border-gray-200 mb-3"></div>
23+
24+
<div class="space-y-2">
25+
<div class="h-3 w-full bg-gray-200 rounded"></div>
26+
<div class="h-3 w-11/12 bg-gray-200 rounded"></div>
27+
<div class="h-3 w-10/12 bg-gray-200 rounded"></div>
28+
</div>
29+
</div>
30+
31+
<!-- Section: Materials -->
32+
<div>
33+
<div class="h-5 w-32 bg-gray-300 rounded mb-2"></div>
34+
<div class="border-t border-gray-200 mb-3"></div>
35+
36+
<div class="space-y-2">
37+
<div class="h-3 w-1/2 bg-gray-200 rounded"></div>
38+
<div class="h-3 w-1/3 bg-gray-200 rounded"></div>
39+
<div class="h-3 w-2/5 bg-gray-200 rounded"></div>
40+
</div>
41+
</div>
42+
43+
<!-- Section: Introduction -->
44+
<div>
45+
<div class="h-5 w-40 bg-gray-300 rounded mb-2"></div>
46+
<div class="border-t border-gray-200 mb-3"></div>
47+
48+
<div class="space-y-2">
49+
<div class="h-3 w-full bg-gray-200 rounded"></div>
50+
<div class="h-3 w-full bg-gray-200 rounded"></div>
51+
<div class="h-3 w-5/6 bg-gray-200 rounded"></div>
52+
<div class="h-3 w-4/6 bg-gray-200 rounded"></div>
53+
</div>
54+
</div>
55+
56+
<!-- Section: Gallery -->
57+
<div>
58+
<div class="h-5 w-28 bg-gray-300 rounded mb-2"></div>
59+
<div class="border-t border-gray-200 mb-4"></div>
60+
61+
<div class="flex flex-wrap gap-4">
62+
<% 3.times do %>
63+
<div class="w-32 h-32 bg-gray-200 rounded border border-gray-300"></div>
64+
<% end %>
65+
</div>
66+
</div>
67+
</div>
68+
</div>
69+
</div>

‎app/views/workshops/show.html.erb‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,14 @@
1-
<%= render "show" %>
1+
<div class="workshop-show max-w-7xl mx-auto <%= DomainTheme.bg_class_for(:workshops) %> border border-gray-200 rounded-xl shadow p-6">
2+
<div class="flex flex-col gap-6">
3+
<!-- Main Workshop Show -->
4+
<div id="show" class="flex-1">
5+
<!-- Tabs -->
6+
<%= render "show_header", workshop: @workshop %>
7+
<%= render "show_actions_row", workshop: @workshop %>
8+
9+
<%= turbo_frame_tag "show_lazy", src: workshop_path(@workshop), data: {turbo: false} do %>
10+
<%= render 'show_skeleton' %>
11+
<% end %>
12+
</div>
13+
</div>
14+
</div>

0 commit comments

Comments
 (0)