memEx/lib/memex_web/live/invite_live/index.html.heex

<div class="w-full flex flex-col space-y-8 justify-center items-center">
  <h1 class="title text-2xl title-primary-500">
    <%= gettext("invites") %>
  </h1>

  <%= if @invites |> Enum.empty?() do %>
    <h1 class="title text-xl text-primary-400">
      <%= gettext("no invites 😔") %>
    </h1>

    <.link patch={Routes.invite_index_path(Endpoint, :new)} class="btn btn-primary">
      <%= dgettext("actions", "invite someone new!") %>
    </.link>
  <% else %>
    <.link patch={Routes.invite_index_path(Endpoint, :new)} class="btn btn-primary">
      <%= dgettext("actions", "create invite") %>
    </.link>
  <% end %>

  <div class="w-full flex flex-row flex-wrap justify-center items-center">
    <.invite_card :for={invite <- @invites} invite={invite} current_user={@current_user}>
      <:code_actions>
        <form phx-submit="copy_to_clipboard">
          <button
            type="submit"
            class="mx-2 my-1 btn btn-primary"
            phx-click={JS.dispatch("memex:clipcopy", to: "#code-#{invite.id}")}
          >
            <%= dgettext("actions", "Copy to clipboard") %>
          </button>
        </form>
      </:code_actions>
      <.link
        patch={Routes.invite_index_path(Endpoint, :edit, invite)}
        class="text-primary-400 link"
        data-qa={"edit-#{invite.id}"}
      >
        <i class="fa-fw fa-lg fas fa-edit"></i>
      </.link>

      <.link
        href="#"
        class="text-primary-400 link"
        phx-click="delete_invite"
        phx-value-id={invite.id}
        data-confirm={
          dgettext("prompts", "are you sure you want to delete the invite for %{invite_name}?",
            invite_name: invite.name
          )
        }
        data-qa={"delete-#{invite.id}"}
      >
        <i class="fa-fw fa-lg fas fa-trash"></i>
      </.link>

      <a
        href="#"
        class="btn btn-primary"
        phx-click={if invite.disabled_at, do: "enable_invite", else: "disable_invite"}
        phx-value-id={invite.id}
      >
        <%= if invite.disabled_at, do: gettext("enable"), else: gettext("disable") %>
      </a>

      <a
        :if={invite.disabled_at |> is_nil() and not (invite.uses_left |> is_nil())}
        href="#"
        class="btn btn-primary"
        phx-click="set_unlimited"
        phx-value-id={invite.id}
        data-confirm={
          dgettext("prompts", "are you sure you want to make %{invite_name} unlimited?",
            invite_name: invite.name
          )
        }
      >
        <%= gettext("set unlimited") %>
      </a>
    </.invite_card>
  </div>

  <%= unless @admins |> Enum.empty?() do %>
    <hr class="hr" />

    <h1 class="title text-2xl text-primary-400">
      <%= gettext("Admins") %>
    </h1>

    <div class="w-full flex flex-row flex-wrap justify-center items-center">
      <.user_card :for={admin <- @admins} user={admin}>
        <.link
          href="#"
          class="text-primary-400 link"
          phx-click="delete_user"
          phx-value-id={admin.id}
          data-confirm={
            dgettext(
              "prompts",
              "are you sure you want to delete %{email}? This action is permanent!",
              email: admin.email
            )
          }
        >
          <i class="fa-fw fa-lg fas fa-trash"></i>
        </.link>
      </.user_card>
    </div>
  <% end %>

  <%= unless @users |> Enum.empty?() do %>
    <hr class="hr" />

    <h1 class="title text-2xl text-primary-400">
      <%= gettext("users") %>
    </h1>

    <div class="w-full flex flex-row flex-wrap justify-center items-center">
      <.user_card :for={user <- @users} user={user}>
        <.link
          href="#"
          class="text-primary-400 link"
          phx-click="delete_user"
          phx-value-id={user.id}
          data-confirm={
            dgettext(
              "prompts",
              "are you sure you want to delete %{email}? This action is permanent!",
              email: user.email
            )
          }
        >
          <i class="fa-fw fa-lg fas fa-trash"></i>
        </.link>
      </.user_card>
    </div>
  <% end %>
</div>

<.modal :if={@live_action in [:new, :edit]} return_to={Routes.invite_index_path(Endpoint, :index)}>
  <.live_component
    module={MemexWeb.InviteLive.FormComponent}
    id={@invite.id || :new}
    title={@page_title}
    action={@live_action}
    invite={@invite}
    return_to={Routes.invite_index_path(Endpoint, :index)}
    current_user={@current_user}
  />
</.modal>