【Elixir】Phoenix/LiveView で作るシンプルアプリ

mix phx.new app --install

mix phx.new app --install --binary-id

cd app

mix ecto.create

# マイグレーションを適用する
mix ecto.migrate

# マイグレーションの適用を元に戻す
mix ecto.rollback

# マイグレーションを最初からやり直す
mix ecto.reset

# マイグレーションファイルを作成する
mix ecto.gen.migration create_xxx

mix phx.server

iex -S mix phx.server

mix ecto.migrate

mix phx.gen.auth Accounts User users --live

mix deps.get

mix ecto.migrate

mix phx.routes

## Authentication routes

scope "/", AppWeb do
  pipe_through [:browser, :redirect_if_user_is_authenticated]
  # ログイン済みの場合は指定パスへリダイレクトされる
end

scope "/", AppWeb do
  pipe_through [:browser, :require_authenticated_user]
  # ログインが必須。未ログインの場合はログインページへリダイレクトされる
end

scope "/", AppWeb do
  pipe_through [:browser]
  # 未ログインでもアクセスできる
end

# GETリクエスト
get "/tasks", TaskController, :index

# GETリクエスト(パラメータあり)
get "/tasks/:id", TaskController, :show

# POSTリクエスト
post "/tasks", TaskController, :create

scope "/", MyAppWeb do
  pipe_through :browser

  # /tasksにアクセスした時にTaskLiveを呼び出す
  live "tasks", TaskLive

  # /booksにアクセスした時にBookLiveのIndexアクションを呼び出す
  live "/books", BookLive.Index, :index
end

## Authentication routes

# ログイン済みの場合は指定パスへリダイレクトされる
scope "/", AppWeb do
  pipe_through [:browser, :redirect_if_user_is_authenticated]

  live_session :redirect_if_user_is_authenticated,
    on_mount: [{AppWeb.UserAuth, :redirect_if_user_is_authenticated}] do
    # LiveViewルート
    live ...
  end

  # 通常のWEBルート
end

# ログインが必須。未ログインの場合はログインページへリダイレクトされる
scope "/", AppWeb do
  pipe_through [:browser, :require_authenticated_user]

  live_session :require_authenticated_user,
    on_mount: [{AppWeb.UserAuth, :ensure_authenticated}] do
    # LiveViewルート
    live ...
  end

  # 通常のWEBルート
end

# 未ログインでもアクセスできる
scope "/", AppWeb do
  pipe_through [:browser]

  live_session :current_user,
    on_mount: [{AppWeb.UserAuth, :mount_current_user}] do
    live ...
  end

  # 通常のWEBルート
end

defmodule AppWeb.ExampleLive.Index do
  use AppWeb, :live_view

  # クライアント接続時に呼ばれる関数
  def mount(_params, _session, socket) do
    # assignを初期化する
    {:ok, assign(socket, count: 0)}
  end

  def handle_event("increase", _value, socket) do
    # assignの値を+1する
    {:noreply, update(socket, :count, &(&1 + 1))}
  end

  def handle_event("decrease", _value, socket) do
    # assignの値を-1する
    {:noreply, update(socket, :count, &(&1 - 1))}
  end

  def handle_event("reset", _value, socket) do
    # 現在のassignはassigns.countからアクセスできる
    IO.inspect(socket.assigns.count)

    # assignを新しい値で上書きする
    {:noreply, assign(socket, count: 0)}
  end
end

<h3>Counter App</h3>
<div>
  Count: <%= @count %>
</div>
<div>
  <.button phx-click="increase">Up</.button>
  <.button phx-click="decrease">Down</.button>
  <.button phx-click="reset">reset</.button>
</div>

scope "/", AppWeb do
  pipe_through :browser

  live "/example", ExampleLive.Index, :index
end

def handle_params(params, uri, socket) do
  {:noreply, socket}
end

# streamを初期化する
stream(socket, :posts, posts)

# データを末尾に追加する
stream_insert(socket, :posts, new_post)

# データを削除する
stream_delete(socket, :posts, target_post)

mix test

mix test test/app_web/controllers
mix test test/app_web/controllers/page_controller_test.exs

mix test --only describe:"describe_name"

** (Postgrex.Error) ERROR 42P07 (duplicate_table) relation "users" already exists

MIX_ENV=test mix ecto.reset

test "簡単な計算のテスト" do
  # 1 + 1 の結果が 2 と等しいこと
  assert 1 + 1 == 2
end

