I am trying to embed a twitter timeline of a particular page in a react-bootstrap Panel however I am unable to get it to work. I am not getting any console logging output which makes me think that I have not gotten it set up properly, however I am unsure as to what the issue is. I am using react-twitter-widgets to embed the timeline.
My component is as follows:
import React from 'react';
import { Timeline } from 'react-twitter-widgets';
function twitterTimeline() {
return (
<Timeline
dataSource={{
sourceType: 'profile',
screenName: 'MetEireann',
}}
options={{
username: 'MetEireann',
height: '400',
}}
onLoad={() => console.log('Timeline is loaded!')}
/>
);
}
export default twitterTimeline;
And then I am using it like so in my react-bootstrap Panel:
import twitterTimeline from '../../components/TwitterTimeline';
.....
<div className="col-lg-4">
<Panel
header={<span>
<i className="fa fa-bar-chart fa-fw" /> Weather Forecast
</span>}
>
<twitterTimeline />
</Panel>
</div>
The component is being loaded in so the issue is obviously with the component itself.
Any help would be greatly appreciated. Thanks in advance.