From 58c411189dd826948a3c12951649e14058d1304f Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Wed, 6 Nov 2024 14:48:28 +0100 Subject: [PATCH 01/11] Update Speaker Show Page to match design with other pages --- app/components/ui/button_component.rb | 3 +- app/views/speakers/_actions.html.erb | 4 +- .../{_about.html.erb => _socials.html.erb} | 38 +++----- app/views/speakers/actions/_admin.html.erb | 40 ++++---- .../speakers/actions/_anonymous.html.erb | 4 +- app/views/speakers/actions/_owner.html.erb | 3 +- .../speakers/actions/_signed_in.html.erb | 2 +- app/views/speakers/show.html.erb | 93 ++++++++++++------- 8 files changed, 97 insertions(+), 90 deletions(-) rename app/views/speakers/{_about.html.erb => _socials.html.erb} (50%) diff --git a/app/components/ui/button_component.rb b/app/components/ui/button_component.rb index 863ae6af8..47d1d13f6 100644 --- a/app/components/ui/button_component.rb +++ b/app/components/ui/button_component.rb @@ -11,7 +11,8 @@ class Ui::ButtonComponent < ApplicationComponent warning: "btn-warning", error: "btn-error", ghost: "btn-ghost", - link: "btn-link" + link: "btn-link", + none: "", } SIZE_MAPPING = { diff --git a/app/views/speakers/_actions.html.erb b/app/views/speakers/_actions.html.erb index 3f3ef2f53..5b0d5ae68 100644 --- a/app/views/speakers/_actions.html.erb +++ b/app/views/speakers/_actions.html.erb @@ -1,3 +1 @@ -
- <%= render "speakers/actions/#{user_kind}", speaker: speaker %> -
+<%= render "speakers/actions/#{user_kind}", speaker: speaker %> diff --git a/app/views/speakers/_about.html.erb b/app/views/speakers/_socials.html.erb similarity index 50% rename from app/views/speakers/_about.html.erb rename to app/views/speakers/_socials.html.erb index 883093eb2..1e4efea84 100644 --- a/app/views/speakers/_about.html.erb +++ b/app/views/speakers/_socials.html.erb @@ -1,51 +1,39 @@ -
-
+
+
<% if speaker.github.present? %> - <%= link_to "https://www.github.com/#{speaker.github}", target: "_blank", class: "hover:fill-gray-500" do %> + <%= link_to "https://www.github.com/#{speaker.github}", target: "_blank", class: "hover:bg-black hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.github } do %> <%= fab("github") %> <% end %> <% end %> <% if speaker.twitter.present? %> - <%= link_to "https://www.x.com/#{speaker.twitter}", target: "_blank", class: "hover:fill-gray-500" do %> + <%= link_to "https://www.x.com/#{speaker.twitter}", target: "_blank", class: "hover:bg-[#74C0FC] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.twitter } do %> <%= fab("twitter") %> <% end %> <% end %> + <% if speaker.bsky.present? %> + <%= link_to "https://bsky.app/profile/#{speaker.bsky}", target: "_blank", class: "hover:bg-[#0085FF] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.bsky } do %> + <%= fab("bluesky") %> + <% end %> + <% end %> + <% if speaker.mastodon.present? %> - <%= link_to speaker.mastodon, target: "_blank", class: "hover:fill-gray-500" do %> + <%= link_to speaker.mastodon, target: "_blank", class: "hover:bg-[#6364FF] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.mastodon } do %> <%= fab("mastodon") %> <% end %> <% end %> <% if speaker.linkedin.present? %> - <%= link_to "https://www.linkedin.com/in/#{speaker.linkedin}", target: "_blank", class: "hover:fill-gray-500" do %> + <%= link_to "https://www.linkedin.com/in/#{speaker.linkedin}", target: "_blank", class: "hover:bg-[#0A66C2] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.linkedin } do %> <%= fab("linkedin") %> <% end %> <% end %> - <% if speaker.bsky.present? %> - <%= link_to "https://bsky.app/profile/#{speaker.bsky}", target: "_blank", class: "hover:fill-gray-500" do %> - <%= fab("bluesky") %> - <% end %> - <% end %> - <% if speaker.speakerdeck.present? %> - <%= link_to "https://speakerdeck.com/#{speaker.speakerdeck}", target: "_blank", class: "hover:fill-gray-500" do %> + <%= link_to "https://speakerdeck.com/#{speaker.speakerdeck}", target: "_blank", class: "hover:bg-[#009287] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.speakerdeck } do %> <%= fab("speaker-deck") %> <% end %> <% end %>
- - <% if speaker.website.present? %> - - Website: <%= link_to speaker.website, speaker.valid_website_url, target: "_blank" %> - - <% end %> - - <% if speaker.bio.present? %> - - Bio: <%= speaker.bio %> - - <% end %>
diff --git a/app/views/speakers/actions/_admin.html.erb b/app/views/speakers/actions/_admin.html.erb index a478afb42..18a2db78e 100644 --- a/app/views/speakers/actions/_admin.html.erb +++ b/app/views/speakers/actions/_admin.html.erb @@ -1,26 +1,24 @@ -
- <%= ui_button url: edit_speaker_path(@speaker), - kind: :secondary, - data: {turbo_frame: "modal"}, - outline: true, - size: :sm do %> - <%= heroicon :pencil_square %> - Update speaker page - <% end %> +<%= ui_button url: edit_speaker_path(@speaker), + kind: :none, + data: {turbo_frame: "modal"}, + size: :sm, + class: "w-full" do %> + <%= heroicon :pencil_square %> + Update speaker page +<% end %> - <% if speaker.github.present? %> - <%= ui_button url: speakers_enhance_path(@speaker), method: :put, kind: :ghost, size: :sm do %> - Fetch from GitHub - <% end %> +<% if speaker.github.present? %> + <%= ui_button url: speakers_enhance_path(@speaker), method: :put, kind: :none, size: :sm, class: "w-full", form_class: "w-full" do %> + Fetch from GitHub <% end %> +<% end %> - <%= ui_button url: avo.resources_speaker_path(@speaker), target: :_blank, kind: :ghost, size: :sm do %> - Open in Avo - <% end %> +<%= ui_button url: avo.resources_speaker_path(@speaker), target: :_blank, kind: :none, size: :sm, class: "w-full" do %> + Open in Avo +<% end %> - <% if Rails.env.development? %> - <%= ui_button url: speaker_url(@speaker, host: "https://rubyvideo.dev", port: 443), target: :_blank, kind: :ghost, size: :sm do %> - Show on RubyVideo.dev - <% end %> +<% if Rails.env.development? %> + <%= ui_button url: speaker_url(@speaker, host: "https://rubyvideo.dev", port: 443), target: :_blank, kind: :none, size: :sm, class: "w-full" do %> + Show on RubyVideo.dev <% end %> -
+<% end %> diff --git a/app/views/speakers/actions/_anonymous.html.erb b/app/views/speakers/actions/_anonymous.html.erb index 2c00bf858..35615a51a 100644 --- a/app/views/speakers/actions/_anonymous.html.erb +++ b/app/views/speakers/actions/_anonymous.html.erb @@ -4,12 +4,12 @@ <% end %> <% else %> <% if !speaker.verified? %> - <%= ui_button url: edit_speaker_path(speaker), kind: :secondary, outline: true, size: :sm, data: {turbo_frame: "modal"} do %> + <%= ui_button url: edit_speaker_path(speaker), kind: :none, size: :sm, data: {turbo_frame: "modal"} do %> <%= heroicon :pencil_square %> Suggest improvements <% end %> -
+
Are you <%= speaker.name %>? <%= link_to sign_in_path, class: "link link-neutral font-light", data: {turbo_frame: "modal"} do %> Claim your profile to manage and edit content. diff --git a/app/views/speakers/actions/_owner.html.erb b/app/views/speakers/actions/_owner.html.erb index 3d16a91a8..1c66e976f 100644 --- a/app/views/speakers/actions/_owner.html.erb +++ b/app/views/speakers/actions/_owner.html.erb @@ -1,5 +1,4 @@ - -<%= ui_button url: edit_speaker_path(speaker), kind: :secondary, outline: true, size: :sm, data: {turbo_frame: "modal"} do %> +<%= ui_button url: edit_speaker_path(speaker), kind: :none, size: :sm, data: {turbo_frame: "modal"} do %> <%= heroicon :pencil_square %> Update my profile <% end %> diff --git a/app/views/speakers/actions/_signed_in.html.erb b/app/views/speakers/actions/_signed_in.html.erb index 9a2df2d33..60d510510 100644 --- a/app/views/speakers/actions/_signed_in.html.erb +++ b/app/views/speakers/actions/_signed_in.html.erb @@ -3,7 +3,7 @@ Help us improve the speaker profile by adding a GitHub handle <% end %> <% else %> - <%= ui_button url: edit_speaker_path(speaker), kind: :secondary, outline: true, size: :sm, data: {turbo_frame: "modal"} do %> + <%= ui_button url: edit_speaker_path(speaker), kind: :none, size: :sm, data: {turbo_frame: "modal"} do %> <%= heroicon :pencil_square %> Suggest improvements <% end %> diff --git a/app/views/speakers/show.html.erb b/app/views/speakers/show.html.erb index 81c3e5ffb..d3ed90735 100644 --- a/app/views/speakers/show.html.erb +++ b/app/views/speakers/show.html.erb @@ -1,48 +1,71 @@ <%= turbo_refreshes_with method: :morph, scroll: :preserve %> +<%= turbo_stream_from @speaker %>
-
-
-

- <%= @speaker.name %> +
+
+
+ <%= image_tag @speaker.github_avatar_url(size: 200), + class: "rounded-full border border-[#D9DFE3] size-24 md:size-36", + height: 200, + width: 200, + alt: "GitHub picture profile of #{@speaker.github}", + loading: :lazy %> - <% if @speaker.pronouns.present? && ["dont_specify", "not_specified"].exclude?(@speaker.pronouns_type) %> - (<%= @speaker.pronouns %>) + <% if @speaker.verified? %> +
+ <%= fa("badge-check", class: "fill-white", size: :xs) %> + + Verified +
<% end %> -

- - <% if @speaker.github.present? %> -
- <%= image_tag @speaker.github_avatar_url(size: 200), - class: "rounded-full mb-4", - height: 200, - width: 200, - alt: "GitHub picture profile of #{@speaker.github}", - loading: :lazy %> - - <% if @speaker.verified? %> -
Verified
+
+ +
+

+ <%= @speaker.name %> + + <% if @speaker.pronouns.present? && ["dont_specify", "not_specified"].exclude?(@speaker.pronouns_type) %> + (<%= @speaker.pronouns %>) <% end %> +

+ +

+ <%= @speaker.bio %> +

+ +
+ <%= render "speakers/socials", speaker: @speaker %>
- <% end %> - <%= render "speakers/about", speaker: @speaker %> - <%= render "speakers/actions", speaker: @speaker %> +
-
-
- <%= render partial: "talks/card", - collection: @talks, - as: :talk, - locals: { - favoritable: true, - user_favorite_talks_ids: @user_favorite_talks_ids, - back_to: request.fullpath, - back_to_title: @speaker.name - } %> -
+
+ <%= link_to "Visit Website", @speaker.website, class: "btn btn-sm btn-primary w-full tooltip tooltip-bottom flex place-content-center", target: "_blank", data: { tip: @speaker.website } %> + <%= render "speakers/actions", speaker: @speaker %>
- <%= turbo_stream_from @speaker %> + +
+ +
+ <% if @speaker.talks.any? %> + + +
+
+ <%= render partial: "talks/card", + collection: @talks, + as: :talk, + locals: { + favoritable: true, + user_favorite_talks_ids: @user_favorite_talks_ids, + back_to: request.fullpath, + back_to_title: @speaker.name + } %> +
+
+ <% end %> +
From ba546ac156911d9a9fa28ad9932930b92064673d Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Wed, 6 Nov 2024 14:57:55 +0100 Subject: [PATCH 02/11] Only show website button if speaker has website --- app/views/speakers/show.html.erb | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/app/views/speakers/show.html.erb b/app/views/speakers/show.html.erb index d3ed90735..cfee89610 100644 --- a/app/views/speakers/show.html.erb +++ b/app/views/speakers/show.html.erb @@ -41,7 +41,9 @@
- <%= link_to "Visit Website", @speaker.website, class: "btn btn-sm btn-primary w-full tooltip tooltip-bottom flex place-content-center", target: "_blank", data: { tip: @speaker.website } %> + <% if @speaker.website %> + <%= link_to "Visit Website", @speaker.website, class: "btn btn-sm btn-primary w-full tooltip tooltip-bottom flex place-content-center", target: "_blank", data: { tip: @speaker.website } %> + <% end %> <%= render "speakers/actions", speaker: @speaker %>
From 425cee8eb9de3b6ee0565883f18be706f15ed44b Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Wed, 6 Nov 2024 15:54:02 +0100 Subject: [PATCH 03/11] Show topic badge list on speaker profile --- app/controllers/speakers_controller.rb | 3 +++ app/javascript/controllers/index.js | 3 +++ .../controllers/toggable_controller.js | 27 +++++++++++++++++++ app/models/speaker.rb | 1 + app/views/speakers/show.html.erb | 5 ++++ app/views/talks/_talk.html.erb | 8 +----- app/views/topics/_badge.html.erb | 3 +++ app/views/topics/_badge_list.html.erb | 16 +++++++++++ 8 files changed, 59 insertions(+), 7 deletions(-) create mode 100644 app/javascript/controllers/toggable_controller.js create mode 100644 app/views/topics/_badge.html.erb create mode 100644 app/views/topics/_badge_list.html.erb diff --git a/app/controllers/speakers_controller.rb b/app/controllers/speakers_controller.rb index b1705f106..ee2af03fb 100644 --- a/app/controllers/speakers_controller.rb +++ b/app/controllers/speakers_controller.rb @@ -22,7 +22,10 @@ def index # GET /speakers/1 def show @talks = @speaker.talks.with_essential_card_data.order(date: :desc) + @topics = @speaker.topics.approved.tally.sort_by(&:last).reverse.map(&:first) + @back_path = speakers_path + set_meta_tags(@speaker) # fresh_when(@speaker) end diff --git a/app/javascript/controllers/index.js b/app/javascript/controllers/index.js index 344e79b2e..b01291b6a 100644 --- a/app/javascript/controllers/index.js +++ b/app/javascript/controllers/index.js @@ -22,6 +22,9 @@ application.register("scroll-position", ScrollPositionController) import SplideController from "./splide_controller" application.register("splide", SplideController) +import ToggableController from "./toggable_controller" +application.register("toggable", ToggableController) + import TransitionController from "./transition_controller" application.register("transition", TransitionController) diff --git a/app/javascript/controllers/toggable_controller.js b/app/javascript/controllers/toggable_controller.js new file mode 100644 index 000000000..83581dd7a --- /dev/null +++ b/app/javascript/controllers/toggable_controller.js @@ -0,0 +1,27 @@ +import { Controller } from "@hotwired/stimulus" + +export default class extends Controller { + static targets = ["toggable", "toggle"] + + static values = { + hideText: { + type: String, + default: "hide" + } + } + + connect() { + this.toggleText = this.toggleTarget.textContent + } + + toggle() { + this.toggleTarget.textContent = this.nextToggleText + this.toggableTargets.forEach(toggable => toggable.classList.toggle("hidden")) + } + + get nextToggleText() { + return (this.toggleTarget.textContent === this.toggleText) + ? this.hideTextValue + : this.toggleText + } +} diff --git a/app/models/speaker.rb b/app/models/speaker.rb index 0d9157db0..724190313 100644 --- a/app/models/speaker.rb +++ b/app/models/speaker.rb @@ -41,6 +41,7 @@ class Speaker < ApplicationRecord has_many :speaker_talks, dependent: :destroy, inverse_of: :speaker, foreign_key: :speaker_id has_many :talks, through: :speaker_talks, inverse_of: :speakers has_many :aliases, class_name: "Speaker", foreign_key: "canonical_id" + has_many :topics, through: :talks belongs_to :canonical, class_name: "Speaker", optional: true belongs_to :user, primary_key: :github_handle, foreign_key: :github, optional: true diff --git a/app/views/speakers/show.html.erb b/app/views/speakers/show.html.erb index cfee89610..a7887b0be 100644 --- a/app/views/speakers/show.html.erb +++ b/app/views/speakers/show.html.erb @@ -48,6 +48,11 @@
+ <% if @topics.any? %> +
+ <%= render partial: "topics/badge_list", locals: { topics: @topics, back_to_url: request.fullpath, back_to_title: @speaker.name } %> +
+ <% end %>
diff --git a/app/views/talks/_talk.html.erb b/app/views/talks/_talk.html.erb index 72f384238..78629bed5 100644 --- a/app/views/talks/_talk.html.erb +++ b/app/views/talks/_talk.html.erb @@ -110,13 +110,7 @@
<% if talk.approved_topics.any? %> -
- <% talk.approved_topics.each do |topic| %> - <%= link_to topic_path(topic, back_to: request.fullpath, back_to_title: talk.title) do %> -
#<%= topic.name.parameterize %>
- <% end %> - <% end %> -
+ <%= render partial: "topics/badge_list", locals: { topics: talk.approved_topics, back_to_url: request.fullpath, back_to_title: talk.title } %> <% end %>
diff --git a/app/views/topics/_badge.html.erb b/app/views/topics/_badge.html.erb new file mode 100644 index 000000000..44ee8c430 --- /dev/null +++ b/app/views/topics/_badge.html.erb @@ -0,0 +1,3 @@ +<%= link_to topic_path(topic, back_to: back_to_url, back_to_title: back_to_title) do %> +
#<%= topic.name.parameterize %>
+<% end %> diff --git a/app/views/topics/_badge_list.html.erb b/app/views/topics/_badge_list.html.erb new file mode 100644 index 000000000..f481b93ff --- /dev/null +++ b/app/views/topics/_badge_list.html.erb @@ -0,0 +1,16 @@ +<% limit ||= 8 %> +<% more_topics = topics.to_a.from(limit) %> + +
+ <%= render partial: "topics/badge", collection: topics.first(limit), as: :topic, locals: { back_to_url: back_to_url, back_to_title: back_to_title } %> + + <% more_topics.each do |topic| %> + + <% end %> + + <% if more_topics.any? %> + <%= more_topics.count %> more + <% end %> +
From a9617b3aabd105b99f24fc2d2e0a944d7e20d964 Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Wed, 6 Nov 2024 16:02:16 +0100 Subject: [PATCH 04/11] Lint --- app/components/ui/button_component.rb | 2 +- app/javascript/controllers/toggable_controller.js | 14 +++++++------- app/views/speakers/_socials.html.erb | 12 ++++++------ app/views/speakers/show.html.erb | 4 ++-- app/views/talks/_talk.html.erb | 2 +- app/views/topics/_badge_list.html.erb | 4 ++-- 6 files changed, 19 insertions(+), 19 deletions(-) diff --git a/app/components/ui/button_component.rb b/app/components/ui/button_component.rb index 47d1d13f6..977a62864 100644 --- a/app/components/ui/button_component.rb +++ b/app/components/ui/button_component.rb @@ -12,7 +12,7 @@ class Ui::ButtonComponent < ApplicationComponent error: "btn-error", ghost: "btn-ghost", link: "btn-link", - none: "", + none: "" } SIZE_MAPPING = { diff --git a/app/javascript/controllers/toggable_controller.js b/app/javascript/controllers/toggable_controller.js index 83581dd7a..c6e732c3e 100644 --- a/app/javascript/controllers/toggable_controller.js +++ b/app/javascript/controllers/toggable_controller.js @@ -1,25 +1,25 @@ -import { Controller } from "@hotwired/stimulus" +import { Controller } from '@hotwired/stimulus' export default class extends Controller { - static targets = ["toggable", "toggle"] + static targets = ['toggable', 'toggle'] static values = { hideText: { type: String, - default: "hide" + default: 'hide' } } - connect() { + connect () { this.toggleText = this.toggleTarget.textContent } - toggle() { + toggle () { this.toggleTarget.textContent = this.nextToggleText - this.toggableTargets.forEach(toggable => toggable.classList.toggle("hidden")) + this.toggableTargets.forEach(toggable => toggable.classList.toggle('hidden')) } - get nextToggleText() { + get nextToggleText () { return (this.toggleTarget.textContent === this.toggleText) ? this.hideTextValue : this.toggleText diff --git a/app/views/speakers/_socials.html.erb b/app/views/speakers/_socials.html.erb index 1e4efea84..97bc8b31e 100644 --- a/app/views/speakers/_socials.html.erb +++ b/app/views/speakers/_socials.html.erb @@ -1,37 +1,37 @@
<% if speaker.github.present? %> - <%= link_to "https://www.github.com/#{speaker.github}", target: "_blank", class: "hover:bg-black hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.github } do %> + <%= link_to "https://www.github.com/#{speaker.github}", target: "_blank", class: "hover:bg-black hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: {tip: speaker.github} do %> <%= fab("github") %> <% end %> <% end %> <% if speaker.twitter.present? %> - <%= link_to "https://www.x.com/#{speaker.twitter}", target: "_blank", class: "hover:bg-[#74C0FC] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.twitter } do %> + <%= link_to "https://www.x.com/#{speaker.twitter}", target: "_blank", class: "hover:bg-[#74C0FC] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: {tip: speaker.twitter} do %> <%= fab("twitter") %> <% end %> <% end %> <% if speaker.bsky.present? %> - <%= link_to "https://bsky.app/profile/#{speaker.bsky}", target: "_blank", class: "hover:bg-[#0085FF] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.bsky } do %> + <%= link_to "https://bsky.app/profile/#{speaker.bsky}", target: "_blank", class: "hover:bg-[#0085FF] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: {tip: speaker.bsky} do %> <%= fab("bluesky") %> <% end %> <% end %> <% if speaker.mastodon.present? %> - <%= link_to speaker.mastodon, target: "_blank", class: "hover:bg-[#6364FF] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.mastodon } do %> + <%= link_to speaker.mastodon, target: "_blank", class: "hover:bg-[#6364FF] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: {tip: speaker.mastodon} do %> <%= fab("mastodon") %> <% end %> <% end %> <% if speaker.linkedin.present? %> - <%= link_to "https://www.linkedin.com/in/#{speaker.linkedin}", target: "_blank", class: "hover:bg-[#0A66C2] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.linkedin } do %> + <%= link_to "https://www.linkedin.com/in/#{speaker.linkedin}", target: "_blank", class: "hover:bg-[#0A66C2] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: {tip: speaker.linkedin} do %> <%= fab("linkedin") %> <% end %> <% end %> <% if speaker.speakerdeck.present? %> - <%= link_to "https://speakerdeck.com/#{speaker.speakerdeck}", target: "_blank", class: "hover:bg-[#009287] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: { tip: @speaker.speakerdeck } do %> + <%= link_to "https://speakerdeck.com/#{speaker.speakerdeck}", target: "_blank", class: "hover:bg-[#009287] hover:fill-white bg-white border rounded-full p-2 tooltip tooltip-top", data: {tip: speaker.speakerdeck} do %> <%= fab("speaker-deck") %> <% end %> <% end %> diff --git a/app/views/speakers/show.html.erb b/app/views/speakers/show.html.erb index a7887b0be..ae94d127a 100644 --- a/app/views/speakers/show.html.erb +++ b/app/views/speakers/show.html.erb @@ -42,7 +42,7 @@
<% if @speaker.website %> - <%= link_to "Visit Website", @speaker.website, class: "btn btn-sm btn-primary w-full tooltip tooltip-bottom flex place-content-center", target: "_blank", data: { tip: @speaker.website } %> + <%= link_to "Visit Website", @speaker.website, class: "btn btn-sm btn-primary w-full tooltip tooltip-bottom flex place-content-center", target: "_blank", data: {tip: @speaker.website} %> <% end %> <%= render "speakers/actions", speaker: @speaker %>
@@ -50,7 +50,7 @@ <% if @topics.any? %>
- <%= render partial: "topics/badge_list", locals: { topics: @topics, back_to_url: request.fullpath, back_to_title: @speaker.name } %> + <%= render partial: "topics/badge_list", locals: {topics: @topics, back_to_url: request.fullpath, back_to_title: @speaker.name} %>
<% end %> diff --git a/app/views/talks/_talk.html.erb b/app/views/talks/_talk.html.erb index 78629bed5..b256aba8d 100644 --- a/app/views/talks/_talk.html.erb +++ b/app/views/talks/_talk.html.erb @@ -110,7 +110,7 @@
<% if talk.approved_topics.any? %> - <%= render partial: "topics/badge_list", locals: { topics: talk.approved_topics, back_to_url: request.fullpath, back_to_title: talk.title } %> + <%= render partial: "topics/badge_list", locals: {topics: talk.approved_topics, back_to_url: request.fullpath, back_to_title: talk.title} %> <% end %>
diff --git a/app/views/topics/_badge_list.html.erb b/app/views/topics/_badge_list.html.erb index f481b93ff..3a5a15763 100644 --- a/app/views/topics/_badge_list.html.erb +++ b/app/views/topics/_badge_list.html.erb @@ -2,11 +2,11 @@ <% more_topics = topics.to_a.from(limit) %>
- <%= render partial: "topics/badge", collection: topics.first(limit), as: :topic, locals: { back_to_url: back_to_url, back_to_title: back_to_title } %> + <%= render partial: "topics/badge", collection: topics.first(limit), as: :topic, locals: {back_to_url: back_to_url, back_to_title: back_to_title} %> <% more_topics.each do |topic| %> <% end %> From 56805c945a1614d871f9a78f6f0c84a1d6fcc253 Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Wed, 6 Nov 2024 16:16:18 +0100 Subject: [PATCH 05/11] Fix speaker broadcast when updating data --- app/jobs/speaker/enhance_profile_job.rb | 2 +- app/models/speaker.rb | 4 +-- app/views/speakers/_header.html.erb | 45 ++++++++++++++++++++++++ app/views/speakers/show.html.erb | 46 +------------------------ test/system/speakers_test.rb | 2 +- 5 files changed, 50 insertions(+), 49 deletions(-) create mode 100644 app/views/speakers/_header.html.erb diff --git a/app/jobs/speaker/enhance_profile_job.rb b/app/jobs/speaker/enhance_profile_job.rb index ef57899b6..422d619e0 100644 --- a/app/jobs/speaker/enhance_profile_job.rb +++ b/app/jobs/speaker/enhance_profile_job.rb @@ -14,7 +14,7 @@ def perform(speaker:, sleep: 0) website: speaker.website.presence || matching_profile.blog || "" ) end - speaker.broadcast_about + speaker.broadcast_header sleep(sleep) end diff --git a/app/models/speaker.rb b/app/models/speaker.rb index 724190313..16413eb6c 100644 --- a/app/models/speaker.rb +++ b/app/models/speaker.rb @@ -118,8 +118,8 @@ def github_avatar_url(size: 200) "https://github.com/#{github}.png?size=#{size}" end - def broadcast_about - broadcast_update_to self, target: dom_id(self, :about), partial: "speakers/about", locals: {speaker: self} + def broadcast_header + broadcast_update_to self, target: dom_id(self, :header), partial: "speakers/header", locals: {speaker: self} end def valid_website_url diff --git a/app/views/speakers/_header.html.erb b/app/views/speakers/_header.html.erb new file mode 100644 index 000000000..61806445e --- /dev/null +++ b/app/views/speakers/_header.html.erb @@ -0,0 +1,45 @@ +
+
+
+ <%= image_tag speaker.github_avatar_url(size: 200), + class: "rounded-full border border-[#D9DFE3] size-24 md:size-36", + height: 200, + width: 200, + alt: "GitHub picture profile of #{speaker.github}", + loading: :lazy %> + + <% if speaker.verified? %> +
+ <%= fa("badge-check", class: "fill-white", size: :xs) %> + + Verified +
+ <% end %> +
+ +
+

+ <%= speaker.name %> + + <% if speaker.pronouns.present? && ["dont_specify", "not_specified"].exclude?(speaker.pronouns_type) %> + (<%= speaker.pronouns %>) + <% end %> +

+ +

+ <%= speaker.bio %> +

+ +
+ <%= render "speakers/socials", speaker: speaker %> +
+
+
+ +
+ <% if speaker.website.present? %> + <%= link_to "Visit Website", speaker.website, class: "btn btn-sm btn-primary w-full tooltip tooltip-bottom flex place-content-center", target: "_blank", data: {tip: speaker.website} %> + <% end %> + <%= render "speakers/actions", speaker: speaker %> +
+
diff --git a/app/views/speakers/show.html.erb b/app/views/speakers/show.html.erb index ae94d127a..7ad0c3141 100644 --- a/app/views/speakers/show.html.erb +++ b/app/views/speakers/show.html.erb @@ -2,51 +2,7 @@ <%= turbo_stream_from @speaker %>
-
-
-
- <%= image_tag @speaker.github_avatar_url(size: 200), - class: "rounded-full border border-[#D9DFE3] size-24 md:size-36", - height: 200, - width: 200, - alt: "GitHub picture profile of #{@speaker.github}", - loading: :lazy %> - - <% if @speaker.verified? %> -
- <%= fa("badge-check", class: "fill-white", size: :xs) %> - - Verified -
- <% end %> -
- -
-

- <%= @speaker.name %> - - <% if @speaker.pronouns.present? && ["dont_specify", "not_specified"].exclude?(@speaker.pronouns_type) %> - (<%= @speaker.pronouns %>) - <% end %> -

- -

- <%= @speaker.bio %> -

- -
- <%= render "speakers/socials", speaker: @speaker %> -
-
-
- -
- <% if @speaker.website %> - <%= link_to "Visit Website", @speaker.website, class: "btn btn-sm btn-primary w-full tooltip tooltip-bottom flex place-content-center", target: "_blank", data: {tip: @speaker.website} %> - <% end %> - <%= render "speakers/actions", speaker: @speaker %> -
-
+ <%= render partial: "speakers/header", locals: {speaker: @speaker} %> <% if @topics.any? %>
diff --git a/test/system/speakers_test.rb b/test/system/speakers_test.rb index 715aacd94..7de85ff92 100644 --- a/test/system/speakers_test.rb +++ b/test/system/speakers_test.rb @@ -27,7 +27,7 @@ class SpeakersTest < ApplicationSystemTestCase wait_for_turbo_stream_connected(streamable: @speaker) @speaker.update(bio: "New bio") - @speaker.broadcast_about + @speaker.broadcast_header assert_text "New bio" end From f4acade6b4e9fe165bf1e95c5d3ba46c8f10abf3 Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Thu, 7 Nov 2024 18:06:17 +0100 Subject: [PATCH 06/11] Add action icons, remove gray bg, remove primary button colors --- .../fontawesome/arrow-up-right-from-square-solid.svg | 1 + app/assets/images/icons/fontawesome/avocado-solid.svg | 1 + app/assets/images/icons/fontawesome/browser-solid.svg | 1 + app/assets/images/icons/fontawesome/pen-solid.svg | 1 + app/views/events/show.html.erb | 2 +- app/views/speakers/_header.html.erb | 7 +++++-- app/views/speakers/actions/_admin.html.erb | 6 +++++- app/views/speakers/actions/_anonymous.html.erb | 10 +++++----- app/views/speakers/actions/_owner.html.erb | 2 +- app/views/speakers/actions/_signed_in.html.erb | 2 +- app/views/speakers/show.html.erb | 2 +- 11 files changed, 23 insertions(+), 12 deletions(-) create mode 100644 app/assets/images/icons/fontawesome/arrow-up-right-from-square-solid.svg create mode 100644 app/assets/images/icons/fontawesome/avocado-solid.svg create mode 100644 app/assets/images/icons/fontawesome/browser-solid.svg create mode 100644 app/assets/images/icons/fontawesome/pen-solid.svg diff --git a/app/assets/images/icons/fontawesome/arrow-up-right-from-square-solid.svg b/app/assets/images/icons/fontawesome/arrow-up-right-from-square-solid.svg new file mode 100644 index 000000000..d00a2680a --- /dev/null +++ b/app/assets/images/icons/fontawesome/arrow-up-right-from-square-solid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/images/icons/fontawesome/avocado-solid.svg b/app/assets/images/icons/fontawesome/avocado-solid.svg new file mode 100644 index 000000000..93e055d43 --- /dev/null +++ b/app/assets/images/icons/fontawesome/avocado-solid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/images/icons/fontawesome/browser-solid.svg b/app/assets/images/icons/fontawesome/browser-solid.svg new file mode 100644 index 000000000..5be26b791 --- /dev/null +++ b/app/assets/images/icons/fontawesome/browser-solid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/assets/images/icons/fontawesome/pen-solid.svg b/app/assets/images/icons/fontawesome/pen-solid.svg new file mode 100644 index 000000000..a334f2a65 --- /dev/null +++ b/app/assets/images/icons/fontawesome/pen-solid.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/views/events/show.html.erb b/app/views/events/show.html.erb index 45855134c..f4fcd150b 100644 --- a/app/views/events/show.html.erb +++ b/app/views/events/show.html.erb @@ -20,7 +20,7 @@
- <%= link_to "Visit Website", @event.website, class: "btn btn-primary w-full", target: "_blank" %> + <%= link_to "Visit Website", @event.website, class: "btn btn-neutral w-full", target: "_blank" %> <%= link_to "View all #{@event.organisation.name} events", @event.organisation, class: "btn w-full" %>
diff --git a/app/views/speakers/_header.html.erb b/app/views/speakers/_header.html.erb index 61806445e..a51d15cc4 100644 --- a/app/views/speakers/_header.html.erb +++ b/app/views/speakers/_header.html.erb @@ -36,10 +36,13 @@
-
+
<% if speaker.website.present? %> - <%= link_to "Visit Website", speaker.website, class: "btn btn-sm btn-primary w-full tooltip tooltip-bottom flex place-content-center", target: "_blank", data: {tip: speaker.website} %> + <%= link_to speaker.website, class: "btn btn-sm btn-neutral w-full tooltip tooltip-bottom flex place-content-center", target: "_blank", data: {tip: speaker.website} do %> + <%= fa "arrow-up-right-from-square", size: :xs, class: "fill-white" %> Visit Website + <% end %> <% end %> + <%= render "speakers/actions", speaker: speaker %>
diff --git a/app/views/speakers/actions/_admin.html.erb b/app/views/speakers/actions/_admin.html.erb index 18a2db78e..2c23d17c7 100644 --- a/app/views/speakers/actions/_admin.html.erb +++ b/app/views/speakers/actions/_admin.html.erb @@ -3,22 +3,26 @@ data: {turbo_frame: "modal"}, size: :sm, class: "w-full" do %> - <%= heroicon :pencil_square %> + <%= fa :pen, size: :xs %> Update speaker page <% end %> <% if speaker.github.present? %> <%= ui_button url: speakers_enhance_path(@speaker), method: :put, kind: :none, size: :sm, class: "w-full", form_class: "w-full" do %> + <%= fab :github, size: :xs %> Fetch from GitHub <% end %> <% end %> <%= ui_button url: avo.resources_speaker_path(@speaker), target: :_blank, kind: :none, size: :sm, class: "w-full" do %> + <%= fa :avocado, size: :xs %> + Open in Avo <% end %> <% if Rails.env.development? %> <%= ui_button url: speaker_url(@speaker, host: "https://rubyvideo.dev", port: 443), target: :_blank, kind: :none, size: :sm, class: "w-full" do %> + <%= fa :browser, size: :xs %> Show on RubyVideo.dev <% end %> <% end %> diff --git a/app/views/speakers/actions/_anonymous.html.erb b/app/views/speakers/actions/_anonymous.html.erb index 35615a51a..0f213c7a7 100644 --- a/app/views/speakers/actions/_anonymous.html.erb +++ b/app/views/speakers/actions/_anonymous.html.erb @@ -3,12 +3,12 @@ Help us improve the speaker profile by adding a GitHub handle <% end %> <% else %> - <% if !speaker.verified? %> - <%= ui_button url: edit_speaker_path(speaker), kind: :none, size: :sm, data: {turbo_frame: "modal"} do %> - <%= heroicon :pencil_square %> - Suggest improvements - <% end %> + <%= ui_button url: edit_speaker_path(speaker), kind: :none, size: :sm, data: {turbo_frame: "modal"} do %> + <%= fa :pen, size: :xs %> + Suggest improvements + <% end %> + <% if !speaker.verified? %>
Are you <%= speaker.name %>? <%= link_to sign_in_path, class: "link link-neutral font-light", data: {turbo_frame: "modal"} do %> diff --git a/app/views/speakers/actions/_owner.html.erb b/app/views/speakers/actions/_owner.html.erb index 1c66e976f..7d301f007 100644 --- a/app/views/speakers/actions/_owner.html.erb +++ b/app/views/speakers/actions/_owner.html.erb @@ -1,4 +1,4 @@ <%= ui_button url: edit_speaker_path(speaker), kind: :none, size: :sm, data: {turbo_frame: "modal"} do %> - <%= heroicon :pencil_square %> + <%= fa :pen, size: :xs %> Update my profile <% end %> diff --git a/app/views/speakers/actions/_signed_in.html.erb b/app/views/speakers/actions/_signed_in.html.erb index 60d510510..65a39a0b7 100644 --- a/app/views/speakers/actions/_signed_in.html.erb +++ b/app/views/speakers/actions/_signed_in.html.erb @@ -4,7 +4,7 @@ <% end %> <% else %> <%= ui_button url: edit_speaker_path(speaker), kind: :none, size: :sm, data: {turbo_frame: "modal"} do %> - <%= heroicon :pencil_square %> + <%= fa :pen, size: :xs %> Suggest improvements <% end %> <% end %> diff --git a/app/views/speakers/show.html.erb b/app/views/speakers/show.html.erb index 7ad0c3141..3ab15f1f9 100644 --- a/app/views/speakers/show.html.erb +++ b/app/views/speakers/show.html.erb @@ -16,7 +16,7 @@ <% if @speaker.talks.any? %> -
+
<%= render partial: "talks/card", collection: @talks, From 4469319c58215cbe14d88167f9a7e4bcb94c323f Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Tue, 26 Nov 2024 16:34:44 +0100 Subject: [PATCH 07/11] update hide text --- app/views/topics/_badge_list.html.erb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/topics/_badge_list.html.erb b/app/views/topics/_badge_list.html.erb index 3a5a15763..060ca436c 100644 --- a/app/views/topics/_badge_list.html.erb +++ b/app/views/topics/_badge_list.html.erb @@ -1,7 +1,7 @@ <% limit ||= 8 %> <% more_topics = topics.to_a.from(limit) %> -
+
<%= render partial: "topics/badge", collection: topics.first(limit), as: :topic, locals: {back_to_url: back_to_url, back_to_title: back_to_title} %> <% more_topics.each do |topic| %> From 6f1427481c0482b6b9e6485607e275c050445705 Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Tue, 26 Nov 2024 16:38:38 +0100 Subject: [PATCH 08/11] Lint --- app/views/speakers/_header.html.erb | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/views/speakers/_header.html.erb b/app/views/speakers/_header.html.erb index c8c36b64d..1218f7a78 100644 --- a/app/views/speakers/_header.html.erb +++ b/app/views/speakers/_header.html.erb @@ -19,7 +19,7 @@
-

<%= @speaker.name %>

+

<%= speaker.name %>

<% if speaker.pronouns.present? && ["dont_specify", "not_specified"].exclude?(speaker.pronouns_type) %> (<%= speaker.pronouns %>) From c39ac6ed12516c75ad3196279b2486670569cf89 Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Tue, 3 Dec 2024 00:36:27 +0100 Subject: [PATCH 09/11] Revert button color on events#show page after merge --- app/views/events/_header.html.erb | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/views/events/_header.html.erb b/app/views/events/_header.html.erb index dbae3fe48..8a5089560 100644 --- a/app/views/events/_header.html.erb +++ b/app/views/events/_header.html.erb @@ -18,8 +18,8 @@
- <%= link_to "Visit Website", event.organisation.website, class: "btn btn-primary w-full", target: "_blank" %> - <%= link_to "View all #{event.organisation.name} events", event.organisation, class: "btn w-full" %> + <%= link_to "Visit Website", @event.website, class: "btn btn-neutral w-full", target: "_blank" %> + <%= link_to "View all #{@event.organisation.name} events", @event.organisation, class: "btn w-full" %>
From bd7bda9c0642b4107392b5f5a6b8eca608ceb77d Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Tue, 3 Dec 2024 01:03:00 +0100 Subject: [PATCH 10/11] Extrac _header_content to being able to broadcast changes --- app/models/speaker.rb | 2 +- app/views/speakers/_header.html.erb | 37 +-------------------- app/views/speakers/_header_content.html.erb | 36 ++++++++++++++++++++ 3 files changed, 38 insertions(+), 37 deletions(-) create mode 100644 app/views/speakers/_header_content.html.erb diff --git a/app/models/speaker.rb b/app/models/speaker.rb index 419442aca..681de9d71 100644 --- a/app/models/speaker.rb +++ b/app/models/speaker.rb @@ -161,7 +161,7 @@ def fetch_bsky_metadata! end def broadcast_header - broadcast_update_to self, target: dom_id(self, :header), partial: "speakers/header", locals: {speaker: self} + broadcast_update_to self, target: dom_id(self, :header_content), partial: "speakers/header_content", locals: {speaker: self} end def valid_website_url diff --git a/app/views/speakers/_header.html.erb b/app/views/speakers/_header.html.erb index 1218f7a78..bd884c500 100644 --- a/app/views/speakers/_header.html.erb +++ b/app/views/speakers/_header.html.erb @@ -1,40 +1,5 @@
-
-
- <%= image_tag speaker.github_avatar_url(size: 200), - class: "rounded-full border border-[#D9DFE3] size-24 md:size-36", - height: 200, - width: 200, - alt: "GitHub picture profile of #{speaker.github}", - loading: :lazy %> - - <% if speaker.verified? %> -
- <%= fa("badge-check", class: "fill-white", size: :xs) %> - - Verified -
- <% end %> -
- -
-
-

<%= speaker.name %>

- - <% if speaker.pronouns.present? && ["dont_specify", "not_specified"].exclude?(speaker.pronouns_type) %> - (<%= speaker.pronouns %>) - <% end %> -
- -

- <%= speaker.bio %> -

- -
- <%= render "speakers/socials", speaker: speaker %> -
-
-
+ <%= render "speakers/header_content", speaker: speaker %>
<% if speaker.website.present? %> diff --git a/app/views/speakers/_header_content.html.erb b/app/views/speakers/_header_content.html.erb new file mode 100644 index 000000000..2d48a2041 --- /dev/null +++ b/app/views/speakers/_header_content.html.erb @@ -0,0 +1,36 @@ +
+
+ <%= image_tag speaker.github_avatar_url(size: 200), + class: "rounded-full border border-[#D9DFE3] size-24 md:size-36", + height: 200, + width: 200, + alt: "GitHub picture profile of #{speaker.github}", + loading: :lazy %> + + <% if speaker.verified? %> +
+ <%= fa("badge-check", class: "fill-white", size: :xs) %> + + Verified +
+ <% end %> +
+ +
+
+

<%= speaker.name %>

+ + <% if speaker.pronouns.present? && ["dont_specify", "not_specified"].exclude?(speaker.pronouns_type) %> + (<%= speaker.pronouns %>) + <% end %> +
+ +

+ <%= speaker.bio %> +

+ +
+ <%= render "speakers/socials", speaker: speaker %> +
+
+
From 2cf0adc90949554ac0b990c2ed26cecd2d156f23 Mon Sep 17 00:00:00 2001 From: Marco Roth Date: Tue, 3 Dec 2024 01:04:00 +0100 Subject: [PATCH 11/11] Lint --- app/models/speaker.rb | 2 +- app/views/events/_header.html.erb | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/app/models/speaker.rb b/app/models/speaker.rb index 681de9d71..f6194e538 100644 --- a/app/models/speaker.rb +++ b/app/models/speaker.rb @@ -161,7 +161,7 @@ def fetch_bsky_metadata! end def broadcast_header - broadcast_update_to self, target: dom_id(self, :header_content), partial: "speakers/header_content", locals: {speaker: self} + broadcast_update target: dom_id(self, :header_content), partial: "speakers/header_content", locals: {speaker: self} end def valid_website_url diff --git a/app/views/events/_header.html.erb b/app/views/events/_header.html.erb index 8a5089560..6bcd401ed 100644 --- a/app/views/events/_header.html.erb +++ b/app/views/events/_header.html.erb @@ -18,8 +18,8 @@
- <%= link_to "Visit Website", @event.website, class: "btn btn-neutral w-full", target: "_blank" %> - <%= link_to "View all #{@event.organisation.name} events", @event.organisation, class: "btn w-full" %> + <%= link_to "Visit Website", event.website, class: "btn btn-neutral w-full", target: "_blank" %> + <%= link_to "View all #{event.organisation.name} events", event.organisation, class: "btn w-full" %>