refactor(attachment): add Attachment::EditComponent

This commit is contained in:
Paul Chavard 2022-05-11 08:57:25 +02:00
parent 57c55107c0
commit d6384caf10
6 changed files with 126 additions and 48 deletions

View file

@ -0,0 +1,92 @@
# Display a widget for uploading, editing and deleting a file attachment
class Attachment::EditComponent < ApplicationComponent
def initialize(form:, attached_file:, accept: nil, template: nil, user_can_destroy: false, direct_upload: true)
@form = form
@attached_file = attached_file
@accept = accept
@template = template
@user_can_destroy = user_can_destroy
@direct_upload = direct_upload
end
attr_reader :template, :form
def self.text(form, file)
new(form: form, attached_file: file, user_can_destroy: true)
end
def self.image(form, file, direct_upload = true)
new(form: form,
attached_file: file,
accept: 'image/png, image/jpg, image/jpeg',
user_can_destroy: true,
direct_upload: direct_upload)
end
def user_can_destroy?
@user_can_destroy
end
def attachment
@attached_file.attachment
end
def attachment_path
helpers.attachment_path attachment.id, { signed_id: attachment.blob.signed_id }
end
def attachment_id
@attachment_id ||= attachment ? attachment.id : SecureRandom.uuid
end
def attachment_input_class
"attachment-input-#{attachment_id}"
end
def persisted?
attachment&.persisted?
end
def champ
@form.object.is_a?(Champ) ? @form.object : nil
end
def file_field_options
{
class: "attachment-input #{attachment_input_class} #{'hidden' if persisted?}",
accept: @accept,
direct_upload: @direct_upload,
id: champ&.input_id,
aria: { describedby: champ&.describedby_id },
data: { auto_attach_url: helpers.auto_attach_url(form, form.object) }
}
end
def file_field_name
@attached_file.name
end
def remove_button_options
{
role: 'button',
class: 'button small danger',
data: { turbo_method: :delete }
}
end
def retry_button_options
{
type: 'button',
class: 'button attachment-error-retry',
data: { input_target: ".#{attachment_input_class}", action: 'autosave#onClickRetryButton' }
}
end
def replace_button_options
{
type: 'button',
class: 'button small',
data: { toggle_target: ".#{attachment_input_class}" }
}
end
end

View file

@ -0,0 +1,2 @@
---
en:

View file

@ -0,0 +1,2 @@
---
fr:

View file

@ -0,0 +1,27 @@
.attachment
- if template&.attached?
%p.mb-1
Veuillez télécharger, remplir et joindre
= link_to('le modèle suivant', url_for(template), target: '_blank', rel: 'noopener')
- if persisted?
.attachment-actions{ id: dom_id(attachment, :actions) }
.attachment-action
= render Attachment::ShowComponent.new(attachment: attachment, user_can_upload: true)
- if user_can_destroy?
.attachment-action{ "data-turbo": "true" }
= link_to('Supprimer', attachment_path, **remove_button_options)
.attachment-action
= button_tag('Remplacer', **replace_button_options)
.attachment-error.hidden
.attachment-error-message
%p.attachment-error-title
Une erreur sest produite pendant lenvoi du fichier.
%p.attachment-error-description
Une erreur inconnue s'est produite pendant l'envoi du fichier
= button_tag(**retry_button_options) do
%span.icon.retry
Ré-essayer
= form.file_field(file_field_name, **file_field_options)

View file

@ -1,43 +0,0 @@
-# Display a widget for uploading, editing and deleting a file attachment
- attachment = attached_file.attachment
- attachment_id = attachment ? attachment.id : SecureRandom.uuid
- persisted = attachment && attachment.persisted?
- accept = defined?(accept) ? accept : nil
- user_can_destroy = defined?(user_can_destroy) ? user_can_destroy : false
- direct_upload = direct_upload != nil ? false : true
- champ = form.object.is_a?(Champ) ? form.object : nil
.attachment
- if defined?(template) && template.attached?
%p.mb-1
Veuillez télécharger, remplir et joindre
= link_to('le modèle suivant', url_for(template), target: '_blank', rel: 'noopener')
- if persisted
.attachment-actions{ class: "attachment-actions-#{attachment_id}" }
.attachment-action
= render partial: "shared/attachment/show", locals: { attachment: attachment, user_can_upload: true }
- if user_can_destroy
.attachment-action
= link_to 'Supprimer', attachment_url(attachment.id, { signed_id: attachment.blob.signed_id }), remote: true, method: :delete, class: 'button small danger', data: { disable: true }, role: 'button'
.attachment-action
= button_tag 'Remplacer', type: 'button', class: 'button small', data: { 'toggle-target': ".attachment-input-#{attachment_id}" }
.attachment-error.hidden
.attachment-error-message
%p.attachment-error-title
Une erreur sest produite pendant lenvoi du fichier.
%p.attachment-error-description
Une erreur inconnue s'est produite pendant l'envoi du fichier
= button_tag type: 'button', class: 'button attachment-error-retry', data: { 'input-target': ".attachment-input-#{attachment_id}", action: 'autosave#onClickRetryButton' } do
%span.icon.retry
Ré-essayer
= form.file_field attached_file.name,
class: "attachment-input attachment-input-#{attachment_id} #{'hidden' if persisted}",
accept: accept,
direct_upload: direct_upload,
id: champ&.input_id,
aria: { describedby: champ&.describedby_id },
data: { 'auto-attach-url': auto_attach_url(form, form.object) }

View file

@ -5,7 +5,7 @@ describe 'shared/attachment/_update.html.haml', type: :view do
subject do
form_for(champ.dossier) do |form|
view.image_upload_and_render form, attached_file
view.render Attachment::EditComponent.image(form, attached_file)
end
end
@ -53,12 +53,10 @@ describe 'shared/attachment/_update.html.haml', type: :view do
context 'when the user cannot destroy the attachment' do
subject do
form_for(champ.dossier) do |form|
render 'shared/attachment/edit', {
form: form,
render Attachment::EditComponent.new(form: form,
attached_file: attached_file,
accept: 'image/png',
user_can_destroy: user_can_destroy
}
user_can_destroy: user_can_destroy)
end
end