slouchpie

slouchpie

Phx_gen_auth using live view ONLY

Fellow Elixir devs,

I am about to eat a sandwich and a cup of tea so sorry if this question is badly phrased.

Basically, I am working on app that uses LiveView for every page except for auth pages, which were generated using phx_gen_auth.

Recently, I wanted to use LiveView Hooks to get browser-detected “timezone” as default value in a select field on the registration form, so I started turning it into a LiveView. It actually works fine except that I want to log the user in after they register and the user_auth.ex function to log_in_user requires a Plug.Conn. I know I cannot access the conn from a LiveView so I wonder should I just stop this.

My questions are:

  1. has anyone had any success doing this?
  2. is it a bad idea to use LiveView for this part of the app?

Marked As Solved

f0rest8

f0rest8

This isn’t specifically about the time zone portion, but I wrote a 2 part guide to modifying your app to turn registration page into a Live View page with phx_gen_auth.

You may only be interested in part 1, the second deals with a multi-part form.

Part 1

Part 2

Hope it helps :heart:

Also Liked

f0rest8

f0rest8

Great to hear! I actually have done that, but I haven’t written a guide on it yet. One way to approach it, as I decided to do, can be figured out by following the archived example from Dashbit’s bytepack_archive.

It’s a bit more complicated than the registration flow since it uses live_component, especially adding the two-factor authentication with their nimble totp library, but it works amazingly.

Then, it’s just expanding on your application a bit to possibly break a single settings page into a Live View page with interactive tabs (tabbed pages) — but that’s just dependent on your app’s preferences.

Oh, lastly, it’s worth noting that it is a similar concept as before (and as @LostKobrakai mentioned), where you interact with your phx_gen_auth generated controllers through your Live View process. Typically, you can just make the swap between conn and socket thanks to how Phoenix is designed.

In a .leex template file all conn references are socket references and vice versa for a .eex template. The Programming Phoenix 1.4 book helps explain how Phoenix handles the connection (and many other things).

I would start by cloning the Bytepack archive, then looking over how they implement their settings page. It’s an incredibly great learning resource.

In the meantime, I’ll post back here if/when I write a Medium guide on it. Good luck! :heart:

LostKobrakai

LostKobrakai

You’ll need classical controllers for everything needing to modify the session. So as you did you can handle the forms in liveview, but they need to submit to a controller. This also kinda means you might need to share some form handling / changeset stuff between the liveview and the controller.

Same goes for logout, which needs to be in a controller given it needs to remove stuff from the session. This however is usually not a problem given it’s often just handled as a link/2 with method: :delete and not a manually created form.

Last Post!

f0rest8

f0rest8

Great to hear! I actually have done that, but I haven’t written a guide on it yet. One way to approach it, as I decided to do, can be figured out by following the archived example from Dashbit’s bytepack_archive.

It’s a bit more complicated than the registration flow since it uses live_component, especially adding the two-factor authentication with their nimble totp library, but it works amazingly.

Then, it’s just expanding on your application a bit to possibly break a single settings page into a Live View page with interactive tabs (tabbed pages) — but that’s just dependent on your app’s preferences.

Oh, lastly, it’s worth noting that it is a similar concept as before (and as @LostKobrakai mentioned), where you interact with your phx_gen_auth generated controllers through your Live View process. Typically, you can just make the swap between conn and socket thanks to how Phoenix is designed.

In a .leex template file all conn references are socket references and vice versa for a .eex template. The Programming Phoenix 1.4 book helps explain how Phoenix handles the connection (and many other things).

I would start by cloning the Bytepack archive, then looking over how they implement their settings page. It’s an incredibly great learning resource.

In the meantime, I’ll post back here if/when I write a Medium guide on it. Good luck! :heart:

Where Next?

Popular in Questions Top

nobody
Hi! In PHP: $_SERVER[‘SERVER_ADDR’] - in Elixir? Searched the docs for ip address and the web, no good results. Thanks!
New
joaquinalcerro
Hi there, I am working with Ecto-Postgresql and I need to call all of the records from a specific table but the table has 40,000 records...
New
Emily
I have VueJS GUIs with the project generated using Webpack. I have Elixir modules that will need to be used by the VueJS GUIs. I forese...
New
9mm
I am constructing a JSON object (map) and I need to conditionally set a field. I’m trying to write proper elixir-way code… and I’m at a l...
New
bsollish-terakeet
Credo is smart enough to check for (something like) this: assert length(the_list) == 0 with this response: Checking if an enum is empt...
New
JorisKok
I have a server on AWS, and was running a load test using artillery. When looking at the Phoenix dashboard I see the Ports going to 100% ...
New
senggen
Erlang/OTP 25 [erts-13.2.2] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] 15:22:35.803 [error] gen_event {lager_file_backend...
New

Other popular topics Top

electic
Hi, I am new to Elixir. I am trying to use the DateTime component to insert a date into MySQL however the there seems to be no way to fo...
New
nobody
Hi! In PHP: $_SERVER[‘SERVER_ADDR’] - in Elixir? Searched the docs for ip address and the web, no good results. Thanks!
New
joaquinalcerro
Hi there, I am working with Ecto-Postgresql and I need to call all of the records from a specific table but the table has 40,000 records...
New
ashish173
I am using Ecto timestamps with postgres, I can see the timestamps() use the :naive_dateime but for my use case I wanted to store the ti...
New
msaraiva
Surface is an experimental library built on top of Phoenix LiveView and its new LiveComponent API that aims to provide a more declarative...
564 44139 214
New
AngeloChecked
What learn first? Rust or Elixir Hi Elixir community! I’m here because i want learn a new language. I’m a junior developer and mainly i ...
New

We're in Beta

About us Mission Statement