From e5dff62e1b7244c5969f4e4406fe04ff357ccc10 Mon Sep 17 00:00:00 2001
From: Niel Rohling <niel.rohling@gmail.com>
Date: Thu, 18 Apr 2019 01:47:47 +0200
Subject: [PATCH] refactoring

---
 src/components/Channel/ChannelEntry.tsx |  4 ++--
 src/components/Channel/Channels.tsx     | 20 +++++++++++---------
 src/{interfaces.d.ts => types.d.ts}     |  6 ++++++
 tslint.json                             |  3 ++-
 4 files changed, 21 insertions(+), 12 deletions(-)
 rename src/{interfaces.d.ts => types.d.ts} (83%)

diff --git a/src/components/Channel/ChannelEntry.tsx b/src/components/Channel/ChannelEntry.tsx
index 62a9b27..31af0e0 100644
--- a/src/components/Channel/ChannelEntry.tsx
+++ b/src/components/Channel/ChannelEntry.tsx
@@ -12,11 +12,11 @@ const ChannelEntry = (props: ChannelEntryProps) => {
 
   return (
     <>
-      <div>{channel.name}</div>
+      {channel.name}
       {joined.length > 0 && (
         <ul>
           {joined.map(e => (
-            <li>{e.nickname}</li>
+            <li key={e.databaseId}>{e.nickname}</li>
           ))}
         </ul>
       )}
diff --git a/src/components/Channel/Channels.tsx b/src/components/Channel/Channels.tsx
index 10d2ea6..3b5d0d7 100644
--- a/src/components/Channel/Channels.tsx
+++ b/src/components/Channel/Channels.tsx
@@ -2,24 +2,26 @@ import React, { Component } from 'react';
 import ApiService from '../../services/ApiService';
 import ChannelList from './ChannelList';
 
-class Channels extends Component<any, any> {
+class Channels extends Component<{}, ChannelState> {
   constructor(props: any) {
     super(props);
     this.state = {
       loaded: false,
       channels: [],
-      users: [],
+      clients: [],
     };
   }
 
   componentDidMount() {
-    ApiService.fetchAllChannels().then(data => {
-      this.setState({
-        channels: data.channelJson,
-        clients: data.clientJson,
-        loaded: true,
-      });
-    });
+    ApiService.fetchAllChannels()
+      .then(data => {
+        this.setState({
+          channels: data.channelJson,
+          clients: data.clientJson,
+          loaded: true,
+        });
+      })
+      .catch(e => console.error(e));
   }
   render() {
     const { loaded, channels, clients } = this.state;
diff --git a/src/interfaces.d.ts b/src/types.d.ts
similarity index 83%
rename from src/interfaces.d.ts
rename to src/types.d.ts
index 63b1dbb..ffe51b8 100644
--- a/src/interfaces.d.ts
+++ b/src/types.d.ts
@@ -15,6 +15,12 @@ interface Client {
   awayMessage: string;
 }
 
+interface ChannelState {
+  loaded: boolean;
+  channels: Channel[];
+  clients: Client[];
+}
+
 interface ChannelListProps {
   channels: Channel[];
   clients: Client[];
diff --git a/tslint.json b/tslint.json
index 397ac68..f59abad 100644
--- a/tslint.json
+++ b/tslint.json
@@ -14,7 +14,8 @@
         "jsx-boolean-value": false,
         "member-access": false,
         "no-console": false,
-        "strict-type-predicates": false
+        "strict-type-predicates": false,
+        "interface-name": false
     },
     "rulesDirectory": []
 }