diff --git a/admin-panel/package.json b/admin-panel/package.json index 731f163..6d2b351 100644 --- a/admin-panel/package.json +++ b/admin-panel/package.json @@ -22,7 +22,8 @@ "redux-logger": "^3.0.6", "redux-saga": "^0.16.0", "redux-thunk": "^2.2.0", - "reselect": "^3.0.1" + "reselect": "^3.0.1", + "styled-components": "^2.2.4" }, "scripts": { "start": "react-scripts start", diff --git a/admin-panel/src/components/events/Bucket.js b/admin-panel/src/components/events/Bucket.js new file mode 100644 index 0000000..5bb83df --- /dev/null +++ b/admin-panel/src/components/events/Bucket.js @@ -0,0 +1,41 @@ +import React, { Component } from 'react' +import {connect} from 'react-redux' +import {DropTarget} from 'react-dnd' +import {removeEvent} from '../../ducks/events' + +class Bucket extends Component { + + render() { + const {connectDropTarget, canDrop, hovered} = this.props + + const dndStyle = { + border: `2px solid ${canDrop + ? hovered + ? 'green' + : 'red' + : 'black'}`, + width:'100px', + height:'100px' + } + + return connectDropTarget( +
+

Bucket:

+
+
+ ) + } +} +const spec = { + drop(props, monitor) { + props.removeEvent(monitor.getItem().id) + } +} + +const collect = (connect, monitor) => ({ + connectDropTarget: connect.dropTarget(), + canDrop: monitor.canDrop(), + hovered: monitor.isOver() +}) + +export default connect(null, {removeEvent})(DropTarget(['event'], spec, collect)(Bucket)) diff --git a/admin-panel/src/components/events/EventDragPreview.js b/admin-panel/src/components/events/EventDragPreview.js new file mode 100644 index 0000000..8892c1b --- /dev/null +++ b/admin-panel/src/components/events/EventDragPreview.js @@ -0,0 +1,21 @@ +import React, { Component } from 'react' +import {connect} from 'react-redux' +import {eventSelector} from '../../ducks/events' + +class EventDragPreview extends Component { + static propTypes = { + + }; + + render() { + return ( +
+

{this.props.event.title}

+
+ ) + } +} + +export default connect((state, ownProps) => ({ + event: eventSelector(state, ownProps) +}))(EventDragPreview) \ No newline at end of file diff --git a/admin-panel/src/components/events/EventsTableRow.js b/admin-panel/src/components/events/EventsTableRow.js new file mode 100644 index 0000000..5c56a9a --- /dev/null +++ b/admin-panel/src/components/events/EventsTableRow.js @@ -0,0 +1,96 @@ +import React, { Component } from 'react' +import {DragSource} from 'react-dnd' +import {getEmptyImage} from 'react-dnd-html5-backend' +import EventDragPreview from './EventDragPreview' + +class EventsTableRow extends Component { + + componentDidMount() { + this.props.connectDragPreview(getEmptyImage()) + } + + render() { + + + const { className, + columns, + index, + key, + onRowClick, + onRowDoubleClick, + onRowMouseOut, + onRowMouseOver, + onRowRightClick, + rowData, + style, + + isDragging, + connectDragSource + } = this.props; + + const dragStyles = { + opacity: isDragging ? 0.2 : 1 + } + + const a11yProps = {}; + + if ( + onRowClick || + onRowDoubleClick || + onRowMouseOut || + onRowMouseOver || + onRowRightClick + ) { + a11yProps['aria-label'] = 'row'; + a11yProps.tabIndex = 0; + + if (onRowClick) { + a11yProps.onClick = event => onRowClick({ event, index, rowData }); + } + if (onRowDoubleClick) { + a11yProps.onDoubleClick = event => + onRowDoubleClick({ event, index, rowData }); + } + if (onRowMouseOut) { + a11yProps.onMouseOut = event => onRowMouseOut({ event, index, rowData }); + } + if (onRowMouseOver) { + a11yProps.onMouseOver = event => onRowMouseOver({ event, index, rowData }); + } + if (onRowRightClick) { + a11yProps.onContextMenu = event => + onRowRightClick({ event, index, rowData }); + } + } + + return ( + connectDragSource(
+ {columns} +
+ ) + ); + + } +} +const spec = { + beginDrag(props) { + return { + id: props.rowData.uid, + DragPreview: EventDragPreview + } + } +} + +const collect = (connect, monitor) => ({ + connectDragSource: connect.dragSource(), + connectDragPreview: connect.dragPreview(), + isDragging: monitor.isDragging() +}) + +export default DragSource('event', spec, collect)(EventsTableRow) \ No newline at end of file diff --git a/admin-panel/src/components/events/VirtualizedLazyTable.js b/admin-panel/src/components/events/VirtualizedLazyTable.js index 2fc24f2..f6bac71 100644 --- a/admin-panel/src/components/events/VirtualizedLazyTable.js +++ b/admin-panel/src/components/events/VirtualizedLazyTable.js @@ -4,6 +4,13 @@ import {moduleName, fetchLazy, selectEvent, eventListSelector} from '../../ducks import {Table, Column, InfiniteLoader} from 'react-virtualized' import 'react-virtualized/styles.css' +import EventTableRow from './EventsTableRow' + + +function rowRenderer (props) { + return +} + export class EventLazyTable extends Component { static propTypes = { @@ -33,6 +40,7 @@ export class EventLazyTable extends Component { height={300} onRowClick={this.handleRowClick} onRowsRendered={onRowsRendered} + rowRenderer={rowRenderer} rowClassName="test__event_table_row" > Admin Page + ) diff --git a/admin-panel/src/components/routes/auth/index.js b/admin-panel/src/components/routes/auth/index.js index 91c9bab..9114b86 100644 --- a/admin-panel/src/components/routes/auth/index.js +++ b/admin-panel/src/components/routes/auth/index.js @@ -1,7 +1,8 @@ import React, { Component } from 'react' import {Route, NavLink} from 'react-router-dom' import {connect} from 'react-redux' -import {signIn, signUp} from '../../../ducks/auth' + +import {signIn, signUp, errorSelector, loadingSelector} from '../../../ducks/auth' import SignInForm from '../../auth/SignInForm' import SignUpForm from '../../auth/SignUpForm' @@ -11,6 +12,7 @@ class Auth extends Component { }; render() { + const {loading, error} = this.props; return (

Auth page

@@ -20,6 +22,12 @@ class Auth extends Component { } /> } /> + {error !== null && +

{error}

+ } + {loading && +
Loading...
+ }
) } @@ -29,4 +37,7 @@ class Auth extends Component { } -export default connect(null, { signIn, signUp })(Auth) \ No newline at end of file +export default connect(state => ({ + error: errorSelector(state), + loading: loadingSelector(state) +}), { signIn, signUp })(Auth) \ No newline at end of file diff --git a/admin-panel/src/config.js b/admin-panel/src/config.js index 65bba00..8bb4843 100644 --- a/admin-panel/src/config.js +++ b/admin-panel/src/config.js @@ -1,14 +1,15 @@ import firebase from 'firebase' -export const appName = 'advreact-04-12' +export const appName = 'advreact-04-12-vesna' const config = { - apiKey: "AIzaSyCmDWlgYIhtEr1pWjgKYds3iXKWBl9wbjE", + appName: appName, + apiKey: "AIzaSyAkBB770P-MOKox9k6DjFRKi9J-bIoMnJs", authDomain: `${appName}.firebaseapp.com`, databaseURL: `https://${appName}.firebaseio.com`, projectId: appName, storageBucket: "", - messagingSenderId: "95255462276" + messagingSenderId: "786443944884" } firebase.initializeApp(config) \ No newline at end of file diff --git a/admin-panel/src/ducks/events.js b/admin-panel/src/ducks/events.js index db0acb6..06465c1 100644 --- a/admin-panel/src/ducks/events.js +++ b/admin-panel/src/ducks/events.js @@ -22,6 +22,8 @@ export const FETCH_LAZY_SUCCESS = `${prefix}/FETCH_LAZY_SUCCESS` export const SELECT = `${prefix}/SELECT` export const ADD_PERSON_TO_EVENT = `${prefix}/ADD_PERSON_TO_EVENT` +export const REMOVE = `${prefix}/REMOVE` + /** * Reducer * */ @@ -67,6 +69,9 @@ export default function reducer(state = new ReducerRecord(), action) { ? selected.remove(payload.uid) : selected.add(payload.uid) ) + case REMOVE: + return state.update('entities', entities => entities.delete(payload.eventId)) + default: return state @@ -86,6 +91,8 @@ export const selectionSelector = createSelector(stateSelector, state => state.se export const selectedEvents = createSelector(eventListSelector, selectionSelector, (events, selected) => events.filter(event => selected.has(event.uid)) ) +export const idSelector = (_, props) => props.id +export const eventSelector = createSelector(entitiesSelector, idSelector, (entities, id) => entities.get(id) !== undefined?entities.get(id):EventRecord) /** * Action Creators @@ -117,6 +124,12 @@ export function addPersonToEvent(personId, eventId) { } } +export function removeEvent(eventId){ + return { + type: REMOVE, + payload:{eventId} + } +} /** * Sagas * */ diff --git a/admin-panel/src/mocks/index.js b/admin-panel/src/mocks/index.js index d1a851f..57c2d98 100644 --- a/admin-panel/src/mocks/index.js +++ b/admin-panel/src/mocks/index.js @@ -6,4 +6,11 @@ export function saveEventsToFB() { conferences.forEach(conference => eventsRef.push(conference)) } +export function getEventsFromFB() { + const db = firebase.database() + const eventsRef = db.ref(`/events`) + return eventsRef.once('value').then(result => result.val() + ); +} + window.saveEventsToFB = saveEventsToFB \ No newline at end of file