test "簡単な計算のテスト" do
  # 1 + 1の結果が2と等しいこと
  assert 1 + 1 == 2

  # 1 + 1の結果が3と等しくないこと
  refute 1 + 1 == 3

  # falseとnil以外はtrueとみなされる
  assert 0
  assert -1
  assert "hello"
  assert true
  refute false
  refute nil
end

setup do
  IO.puts("setup")
end

setup do
  email = "test@example.com"
  %{email: email}
end

test "get email", %{email: email} do
  assert email == "test@example.com"
end

defp init(_conn) do
  # 初期化処理などを行う
  :ok
end

setup :init

import App.AccountsFixtures

user1 = user_fixture()
user2 = user_fixture(%{email: "test@example.com"})

defmodule App.ExampleTest do
  use App.DataCase

  describe "calc" do
    test "簡単な計算のテスト" do
      # 1 + 1の結果が2と等しいこと
      assert 1 + 1 == 2

      # 1 + 1の結果が3と等しくないこと
      refute 1 + 1 == 3
    end
  end

  describe "get_user" do
    # 他のdescribeには影響しない
    import App.AccountsFixtures
    alias App.Repo
    alias App.Accounts.User

    # テストの前処理を行う
    setup do
      # fixtureにmapを渡してフィールド値を上書きできる
      user = user_fixture(%{email: "test@example.com"})
      # testにデータを渡したい場合はmapを返す
      %{user: user}
    end

    # 第二引数でsetupのmapを受け取れる
    test "emailを指定してuserを取得する", %{user: user} do
      # 指定idのuserが取得できること
      assert Repo.get_by(User, email: user.email)

      # 指定idのuserが取得できないこと
      refute Repo.get_by(User, email: "not exist")
    end
  end
end

mix test test/app/example_test.exs --only describe:"get_user"

test "GET /", %{conn: conn} do
  # GET /にアクセスする
  conn = get(conn, ~p"/")

  # ステータスが200かつレスポンスに指定の文字列が含まれることを期待する
  assert html_response(conn, 200) =~ "Example Page"
end

test "saves new post", %{conn: conn} do
  # LIVE /postsにアクセスできることを期待する。LiveViewとHTMLを取得する
  {:ok, index_live, _html} = live(conn, ~p"/posts")

  # "New Post"というテキストを含むanchor要素を1つ取得できることを期待する→クリック→レンダリング後のHTMLに指定の文字列が含まれることを期待する
  assert index_live |> element("a", "New Post") |> render_click() =~
    "New Post"

  # 指定時間(デフォルトは100ms)以内にlive patchが発生することを期待する
  assert_patch(index_live, ~p"/posts/new")

  # フォームにデータを入力→changeイベント→レンダリング後のHTMLに指定のエラーメッセージが含まれることを期待する
  assert index_live
          |> form("#post-form", post: @invalid_attrs)
          |> render_change() =~ "can't be blank"

  # フォームにデータを入力→submitイベント→レンダリング
  assert index_live
          |> form("#post-form", post: @create_attrs)
          |> render_submit()

  # 指定時間(デフォルトは100ms)以内にlive patchが発生することを期待する
  assert_patch(index_live, ~p"/posts")

  # レンダリング後のHTMLに指定の文字列が含まれることを期待する
  html = render(index_live)
  assert html =~ "Post created successfully"
  assert html =~ "some body"
end

mix phx.gen.live Communication Post posts body:string like_count:integer user_id:references:users

scope "/", AppWeb do
  pipe_through [:browser, :require_authenticated_user]

  live_session :require_authenticated_user,
    on_mount: [{AppWeb.UserAuth, :ensure_authenticated}] do

    live "/posts", PostLive.Index, :index
    live "/posts/new", PostLive.Index, :new
    live "/posts/:id/edit", PostLive.Index, :edit
    live "/posts/:id", PostLive.Show, :show
    live "/posts/:id/show/edit", PostLive.Show, :edit
  end
end

mix phx.routes

defmodule App.Repo.Migrations.CreatePosts do
  use Ecto.Migration

  def change do
    create table(:posts) do
      add :body, :string, null: false
      add :like_count, :integer, default: 0, null: false
      add :user_id, references(:users, on_delete: :delete_all)

      timestamps(type: :utc_datetime)
    end

    create index(:posts, [:user_id])

  end
end

mix ecto.migrate

schema "posts" do
  field :body, :string
  field :like_count, :integer, default: 0
  field :user_id, :id

  timestamps(type: :utc_datetime)
