annonomize function components
This commit is contained in:
parent
cb768c9fac
commit
3487e53115
7 changed files with 16 additions and 28 deletions
|
@ -1,9 +1,9 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { BrowserRouter as Router, Route } from 'react-router-dom';
|
import { BrowserRouter as Router, Route } from 'react-router-dom';
|
||||||
import Home from './components/Home';
|
import Home from './Home';
|
||||||
import Header from './components/Header';
|
import Header from './Header';
|
||||||
|
|
||||||
const App = () => {
|
export default () => {
|
||||||
return (
|
return (
|
||||||
<div className='App'>
|
<div className='App'>
|
||||||
<Header />
|
<Header />
|
||||||
|
@ -13,5 +13,3 @@ const App = () => {
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default App;
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ChannelList from './ChannelList';
|
import ChannelList from './ChannelList';
|
||||||
|
|
||||||
const ChannelEntry = props => {
|
export default props => {
|
||||||
const { clients, channel } = props;
|
const { clients, channel } = props;
|
||||||
const joined = [];
|
const joined = [];
|
||||||
if (channel.totalClients > 0) {
|
if (channel.totalClients > 0) {
|
||||||
|
@ -26,5 +26,3 @@ const ChannelEntry = props => {
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default ChannelEntry;
|
|
||||||
|
|
|
@ -2,7 +2,7 @@ import React from 'react';
|
||||||
|
|
||||||
import ChannelEntry from './ChannelEntry';
|
import ChannelEntry from './ChannelEntry';
|
||||||
|
|
||||||
const ChannelList = ({ channels, clients }) => {
|
export default ({ channels, clients }) => {
|
||||||
return (
|
return (
|
||||||
<ul className='channelList'>
|
<ul className='channelList'>
|
||||||
{channels.map(channel => {
|
{channels.map(channel => {
|
||||||
|
@ -15,5 +15,3 @@ const ChannelList = ({ channels, clients }) => {
|
||||||
</ul>
|
</ul>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default ChannelList;
|
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
const ChannelView = ({ channel }) => {
|
export default ({ channel }) => {
|
||||||
return (
|
return (
|
||||||
<div className='channel-view'>
|
<div className='channel-view'>
|
||||||
<h2>{channel.name}</h2>
|
<h2>{channel.name}</h2>
|
||||||
|
@ -24,5 +24,3 @@ const ChannelView = ({ channel }) => {
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default ChannelView;
|
|
||||||
|
|
|
@ -1,7 +1,5 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
const Header = () => {
|
export default () => {
|
||||||
return <div className='app-header'>Cliffbreak.de</div>;
|
return <div className='app-header'>Cliffbreak.de</div>;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Header;
|
|
||||||
|
|
|
@ -1,12 +1,10 @@
|
||||||
import React, { Component } from 'react';
|
import React from 'react';
|
||||||
import Channels from './Channel/Channels';
|
import Channels from './Channel/Channels';
|
||||||
|
|
||||||
export default class Home extends Component {
|
export default () => {
|
||||||
render() {
|
return (
|
||||||
return (
|
<div>
|
||||||
<div>
|
<Channels />
|
||||||
<Channels />
|
</div>
|
||||||
</div>
|
);
|
||||||
);
|
};
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
import App from './App';
|
import App from './components/App';
|
||||||
import './index.scss';
|
import './index.scss';
|
||||||
import * as serviceWorker from './serviceWorker';
|
import * as serviceWorker from './serviceWorker';
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue