import React from 'react';
import ChannelList from './ChannelList';

const ChannelEntry = props => {
  const { clients, channel } = props;
  const joined = [];
  if (channel.totalClients > 0) {
    clients.forEach(client => {
      if (client.channelId === channel.id) joined.push(client);
    });
  }

  return (
    <>
      {channel.name}
      {joined.length > 0 && (
        <ul>
          {joined.map(e => (
            <li key={e.databaseId}>{e.nickname}</li>
          ))}
        </ul>
      )}
      {channel.subchannels !== undefined && (
        <ChannelList channels={channel.subchannels} clients={clients} />
      )}
    </>
  );
};

export default ChannelEntry;