Challenge 3: Client Subscription — Solution

// app/javascript/channels/notifications_channel.js
import consumer from "./consumer"

consumer.subscriptions.create(
  { channel: "NotificationsChannel" },
  {
    received(data) {
      const list = document.querySelector("#notifications")
      const item = document.createElement("li")
      item.textContent = data.message
      list.appendChild(item)
    }
  }
)

=begin
Notes:
- No extra identifying params (like CommentsChannel's post_id) are passed
  in the subscription object here -- the server already knows which user
  this connection belongs to from Connection#connect, so subscribing to
  NotificationsChannel alone is enough for stream_for current_user to find
  the right stream.
- received(data) fires automatically every time Challenge 2's
  broadcast_to(user, ...) call sends a payload to this user's stream --
  there's no polling or manual re-fetching involved.
- The DOM update inside received is the same kind of direct manipulation
  already covered in js1-8 -- Action Cable's job ends at delivering the
  data to the browser; what the page does with it is ordinary client-side
  JavaScript.
=end