Stephen Schüz PRO
Joined 12/25/2018
Stephen Schüz PRO said almost 2 years ago on StimulusJS, Active Storage and DropzoneJS :
  Thanks for the great video and the simple setup! I've been banging my head against trying to display the photos that are already stored, when I open my form. I did something like this:
JSON.parse(this.filesTarget.dataset.urls).forEach((image) => {
  let mockFile = { name: `${image.name}`, size: 12345 };
  dropzone.displayExistingFile(mockFile, image.url);
})
The dataset gives me the external url (in this case on cloudinary), but I can't seem to use the displayExistingFile method w external urls... How would you go about displaying exising images in DZ?

P.S.
Maybe for a follow-up screencast: How to delete them again from the db?
And maybe as a bonus: Make them sortablejs?

Stephen Schüz PRO said over 1 year ago on Hotwire Question and Answer Feature :
Thanks for this, this is gold. I’ve been banging my head against authorizations with broadcasting and, in the end, came up with a front-end solution. I basically put some info into the head about the current user:
<meta name="current-person-id" content="<%= current_user ? current_user.id : nil %>">
<meta name="current-person-admin" content="<%= current_user ? current_user.admin : nil %>">
<meta name="current-person-user" content="<%= @workout&.user == current_user ? true : nil %>">
Then I use this info in a stimulus controller, which shows/hides elements based on what user is present.
import { Controller } from "@hotwired/stimulus"

// Connects to data-controller="meta"
export default class extends Controller {
  static targets = [ "admin", "user", "published" ]

  connect() {
    // Data from meta tags
    const admin = document.querySelector('meta[name="current-person-admin"]').content
    const user = document.querySelector('meta[name="current-person-user"]').content
    const id = document.querySelector('meta[name="current-person-id"]').content
    const published = document.querySelector('meta[name="current-record-published"]').content
    const recordId = document.querySelector('meta[name="current-record-id"]').content
    
    checkAuthorisation(this.userTargets, user)
    checkAuthorisation(this.adminTargets, admin)
    checkAuthorisationPublished(this.publishedTargets, user)

    // Check if user owns record or if user is admin
    function checkAuthorisation(elements, subject) {
      elements.forEach((element) => {
        if (subject === "true" || admin === "true") {
          // Do nothing
          // element.classList.remove("hidden")
        } else {
          element.classList.add("hidden")
        }
      })
    }

    // Check if record is published, user owns record or if user is admin
    function checkAuthorisationPublished(elements, subject) {
      elements.forEach((element) => {
        if (subject === "true" || admin === "true" || published === "true") {
          // Do nothing
          // element.classList.remove("hidden")
        } else {
          element.classList.add("hidden")
        }
      })
    }
    
  }
}
On the view, I just traget the relevant elements e.g:
<%= button_to workout_block_path(block.workout, block), method: :delete, data: { controller: "meta", target: "meta.published" }, form: { data: { turbo_confirm: "Are you sure?" } }, class: "btn-styling" do %>
  <span class="emoji">🗑</span> 
<% end %>
I’m going to give your solution a spin, which is a super creative use of the framework and which seems way more robust!! Thanks again.

P.s. this is app

Stephen Schüz PRO said 9 months ago on Optical Character Recognition :
EDIT: It worked after I added tesseract to my docker file 😅
RUN apt-get update \
  && apt-get -y install tesseract-ocr-all 

Thanks for this episode, really nice!! I've implemented this the way you did (but using sidekiq for the job and cloundinary for the file storage), and it works fine in development. However, when I switch to production on fly.io, I'm getting issues with MiniMagik: 

MiniMagick::Invalid (`identify /tmp/mini_magick20230712-231-wlk5jb` failed with status: 1 and error: identify-im6.q16: attempt to perform an operation not allowed by the security policy `PDF' @ error/constitute.c/IsCoderAuthorized/421.dasf

Has anybody else experienced issues on production with this?

Thanks!