Skip to content

Commit

Permalink
Show empty stream message using :last-child pseudoselector
Browse files Browse the repository at this point in the history
  • Loading branch information
codeanpeace committed Jul 26, 2023
1 parent a5d7aa7 commit cbdda42
Showing 1 changed file with 1 addition and 0 deletions.
1 change: 1 addition & 0 deletions lib/live_cal_web/components/core_components.ex
Expand Up @@ -510,6 +510,7 @@ defmodule LiveCalWeb.CoreComponents do
phx-update={match?(%Phoenix.LiveView.LiveStream{}, @rows) && "stream"}
class="relative divide-y divide-zinc-100 border-t border-zinc-200 text-sm leading-6 text-zinc-700"
>
<tr class="hidden last:table-row"><td>No Streamed Items</td></tr>

This comment has been minimized.

Copy link
@codeanpeace

codeanpeace Aug 1, 2023

Author Owner

<tr class="hidden only:table-row"><td>No Streamed Items</td></tr>
https://elixirforum.com/t/stream-empty-state/57219/15?u=codeanpeace

<tr :for={row <- @rows} id={@row_id && @row_id.(row)} class="group hover:bg-zinc-50" data-visibility={if Map.has_key?(elem(row, 1), :visibility), do: elem(row, 1).visibility}>
<td
:for={{col, i} <- Enum.with_index(@col)}
Expand Down

1 comment on commit cbdda42

@codeanpeace
Copy link
Owner Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please note that you will still see the table headers when there are no streamed items. When I first had the idea, I had <ul>/<ol> and <li> elements in mind where it would be much less of an issue or even desired behavior. I ended up applying the idea to the .table core component purely out of convenience since that was what was available in a newly generated Phoenix app.

https://elixirforum.com/t/stream-empty-state/57219/18

Please sign in to comment.