end

def changeset(post, attrs) do
  post
  |> cast(attrs, [:body, :like_count])
  |> validate_required([:body, :like_count])
  |> validate_length(:body, min: 1, max: 200)
end

schema "users" do
  field :email, :string
  field :password, :string, virtual: true, redact: true
  field :hashed_password, :string, redact: true
  field :confirmed_at, :naive_datetime

  # 追加
  has_many(:posts, App.Communication.Post)

  timestamps(type: :utc_datetime)
end

schema "posts" do
  field :title, :string
  field :body, :string
  field :comment_count, :integer

  # 削除
  # field :user_id, :id

  # 追加
  belongs_to(:user, App.Accounts.User)

  timestamps(type: :utc_datetime)
end

alias App.Accounts
alias App.Accounts.User

def create_post(%User{id: user_id}, attrs \\ %{}) do
  %Post{}
  |> registration_change_post(user_id, attrs)
  |> Repo.insert()
end

def registration_change_post(%Post{} = post, user_id, attrs \\ %{}) do
  user = Accounts.get_user!(user_id)

  post
  |> Repo.preload(:user)
  |> Post.changeset(attrs)
  |> Ecto.Changeset.put_assoc(:user, user)
end

defp save_post(socket, :new, post_params) do
  user = socket.assigns.current_user

  case Communication.create_post(user, post_params) do
    # ...
  end
end

<.modal :if={@live_action == :new} id="post-modal" show on_cancel={JS.patch(~p"/posts")}>
  <.live_component
    module={AppWeb.PostLive.FormComponent}
    id={@post.id || :new}
    current_user={@current_user}
    title={@page_title}
    action={@live_action}
    post={@post}
    patch={~p"/posts"}
  />
</.modal>

def list_posts do
  query =
    from(
      p in Post,
      join: u in assoc(p, :user),
      preload: [user: u]
    )

  Repo.all(query)
end

def get_post!(id) do
  query =
    from(
      p in Post,
      where: p.id == ^id,
      join: u in assoc(p, :user),
      preload: [user: u]
    )

  Repo.one!(query)
end

<%= @post.user.email %>

def post_fixture(attrs \\ %{}) do
  attrs =
    attrs
    |> Enum.into(%{
      body: "some body",
      like_count: 42
    })

  {:ok, post} =
    App.Communication.create_post(attrs[:user], attrs)

  post
end

test "list_posts/0 returns all posts" do
  user = user_fixture()
  post = post_fixture(%{user: user})
  assert Communication.list_posts() == [Map.put(post, :user, user)]
end

setup :register_and_log_in_user

test "lists all posts", %{conn: conn, user: user} do
  post = post_fixture(%{user: user})
  {:ok, _index_live, html} = live(conn, ~p"/posts")

  assert html =~ "Listing Posts"
  assert html =~ post.body
end

def list_posts do
  query =
    from(
      p in Post,
      join: u in assoc(p, :user),
      preload: [user: u],
      order_by: [desc: p.updated_at],
      limit: 10
    )

  Repo.all(query)
end

@impl true
def mount(_params, _session, socket) do
  {:ok, stream(socket, :posts, Communication.list_posts(), at: 0, limit: 10)}
end

def handle_info({AppWeb.PostLive.FormComponent, {:saved, post}}, socket) do
  {:noreply, stream_insert(socket, :posts, post, at: 0)}
end

@doc """
リソースへの権限があるかbooleanで返します。

- UserがPostの作成者の場合はtrueを返す。
- UserがPostの作成者でない場合はfalseを返す。
"""
def can?(%User{id: user_id}, action, %Post{user_id: user_id}) when action in [:update, :delete],
do: true

def can?(%User{}, action, %Post{}) when action in [:update, :delete],
do: false

def update_post(%User{} = user, %Post{} = post, attrs) do
  if can?(user, :update, post) do
    post
    |> Post.changeset(attrs)
    |> Repo.update()
  else
    {:error, "permission denied"}
  end
end

def delete_post(%User{} = user, %Post{} = post) do
  if can?(user, :delete, post) do
    Repo.delete(post)
  else
    {:error, "permission denied"}
  end
end

defmodule AppWeb.PermissionError do
  defexception [:message]
end

