react component for main app that loads announcement list

App.js

// App
// <App/>

import React from 'react';

import Header from './Header';
import SenderNav from './SenderNav';
import Dashboard from './Dashboard';
import AnnouncementsList from './Announcements/AnnouncementsList';

// Firebase
import Rebase from 're-base';
var base = Rebase.createClass('https://myappurl.firebaseio.com/');

var App = React.createClass({

    getInitialState : function() {
        return{
            contents : {},
            announcements : {}
        }
    },

    componentDidMount : function() {

        base.syncState('contents', {
            context: this,
            state: 'contents'
        });

        base.syncState('announcements', {
            context: this,
            state: 'announcements',
            queries: {
                orderByValue: 'created_at',
                limitToLast: 1
            }
        });
    },

    seedContent : function(event){
        this.setState({
            contents : require('../../loading/sample_content'),
            announcements : require('../../loading/sample_announcements')
        });
        console.log("seeded content");
    },

    render : function() {
        return (
            <div id="container2">

                <Header/>
                <SenderNav/>
                <div className="row">
                    <div className="col-md-12 center" align="center">&nbsp;Errors & Notices will go here </div>
                </div>


                <div className="container-fluid">

                    <div id="">
                        <AnnouncementList
                            seedContent={this.seedContent}
                            announcements={this.state.announcements}/>
                    </div>
                        {/*<!-- footer -->*/}
                </div>
            </div>
        )
    }
});

export default App;