SHARE
TWEET

Untitled

a guest Jul 18th, 2019 81 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React from 'react';
  2. import {connect} from 'react-redux';
  3. import ComponentForm from './ComponentForm';
  4. import {startAddComponent} from '../actions/components';
  5.  
  6. export class AddComponentPage extends React.Component {
  7.     onSubmit = (component) => {
  8.         console.log(this.props);
  9.         this.props.startAddComponent(component);
  10.         this.props.history.push('/');
  11.     };
  12.  
  13.     render() {
  14.         //console.log(this.props);
  15.         return (
  16.             <div>
  17.                 <h1 className="page-header__title">Add Component</h1>
  18.                 <ComponentForm onSubmit={this.onSubmit}/>
  19.             </div>
  20.         )
  21.     }
  22. }
  23.  
  24. const mapDispatchToProps = (dispatch) => {
  25.     return { startAddComponent: (comp) => dispatch(startAddComponent(comp))}
  26. };
  27.  
  28. export default connect(undefined, mapDispatchToProps)(AddComponentPage);
  29.      
  30. import database from '../firebase/firebase';
  31.  
  32. export const addComponent = (component) => ({
  33.     type: 'ADD_COMPONENT',
  34.     component
  35. });
  36.  
  37. export const startAddComponent = (componentData = {})=> {
  38.     return (dispatch, getState) => {
  39.         const uid = getState().auth.uid;
  40.         const {
  41.             description = '',
  42.             startDate = 0,
  43.             endDate = 0,
  44.             tags = []
  45.         } = componentData;
  46.  
  47.         const component = {description, startDate, endDate, tags };
  48.         database.ref(`users/${uid}/components`).push(component)
  49.             .then ((ref) => {
  50.                 dispatch(addComponent({
  51.                     id: ref.key,
  52.                     ...component
  53.                 }));
  54.             });
  55.     };
  56. };
  57.      
  58. import { createStore, combineReducers, applyMiddleware, compose } from 'redux';
  59. import thunk from 'redux-thunk';
  60. import authReducer from '../reducers/auth';
  61. import componentReducer from '../reducers/components';
  62.  
  63.  
  64. const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
  65.  
  66. export default () => {
  67.     const store = createStore(
  68.         combineReducers({
  69.             auth: authReducer,
  70.             components: componentReducer
  71.         }),
  72.         composeEnhancers(applyMiddleware(thunk))
  73.         //window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
  74.     );
  75.     return store;
  76. };
  77.      
  78. const componentsReducerDefaultState = [];
  79.  
  80. export default (state = componentsReducerDefaultState, action) => {
  81.     //console.log(action)
  82.     switch (action.type) {
  83.         case 'ADD_COMPONENT':
  84.             return [
  85.                 ...state,
  86.                 action.component
  87.             ];
  88.         case 'SET_COMPONENTS':
  89.             return action.components;
  90.         default:
  91.             return state;
  92.     }
  93. };
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top