defp save_post(socket, :edit, post_params) do
  user = socket.assigns.current_user

  case Communication.update_post(user, socket.assigns.post, post_params) do
    {:ok, post} ->
      notify_parent({:saved, post})

      {:noreply,
        socket
        |> put_flash(:info, "Post updated successfully")
        |> push_patch(to: socket.assigns.patch)}

    {:error, "permission denied"} ->
      raise AppWeb.PermissionError

    {:error, %Ecto.Changeset{} = changeset} ->
      {:noreply, assign_form(socket, changeset)}
  end
end

def handle_event("delete", %{"id" => id}, socket) do
  post = Communication.get_post!(id)
  user = socket.assigns.current_user

  case Communication.delete_post(user, post) do
    {:ok, _} -> {:noreply, push_navigate(socket, to: ~p"/posts", replace: true)}
    {:error, "permission denied"} -> raise AppWeb.PermissionError
  end
end

@impl true
def handle_params(%{"id" => id}, _, socket) do
  post = Communication.get_post!(id)
  user = socket.assigns.current_user

  {:noreply,
    socket
    |> assign(:page_title, page_title(socket.assigns.live_action))
    |> assign(:can_update, Communication.can?(user, :update, post))
    |> assign(:can_delete, Communication.can?(user, :delete, post))
    |> assign(:post, post)}
end

<:actions>
  <.link patch={~p"/posts/#{@post}/show/edit"} phx-click={JS.push_focus()} :if={@can_update}>
    <.button>Edit</.button>
  </.link>
  <.link phx-click={JS.push("delete", value: %{id: @post.id})} data-confirm="Are you sure?" :if={@can_delete}>
    <.button>Delete</.button>
  </.link>
</:actions>

describe "posts" do
  test "update_post/3 with valid data updates the post" do
    user = user_fixture()
    post = post_fixture(%{user: user})
    update_attrs = %{body: "some updated body"}

    assert {:ok, %Post{} = post} = Communication.update_post(user, post, update_attrs)
    assert post.body == "some updated body"
  end

  test "delete_post/2 deletes the post" do
    user = user_fixture()
    post = post_fixture(%{user: user})
    assert {:ok, %Post{}} = Communication.delete_post(user, post)
    assert_raise Ecto.NoResultsError, fn -> Communication.get_post!(post.id) end
  end
end

describe "other posts" do
  import App.CommunicationFixtures
  import App.AccountsFixtures

# 別ユーザーのPostを作成する
  setup do
    user = user_fixture()
    post = post_fixture(%{user: user})

    %{post: post}
  end

  # 第二引数でsetupのPostを受け取る
  test "update_post/3 他人のPostは更新できないこと", %{post: post} do
    user = user_fixture()
    update_attrs = %{body: "some updated body"}

    # 権限エラーになることぉ期待する
    assert {:error, "permission denied"} = Communication.update_post(user, post, update_attrs)
  end

  test "delete_post/2 他人のPostは削除できないこと", %{post: post} do
    user = user_fixture()

    # 権限エラーになることぉ期待する
    {:error, "permission denied"} = Communication.delete_post(user, post)
  end
end

describe "posts_authorization" do
  import App.CommunicationFixtures
  import App.AccountsFixtures

  test "Postに対する権限が取得できること" do
    u1 = user_fixture()
    p1 = post_fixture(%{user: u1})
    u2 = user_fixture()
    p2 = post_fixture(%{user: u2})

    assert Communication.can?(u1, :update, p1)
    assert Communication.can?(u1, :delete, p1)
    refute Communication.can?(u1, :update, p2)
    refute Communication.can?(u1, :delete, p2)
  end
end

import App.CommunicationFixtures

# ログインユーザーの作成とログインを行う
setup :register_and_log_in_user

describe "show posts" do
  # 第二引数でログインユーザーを受け取る
  test "ShowページでPostが削除できること", %{conn: conn, user: user} do
    post = post_fixture(%{user: user})
    {:ok, show_live, html} = live(conn, ~p"/posts/#{post}")

    # HTMLに削除ボタンが含まれていることを期待する
    assert html =~ "Delete"

    # 削除ボタンが見つかりクリックできることを期待する
    assert show_live |> element("a", "Delete") |> render_click() =~ "Delete

    # リダイレクトが発生することを期待する
    assert_redirect(show_live, ~p"/posts")
  end
end

describe "show other posts" do
  import App.AccountsFixtures

  # 別ユーザーでPostを作成する
  setup do
    user = user_fixture()
    post = post_fixture(%{user: user})
    %{post: post}
  end

  # 第二引数でsetupのPostを受け取る
  test "他人のPostは削除できないこと", %{conn: conn, post: post} do
    {:ok, _show_live, html} = live(conn, ~p"/posts/#{post}")

    # 削除ボタンが見つからないことを期待する
    refute html =~ "Delete"
  end
