From 09814ac40d16f17b71f03a8fcff39447d0ff083e Mon Sep 17 00:00:00 2001 From: MICHAELMUNAVU83 Date: Tue, 17 Oct 2023 03:46:50 +0300 Subject: [PATCH 1/3] Started add to cart with sockets --- .../live/home_live/cart_component.ex | 24 +++++++++++++++++++ .../live/home_live/index.ex | 15 ++++++++++++ .../live/home_live/index.html.heex | 16 ++++++++++++- lib/elixir_conf_africa_web/router.ex | 1 + 4 files changed, 55 insertions(+), 1 deletion(-) create mode 100644 lib/elixir_conf_africa_web/live/home_live/cart_component.ex diff --git a/lib/elixir_conf_africa_web/live/home_live/cart_component.ex b/lib/elixir_conf_africa_web/live/home_live/cart_component.ex new file mode 100644 index 0000000..73b6218 --- /dev/null +++ b/lib/elixir_conf_africa_web/live/home_live/cart_component.ex @@ -0,0 +1,24 @@ +defmodule ElixirConfAfricaWeb.HomeLive.CartComponent do + use ElixirConfAfricaWeb, :live_component + + @impl true + def render(assigns) do + ~H""" +
+ tvgbhnjmk + test +
+ """ + end + + @impl true + def update(params, socket) do + IO.inspect(socket) + + {:ok, socket} + end + + @impl true + + defp notify_parent(msg), do: send(self(), {__MODULE__, msg}) +end diff --git a/lib/elixir_conf_africa_web/live/home_live/index.ex b/lib/elixir_conf_africa_web/live/home_live/index.ex index 9dfc8d0..9ec563d 100644 --- a/lib/elixir_conf_africa_web/live/home_live/index.ex +++ b/lib/elixir_conf_africa_web/live/home_live/index.ex @@ -9,6 +9,21 @@ defmodule ElixirConfAfricaWeb.HomeLive.Index do {:ok, socket |> assign(:available_tickets, availabe_tickets) + |> assign(:cart, []) |> assign(:event, elixir_conf_africa_event)} end + + def handle_event("add_to_cart", %{"id" => id}, socket) do + if Enum.member?(socket.assigns.cart, String.to_integer(id)) do + {:noreply, + socket + |> put_flash(:error, "Ticket already in cart")} + else + new_cart_items = socket.assigns.cart ++ [String.to_integer(id)] + + {:noreply, + socket + |> assign(:cart, new_cart_items)} + end + end end diff --git a/lib/elixir_conf_africa_web/live/home_live/index.html.heex b/lib/elixir_conf_africa_web/live/home_live/index.html.heex index cec095a..3157508 100644 --- a/lib/elixir_conf_africa_web/live/home_live/index.html.heex +++ b/lib/elixir_conf_africa_web/live/home_live/index.html.heex @@ -124,7 +124,11 @@

KSH <%= ticket_type.price %>

