diff --git a/admin/src/App.js b/admin/src/App.js index 89f2dc0..a955695 100644 --- a/admin/src/App.js +++ b/admin/src/App.js @@ -8,6 +8,11 @@ class App extends Component { render() { return (
+
+ + events + +
people diff --git a/admin/src/components/events/event-list.js b/admin/src/components/events/event-list.js new file mode 100644 index 0000000..0b5106d --- /dev/null +++ b/admin/src/components/events/event-list.js @@ -0,0 +1,25 @@ +import React from 'react' +import Event from './event' + +class EventList extends React.Component { + render() { + return ( +
    + {this.getEvents()} +
+ ) + } + + getEvents() { + const { events } = this.props + + if (!events) return [] + + return events.map((value, key) => { + return (
  • ) + }) + } +} + + +export default EventList \ No newline at end of file diff --git a/admin/src/components/events/event.js b/admin/src/components/events/event.js new file mode 100644 index 0000000..f837af2 --- /dev/null +++ b/admin/src/components/events/event.js @@ -0,0 +1,20 @@ +import React from 'react' + +class Event extends React.Component { + render() { + const {event: {title, url, when, where}} = this.props + return ( +
    +

    {title}

    +
    +
    Url:
    {url}
    +
    When:
    {when}
    +
    Where:
    {where}
    +
    +
    + ) + } +} + + +export default Event \ No newline at end of file diff --git a/admin/src/config.js b/admin/src/config.js index aa22b3b..8f5eb89 100644 --- a/admin/src/config.js +++ b/admin/src/config.js @@ -1,16 +1,16 @@ -import firebase from 'firebase/app' +import firebase from 'firebase' import 'firebase/auth' import 'firebase/database' -export const appName = 'advreact-10-05' +export const appName = 'adv-react-training' export const config = { - apiKey: 'AIzaSyCbMQM0eQUSQ0SuLVAu9ZNPUcm4rdbiB8U', - authDomain: `${appName}.firebaseapp.com`, - databaseURL: `https://${appName}.firebaseio.com`, - projectId: appName, - storageBucket: '', - messagingSenderId: '1094825197832' + apiKey: "AIzaSyCmvhyNT0lpU0qkMlXHzrsNbH3HOTh8f4A", + authDomain: `${appName}.firebaseapp.com`, + databaseURL: `https://${appName}.firebaseio.com`, + projectId: appName, + storageBucket: `${appName}.appspot.com`, + messagingSenderId: "547163325073" } firebase.initializeApp(config) diff --git a/admin/src/ducks/events.js b/admin/src/ducks/events.js new file mode 100644 index 0000000..67fc1f3 --- /dev/null +++ b/admin/src/ducks/events.js @@ -0,0 +1,72 @@ +import { appName} from "../config" +import { Record, Map } from 'immutable' +import firebase from 'firebase/app' +import { takeEvery, all, put, call, apply } from 'redux-saga/effects' + +/** + * Constants + * */ +export const moduleName = 'events' +const prefix = `${appName}/${moduleName}` + +export const EVENTS_LOAD_REQUEST = `${prefix}/EVENTS_LOAD_REQUEST` +export const EVENTS_LOAD_SUCCESS = `${prefix}/EVENTS_LOAD_SUCCESS` +export const EVENTS_LOAD_ERROR = `${prefix}/EVENTS_LOAD_ERROR` + +/** + * Reducer + * */ +export const ReducerRecord = Record({ + events: null, + eventsLoadError: null +}) + +export default function reducer(state = new ReducerRecord(), action) { + const { type, payload } = action + + switch (type) { + case EVENTS_LOAD_SUCCESS: + return state.set('events', payload.events) + case EVENTS_LOAD_ERROR: + return state.set('eventsLoadError', payload.error) + default: + return state + } +} + +/** + * Selectors + */ +export const getEvents = (state) => state[moduleName].events +export const getEventsLoadError = (state) => state[moduleName].eventsLoadError + +/** + * Action Creators + * */ + +export function loadEvents() { + return { + type: EVENTS_LOAD_REQUEST + } +} + +/** + * Sagas + */ + +export function* loadEventsSaga() { + + try { + const refs = firebase.database().ref().child('events') + const events = yield apply(refs, refs.once, ['value']) + + yield put({ type: EVENTS_LOAD_SUCCESS, payload: { events: Map(events.toJSON()) } }) + + } catch (error) { + yield put({ type: EVENTS_LOAD_ERROR, error }) + } +} + +export function* saga() { + yield all([takeEvery(EVENTS_LOAD_REQUEST, loadEventsSaga), loadEventsSaga()]) +} \ No newline at end of file diff --git a/admin/src/redux/reducer.js b/admin/src/redux/reducer.js index f9c1879..8e2e9be 100644 --- a/admin/src/redux/reducer.js +++ b/admin/src/redux/reducer.js @@ -3,10 +3,12 @@ import { routerReducer as router } from 'react-router-redux' import { reducer as form } from 'redux-form' import authReducer, { moduleName as authModule } from '../ducks/auth' import peopleReducer, { moduleName as peopleModule } from '../ducks/people' +import eventsReducer, { moduleName as eventsModule} from '../ducks/events' export default combineReducers({ router, form, [authModule]: authReducer, - [peopleModule]: peopleReducer + [peopleModule]: peopleReducer, + [eventsModule]: eventsReducer }) diff --git a/admin/src/redux/saga.js b/admin/src/redux/saga.js index 8f1e0cd..9d0ed64 100644 --- a/admin/src/redux/saga.js +++ b/admin/src/redux/saga.js @@ -1,7 +1,8 @@ import { all } from 'redux-saga/effects' import { saga as authSaga } from '../ducks/auth' import { saga as peopleSaga } from '../ducks/people' +import { saga as eventsSaga } from '../ducks/events' export default function*() { - yield all([authSaga(), peopleSaga()]) + yield all([authSaga(), peopleSaga(), eventsSaga()]) } diff --git a/admin/src/routes/admin.js b/admin/src/routes/admin.js index aa30167..d2f5a70 100644 --- a/admin/src/routes/admin.js +++ b/admin/src/routes/admin.js @@ -1,6 +1,7 @@ import React, { Component } from 'react' import { Route } from 'react-router-dom' import PersonPage from './person-page' +import EventsPage from "./events"; class AdminPage extends Component { static propTypes = {} @@ -10,6 +11,7 @@ class AdminPage extends Component {

    Admin Page

    +
    ) } diff --git a/admin/src/routes/events.js b/admin/src/routes/events.js new file mode 100644 index 0000000..24ceb2b --- /dev/null +++ b/admin/src/routes/events.js @@ -0,0 +1,30 @@ +import React from 'react' +import { connect } from 'react-redux' +import { loadEvents, getEvents, getEventsLoadError } from '../ducks/events' +import EventList from '../components/events/event-list' + +class EventsPage extends React.Component { + constructor(props) { + super(props) + loadEvents(); + } + + render() { + const { events, eventsLoadError } = this.props + return ( +
    +

    Events List:

    + {eventsLoadError &&
    Something was wrong!!!
    } + +
    + + ) + } +} + +const mapStateToProps = (state) => ({ + events: getEvents(state), + eventsLoadError: getEventsLoadError(state) +}) + +export default connect(mapStateToProps, loadEvents)(EventsPage) \ No newline at end of file