https://avo.cool logo
Join Discord
Powered by
Action reload
# general
f
Question - does 
reload
in an action only work in certain instances? I'm trying to render a success message and reload the page so that an item will be added to a resource index view as a result of the action. 
reload
doesn't appear to be working when called in the 
handle
method
l
It should always work, can you provide the action's code?
f
In all it's glory
Copy code
class Avo::Actions::InviteUser < Avo::BaseAction
  self.standalone = true
  self.visible = -> { view == :index }

  self.name = 'Invite User'
  self.message = "Provide the email address of the user you'd like to invite."
  self.confirm_button_label = 'Send Invitation'

  # self.visible = -> do
  #   true
  # end

  def fields
    field :email, as: :text, required: true, placeholder: 'user@mail.com', stacked: true
  end

  def handle(fields:, current_user:, **_args)
    role = arguments.fetch(:role, '')

    user, _mail = User.invite!({ email: fields[:email]&.downcase, role: }, current_user)

    if user.errors.any?
      error user.errors.full_messages.to_sentence
      keep_modal_open
    else
      succeed "Sent invitation to #{user.email}"
      close_modal
      # we should reload but there appears to be a bug in Avo...
      # reload
    end
  end
end
I only have 
close_modal
there because reload wasn't working
l
Did u had both?
f
i know those are mutually exclusive after reviewing the avo internals
i've tried all the iterations, mr paul
🙂
reload no hace nada
l
I'll have a look and try to reproduce it
Thanks for the details
f
thanks for your help and awesome support
l
Anytime!
@future-garden-51299 can you please provide more information? Are you using the action on index/show and the expected vs actual behavior?
I'm trying to reproduce it and its reloading on my side
reload
is the default behavior so including 
reload
or nothing is actually the same
f
On the index
Thanks!
Passing a role string in as arguments
l
Try to remove the close modal:
Copy code
ruby
#...
else
  succeed "Sent invitation to #{user.email}"
end
#...
and tell us expected vs actual behavior
f
expected: that the page would reload and show the toast notification actual: appears to do nothing, although i can see the invitation being sent in server logs–the UI just doesn't update, even not displaying the success toast notification
l
if the toast notification do not appear that means it's breaking somewhere else
can you provide a minimal reproduction repo where this is happening?
i'm not able to reproduce it on my side
f
i wish i would have thought to open the JS console sooner - good call
l
Is that on a custom JS code?
f
nope
i just upgraded avo - it looks like it's raising "unkown action" in the 
performAction
method on render in the stream...
is there a separate step in upgrading that i need to do to upgrade turbo along with avo?
i think i need to upgrade 
@hotwired/turbo-rails
to > 8
turbo-action="advance" action="redirect_to"
is the issue
I'm assuming this is how avo does the reload
@loud-jewelry-99127 should it use refresh for reload instead? https://turbo.hotwired.dev/reference/streams#refresh
l
Hey @future-garden-51299 we have 
"@hotwired/turbo-rails": "^8.0.4"
as dependecy so I'm not sure if manual update is needed. > turbo-action="advance" action="redirect_to" is the issue Where is that coming from? Is generated by Avo::ActionsController response?
That response uses [turbo_power gem](https://github.com/marcoroth/turbo_power-rails)
f
there's no turbo_power in my yarn.lock - should i have to manually add this package?
l
turbo_power is on gemfile.lock
is avo dependency
f
right - it just doesn't seem to be initialized or in the bundle
l
I noticed that the Js code on t he screenshot is from 
avo-overrides
is that something from your project?
f
yep - it's the only way i knew how to get custom js into avo
l
And how it works exactly? are you rebuilding the JS?
f
Copy code
// avo/partials/_pre_head

<%= stylesheet_link_tag "avo-overrides", "data-turbo-track": "reload" %>
<%= javascript_include_tag "avo-overrides", "data-turbo-track": "reload", defer: true %>

<script src="//js.honeybadger.io/v6.8/honeybadger.min.js" type="text/javascript"></script>

<script type="text/javascript">
  Honeybadger.configure({
    apiKey: '<%= ENV["HONEYBADGER_API_KEY"] %>',
    environment: '<%= Rails.env %>',
  });
</script>


// avo-overrides.js
import "@hotwired/turbo-rails"
import "./controllers"
import "@mapbox/search-js-web"

// avo-overrides.scss
@import "https://api.mapbox.com/mapbox-gl-js/v3.1.2/mapbox-gl.css";
@import "https://api.mapbox.com/mapbox-gl-js/plugins/mapbox-gl-draw/v1.4.3/mapbox-gl-draw.css";

[data-resource-name="Avo::Resources::Search"] {
  [data-target="panel-tools"] {
    display: none;
  }
}

img[alt="Map"] {
  width: 100% !important;
  height: auto !important;
}

#area-picker {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.field_with_errors {

  input,
  tags.tagify {
    border-color: rgba(129, 36, 36, 0.571) !important;
  }
}
no rebuilding the JS, yet.... ive thought about that to get more tailwind classes but haven't expanded to more complex resource tools, yet
l
When you need more tailwind classes read this https://docs.avohq.io/3.0/tailwindcss-integration
About this particular error, im not sure why it blows in the custom JS, cant reproduce it locally, it might be something wit the custom JS code?
f
it just doesn't seem like that turbo_power dependency is loaded
l
TL;DR this will build css from Avo + Your app togheter on your side instead using the pre.build assets
f
ok - that may be the way to go, anyways... i'll get rid of my custom stuff and try again
l
try the same flux without the custom JS and let me know if still blowing up
f
Ok - my manual import of turbo-rails is what was causing it... i guess that was already imported earlier and overriding the TurboPower definitions. Thanks for your thought partnership, @loud-jewelry-99127 !
l
Anytime Mr @future-garden-51299 !
f
Have you tried this recently?
l
Yes @future-garden-51299 not very recent but yes, something wrong?
f
I'm willing to bet my understand of expected behavior is incorrect... Does this only touch css, and we have to figure out a workaround for our own javascript?
I finally got my css to show up in the avo.tailwind.css file and build, but I guess I've got a couple questions... 1. our application layout is still NOT used, correct? 2. any custom js or layout work needs to be done in the pre_head file still, correct? 3. why are there two tailwind processes that need to run, one in ruby and one in node?
l
1. what do you mean? you want the styles from layout to be build and they're not?
> Does this only touch css, and we have to figure out a workaround for our own javascript? Yes the tailwind css integration only touches css, it build avo + your app taiwind classes at once
2. yes, using the 
javascript_include_tag
PreviousNext
Powered by