- @@ -141,3 +145,13 @@
+ +<%= if @live_action in [:cart] do %> + <.live_component + module={ElixirConfAfricaWeb.HomeLive.CartComponent} + id="cart" + title="Cart" + action={@live_action} + patch={~p"/ticket_types"} + /> +<% end %> diff --git a/lib/elixir_conf_africa_web/router.ex b/lib/elixir_conf_africa_web/router.ex index b538e48..9d99a7d 100644 --- a/lib/elixir_conf_africa_web/router.ex +++ b/lib/elixir_conf_africa_web/router.ex @@ -20,6 +20,7 @@ defmodule ElixirConfAfricaWeb.Router do get "/", PageController, :home live "/home", HomeLive.Index, :index + live "/home/cart", HomeLive.Index, :cart live "/events", EventLive.Index, :index live "/events/new", EventLive.Index, :new From f5db2d41dcd3980f6263a4de9156aec90a56dc29 Mon Sep 17 00:00:00 2001 From: MICHAELMUNAVU83 Date: Wed, 18 Oct 2023 04:32:50 +0300 Subject: [PATCH 2/3] Added cart in socket --- .../live/home_live/cart_component.ex | 24 -- .../live/home_live/index.ex | 32 ++- .../live/home_live/index.html.heex | 244 +++++++++++++----- lib/elixir_conf_africa_web/router.ex | 1 - 4 files changed, 206 insertions(+), 95 deletions(-) delete mode 100644 lib/elixir_conf_africa_web/live/home_live/cart_component.ex diff --git a/lib/elixir_conf_africa_web/live/home_live/cart_component.ex b/lib/elixir_conf_africa_web/live/home_live/cart_component.ex deleted file mode 100644 index 73b6218..0000000 --- a/lib/elixir_conf_africa_web/live/home_live/cart_component.ex +++ /dev/null @@ -1,24 +0,0 @@ -defmodule ElixirConfAfricaWeb.HomeLive.CartComponent do - use ElixirConfAfricaWeb, :live_component - - @impl true - def render(assigns) do - ~H""" -
- tvgbhnjmk - test -
- """ - end - - @impl true - def update(params, socket) do - IO.inspect(socket) - - {:ok, socket} - end - - @impl true - - defp notify_parent(msg), do: send(self(), {__MODULE__, msg}) -end diff --git a/lib/elixir_conf_africa_web/live/home_live/index.ex b/lib/elixir_conf_africa_web/live/home_live/index.ex index 9ec563d..e9c6877 100644 --- a/lib/elixir_conf_africa_web/live/home_live/index.ex +++ b/lib/elixir_conf_africa_web/live/home_live/index.ex @@ -1,29 +1,53 @@ defmodule ElixirConfAfricaWeb.HomeLive.Index do use ElixirConfAfricaWeb, :live_view alias ElixirConfAfrica.Events + alias ElixirConfAfrica.TicketTypes def mount(_params, _session, socket) do elixir_conf_africa_event = Events.get_elixir_conf_event_and_ticket_types() availabe_tickets = Events.get_all_available_tickets() + cart = [] + total_price = get_total_price(cart) {:ok, socket |> assign(:available_tickets, availabe_tickets) - |> assign(:cart, []) + |> assign(:cart, cart) + |> assign(:total_price, total_price) + |> assign(:page_state, "details") |> assign(:event, elixir_conf_africa_event)} end def handle_event("add_to_cart", %{"id" => id}, socket) do - if Enum.member?(socket.assigns.cart, String.to_integer(id)) do + ticket_type = + TicketTypes.get_ticket_type!(String.to_integer(id)) + |> Map.put(:quantity, 1) + + if Enum.member?(socket.assigns.cart, ticket_type) do {:noreply, socket |> put_flash(:error, "Ticket already in cart")} else - new_cart_items = socket.assigns.cart ++ [String.to_integer(id)] + new_cart_items = [ticket_type | socket.assigns.cart] + total_price = get_total_price(new_cart_items) {:noreply, socket - |> assign(:cart, new_cart_items)} + |> put_flash(:info, "Ticket added to cart") + |> assign(:cart, new_cart_items) + |> assign(:total_price, total_price)} end end + + def handle_event("change_page_state", %{"page_state" => page_state}, socket) do + {:noreply, + socket + |> assign(:page_state, page_state)} + end + + defp get_total_price(cart) do + Enum.reduce(cart, 0, fn ticket_type, acc -> + acc + Decimal.to_integer(ticket_type.price) * ticket_type.quantity + end) + end end diff --git a/lib/elixir_conf_africa_web/live/home_live/index.html.heex b/lib/elixir_conf_africa_web/live/home_live/index.html.heex index 3157508..1330c66 100644 --- a/lib/elixir_conf_africa_web/live/home_live/index.html.heex +++ b/lib/elixir_conf_africa_web/live/home_live/index.html.heex @@ -57,10 +57,18 @@
-

+

Details

-

+

Cart

@@ -72,70 +80,184 @@

-<%!-- navbar --%> -
-
-
-
-

- Event Information -

-
-
-

Start Date

-

<%= @event.start_date %>

-
-
-

End Date

-

<%= @event.start_date %>

+ <%= if @page_state == "details" do %> +
+
+
+

+ Event Information +

+
+
+

Start Date

+

<%= @event.start_date %>

+
+
+

End Date

+

<%= @event.start_date %>

+
+
+

Event Type

+

<%= @event.event_type %>

+
+
+

Available Tickets

+

<%= @available_tickets %>

+
-
-

Event Type

-

<%= @event.event_type %>

+
+

Location

+

<%= @event.location %>

-

Available Tickets

-

<%= @available_tickets %>

+

Hosted by

+

Elixir Conf Africa