end

mix phx.gen.context Interaction Like likes user_id:references:users post_id:references:posts

defmodule App.Repo.Migrations.CreateLikes do
  use Ecto.Migration

  def change do
    create table(:likes) do
      add :user_id, references(:users, on_delete: :delete_all)
      add :post_id, references(:posts, on_delete: :delete_all)

      timestamps(type: :utc_datetime)
    end

    create unique_index(:likes, [:user_id, :post_id])
    create index(:likes, [:user_id])
    create index(:likes, [:post_id])
  end
end

mix ecto.migrate

schema "likes" do

  # 削除
  # field :user_id, :id
  # field :post_id, :id

  # 追加
  belongs_to(:user, App.Accounts.User)

  # 追加
  belongs_to(:post, App.Communication.Post)

  timestamps(type: :utc_datetime)
end

def changeset(like, attrs) do
  like
  |> cast(attrs, [:user_id, :post_id])
  |> validate_required([:user_id, :post_id])
end

defmodule App.Interaction do
  @moduledoc """
  The Interaction context.
  """

  import Ecto.Query, warn: false
  alias App.Repo
  alias App.Accounts.User
  alias App.Communication.Post
  alias App.Interaction.Like

  def list_likes_by_post_id(post_id) do
    query =
      from(
        l in Like,
        where: l.post_id == ^post_id,
        join: u in assoc(l, :user),
        preload: [user: u],
        order_by: [desc: l.inserted_at],
        limit: 10
      )

    Repo.all(query)
  end

  def get_like(user_id, post_id) do
    query =
      from(
        l in Like,
        where: l.post_id == ^post_id and l.user_id == ^user_id
      )

    Repo.one(query)
  end

  def toggle_like(%User{} = user, %Post{} = post) do
    # いいねデータが存在する場合は削除、なければ作成する
    if like_exists?(user.id, post.id) do
      like = get_like(user.id, post.id)

      case delete_like(like) do
        {:ok, %Like{} = like} -> {:ok, :delete, like}
        {:error, %Ecto.Changeset{} = changeset} -> {:error, :delete, changeset}
      end
    else
      case create_like(user, post) do
        {:ok, %Like{} = like} -> {:ok, :create, like}
        {:error, %Ecto.Changeset{} = changeset} -> {:error, :create, changeset}
      end
    end
  end

  def like_exists?(user_id, post_id) do
    Repo.exists?(
      from(
        l in Like,
        where: l.user_id == ^user_id and l.post_id == ^post_id,
        select: {l.id}
      )
    )
  end

  def create_like(%User{} = user, %Post{} = post) do
    %Like{}
    |> registration_change_like(user, post)
    |> Repo.insert()
  end

  def delete_like(%Like{} = like) do
    Repo.delete(like)
  end

  def registration_change_like(%Like{} = like, %User{} = user, %Post{} = post) do
    like
    |> Repo.preload([:user, :post])
    |> Like.changeset(%{user_id: user.id, post_id: post.id})
    |> Ecto.Changeset.put_assoc(:user, user)
    |> Ecto.Changeset.put_assoc(:post, post)
  end
end

