Fix final ts compilation errs

12 · Jun 12, 2020 · 5e28099 · 5e28099
1 parent d9f9deb
commit 5e28099
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 6 deletions.
diff --git a/src/Components/Line/index.tsx b/src/Components/Line/index.tsx
@@ -28,16 +28,17 @@ const article = (status: number) => {
   }
 };
 
-export type LineProps = {
+export interface LineProps {
   name: string;
+  key: string;
   lineStatuses: [
     {
       statusSeverity: number;
       statusSeverityDescription: string;
       reason: string;
     }
   ];
-};
+}
 
 const Line: React.FunctionComponent<LineProps> = (line) => {
   const { name, lineStatuses } = line;

diff --git a/src/Containers/App/index.tsx b/src/Containers/App/index.tsx
@@ -8,10 +8,10 @@ import { globalStyles, WrapperStyled, GithubLinkStyled } from '../../Helpers/sty
 const endpoint =
   'https://api.tfl.gov.uk/line/mode/tube%2Cdlr%2Coverground%2Ctflrail%2Ctram%2Ccable-car/status';
 
-type ResponseType = {
-  response: Array<object> | null;
+interface ResponseType {
+  response: Array<LineProps> | null;
   error: object | null;
-};
+}
 
 const App = () => {
   const res: ResponseType = useFetch(endpoint);
@@ -24,7 +24,10 @@ const App = () => {
     <>
       <Global styles={globalStyles} />
       <WrapperStyled>
-        {res.response && res.response.map((line: LineProps) => <Line key={line.name} {...line} />)}
+        {res.response &&
+          res.response.map(({ name, lineStatuses }: LineProps) => (
+            <Line key={name} name={name} lineStatuses={lineStatuses} />
+          ))}
       </WrapperStyled>
       {!!res.response && (
         <GithubLinkStyled href="https://github.com/12/tube-status">