-
-

Location

-

<%= @event.location %>

-
-
-

Hosted by

-

Elixir Conf Africa

+
+

Available Tickets

+ +
+ <%= for ticket_type <- @event.ticket_types do %> +
+
+

<%= ticket_type.name %>

+

<%= ticket_type.number %>Tickets

+
+

+ <%= ticket_type.description %> +

+
+

KSH <%= ticket_type.price %>

+
+ + +
+
+
+ <% end %> +
-
-

Available Tickets

+
+ <% else %> +
+
+
+

+ Ticket Cart +

-
- <%= for ticket_type <- @event.ticket_types do %> -
-
-

<%= ticket_type.name %>

-

<%= ticket_type.number %>Tickets

-
-

- <%= ticket_type.description %> + <%= for cart_item <- @cart do %> +

+

+ <%= cart_item.name %>

-
-

KSH <%= ticket_type.price %>

-
- - +
+

+ <%= cart_item.price %> +

+
+
+

+ Who is this ticket for ? +

+ +
+ <% end %> + +
+

Total Amount

+

<%= @total_price %>

+
+
+

+ Checkout +

+
+
+
+

+ Ticket Overview +

+ + <%= for cart_item <- @cart do %> +

Early Bird Ticket

+
+

+ +

+
+
+ +

+ Elixir Safari +

+
+
+ +
+
+
+

Name:

+

Otieno

+
+
+

Country:

+

kenya

+
+
+
+

20th June 2024

+

+

20th June 2024

+
+
+
+

+ Ticket Value +

+

+ <%= cart_item.price %> +

+
+
+
+ +
@@ -143,15 +265,5 @@
-
+ <% end %>
- -<%= if @live_action in [:cart] do %> - <.live_component - module={ElixirConfAfricaWeb.HomeLive.CartComponent} - id="cart" - title="Cart" - action={@live_action} - patch={~p"/ticket_types"} - /> -<% end %> diff --git a/lib/elixir_conf_africa_web/router.ex b/lib/elixir_conf_africa_web/router.ex index 9d99a7d..b538e48 100644 --- a/lib/elixir_conf_africa_web/router.ex +++ b/lib/elixir_conf_africa_web/router.ex @@ -20,7 +20,6 @@ defmodule ElixirConfAfricaWeb.Router do get "/", PageController, :home live "/home", HomeLive.Index, :index - live "/home/cart", HomeLive.Index, :cart live "/events", EventLive.Index, :index live "/events/new", EventLive.Index, :new From 0145e70e2f6821dfbc3ce88062f4f36866b4a551 Mon Sep 17 00:00:00 2001 From: MICHAELMUNAVU83 Date: Wed, 18 Oct 2023 04:39:26 +0300 Subject: [PATCH 3/3] Refractored pipe function --- lib/elixir_conf_africa/ticket_types.ex | 5 +++++ lib/elixir_conf_africa_web/live/home_live/index.ex | 6 ++++-- 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/lib/elixir_conf_africa/ticket_types.ex b/lib/elixir_conf_africa/ticket_types.ex index bba0b1f..e20f843 100644 --- a/lib/elixir_conf_africa/ticket_types.ex +++ b/lib/elixir_conf_africa/ticket_types.ex @@ -21,6 +21,11 @@ defmodule ElixirConfAfrica.TicketTypes do Repo.all(TicketType) end + def add_quantity(ticket_type, quantity) do + ticket_type + |> Map.put(:quantity, quantity) + end + @doc """ Gets a single ticket_type. diff --git a/lib/elixir_conf_africa_web/live/home_live/index.ex b/lib/elixir_conf_africa_web/live/home_live/index.ex index e9c6877..ff7c585 100644 --- a/lib/elixir_conf_africa_web/live/home_live/index.ex +++ b/lib/elixir_conf_africa_web/live/home_live/index.ex @@ -20,8 +20,10 @@ defmodule ElixirConfAfricaWeb.HomeLive.Index do def handle_event("add_to_cart", %{"id" => id}, socket) do ticket_type = - TicketTypes.get_ticket_type!(String.to_integer(id)) - |> Map.put(:quantity, 1) + id + |> String.to_integer() + |> TicketTypes.get_ticket_type!() + |> TicketTypes.add_quantity(1) if Enum.member?(socket.assigns.cart, ticket_type) do {:noreply,