defmodule App.InteractionTest do
  use App.DataCase

  alias App.Interaction

  describe "likes" do
    alias App.Interaction.Like

    import App.AccountsFixtures
    import App.CommunicationFixtures
    import App.InteractionFixtures

    test "toggle_like/2 Likeが存在する場合は削除、なければ作成できること" do
      user = user_fixture()
      post = post_fixture(%{user: user})
      like_fixture(%{user: user, post: post})
      assert Interaction.like_exists?(user.id, post.id)
      assert {:ok, :delete, _} = Interaction.toggle_like(user, post)
      refute Interaction.like_exists?(user.id, post.id)
      assert {:ok, :create, _} = Interaction.toggle_like(user, post)
      assert Interaction.like_exists?(user.id, post.id)
    end

    test "list_likes_by_post_id/1 post_idにマッチするLikeが取得できること" do
      user = user_fixture()
      post = post_fixture(%{user: user})
      like = like_fixture(%{user: user, post: post})

      assert [result | _] =
               Interaction.list_likes_by_post_id(post.id)

      assert result.user_id == like.user_id
      assert result.post_id == like.post_id
    end

    test "get_like/2 Likeが取得できること" do
      user = user_fixture()
      post = post_fixture(%{user: user})
      like = like_fixture(%{user: user, post: post})

      refute Interaction.get_like(0, 0)

      assert result =
               Interaction.get_like(user.id, post.id)

      assert result.user_id == like.user_id
      assert result.post_id == like.post_id
    end

    test "like_exists?/2 Likeが存在するかbooleanで返されること" do
      user = user_fixture()
      post = post_fixture(%{user: user})
      like_fixture(%{user: user, post: post})
      assert Interaction.like_exists?(user.id, post.id)
      refute Interaction.like_exists?(0, 0)
    end

    test "create_like/2 正しいデータでLikeが作成できること" do
      user = user_fixture()
      post = post_fixture(%{user: user})

      assert {:ok, %Like{} = like} =
               Interaction.create_like(user, post)

      assert like.user_id == user.id
      assert like.post_id == post.id
      assert Interaction.like_exists?(user.id, post.id)
    end

    test "delete_like/1 Likeが削除できること" do
      user = user_fixture()
      post = post_fixture(%{user: user})
      like = like_fixture(%{user: user, post: post})
      assert {:ok, %Like{}} = Interaction.delete_like(like)
      refute Interaction.like_exists?(user.id, post.id)
    end

    test "registration_change_like/3 changesetが返されること" do
      user = user_fixture()
      post = post_fixture(%{user: user})
      like = like_fixture(%{user: user, post: post})

      assert %Ecto.Changeset{} =
               Interaction.registration_change_like(like, user, post)
    end
  end
end

def handle_params(%{"id" => id}, _, socket) do
  post = Communication.get_post!(id)
  user = socket.assigns.current_user

  {:noreply,
    socket
    |> assign(:page_title, page_title(socket.assigns.live_action))
    |> assign(:can_update, Communication.can?(user, :update, post))
    |> assign(:can_delete, Communication.can?(user, :delete, post))
    |> assign(:post, post)
    |> stream(:likes, Interaction.list_likes_by_post_id(post.id), at: 0, limit: 10)}
end

@impl true
def handle_event("like", %{"id" => id}, socket) do
  post = Communication.get_post!(id)
  user = socket.assigns.current_user

  case Interaction.toggle_like(user, post) do
    {:ok, :create, like} ->
      {:noreply, stream_insert(socket, :likes, like)}

    {:ok, :delete, like} ->
      {:noreply, stream_delete(socket, :likes, like)}

    {:error, :create, _} ->
      {:noreply, put_flash(socket, :error, "いいねの途中でエラーが発生しました")}

    {:error, :delete, _} ->
      {:noreply, put_flash(socket, :error, "いいねの取り消しの途中でエラーが発生しました")}
  end
end

<.list>
  <:item title="Like count">
    <.button phx-click={JS.push("like", value: %{id: @post.id})}>
  <%= @post.like_count %> Likes
  </.button>
  </:item>
</.list>

<h2>いいねしたユーザー</h2>
<ul id="liked-users" phx-update="stream">
  <li :for={{dom_id, like} <- @streams.likes} id={dom_id}>
  <%= like.user.email %>
      </li>
  </ul>

def create_like(%User{} = user, %Post{} = post) do
  Ecto.Multi.new()
  |> Ecto.Multi.one(
    :post,
    from(p in Post, where: p.id == ^post.id)
  )
  |> Ecto.Multi.update(:set_count, fn %{post: post} ->
    Post.like_count_changeset(post, %{like_count: post.like_count + 1})
  end)
  |> Ecto.Multi.insert(
    :create_like,
    registration_change_like(%Like{}, user, post)
  )
  |> Repo.transaction()
  |> case do
    {:ok, %{create_like: like}} ->
      {:ok, like}

    {:error, _name, changeset} ->
      {:error, changeset}
  end
end

def delete_like(%Like{} = like) do
  Ecto.Multi.new()
  |> Ecto.Multi.one(
    :post,
    from(p in Post, where: p.id == ^like.post_id)
  )
  |> Ecto.Multi.update(:set_count, fn %{post: post} ->
    Post.like_count_changeset(post, %{like_count: post.like_count - 1})
  end)
  |> Ecto.Multi.delete(:delete_like, like)
  |> Repo.transaction()
  |> case do
    {:ok, %{delete_like: like}} ->
      {:ok, like}

    {:error, _name, changeset} ->
      {:error, changeset}
  end
end

def like_count_changeset(post, attrs) do
  post
  |> cast(attrs, [:like_count])
  |> validate_required([:like_count])
