From 64a84708d0239d68973b702a858385ff32ab369b Mon Sep 17 00:00:00 2001 From: Niel Rohling Date: Wed, 17 Apr 2019 23:39:50 +0200 Subject: [PATCH] add channelentry comp --- src/components/Channel/ChannelEntry.tsx | 21 +++++++++++++++++++++ src/components/Channel/ChannelList.tsx | 14 ++++++++------ src/interfaces.d.ts | 3 +++ 3 files changed, 32 insertions(+), 6 deletions(-) create mode 100644 src/components/Channel/ChannelEntry.tsx diff --git a/src/components/Channel/ChannelEntry.tsx b/src/components/Channel/ChannelEntry.tsx new file mode 100644 index 0000000..cd7645d --- /dev/null +++ b/src/components/Channel/ChannelEntry.tsx @@ -0,0 +1,21 @@ +import React, { Component } from 'react'; + +class ChannelEntry extends Component { + render() { + const { name, subchannels } = this.props.channel; + return ( + <> +
{name}
+ {subchannels !== undefined && ( + + )} + + ); + } +} + +export default ChannelEntry; diff --git a/src/components/Channel/ChannelList.tsx b/src/components/Channel/ChannelList.tsx index 3e97e96..8940978 100644 --- a/src/components/Channel/ChannelList.tsx +++ b/src/components/Channel/ChannelList.tsx @@ -1,5 +1,6 @@ import React, { Component } from 'react'; import ChannelService from '../../services/ChannelService'; +import ChannelEntry from './ChannelEntry'; import './ChannelList.scss'; @@ -24,12 +25,13 @@ export default class Channellist extends Component { } else { return (
    - {channels.map((e: Channel) => ( -
  • - #{e.id} - {e.name} -
  • - ))} + {channels.map((e: Channel) => { + return ( +
  • + +
  • + ); + })}
); } diff --git a/src/interfaces.d.ts b/src/interfaces.d.ts index 33e633d..db9ca9c 100644 --- a/src/interfaces.d.ts +++ b/src/interfaces.d.ts @@ -6,6 +6,9 @@ interface Channel { subchannels: Channel[]; } +interface ChannelEntryProps { + channel: Channel; +} interface ChannelViewProps { channel: Channel; }