Skip to content

Commit

Permalink
Merge pull request #220 from olinlibrary/osteele/hide-unauthorized-ui
Browse files Browse the repository at this point in the history
Hide unauthorized ui
  • Loading branch information
osteele committed May 9, 2018
2 parents aa83b1a + 7079d40 commit f71cd53
Show file tree
Hide file tree
Showing 4 changed files with 111 additions and 99 deletions.
5 changes: 2 additions & 3 deletions src/containers/sidebar-container.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,12 @@ import * as Actions from '../data/actions';
// This function passes values/objects from the Redux state to the React component as props
const mapStateToProps = state => ({
general: state.general,
account: state.account,
currentEvent: state.events.current,
isCollapsed: state.sidebar.isCollapsed,
sidebarMode: state.sidebar.mode,
possibleLabels: state.labels.labelList,
selectedLabels: state.events.current
? state.events.current.labels
: state.labels.visibleLabels,
selectedLabels: state.events.current ? state.events.current.labels : state.labels.visibleLabels,
});

// This function passes functions from /srcs/data/actions.jsx to the React component as props
Expand Down
13 changes: 8 additions & 5 deletions src/data/reducers.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
// This file contains a bunch of Redux reducers

import { ActionTypes } from './actions';
import SidebarModes from '../data/sidebar-modes';
import { ActionTypes } from './actions';