end

def handle_params(%{"id" => id}, _, socket) do
  post = Communication.get_post!(id)
  user = socket.assigns.current_user

  {:noreply,
    socket
    |> assign(:page_title, page_title(socket.assigns.live_action))
    |> assign(:can_update, Communication.can?(user, :update, post))
    |> assign(:can_delete, Communication.can?(user, :delete, post))
    |> assign(:post, post)
    |> assign(:like_count, post.like_count)
    |> stream(:likes, Interaction.list_likes_by_post_id(post.id), at: 0, limit: 10)}
end

@impl true
def handle_event("like", %{"id" => id}, socket) do
  post = Communication.get_post!(id)
  user = socket.assigns.current_user

  case Interaction.toggle_like(user, post) do
    {:ok, :create, %Like{} = like} ->
      {:noreply,
        socket
        |> update(:like_count, &(&1 + 1))
        |> stream_insert(:likes, like)}

    {:ok, :delete, %Like{} = like} ->
      {:noreply,
        socket
        |> update(:like_count, &(&1 - 1))
        |> stream_delete(:likes, like)}

    {:error, :create, %Ecto.Changeset{}} ->
      {:noreply, put_flash(socket, :error, "いいねの途中でエラーが発生しました")}

    {:error, :delete, %Ecto.Changeset{}} ->
      {:noreply, put_flash(socket, :error, "いいねの取り消しの途中でエラーが発生しました")}
  end
end

<.button phx-click={JS.push("like", value: %{id: @post.id})}>
  <%= @like_count %> Likes
</.button>

test "create_like/2 正しいデータでLikeが作成できること" do
  user = user_fixture()
  post = post_fixture(%{user: user})

  assert {:ok, %Like{} = like} =
            Interaction.create_like(user, post)

  assert like.user_id == user.id
  assert like.post_id == post.id
  assert Interaction.like_exists?(user.id, post.id)
  assert %Post{like_count: 1} = Communication.get_post!(post.id)
end

test "delete_like/1 Likeが削除できること" do
  user = user_fixture()
  post = post_fixture(%{user: user})
  like = like_fixture(%{user: user, post: post})
  assert {:ok, %Like{}} = Interaction.delete_like(like)
  refute Interaction.like_exists?(user.id, post.id)
  assert %Post{like_count: 0} = Communication.get_post!(post.id)
end

alias App.Communication
alias App.Communication.Post

test "いいねボタンを押すといいね数が更新されること", %{conn: conn, user: user} do
  post = post_fixture(%{user: user})
  {:ok, show_live, _html} = live(conn, ~p"/posts/#{post}")

  assert show_live |> element("button", "0 Likes") |> render_click() =~ "1 Likes"

  assert show_live |> element("button", "1 Likes") |> render_click() =~ "0 Likes"
end

create table(:posts) do
  add :body, :string, null: false
  add :like_count, :integer, default: 0, null: false

  # 追加
  add :path, :string

  add :user_id, references(:users, on_delete: :delete_all)

  timestamps(type: :utc_datetime)
end

mix ecto.reset

schema "posts" do
  field :body, :string
  field :like_count, :integer, default: 0

  # 追加
  field :path, :string

  belongs_to(:user, App.Accounts.User)
  many_to_many(:liked_users, App.Accounts.User, join_through: "likes")

  timestamps(type: :utc_datetime)
end

def changeset(post, attrs) do
  post
  |> cast(attrs, [:body, :like_count, :path])
  |> validate_required([:body])
  |> validate_length(:body, min: 1, max: 200)
end

def mount(socket) do
  {:ok,
    allow_upload(socket, :images,
      accept: ~w(.jpg .jpeg .png),
      max_entries: 1,
      max_file_size: 4_000_000
    )}
end

defp save_post(socket, :new, post_params) do
  {:ok, post_params} = save_file(socket, post_params)
  user = socket.assigns.current_user

  case Communication.create_post(user, post_params) do
    # ...
  end
end

defp save_file(socket, post_params) do
  image_files =
    consume_uploaded_entries(socket, :images, fn %{path: path}, entry ->
      # 実際はバイナリコードなどをチェックするべき
      ext = Path.extname(entry.client_name)
      dest = Path.join([:code.priv_dir(:app), "static", "uploads", Path.basename(path) <> ext])

      File.cp!(path, dest)
      {:ok, "/uploads/#{Path.basename(dest)}"}
    end)

  post_params = if length(image_files) > 0 do
    [file | _] = image_files
    Map.put(post_params, "path", file)
  else
    Map.put(post_params, "path", nil)
  end

  {:ok, post_params}
