diff --git a/src/App.js b/src/App.js index 5f4cdf8..b34a366 100644 --- a/src/App.js +++ b/src/App.js @@ -3,6 +3,8 @@ import './App.css'; import timelineData from './data/timeline.json'; import Timeline from './components/Timeline'; +import TimelineEvent from './components/TimelineEvent'; +import Timestamp from './components/Timestamp'; class App extends Component { render() { @@ -12,9 +14,10 @@ class App extends Component { return (
-

Application title

+

Ada Lovelace's social media feed

+
); diff --git a/src/components/Timeline.js b/src/components/Timeline.js index 624d4ec..782bb6a 100644 --- a/src/components/Timeline.js +++ b/src/components/Timeline.js @@ -2,9 +2,24 @@ import React from 'react'; import './Timeline.css'; import TimelineEvent from './TimelineEvent'; -const Timeline = () => { - // Fill in your code here - return; +const Timeline = (props) => { + + const events = props.events.map((event, i) => { + return ( + + ); + }); + + return ( +
+ + {events} + +
+ ); } export default Timeline; diff --git a/src/components/TimelineEvent.js b/src/components/TimelineEvent.js index 9079165..df0a0a5 100644 --- a/src/components/TimelineEvent.js +++ b/src/components/TimelineEvent.js @@ -2,9 +2,22 @@ import React from 'react'; import './TimelineEvent.css'; import Timestamp from './Timestamp'; -const TimelineEvent = () => { +const TimelineEvent = (props) => { // Fill in your code here - return; + // const time = props.time + return( +
+
+ {props.person} +
+
+ {props.status} +
+
+ +
+
+ ); } export default TimelineEvent;