export function general(state = {}, action) {
const newState = Object.assign({}, state);
Expand All @@ -11,7 +11,7 @@ export function general(state = {}, action) {
alert(action.message);
return state;
case ActionTypes.DISPLAY_ERROR:
alert((action.message) ? action.message : action.error);
alert(action.message ? action.message : action.error);
console.error(action.error);
return state;
case ActionTypes.SET_PAGE_TITLE_PREFIX:
Expand All @@ -23,6 +23,10 @@ export function general(state = {}, action) {
}
}

export function account(state = {}, _action) {
return state;
}

export function calendar(state = {}, action) {
const newState = Object.assign({}, state);

Expand Down Expand Up @@ -87,9 +91,8 @@ export function labels(state = {}, action) {
// If the visible labels array hasn't been set yet, set it to be the default
if (!state.visibleLabels) {
const labelsArray = Object.values(labelList);
newState.visibleLabels = (labelsArray.length > 0)
? labelsArray.filter(l => l.default).map(l => l.name)
: [];
newState.visibleLabels =
labelsArray.length > 0 ? labelsArray.filter(l => l.default).map(l => l.name) : [];
}
return newState;
}
Expand Down
35 changes: 22 additions & 13 deletions src/data/setup-store.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,10 @@
import { createStore, applyMiddleware, combineReducers } from 'redux';
import thunkMiddleware from 'redux-thunk';
import ReactGA from 'react-ga';
import { routerReducer, routerMiddleware } from 'react-router-redux';
import { routerMiddleware, routerReducer } from 'react-router-redux';
import { applyMiddleware, combineReducers, createStore } from 'redux';
import thunkMiddleware from 'redux-thunk';
import * as reducers from './reducers';
import SidebarMode from './sidebar-modes';


export default function setupStore(history) {
const debug = process.env.DEBUG || false;
const googleAnalyticsId = process.env.GA_ID;
Expand Down Expand Up @@ -50,6 +49,15 @@ export default function setupStore(history) {
},
},
},
// TODO: replace this by the response to GET /account, on implementaion of olinlibrary/ABE#214
account: {
authenticated: true,
permissions: {
add_events: true,
edit_events: true,
view_all_events: true,
},
},
events: {
current: null,
events: null,
Expand Down Expand Up @@ -80,15 +88,16 @@ export default function setupStore(history) {
}

// Load the Redux middleware if the Redux devtools extension is available
const middleware = (debug && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__)
? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__(applyMiddleware(
thunkMiddleware, // lets us dispatch() functions
routerMiddleware(history),
))
: applyMiddleware(
thunkMiddleware, // lets us dispatch() functions
routerMiddleware(history),
);
const middleware =
debug && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__
? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__(applyMiddleware(
thunkMiddleware, // lets us dispatch() functions
routerMiddleware(history),
))
: applyMiddleware(
thunkMiddleware, // lets us dispatch() functions
routerMiddleware(history),
);

return createStore(
combineReducers({ ...reducers, router: routerReducer }),
Expand Down
157 changes: 79 additions & 78 deletions src/sidebar/sidebar.jsx
Original file line number Diff line number Diff line change
@@ -1,91 +1,92 @@
// This component is the sidebar, which is displayed across the entire app. Its content merely changes when pages are
// changed.
// This component is the sidebar, which is displayed across the entire app. Its
// content merely changes when pages are changed.

import React, { Component } from 'react';
import Footer from './footer';
import React from 'react';
import LabelPane from '../components/label-pane';
import { SidebarHeader } from '../components/sidebar-header';
import SidebarItemContainer from './sidebar-item-wrapper';
import EventActionsPane from './event-actions-pane';
import FilterPane from './filter-pane';
import LinkPane from './link-pane';
import Footer from './footer';
import GenerateICSPane from './generate-ics-pane';
import LinkPane from './link-pane';
import MarkdownGuide from './markdown-guide';
import EventActionsPane from './event-actions-pane';
import LabelPane from '../components/label-pane';
import SidebarItemContainer from './sidebar-item-wrapper';

export default class Sidebar extends Component {
render() {
const mode = this.props.sidebarMode;
const content = [];
const Sidebar = (props) => {
const {
account: { permissions },
sidebarMode: mode,
} = props;

if (mode.LINK_PANE) {
content.push(<LinkPane
addEventClicked={this.props.addEvent}
importICSClicked={this.props.importICSClicked}
key="link"
className="sidebar-item"
/>);
}
const content = (
<div>
{!permissions.view_all_events && (
<p>
You are viewing the public calendar. Visit the calendar from on campus to see all events
and to add and edit events.
</p>
)}

if (mode.EVENT_ACTIONS) {
content.push(<EventActionsPane key="event-actions" className="sidebar-item" {...this.props} />);
}
{mode.LINK_PANE &&
permissions.add_events && (
<LinkPane
addEventClicked={props.addEvent}
importICSClicked={props.importICSClicked}
key="link"
className="sidebar-item"
/>
)}

if (mode.EVENT_LABELS_PANE) { // For viewing a single event
const currentEventLabels = this.props.currentEvent ? this.props.currentEvent.labels : null;
content.push(<SidebarItemContainer
key="event-labels"
header="Labels"
>
<LabelPane
editable={false}
showUnselected={false}
selectedLabels={currentEventLabels}
{...this.props}
/>
</SidebarItemContainer>);
}
{mode.EVENT_ACTIONS &&
permissions.edit_events && (
<EventActionsPane key="event-actions" className="sidebar-item" {...props} />
)}

if (mode.FILTER_PANE) { // For viewing the calendar
content.push(<SidebarItemContainer
key="filter-pane"
header="Filter"
>
<FilterPane {...this.props} />
</SidebarItemContainer>);
}
if (mode.GENERATE_ICS_PANE) {
const header = 'Subscribe';
content.push(<SidebarItemContainer
key="gen-ics"
header={header}
>
<GenerateICSPane {...this.props} />
</SidebarItemContainer>);
}
{mode.EVENT_LABELS_PANE && (
<SidebarItemContainer key="event-labels" header="Labels">
<LabelPane
editable={false}
showUnselected={false}
selectedLabels={props.currentEvent ? props.currentEvent.labels : null}
{...props}
/>
</SidebarItemContainer>
)}

if (mode.MARKDOWN_GUIDE) {
content.push(<SidebarItemContainer
key="markdown-guide"
header="Markdown Guide"
>
<MarkdownGuide />
</SidebarItemContainer>);
}
{mode.FILTER_PANE && (
// For viewing the calendar
<SidebarItemContainer key="filter-pane" header="Filter">
<FilterPane {...props} />
</SidebarItemContainer>
)}

const sidebarClasses = `app-sidebar${(this.props.isCollapsed) ? ' collapsed' : ' expanded'}`;
return (
<div className={sidebarClasses}>
<div className="sidebar-container">
<SidebarHeader
homeClicked={this.props.homeClicked}
toggleSidebarCollapsed={this.props.toggleSidebarCollapsed}
/>
<div className="sidebar-content">
{content}
</div>
<Footer class="sidebar-footer" />
</div>
{mode.GENERATE_ICS_PANE && (
<SidebarItemContainer key="gen-ics" header="Subscribe">
<GenerateICSPane {...props} />
</SidebarItemContainer>
)}

{mode.MARKDOWN_GUIDE && (
<SidebarItemContainer key="markdown-guide" header="Markdown Guide">
<MarkdownGuide />
</SidebarItemContainer>
)}
</div>
);

const sidebarClasses = `app-sidebar${props.isCollapsed ? ' collapsed' : ' expanded'}`;
return (
<div className={sidebarClasses}>
<div className="sidebar-container">
<SidebarHeader
homeClicked={props.homeClicked}
toggleSidebarCollapsed={props.toggleSidebarCollapsed}
/>
<div className="sidebar-content">{content}</div>
<Footer class="sidebar-footer" />
</div>
);
}
}
</div>
);
};

export default Sidebar;

0 comments on commit f71cd53

Please sign in to comment.