end

@impl true
def render(assigns) do
  ~H"""
  <div>
    ・・・

    <.simple_form
      for={@form}
      id="post-form"
      phx-target={@myself}
      phx-change="validate"
      phx-submit="save"
    >
    ・・・

    <.live_file_input :if={@action == :new} upload={@uploads.images} />
    <%= for entry <- @uploads.images.entries do %>
      <figure>
        <.live_img_preview entry={entry} />
        <figcaption><%= entry.client_name %></figcaption>
      </figure>
      <progress value={entry.progress} max="100"><%= entry.progress %>%</progress>
      <%= for err <- upload_errors(@uploads.images, entry) do %>
        <p role="alert" class="alert alert-danger"><%= err %></p>
      <% end %>
    <% end %>

      <:actions>
        <.button phx-disable-with="Saving...">Save Post</.button>
      </:actions>
    </.simple_form>
  </div>
  """
end

defp delete_file!(post_path) do
  if !is_nil(post_path) do
    path = Path.join([:code.priv_dir(:app), "static", post_path])
    File.rm!(path)
  end
end

plug Plug.Static,
  at: "/",
  from: :app,
  gzip: false,
  only: ~w(assets fonts images favicon.ico robots.txt uploads)

<div class="max-w-xs overflow-hidden" :if="{@post.path}">
  <img src="{@post.path}" class="w-full h-auto block" alt="添付画像" />
</div>

describe "upload" do
  test "Postにアップロード画像を添付できること", %{conn: conn} do
    {:ok, index_live, _html} = live(conn, ~p"/posts")

    assert index_live |> element("a", "New Post") |> render_click() =~
              "New Post"

    assert_patch(index_live, ~p"/posts/new")

    assert index_live
            |> file_input("#post-form", :images, [
              %{
                name: "hello.png",
                type: "image/png",
                content: File.read!("test/support/uploads/hello.png")
              }
            ])
            |> render_upload("hello.png") =~ "hello.png"

    assert index_live
            |> form("#post-form", post: @create_attrs)
            |> render_submit()

    assert_patch(index_live, ~p"/posts")

    html = render(index_live)
    assert html =~ "Post created successfully"
    assert html =~ "some body"
  end
end

@impl true
def start(_type, _args) do
  children = [
    ...
    {Phoenix.PubSub, name: App.PubSub},
  ]

  # See https://hexdocs.pm/elixir/Supervisor.html
  # for other strategies and supported options
  opts = [strategy: :one_for_one, name: App.Supervisor]
  Supervisor.start_link(children, opts)
end

defmodule App.CommunicationBroadcaster do
  @moduledoc """
  Communicationデータのブロードキャストを行うモジュール
  """

  # このモジュール名の文字列("App.CommunicationBroadcaster")をtopicにする
  @topic inspect(__MODULE__)

  @doc false
  def subscribe do
    Phoenix.PubSub.subscribe(App.PubSub, @topic)
  end

  @doc false
  def broadcast({event, data}) do
    Phoenix.PubSub.broadcast(App.PubSub, @topic, {event, data})
  end
end

defmodule App.CommunicationBroadcasterTest do
  use App.DataCase
  alias App.CommunicationBroadcaster

  describe "broadcaster" do
    test "broadcast/1 ブロードキャストされたデータを受信できること" do
      data = {:create_message, "some message"}

      CommunicationBroadcaster.subscribe()
      CommunicationBroadcaster.broadcast(data)
      assert_receive ^data
    end
  end
end

def mount(_params, _session, socket) do
# mount時にsubscribeする
  if connected?(socket), do: App.CommunicationBroadcaster.subscribe()

  {:ok, stream(socket, :posts, Communication.list_posts(), at: 0, limit: 10)}
end

...

# FormComponentの送信後に呼び出されるコールバック関数
@impl true
def handle_info({AppWeb.PostLive.FormComponent, {:saved, post}}, socket) do
# subscriberに新しいPostをbroadcastする
  App.CommunicationBroadcaster.broadcast({:saved, post})

  {:noreply, stream_insert(socket, :posts, post, at: 0)}
end

# broadcast後に呼び出されるコールバック関数
@impl true
def handle_info({:saved, post}, socket) do
  {:noreply, stream_insert(socket, :posts, post, at: 0)}
end