diff --git a/admin/src/components/basket/index.js b/admin/src/components/basket/index.js
new file mode 100644
index 0000000..bc36475
--- /dev/null
+++ b/admin/src/components/basket/index.js
@@ -0,0 +1,46 @@
+import React, { Component } from 'react'
+import { connect } from 'react-redux'
+import { DropTarget } from 'react-dnd'
+import { deletePerson } from '../../ducks/people'
+import { deleteEvent } from '../../ducks/events'
+
+class Basket extends Component {
+ static propTypes = {}
+
+ render() {
+ const { event, connectDropTarget, canDrop, hovered } = this.props
+
+ const borderColor = canDrop ? (hovered ? 'red' : 'green') : 'black'
+
+ return connectDropTarget(
+
+
Корзина
+ Перетащите в корзину чтобы удалить пользователя или событие
+
+ )
+ }
+}
+
+const spec = {
+ drop(props, monitor) {
+ const { deletePerson, deleteEvent } = props
+ let item = monitor.getItem()
+ if (item.uid) deletePerson(monitor.getItem().uid)
+
+ if (item.eventId) {
+ console.log('---', 'eventId to basket', monitor.getItem().eventId)
+ deleteEvent(monitor.getItem().eventId)
+ }
+ }
+}
+
+const collect = (connect, monitor) => ({
+ connectDropTarget: connect.dropTarget(),
+ canDrop: monitor.canDrop(),
+ hovered: monitor.isOver()
+})
+
+export default connect(
+ null,
+ { deletePerson, deleteEvent }
+)(DropTarget(['person', 'event'], spec, collect)(Basket))
diff --git a/admin/src/components/events/virtualized-lazy-table.js b/admin/src/components/events/virtualized-lazy-table.js
index 520c87f..8b1849b 100644
--- a/admin/src/components/events/virtualized-lazy-table.js
+++ b/admin/src/components/events/virtualized-lazy-table.js
@@ -10,41 +10,57 @@ import {
import { Table, Column, InfiniteLoader } from 'react-virtualized'
import 'react-virtualized/styles.css'
+import { DragSource } from 'react-dnd'
+import { getEmptyImage } from 'react-dnd-html5-backend'
+// import DragPreview from './person-drag-preview'
+
export class EventLazyTable extends Component {
static propTypes = {}
componentDidMount() {
this.props.fetchLazy()
+ this.props.connectPreview(getEmptyImage())
}
render() {
const { loaded, events } = this.props
+
+ const { connectDragSource, isDragging } = this.props
+ const dndStyle = {
+ opacity: isDragging ? 0.3 : 1
+ }
+
return (
-
- {({ onRowsRendered, registerChild }) => (
-
+
)
}
@@ -59,6 +75,21 @@ export class EventLazyTable extends Component {
handleSelect = ({ rowData }) => this.props.selectEvent(rowData.uid)
}
+const spec = {
+ beginDrag(props, ff) {
+ const eventId = props.events[0].uid
+ return {
+ eventId
+ }
+ }
+}
+
+const collect = (connect, monitor) => ({
+ connectDragSource: connect.dragSource(),
+ connectPreview: connect.dragPreview(),
+ isDragging: monitor.isDragging()
+})
+
export default connect(
(state) => ({
events: eventListSelector(state),
@@ -66,4 +97,4 @@ export default connect(
loaded: loadedSelector(state)
}),
{ fetchLazy, selectEvent }
-)(EventLazyTable)
+)(DragSource('event', spec, collect)(EventLazyTable))
diff --git a/admin/src/components/people/person-drag-preview.js b/admin/src/components/people/person-drag-preview.js
index 730f156..2b85b80 100644
--- a/admin/src/components/people/person-drag-preview.js
+++ b/admin/src/components/people/person-drag-preview.js
@@ -4,6 +4,8 @@ import { personSelector } from '../../ducks/people'
class PersonDragPreview extends Component {
render() {
+ if (!this.props.person) return null
+
return {this.props.person.firstName}
}
}
diff --git a/admin/src/config.js b/admin/src/config.js
index a6889dc..39af168 100644
--- a/admin/src/config.js
+++ b/admin/src/config.js
@@ -1,16 +1,33 @@
+// import { initializeApp } from 'firebase/app'
+// import 'firebase/auth'
+// import 'firebase/database'
+//
+// export const appName = 'adv-react-25-06'
+//
+// const config = {
+// apiKey: 'AIzaSyDzqwnZ_39QyqhxYZVPjVH8eBww7DUBmVc',
+// authDomain: `${appName}.firebaseapp.com`,
+// databaseURL: `https://${appName}.firebaseio.com`,
+// projectId: appName,
+// storageBucket: '',
+// messagingSenderId: '874599443389'
+// }
+//
+// initializeApp(config)
+
import { initializeApp } from 'firebase/app'
import 'firebase/auth'
import 'firebase/database'
-export const appName = 'adv-react-25-06'
+export const appName = 'adv-react-au-0307'
const config = {
- apiKey: 'AIzaSyDzqwnZ_39QyqhxYZVPjVH8eBww7DUBmVc',
+ apiKey: 'AIzaSyDj6YDOCSRPFbUGtUwwtyPrA-koT2uKCxg',
authDomain: `${appName}.firebaseapp.com`,
databaseURL: `https://${appName}.firebaseio.com`,
projectId: appName,
storageBucket: '',
- messagingSenderId: '874599443389'
+ messagingSenderId: '650330669903'
}
initializeApp(config)
diff --git a/admin/src/ducks/events.js b/admin/src/ducks/events.js
index 446f007..f7d0a69 100644
--- a/admin/src/ducks/events.js
+++ b/admin/src/ducks/events.js
@@ -4,6 +4,7 @@ import { Record, OrderedSet, OrderedMap } from 'immutable'
import firebase from 'firebase/app'
import { createSelector } from 'reselect'
import { fbToEntities } from './utils'
+import { DELETE_PERSON } from './people'
/**
* Constants
@@ -20,6 +21,9 @@ export const FETCH_LAZY_REQUEST = `${prefix}/FETCH_LAZY_REQUEST`
export const FETCH_LAZY_START = `${prefix}/FETCH_LAZY_START`
export const FETCH_LAZY_SUCCESS = `${prefix}/FETCH_LAZY_SUCCESS`
+export const DELETE_EVENT = `${prefix}/DELETE_EVENT`
+export const DELETE_EVENT_SUCCESS = `${prefix}/DELETE_EVENT_SUCCESS`
+
/**
* Reducer
* */
@@ -69,6 +73,13 @@ export default function reducer(state = new ReducerRecord(), action) {
: selected.add(payload.uid)
)
+ case DELETE_EVENT:
+ return state.update('entities', (entities) =>
+ entities.filter(function(item) {
+ return item.get('uid') !== payload.eventId
+ })
+ )
+
default:
return state
}
@@ -128,10 +139,31 @@ export function fetchLazy() {
}
}
+export function deleteEvent(eventId) {
+ return {
+ type: DELETE_EVENT,
+ payload: { eventId }
+ }
+}
+
/**
* Sagas
* */
+export function* deleteEventSaga(action) {
+ const ref = firebase
+ .database()
+ .ref('events/' + action.payload.eventId)
+ .remove()
+
+ const successAction = {
+ type: DELETE_EVENT_SUCCESS,
+ payload: { eventId: action.payload.eventId }
+ }
+
+ yield put(successAction)
+}
+
export function* fetchAllSaga() {
const eventsState = yield select(stateSelector)
if (eventsState.loading || eventsState.loaded) return
@@ -181,5 +213,9 @@ export const fetchLazySaga = function*() {
}
export function* saga() {
- yield all([takeEvery(FETCH_ALL_REQUEST, fetchAllSaga), fetchLazySaga()])
+ yield all([
+ takeEvery(FETCH_ALL_REQUEST, fetchAllSaga),
+ fetchLazySaga(),
+ takeEvery(DELETE_EVENT, deleteEventSaga)
+ ])
}
diff --git a/admin/src/ducks/people.js b/admin/src/ducks/people.js
index 08d582f..a7dc8e8 100644
--- a/admin/src/ducks/people.js
+++ b/admin/src/ducks/people.js
@@ -2,7 +2,7 @@ import { appName } from '../config'
import { Record, List } from 'immutable'
import { reset } from 'redux-form'
import { createSelector } from 'reselect'
-import { put, takeEvery, call } from 'redux-saga/effects'
+import { put, takeEvery, call, all } from 'redux-saga/effects'
import { generateId } from './utils'
/**
@@ -12,6 +12,8 @@ export const moduleName = 'people'
const prefix = `${appName}/${moduleName}`
export const ADD_PERSON = `${prefix}/ADD_PERSON`
export const ADD_PERSON_SUCCESS = `${prefix}/ADD_PERSON_SUCCESS`
+export const DELETE_PERSON = `${prefix}/DELETE_PERSON`
+export const DELETE_PERSON_SUCCESS = `${prefix}/DELETE_PERSON_SUCCESS`
export const ADD_EVENT = `${prefix}/ADD_EVENT`
@@ -52,6 +54,13 @@ export default function reducer(state = new ReducerState(), action) {
entities.push(new PersonRecord(payload.person))
)
+ case DELETE_PERSON:
+ return state.update('entities', (entities) =>
+ entities.filter(function(item) {
+ return item.get('uid') !== payload.personUid
+ })
+ )
+
default:
return state
}
@@ -83,6 +92,13 @@ export function addPerson(person) {
}
}
+export function deletePerson(personUid) {
+ return {
+ type: DELETE_PERSON,
+ payload: { personUid }
+ }
+}
+
export function addEventToPerson(eventUid, personUid) {
return {
type: ADD_EVENT,
@@ -109,6 +125,18 @@ export function* addPersonSaga(action) {
yield put(reset('person'))
}
+export function* deletePersonSaga(action) {
+ const successAction = {
+ type: DELETE_PERSON_SUCCESS,
+ payload: { uid: action.payload.personUid }
+ }
+
+ yield put(successAction)
+}
+
export function* saga() {
- yield takeEvery(ADD_PERSON, addPersonSaga)
+ yield all([
+ takeEvery(ADD_PERSON, addPersonSaga),
+ takeEvery(DELETE_PERSON, deletePersonSaga)
+ ])
}
diff --git a/admin/src/ducks/utils.js b/admin/src/ducks/utils.js
index 9fbc6be..168fec7 100644
--- a/admin/src/ducks/utils.js
+++ b/admin/src/ducks/utils.js
@@ -5,8 +5,7 @@ export function generateId() {
}
export function fbToEntities(values, DataRecord) {
- return Object.entries(values).reduce(
- (acc, [uid, value]) => acc.set(uid, new DataRecord({ uid, ...value })),
- new OrderedMap({})
- )
+ return Object.entries(values).reduce((acc, [uid, value]) => {
+ return acc.set(uid, new DataRecord({ uid, ...value }))
+ }, new OrderedMap({}))
}
diff --git a/admin/src/routes/all-page.js b/admin/src/routes/all-page.js
index 17707b6..306d7e6 100644
--- a/admin/src/routes/all-page.js
+++ b/admin/src/routes/all-page.js
@@ -2,6 +2,7 @@ import React, { Component } from 'react'
import EventsTable from '../components/events/virtualized-lazy-table'
import SelectedEvents from '../components/events/selected-events'
import PeopleList from '../components/people/people-list'
+import Basket from '../components/basket'
class AllPage extends Component {
static propTypes = {}
@@ -10,6 +11,7 @@ class AllPage extends Component {
return (