[PR] Adding liveview version without pushing to S3 from client

[LuchoTurtle]

closes #62

This creates a new liveview page that doesn't upload the images to the S3 bucket through the client.

[LuchoTurtle]

I'm having a bit of trouble trying to debug the cause of refreshing the page after an image is locally uploaded.
The file, after it's selected in the input, is being correctly materialized locally.

However, this triggers a refresh of the page, which doesn't allow me to "see" the locally uploaded files (which are meant to later be uploaded to S3).

I initially thought because of the LiveReload library triggering the asset_change event which results in the refreshing of the page -> https://shankardevy.com/code/phoenix-live-reload/.

However, this doesn't seem to be the case. The code is configured correctly, as it's happening in the original LiveView.

I'm trying to assume this is an issue with form submitting and I'm trying to get preventDefault() to be invoked so this page refresh doesn't occur.

[nelsonic]

@LuchoTurtle did you figure it out? You've pushed quite a few more commits since the comment. If you're still stuck, ping me on Signal and we can Zoom-pair on it. 🧑‍💻

[LuchoTurtle]

Yeah, I've figured it out. This was because the asset_change event that was being created was prompted by LiveReload. I've changed the configuration of the folder and what LiveView watches so it reloads.

For the use case, I need to upload the files locally with auto-upload and then prompt the person to upload the file to S3.

Unfortunately, there is not a discernable way of getting the file's contents when the person inputs the file, so we ought to upload locally before uploading to S3 by using the upload/1 function you've implemented.

I've added testing and error handling but I still need to finish the documentation.

[codecov]

Codecov Report

Merging #87 (63e54ef) into main (66a8e0f) will not change coverage.
The diff coverage is 100.00%.

@@            Coverage Diff            @@
##              main       #87   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files            7         8    +1     
  Lines           95       127   +32     
=========================================
+ Hits            95       127   +32     

Impacted Files	Coverage Δ
lib/app_web/controllers/page_controller.ex	100.00% <100.00%> (ø)
lib/app_web/live/imgup_no_client_live.ex	100.00% <100.00%> (ø)
lib/app_web/router.ex	100.00% <100.00%> (ø)

📣 We’re building smart automated test selection to slash your CI/CD build times. Learn more

[LuchoTurtle]

This should be ready for review.
I've updated the code without mocks and have updated the branch so it doesn't have merge conflicts with #86 .

[nelsonic]

Tried this on my localhost:

git checkout 'clientless-#62'
git pull
mix deps.get
mix s

Visit http://localhost:4000/liveview_clientless and attempt to upload a recent image file and got:

Stack trace:

[debug] HANDLE EVENT "upload_to_s3" in AppWeb.ImgupNoClientLive
  Parameters: %{"uuid" => "205fc761-9644-422a-9007-7ca5f2fdeb24", "value" => ""}
[error] There was a problem uploading the file to S3.
[error] ** (Protocol.UndefinedError) protocol Enumerable not implemented for nil of type Atom
    (elixir 1.14.3) lib/enum.ex:1: Enumerable.impl_for!/1
    (elixir 1.14.3) lib/enum.ex:166: Enumerable.reduce/3
    (elixir 1.14.3) lib/enum.ex:4307: Enum.reverse/1
    (elixir 1.14.3) lib/enum.ex:3646: Enum.to_list/1
    (elixir 1.14.3) lib/map.ex:228: Map.new_from_enum/1
    (ex_aws 2.4.3) lib/ex_aws/config.ex:66: ExAws.Config.new/2
    (ex_aws 2.4.3) lib/ex_aws.ex:73: ExAws.request/2
    (app 1.0.0) lib/app/upload.ex:74: App.Upload.upload_file_to_s3/3
    (app 1.0.0) lib/app/upload.ex:26: App.Upload.upload/1
    (app 1.0.0) lib/app_web/live/imgup_no_client_live.ex:85: AppWeb.ImgupNoClientLive.handle_event/3
    (phoenix_live_view 0.19.4) lib/phoenix_live_view/channel.ex:401: anonymous fn/3 in Phoenix.LiveView.Channel.view_handle_event/3
    (telemetry 1.2.1) /Users/n/code/img/app/deps/telemetry/src/telemetry.erl:321: :telemetry.span/3
    (phoenix_live_view 0.19.4) lib/phoenix_live_view/channel.ex:221: Phoenix.LiveView.Channel.handle_info/2
    (stdlib 4.2) gen_server.erl:1123: :gen_server.try_dispatch/4
    (stdlib 4.2) gen_server.erl:1200: :gen_server.handle_msg/6
    (stdlib 4.2) proc_lib.erl:240: :proc_lib.init_p_do_apply/3

[nelsonic]

Happy to show you on my computer when you're available. e.g. standup tomorrow morning. 👍

[LuchoTurtle]

This should work now 👌 . The issue was as expected, the env variables were not being loaded on the dev env.

[LuchoTurtle]

@nelsonic before delving into this PR, please merge #101 first so dwyl/flutter-image-upload-demo#3 works. Thanks!

[nelsonic]

Appears to be working on localhost: 🎉

[nelsonic]

@LuchoTurtle looks good. thanks! 🥇