From 8f1286e7208fd69d28827fb7daac78287d7574ef Mon Sep 17 00:00:00 2001 From: SerGladkOFF Date: Tue, 5 Sep 2017 22:28:52 +0300 Subject: [PATCH 1/2] HW3 add person to FB\virtualize person list --- src/components/people/Persons.js | 39 ++++++++++++++++++++++++ src/components/routes/PersonPage.js | 25 ++++++++++++++-- src/config.js | 7 +++-- src/ducks/people.js | 46 +++++++++++++++++++++++------ 4 files changed, 102 insertions(+), 15 deletions(-) create mode 100644 src/components/people/Persons.js diff --git a/src/components/people/Persons.js b/src/components/people/Persons.js new file mode 100644 index 0000000..fb2e278 --- /dev/null +++ b/src/components/people/Persons.js @@ -0,0 +1,39 @@ +import React,{Component} from 'react' +import {Table, Column} from 'react-virtualized' + +export default class Persons extends Component { + render(){ + const { + entities=[] + }=this.props + console.log("Persons",entities) + return
+ entities[index]} + > + + + +
+
+ } + +} \ No newline at end of file diff --git a/src/components/routes/PersonPage.js b/src/components/routes/PersonPage.js index fd69263..f7ff2b8 100644 --- a/src/components/routes/PersonPage.js +++ b/src/components/routes/PersonPage.js @@ -1,7 +1,8 @@ import React, { Component } from 'react' import {connect} from 'react-redux' -import {addPerson} from '../../ducks/people' +import {addPerson,moduleName} from '../../ducks/people' import NewPersonForm from '../people/NewPersonForm' +import Persons from '../people/Persons' class PersonPage extends Component { static propTypes = { @@ -9,13 +10,31 @@ class PersonPage extends Component { }; render() { + const { + addPerson, + error, + entities + }=this.props return (

Add new person

- + +

{error}

+
) } } -export default connect(null, {addPerson})(PersonPage) \ No newline at end of file +//entities={entities.valueSeq().toArray()} + +export default connect(store=>({ + error:store[moduleName].error, + entities:store[moduleName].entities +}), {addPerson})(PersonPage) \ No newline at end of file diff --git a/src/config.js b/src/config.js index e8d8d78..f01e1ac 100644 --- a/src/config.js +++ b/src/config.js @@ -1,13 +1,14 @@ import firebase from 'firebase' -export const appName = "advreact-21-08" +export const appName ="advreact-277e8"// "advreact-21-08" export const firebaseConfig = { - apiKey: "AIzaSyDjA6CeIHuni5lNm4ML1b-TSxJltsYUO8g", + //apiKey: "AIzaSyDjA6CeIHuni5lNm4ML1b-TSxJltsYUO8g", + apiKey: "AIzaSyCw2LF9saF-AiDhbN464gWERWR35m5qm0Q", authDomain: `${appName}.firebaseapp.com`, databaseURL: `https://${appName}.firebaseio.com`, projectId: appName, storageBucket: `${appName}.appspot.com`, - messagingSenderId: "789814589283" + messagingSenderId: "313050002315"//"789814589283" } firebase.initializeApp(firebaseConfig) \ No newline at end of file diff --git a/src/ducks/people.js b/src/ducks/people.js index 6a2a848..e6d220c 100644 --- a/src/ducks/people.js +++ b/src/ducks/people.js @@ -3,9 +3,11 @@ import {Record, List} from 'immutable' import {put, call, takeEvery} from 'redux-saga/effects' import {generateId} from './utils' import {reset} from 'redux-form' +import firebase from 'firebase' const ReducerState = Record({ - entities: new List([]) + entities: new List([]), + error:null }) const PersonRecord = Record({ @@ -19,15 +21,19 @@ export const moduleName = 'people' const prefix = `${appName}/${moduleName}` export const ADD_PERSON_REQUEST = `${prefix}/ADD_PERSON_REQUEST` export const ADD_PERSON = `${prefix}/ADD_PERSON` +export const ADD_PERSON_ERROR = `${prefix}/ADD_PERSON_ERROR` + + export default function reducer(state = new ReducerState(), action) { - const {type, payload} = action + const {type, payload,error} = action switch (type) { case ADD_PERSON: return state.update('entities', entities => entities.push(new PersonRecord(payload))) - + case ADD_PERSON_ERROR: + return state.set('error', error.message) default: return state } @@ -39,18 +45,40 @@ export function addPerson(person) { payload: person } } +function addPersonToFB(userId, {firstName,lastName,email}) { + firebase.database().ref('users/' + userId).set({ + firstName, + lastName, + email + }); + } export const addPersonSaga = function * (action) { - const id = yield call(generateId) + try { + const id = yield call(generateId) - yield put({ - type: ADD_PERSON, - payload: {...action.payload, id} - }) + yield call(()=>addPersonToFB(id,action.payload)) + + yield put({ + type: ADD_PERSON, + payload: {...action.payload, id} + }) - yield put(reset('person')) + yield put(reset('person')) + + } catch (error) { + yield put({ + type: ADD_PERSON_ERROR, + error + }) + } + + + } + + /* export function addPerson(person) { return (dispatch) => { From c14a1c31bc57ec64be1846d58d4e96fa058aae5c Mon Sep 17 00:00:00 2001 From: SerGladkOFF Date: Wed, 6 Sep 2017 22:02:14 +0300 Subject: [PATCH 2/2] tests --- src/components/events/VirtualizedEventList.js | 2 +- src/components/people/Persons.js | 25 ++++++---- src/components/people/person.test.js | 50 +++++++++++++++++++ src/ducks/people.js | 3 +- src/ducks/people.test.js | 12 ++++- 5 files changed, 79 insertions(+), 13 deletions(-) create mode 100644 src/components/people/person.test.js diff --git a/src/components/events/VirtualizedEventList.js b/src/components/events/VirtualizedEventList.js index edf61fd..9385667 100644 --- a/src/components/events/VirtualizedEventList.js +++ b/src/components/events/VirtualizedEventList.js @@ -15,7 +15,7 @@ export class EventList extends Component { render() { const {loaded, events} = this.props -// if (loading) return + // if (loading) return return ( return
entities[index]} - > + rowClassName="person-list__row" + rowCount={entities.length} + rowHeight={40} + headerHeight={50} + overscanRowCount={5} + width={700} + height={300} + rowGetter={({ index }) => entities[index]}> { + //какие бы компоненты сюда не подставлял всегда проходит + //const container=shallow()/NewPersonForm + //expect(container.contains())/NewPersonForm + //пока я не написал вот так + const container=shallow() + + + expect(container.contains()).toEqual(true) +}) + +//не прошкел тест=( +//дедлайн поковырять не успел больше +it('should render event list', () => { + + + const container = shallow() + + const rows = container.find('.person-list__row') + + expect(rows.length).toEqual(entities.length) +}) + diff --git a/src/ducks/people.js b/src/ducks/people.js index e6d220c..fd88dc5 100644 --- a/src/ducks/people.js +++ b/src/ducks/people.js @@ -45,7 +45,7 @@ export function addPerson(person) { payload: person } } -function addPersonToFB(userId, {firstName,lastName,email}) { +export function addPersonToFB(userId, {firstName,lastName,email}) { firebase.database().ref('users/' + userId).set({ firstName, lastName, @@ -53,6 +53,7 @@ function addPersonToFB(userId, {firstName,lastName,email}) { }); } + export const addPersonSaga = function * (action) { try { const id = yield call(generateId) diff --git a/src/ducks/people.test.js b/src/ducks/people.test.js index 3afb2ca..0ac13d0 100644 --- a/src/ducks/people.test.js +++ b/src/ducks/people.test.js @@ -1,10 +1,11 @@ -import {addPersonSaga, ADD_PERSON, ADD_PERSON_REQUEST} from './people' +import {addPersonSaga,addPersonToFB, ADD_PERSON, ADD_PERSON_REQUEST} from './people' import {call, put} from 'redux-saga/effects' import {generateId} from './utils' it('should dispatch person with id', () => { const person = { firstName: 'Roman', + lastName:'Roman', email: 'test@test.com' } @@ -13,10 +14,19 @@ it('should dispatch person with id', () => { payload: person }) + + expect(saga.next().value).toEqual(call(generateId)) const id = generateId() + //в начале я написл так + //expect(saga.next(id).value).toEqual(call(()=>addPersonToFB(id, person))) + //спустя тек оверфлоу написал так + //жестко или норм? + expect(JSON.stringify(saga.next(id).value)) + .toBe(JSON.stringify(call(()=>addPersonToFB(id, person)))) + expect(saga.next(id).value).toEqual(put({ type: ADD_PERSON, payload: {id, ...person}