1
0
Fork 0
mirror of https://github.com/maybe-finance/maybe.git synced 2025-07-19 13:19:39 +02:00

Fix and improve chat title edit (#2285)

* Fix and improve chat title edit

* Put back background color

* use transparent
This commit is contained in:
Alex Hatzenbuhler 2025-05-23 14:31:08 -05:00 committed by GitHub
parent 5cfb4addbd
commit 5c82af0e8c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 27 additions and 13 deletions

View file

@ -1,25 +1,26 @@
class MenuItemComponent < ViewComponent::Base class MenuItemComponent < ViewComponent::Base
VARIANTS = %i[link button divider].freeze VARIANTS = %i[link button divider].freeze
attr_reader :variant, :text, :icon, :href, :method, :destructive, :confirm, :opts attr_reader :variant, :text, :icon, :href, :method, :destructive, :confirm, :frame, :opts
def initialize(variant:, text: nil, icon: nil, href: nil, method: :post, destructive: false, confirm: nil, **opts) def initialize(variant:, text: nil, icon: nil, href: nil, method: :post, destructive: false, confirm: nil, frame: nil, **opts)
@variant = variant.to_sym @variant = variant.to_sym
@text = text @text = text
@icon = icon @icon = icon
@href = href @href = href
@method = method.to_sym @method = method.to_sym
@destructive = destructive @destructive = destructive
@opts = opts
@confirm = confirm @confirm = confirm
@frame = frame
@opts = opts
raise ArgumentError, "Invalid variant: #{@variant}" unless VARIANTS.include?(@variant) raise ArgumentError, "Invalid variant: #{@variant}" unless VARIANTS.include?(@variant)
end end
def wrapper(&block) def wrapper(&block)
if variant == :button if variant == :button
button_to href, method: method, class: container_classes, **merged_button_opts, &block button_to href, method: method, class: container_classes, **merged_opts, &block
elsif variant == :link elsif variant == :link
link_to href, class: container_classes, **opts, &block link_to href, class: container_classes, **merged_opts, &block
else else
nil nil
end end
@ -44,7 +45,7 @@ class MenuItemComponent < ViewComponent::Base
].join(" ") ].join(" ")
end end
def merged_button_opts def merged_opts
merged_opts = opts.dup || {} merged_opts = opts.dup || {}
data = merged_opts.delete(:data) || {} data = merged_opts.delete(:data) || {}
@ -52,6 +53,10 @@ class MenuItemComponent < ViewComponent::Base
data = data.merge(turbo_confirm: confirm.to_data_attribute) data = data.merge(turbo_confirm: confirm.to_data_attribute)
end end
if frame.present?
data = data.merge(turbo_frame: frame)
end
merged_opts.merge(data: data) merged_opts.merge(data: data)
end end
end end

View file

@ -2,7 +2,9 @@
<%= tag.div class: "flex items-center justify-between px-4 py-3 bg-container shadow-border-xs rounded-lg" do %> <%= tag.div class: "flex items-center justify-between px-4 py-3 bg-container shadow-border-xs rounded-lg" do %>
<div class="grow"> <div class="grow">
<%= render "chats/chat_title", chat: chat, ctx: "list" %> <%= turbo_frame_tag dom_id(chat, :title) do %>
<%= render "chats/chat_title", chat: chat, ctx: "list" %>
<% end %>
<p class="text-sm text-secondary"> <p class="text-sm text-secondary">
<%= time_ago_in_words(chat.updated_at) %> ago <%= time_ago_in_words(chat.updated_at) %> ago
@ -10,7 +12,13 @@
</div> </div>
<%= render MenuComponent.new(icon_vertical: true) do |menu| %> <%= render MenuComponent.new(icon_vertical: true) do |menu| %>
<% menu.with_item(variant: "link", text: "Edit chat", href: edit_chat_path(chat), icon: "pencil", frame: dom_id(chat, "title")) %> <% menu.with_item(
variant: "link",
text: "Edit chat title",
href: edit_chat_path(chat, ctx: "list"),
icon: "pencil",
frame: dom_id(chat, "title")) %>
<% menu.with_item( <% menu.with_item(
variant: "button", variant: "button",
text: "Delete chat", text: "Delete chat",

View file

@ -1,8 +1,9 @@
<%= turbo_frame_tag dom_id(@chat, :title), class: "block" do %> <%= turbo_frame_tag dom_id(@chat, :title), class: "block" do %>
<% bg_class = params[:ctx] == "chat" ? "bg-container" : "bg-container-inset" %> <%= styled_form_with model: @chat, data: { controller: "auto-submit-form", auto_submit_form_trigger_event_value: "blur" } do |f| %>
<%= styled_form_with model: @chat, <%= f.text_field :title,
class: class_names("p-1 rounded-md font-medium text-primary w-full", bg_class), data: { auto_submit_form_target: "auto" },
data: { controller: "auto-submit-form", auto_submit_form_trigger_event_value: "blur" } do |f| %> autofocus: true,
<%= f.text_field :title, data: { auto_submit_form_target: "auto" }, inline: true %> inline: true,
class: "w-full rounded-md px-2 py-1 text-sm font-medium bg-transparent" %>
<% end %> <% end %>
<% end %> <% end %>