manuelgeek/phx_izitoast

Can't connect to code reload

Closed this issue · 8 comments

tlindener commented

First thanks for the module. Unfortunately, I don't get any toasts.
In the console there is only this error:
Firefox can’t establish a connection to the server at ws://localhost:4002/phoenix/live_reload/socket/websocket?vsn=2.0.0.

I've fixed the above issue somehow. But the toast does not show up. It looks like the js code and css aren't added at all.

manuelgeek commented

Hello @tlindener Kindly confirm if you've imported izi_toast in your view and added the fucton in your layout template like below
in your layout_view.ex

import PhxIzitoast

then in your app.html.eex

<body>
...............
<%= izi_toast(@conn) %>
.................
</body>
manuelgeek commented

@tlindener you also need to get the css and js loaded correctly. Do this;
Add the below code to your app_web/endpoint.ex file just below the existing plug Plug.Static configuration.

plug Plug.Static, 
    at: "/", 
    from: {:phx_izitoast, "priv/static"}, 
    gzip: false, 
    only: ~w(css  js )
tlindener commented

I did exactly like in the docs

defmodule AppWeb.LayoutView do
  use ElementGoWeb, :view
  import PhxIzitoast 
end

In endpoint.ex

  plug Plug.Static,
    at: "/",
    from: :app,
    gzip: false,
    only: ~w(css fonts images js favicon.ico robots.txt)
  
  plug Plug.Static, 
    at: "/", 
    from: {:phx_izitoast, "priv/static"}, 
    gzip: false, 
    only: ~w(css  js )

When I check on izi_toast this returns nil though :(
<%= IO.inspect(izi_toast(@conn)) %>
Appreciate your help :)

When I add the tags manually the js and css can be loaded. But using

 |> PhxIzitoast.message(gettext("User created successfully."))

Still shows no toast

manuelgeek commented

@tlindener When you call conn = PhxIzitoast.message(gettext(conn,"User created successfully."))
a tuple :izitaost is assigned to the conn with a list of toast options as the value,
the function izi_toast(@conn) check for the :izitoast and created neccesary tags for the toast to display.
From your issue its like the assignment doesn't happen, maybe a snipet of your controller function could help

tlindener commented

This is the controller function that is called:

  def create(conn, %{"user" => user_params}) do
    case Account.register_user(user_params, tenant: conn.assigns.tenant) do
      {:ok, user} ->
        conn
        |> PhxIzitoast.message(gettext("User created successfully."))
        |> redirect(to: Routes.user_path(conn, :show, conn.assigns.tenant, user))

      {:error, %Ecto.Changeset{} = changeset} ->
        render(conn, "new.html", changeset: changeset)
    end
  end
manuelgeek commented

@tlindener I've actually tested, it seems not to work on redirect, Let me check on this, I'll get back to you on this
using render you'll get your toasts
Regards

manuelgeek commented

@tlindener kinfly chek=ck out the new version 0.1.1, Ill close this issue after your response.

tlindener commented

Awesome! I just checked and now it is working indeed! Great work and thanks a lot for your help!

  • 👍1