Commit 6170ce32 authored by Andrew Hrdy's avatar Andrew Hrdy
Browse files

Updated dependencies and started fixing breaking changes before TS conversion

parent aef8cb0a
This diff is collapsed.
import React from 'react';
import classNames from 'classnames';
import {findLink} from '../utils/nameUtils';
import Chip from 'material-ui/Chip';
import Chip from '@material-ui/core/Chip';
const Alert = ({alert}) => {
const getUrgencyClass = () => {
......
import React from 'react';
import AppBar from 'material-ui/AppBar';
import Toolbar from 'material-ui/Toolbar';
import Typography from 'material-ui/Typography';
import Button from 'material-ui/Button';
import IconButton from 'material-ui/IconButton';
import MenuIcon from 'material-ui-icons/Menu';
import AppBar from '@material-ui/core/AppBar';
import Toolbar from '@material-ui/core/Toolbar';
import Typography from '@material-ui/core/Typography';
import Button from '@material-ui/core/Button';
import IconButton from '@material-ui/core/IconButton';
import MenuIcon from '@material-ui/icons/Menu';
import SearchBar from '../containers/SearchBar';
import classNames from 'classnames';
import AlertContainer from '../containers/AlertContainer';
......@@ -35,7 +35,7 @@ class CustomAppBar extends React.Component {
<Toolbar className={'app-bar-tool-bar'}>
<div className={'app-bar-logo-name'}>
<img src={require('../images/SRCT_square.svg')} className={'app-bar-logo'}/>
<Typography type="title" className={classNames('app-bar-title', 'app-bar-text-color')}>
<Typography variant="h6" className={classNames('app-bar-title', 'app-bar-text-color')}>
What's Open
</Typography>
</div>
......
import React from 'react';
import FacilityCard from '../containers/FacilityCard';
import Grid from 'material-ui/Grid';
import Grid from '@material-ui/core/Grid';
class CardContainer extends React.Component {
constructor(props) {
......
import React from 'react';
import ReactMapboxGl, {Marker, Popup} from 'react-mapbox-gl';
import {MenuItem} from 'material-ui/Menu';
import Select from 'material-ui/Select';
import {FormControl} from 'material-ui/Form';
import {MenuItem} from '@material-ui/core/Menu';
import Select from '@material-ui/core/Select';
import {FormControl} from '@material-ui/core/FormControl';
import {getMaxBounds, getCenterOfCampusRegion} from '../utils/mapboxUtils';
import mapboxgl from 'mapbox-gl';
import {Typography} from 'material-ui';
import {Typography} from '@material-ui/core/Typography';
import {removeBrackets} from '../utils/nameUtils';
const mapboxToken = 'pk.eyJ1IjoibWR1ZmZ5OCIsImEiOiJjaXk2a2lxODQwMDdyMnZzYTdyb3M4ZTloIn0.mSocl7zUnZBO6-CV9cvmnA';
......@@ -189,7 +189,7 @@ class FacilitiesMap extends React.Component {
{selectedLocation && (
<Popup coordinates={selectedLocation.location.coordinate_location.coordinates} anchor="top">
<div>
<Typography type="subheading" align={'center'}>
<Typography variant="subtitle1" align={'center'}>
{selectedLocation.location.building}
</Typography>
</div>
......@@ -198,7 +198,7 @@ class FacilitiesMap extends React.Component {
{selectedLocation.facilities.map((facility) => {
return (
<li key={facility.slug}>
<Typography type="caption">{removeBrackets(facility.facility_name)}</Typography>
<Typography variant="caption">{removeBrackets(facility.facility_name)}</Typography>
</li>
);
})}
......
import React from 'react';
import Typography from 'material-ui/Typography';
import Typography from '@material-ui/core/Typography';
const FacilityCategory = ({category}) => {
return (
<div className={'facility-category-wrapper'}>
<Typography type={'body1'} noWrap>
<Typography variant={'body1'} noWrap>
{category.name}
</Typography>
</div>
......
import React from 'react';
import Dialog from 'material-ui/Dialog';
import Grid from 'material-ui/Grid';
import Dialog from '@material-ui/core/Dialog';
import Grid from '@material-ui/core/Grid';
import FacilityLabels from './FacilityLabels';
import WeekHours from './WeekHours';
import Button from 'material-ui/Button';
import Avatar from 'material-ui/Avatar';
import Typography from 'material-ui/Typography';
import Button from '@material-ui/core/Button';
import Avatar from '@material-ui/core/Avatar';
import Typography from '@material-ui/core/Typography';
import MapDialog from './MapDialog';
import CloseIcon from 'material-ui-icons/Close';
import IconButton from 'material-ui/IconButton';
import LocationOnIcon from 'material-ui-icons/LocationOn';
import CloseIcon from '@material-ui/icons/Close';
import IconButton from '@material-ui/core/IconButton';
import LocationOnIcon from '@material-ui/icons/LocationOn';
import {removeBrackets} from '../utils/nameUtils';
class FacilityDialog extends React.Component {
......@@ -48,7 +48,7 @@ class FacilityDialog extends React.Component {
<Avatar className={'fd-avatar'} src={facility.logo} />
</Grid>
<Grid item className={'fd-header-text-container'}>
<Typography className={'fd-header-text'} type={'headline'}>
<Typography className={'fd-header-text'} variant={'h5'}>
{removeBrackets(facility.facility_name)}
</Typography>
</Grid>
......@@ -56,10 +56,10 @@ class FacilityDialog extends React.Component {
</Grid>
<Grid item className={'fd-location-wrapper'}>
<Typography type={'caption'}>
<Typography variant={'caption'}>
<LocationOnIcon />
</Typography>
<Typography title={facility.facility_location.building} type={'caption'} align={'center'}>
<Typography title={facility.facility_location.building} variant={'caption'} align={'center'}>
{facility.facility_location.building}
</Typography>
</Grid>
......
import React from 'react';
import Chip from 'material-ui/Chip';
import Chip from '@material-ui/core/Chip';
const FacilityLabels = ({facility}) => {
return (
......
import React from 'react';
import Typography from 'material-ui/Typography';
import Typography from '@material-ui/core/Typography';
import FacilityUtils from '../utils/facilityUtils';
import classNames from 'classnames';
......@@ -31,7 +31,7 @@ const FacilityStatus = ({facility}) => {
const statusInfo = generateStatusInfo();
return (
<Typography type={'caption'}
<Typography variant={'caption'}
className={classNames('facility-status-text', statusInfo.isOpen ? 'facility-status-open' : 'facility-status-closed')}>
{statusInfo.label}
</Typography>
......
import React from 'react';
import FavoriteBorderIcon from 'material-ui-icons/FavoriteBorder';
import FavoriteIcon from 'material-ui-icons/Favorite';
import FavoriteBorderIcon from '@material-ui/icons/FavoriteBorder';
import FavoriteIcon from '@material-ui/icons/Favorite';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import ReactPiwik from 'react-piwik';
......
import React from 'react';
import PropTypes from 'prop-types';
import Dialog from 'material-ui/Dialog';
import Dialog from '@material-ui/core/Dialog';
import FacilitiesMap from './FacilitiesMap';
import IconButton from 'material-ui/IconButton';
import CloseIcon from 'material-ui-icons/Close';
import IconButton from '@material-ui/core/IconButton';
import CloseIcon from '@material-ui/icons/Close';
class MapDialog extends React.Component {
handleRequestClose = () => {
......
import React from 'react';
import Paper from 'material-ui/Paper';
import Avatar from 'material-ui/Avatar';
import Typography from 'material-ui/Typography';
import Divider from 'material-ui/Divider';
import Paper from '@material-ui/core/Paper';
import Avatar from '@material-ui/core/Avatar';
import Typography from '@material-ui/core/Typography';
import Divider from '@material-ui/core/Divider';
import TextwTitle from '../components/TextwTitle';
import FacilitiesMap from '../components/FacilitiesMap';
import MapDialog from '../components/MapDialog';
import classNames from 'classnames';
import WeekHours from './WeekHours';
import FacilityLabels from './FacilityLabels';
import CloseIcon from 'material-ui-icons/Close';
import IconButton from 'material-ui/IconButton';
import CloseIcon from '@material-ui/icons/Close';
import IconButton from '@material-ui/core/IconButton';
import {removeBrackets} from '../utils/nameUtils';
import phoneFormatter from 'phone-formatter';
import ReactPiwik from 'react-piwik';
......@@ -53,13 +52,13 @@ class Sidebar extends React.Component {
<meta></meta>
<Paper
className={classNames(['sidebar-root', (isSidebarOpen && 'sidebar-open'), (!isSidebarOpen && 'sidebar-closed')])}>
<IconButton className={'sidebar-close-btn'} onClick={this.handleSidebarClose}>
<IconButton className={'sidebar-close-btn'} size="small" onClick={this.handleSidebarClose}>
<CloseIcon />
</IconButton>
<div className={'sidebar-row1'}>
<Avatar className={'sidebar-avatar'} src={facility.logo} />
<div className={'sidebar-title'}>
<Typography type="display1">{removeBrackets(facility.facility_name)}</Typography>
<Typography variant="h4">{removeBrackets(facility.facility_name)}</Typography>
</div>
</div>
<Divider className={'sidebar-divider'} />
......
import React from 'react';
import Grid from 'material-ui/Grid';
import Grid from '@material-ui/core/Grid';
import facilityUtils from '../utils/facilityUtils';
import Typography from 'material-ui/Typography';
import Typography from '@material-ui/core/Typography';
const WeekHours = ({facility}) => {
const weekDays = [
......@@ -23,10 +23,10 @@ const WeekHours = ({facility}) => {
output[index] = (
<Grid container spacing={0} key={facility.slug + index} className="week-hours-row">
<Grid item xs={2}>
<Typography type={'body1'}>{weekDays[dayOfWeek]}</Typography>
<Typography variant={'body1'}>{weekDays[dayOfWeek]}</Typography>
</Grid>
<Grid item>
<Typography type={'body1'}>{todaysHours[i].text}</Typography>
<Typography variant={'body1'}>{todaysHours[i].text}</Typography>
</Grid>
</Grid>
);
......
import React from 'react';
import {findDOMNode} from 'react-dom';
import IconButton from 'material-ui/IconButton';
import Popover from 'material-ui/Popover';
import IconButton from '@material-ui/core/IconButton';
import Popover from '@material-ui/core/Popover';
import Alert from '../components/Alert';
import NotificationsIcon from 'material-ui-icons/Notifications';
import CloseIcon from 'material-ui-icons/Close';
import Typography from 'material-ui/Typography';
import NotificationsIcon from '@material-ui/icons/Notifications';
import CloseIcon from '@material-ui/icons/Close';
import Typography from '@material-ui/core/Typography';
import {connect} from 'react-redux';
import {viewAlert} from '../actions/api';
......@@ -56,7 +56,7 @@ class AlertContainer extends React.Component {
}} ref={this.handleBtnRef} onClick={this.handleOpen}>
{activeAlerts.filter((alert) => !alert.viewed).length !== 0 &&
<span className={'alert-container-number'}>
<Typography type={'caption'} className={'alert-container-number-text'}>
<Typography variant={'caption'} className={'alert-container-number-text'}>
{activeAlerts.length}
</Typography>
</span>}
......@@ -78,7 +78,7 @@ class AlertContainer extends React.Component {
onClose={this.handleClose}>
<div className={'alert-container-popover'}>
<div className={'alert-container-header'}>
<Typography type={'title'} className={'alert-container-title'}>
<Typography variant={'h6'} className={'alert-container-title'}>
Alerts
</Typography>
<IconButton className={'alert-container-close-btn'} onClick={this.handleClose}>
......
import React from 'react';
import Card, {CardContent} from 'material-ui/Card';
import Typography from 'material-ui/Typography';
import Grid from 'material-ui/Grid';
import Card from '@material-ui/core/Card';
import CardContent from '@material-ui/core/CardContent';
import Typography from '@material-ui/core/Typography';
import Grid from '@material-ui/core/Grid';
import FacilityStatus from '../components/FacilityStatus';
import FavoriteButton from '../components/FavoriteButton';
import FacilityCategory from '../components/FacilityCategory';
import {connect} from 'react-redux';
import {addFavoriteFacility, removeFavoriteFacility, setSelectedFacility, setSidebar} from '../actions/ui';
import LocationOnIcon from 'material-ui-icons/LocationOn';
import LocationOnIcon from '@material-ui/icons/LocationOn';
import {removeBrackets} from '../utils/nameUtils';
import classNames from 'classnames';
import FacilityDialog from '../components/FacilityDialog';
import FacilityUtils from '../utils/facilityUtils';
import ReactPiwik from 'react-piwik';
import Perf from 'react-addons-perf';
class FacilityCard extends React.Component {
constructor(props) {
super(props);
this.state = {
modified: null,
modified: null
};
}
......@@ -97,11 +97,10 @@ class FacilityCard extends React.Component {
removeFavoriteFacility={removeFavoriteFacility} />
<CardContent className={'fc-card-content'}>
<Grid container alignItems={'center'} direction={'column'}
className={'fc-small-grid-container-spacing'}>
<Grid container alignItems={'center'} direction={'column'}>
<Grid item
className={classNames('fc-small-grid-item-spacing', 'fc-ellipsis-container', 'fc-title-container')}>
<Typography type={'subheading'} align={'center'}
<Typography variant={'subtitle1'} align={'center'}
className={classNames('fc-title', 'fc-one-line-ellipsis')}>
{removeBrackets(facility.facility_name)}
</Typography>
......@@ -109,23 +108,23 @@ class FacilityCard extends React.Component {
<Grid item className={'fc-small-grid-item-spacing'}>
<FacilityCategory category={facility.facility_category} />
</Grid>
<Grid item className={'fc-small-grid-item-spacing'}>
<Typography type={'body1'}>
<Grid item className={'fc-small-grid-item-spacing fc-display-hours'}>
<Typography variant={'body1'}>
{`Today: ${getDisplayHours()}`}
</Typography>
</Grid>
</Grid>
<Grid container justify={'space-around'} className={'fc-extra-info-wrapper'}>
<Grid container justify={'space-around'}>
<Grid item className={'fc-extra-info'}>
<FacilityStatus facility={facility} />
</Grid>
<Grid item className={'fc-extra-info'}>
<Typography type={'caption'}>
<Typography variant={'caption'}>
<LocationOnIcon className={'fc-card-map-marker-icon'} />
</Typography>
<Typography title={buildingName} type={'caption'} align={'center'}
<Typography title={buildingName} variant={'caption'} align={'center'}
className={'fc-two-line-ellipsis'}>
{buildingName}
</Typography>
......
......@@ -2,15 +2,15 @@ import React from 'react';
import PropTypes from 'prop-types';
import {connect} from 'react-redux';
import {setCampusRegion, setSearchTerm} from '../actions/ui';
import SearchIcon from 'material-ui-icons/Search';
import CloseIcon from 'material-ui-icons/Close';
import ArrowBackIcon from 'material-ui-icons/ArrowBack';
import IconButton from 'material-ui/IconButton';
import Input from 'material-ui/Input';
import Paper from 'material-ui/Paper';
import {MenuItem} from 'material-ui/Menu';
import Select from 'material-ui/Select';
import {FormControl} from 'material-ui/Form';
import SearchIcon from '@material-ui/icons/Search';
import CloseIcon from '@material-ui/icons/Close';
import ArrowBackIcon from '@material-ui/icons/ArrowBack';
import IconButton from '@material-ui/core/IconButton';
import Input from '@material-ui/core/Input';
import Paper from '@material-ui/core/Paper';
import MenuItem from '@material-ui/core/MenuItem';
import Select from '@material-ui/core/Select';
import FormControl from '@material-ui/core/FormControl';
import classNames from 'classnames';
import ReactPiwik from 'react-piwik';
......@@ -92,10 +92,10 @@ class SearchBar extends React.Component {
return (
<Paper className={classNames('search-bar-paper-background', this.state.isFocused && 'search-bar-focus',
this.state.value && 'search-bar-has-value', this.state.isMobileOpen && 'search-bar-mobile-open')}>
<IconButton onClick={this.handleMobileExpand} disableRipple className={'search-bar-search-btn'}>
<IconButton onClick={this.handleMobileExpand} disableRipple={true} className={'search-bar-search-btn'}>
<SearchIcon className={'search-bar-search-icon'}/>
</IconButton>
<IconButton onClick={this.handleMobileCollapse} disableRipple className={'search-bar-back-btn'}>
<IconButton onClick={this.handleMobileCollapse} disableRipple={true} className={'search-bar-back-btn'}>
<ArrowBackIcon className={'search-bar-back-icon'}/>
</IconButton>
<Input
......@@ -113,7 +113,7 @@ class SearchBar extends React.Component {
inputRef={(el) => this.inputElement = el}
value={this.state.value}
/>
<IconButton onClick={this.clear} disableRipple className={'search-bar-close-btn'}>
<IconButton onClick={this.clear} disableRipple={true} className={'search-bar-close-btn'}>
<CloseIcon/>
</IconButton>
<FormControl className={'search-bar-campus-control'}>
......
......@@ -10,7 +10,7 @@ import {ConnectedRouter, routerMiddleware} from 'react-router-redux';
import {Provider} from 'react-redux';
import ReduxThunk from 'redux-thunk';
import reducers from './reducers/index';
import {MuiThemeProvider} from 'material-ui/styles';
import {MuiThemeProvider} from '@material-ui/core/styles';
import theme from './theme';
import './styles/whatsOpen.scss';
import 'typeface-roboto';
......
......@@ -17,17 +17,18 @@
}
.fc-card-content {
padding: 8px 4px !important;
padding: 8px 4px 0 !important;
}
.fc-small-grid-container-spacing {
margin: -2px -8px !important;
}
.fc-small-grid-item-spacing {
padding: 3px 8px !important;
}
.fc-display-hours {
white-space: nowrap;
}
.fc-ellipsis-container {
width: 100%;
}
......@@ -56,20 +57,14 @@
.fc-title {
font-weight: bold !important;
margin-right: 6px!important;
}
.fc-extra-info {
display: flex;
align-items: center;
max-width: 50%;
}
.fc-extra-info-wrapper {
padding-top: 8px;
}
.fc-one-line-ellipsis {
white-space: nowrap;
text-overflow: ellipsis;
......
import {createMuiTheme} from 'material-ui/styles';
import {createMuiTheme} from '@material-ui/core/styles';
const theme = createMuiTheme({
direction: 'ltr',
......@@ -177,6 +177,7 @@ const theme = createMuiTheme({
fontWeightLight: 300,
fontWeightRegular: 400,
fontWeightMedium: 500,
useNextVariants: true,
display4: {
fontSize: 112,
fontWeight: 300,
......@@ -221,7 +222,7 @@ const theme = createMuiTheme({
lineHeight: 1,
color: 'rgba(0, 0, 0, 0.87)'
},
subheading: {
subtitle1: {
fontSize: 16,
fontWeight: 400,
fontFamily: '"Roboto", "-apple-system", "Helvetica", "Arial", sans-serif',
......@@ -342,6 +343,13 @@ const theme = createMuiTheme({
popover: 2100,
snackbar: 2900,
tooltip: 3000
},
overrides: {
MuiButtonBase: {
root: {
backgroundColor: 'transparent !important' // Removes hover affects on buttons - Maybe add this back at some point
}
}
}
});
export default theme;
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment