Commit 62edab93 authored by Andrew Hrdy's avatar Andrew Hrdy

Merge dev into typescript

parents 6170ce32 0d1e3476
Pipeline #3914 passed with stage
in 1 minute and 31 seconds
# Changelog # Changelog
## [2.2.2] - 2018-10-04 ## [2.2.2] - 2019-01-31
### Removed ### Removed
- temporarily removing label feature
- Facility labels
### Changed ### Changed
- performance improvements to facility card and favorite button
- Adheres to new alert schema in API v2.2
## [2.2.1] - 2018-09-18 ## [2.2.1] - 2018-09-18
...@@ -14,8 +16,6 @@ ...@@ -14,8 +16,6 @@
- Matomo Events API - Matomo Events API
### Removed
### Changed ### Changed
- FacilityMap update code for better map performance - FacilityMap update code for better map performance
...@@ -118,4 +118,6 @@ ...@@ -118,4 +118,6 @@
[2.1.2]: https://git.gmu.edu/srct/whats-open-web/compare/v2.1.1...v2.1.2 [2.1.2]: https://git.gmu.edu/srct/whats-open-web/compare/v2.1.1...v2.1.2
[2.1.3]: https://git.gmu.edu/srct/whats-open-web/compare/v2.1.2...v2.1.3 [2.1.3]: https://git.gmu.edu/srct/whats-open-web/compare/v2.1.2...v2.1.3
[2.1.4]: https://git.gmu.edu/srct/whats-open-web/compare/v2.1.3...v2.1.4 [2.1.4]: https://git.gmu.edu/srct/whats-open-web/compare/v2.1.3...v2.1.4
[2.2.0]: https://git.gmu.edu/srct/whats-open-web/compare/v2.1.4...v2.2.0 [2.2.0]: https://git.gmu.edu/srct/whats-open-web/compare/v2.1.4...v2.2.0
\ No newline at end of file [2.2.1]: https://git.gmu.edu/srct/whats-open-web/compare/v2.2.0...v2.2.1
[2.2.2]: https://git.gmu.edu/srct/whats-open-web/compare/v2.2.1...v2.2.2
\ No newline at end of file
...@@ -4141,9 +4141,9 @@ ...@@ -4141,9 +4141,9 @@
} }
}, },
"earcut": { "earcut": {
"version": "2.1.3", "version": "2.1.4",
"resolved": "https://registry.npmjs.org/earcut/-/earcut-2.1.3.tgz", "resolved": "https://registry.npmjs.org/earcut/-/earcut-2.1.4.tgz",
"integrity": "sha512-AxdCdWUk1zzK/NuZ7e1ljj6IGC+VAdC3Qb7QQDsXpfNrc5IM8tL9nNXUmEGE6jRHTfZ10zhzRhtDmWVsR5pd3A==" "integrity": "sha512-ttRjmPD5oaTtXOoxhFp9aZvMB14kBjapYaiBuzBB1elOgSLU9P2Ev86G2OClBg+uspUXERsIzXKpUWweH2K4Xg=="
}, },
"ecc-jsbn": { "ecc-jsbn": {
"version": "0.1.1", "version": "0.1.1",
...@@ -6325,9 +6325,9 @@ ...@@ -6325,9 +6325,9 @@
"dev": true "dev": true
}, },
"grid-index": { "grid-index": {
"version": "1.0.0", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/grid-index/-/grid-index-1.0.0.tgz", "resolved": "https://registry.npmjs.org/grid-index/-/grid-index-1.1.0.tgz",
"integrity": "sha1-rSxdVM5bNUN/r/HXCprrPR0mERA=" "integrity": "sha512-HZRwumpOGUrHyxO5bqKZL0B0GlUpwtCAzZ42sgxUPniu33R1LSFH5yrIcBCHjkctCAh3mtWKcKd9J4vDDdeVHA=="
}, },
"grouped-queue": { "grouped-queue": {
"version": "0.3.3", "version": "0.3.3",
......
...@@ -2,6 +2,8 @@ import React from 'react'; ...@@ -2,6 +2,8 @@ import React from 'react';
import classNames from 'classnames'; import classNames from 'classnames';
import {findLink} from '../utils/nameUtils'; import {findLink} from '../utils/nameUtils';
import Chip from '@material-ui/core/Chip'; import Chip from '@material-ui/core/Chip';
import Button from '@material-ui/core/Button';
import ArrowForwardIcon from '@material-ui/icons/ArrowForward';
const Alert = ({alert}) => { const Alert = ({alert}) => {
const getUrgencyClass = () => { const getUrgencyClass = () => {
...@@ -18,19 +20,33 @@ const Alert = ({alert}) => { ...@@ -18,19 +20,33 @@ const Alert = ({alert}) => {
} }
}; };
const getMessage = () => { const getBody = () => {
const links = findLink(alert.message); /*
API V2.2 removed the message field and replaced it with
subject and body. In order to ensure backwards compatability,
use the message field if it exists, otherwise use body.
TODO: Eventually, this check will be useless when older alerts
are phased out and should be removed to minimize complexity.
Alternatively, move this into the mapper once TypeScript is added.
*/
const body = alert.message ? alert.message : alert.body;
const links = findLink(body);
if (!links) { if (!links) {
return (<span className={'alert-message'}> return (
{alert.message} <span className={'alert-body'}>
</span>); {body}
</span>
);
} }
return ( return (
<span className={'alert-message'}> <span className={'alert-body'}>
{alert.message.substring(0, links.index)} {body.substring(0, links.index)}
<a href={links[0]} className={'alert-link'} target="_blank" rel="noopener noreferrer">{links[0]}</a> <a href={links[0]} className={'alert-link'} target="_blank" rel="noopener noreferrer">{links[0]}</a>
{alert.message.substring(links.index + links[0].length)} {body.substring(links.index + links[0].length)}
</span> </span>
); );
}; };
...@@ -39,8 +55,24 @@ const Alert = ({alert}) => { ...@@ -39,8 +55,24 @@ const Alert = ({alert}) => {
return ( return (
<div className={'alert'}> <div className={'alert'}>
{getMessage()} <div className={'alert-subject-container'}>
<Chip label={getChipLabel()} className={classNames('alert-urgency-chip', getUrgencyClass())}/> <h3 className={'alert-subject'}>{alert.subject}</h3>
<Chip label={getChipLabel()} className={classNames('alert-urgency-chip', getUrgencyClass())} />
</div>
{getBody()}
{
alert.url &&
<span className={'alert-url-container'}>
<Button size={'small'} href={alert.url} target="_blank" rel="noopener noreferrer" classes={{
root: 'alert-url-button-root'
}}>
More Information
<ArrowForwardIcon />
</Button>
</span>
}
</div> </div>
); );
}; };
......
import React from 'react'; import React from 'react';
import Dialog from '@material-ui/core/Dialog'; import Dialog from '@material-ui/core/Dialog';
import Grid from '@material-ui/core/Grid'; import Grid from '@material-ui/core/Grid';
import FacilityLabels from './FacilityLabels';
import WeekHours from './WeekHours'; import WeekHours from './WeekHours';
import Button from '@material-ui/core/Button'; import Button from '@material-ui/core/Button';
import Avatar from '@material-ui/core/Avatar'; import Avatar from '@material-ui/core/Avatar';
...@@ -64,10 +63,6 @@ class FacilityDialog extends React.Component { ...@@ -64,10 +63,6 @@ class FacilityDialog extends React.Component {
</Typography> </Typography>
</Grid> </Grid>
<Grid item className={'fd-facility-labels'}>
<FacilityLabels facility={facility} />
</Grid>
<Grid item className={'fd-week-hours'}> <Grid item className={'fd-week-hours'}>
<WeekHours facility={facility} /> <WeekHours facility={facility} />
</Grid> </Grid>
......
import React from 'react';
import Chip from '@material-ui/core/Chip';
const FacilityLabels = ({facility}) => {
return (
<div className={'label-chip-holder'}>
{facility.facility_labels && facility.facility_labels.map((label) =>
<Chip className={'label-chip'} key={label} label={label} />
)}
</div>
);
};
export default FacilityLabels;
\ No newline at end of file
...@@ -70,9 +70,6 @@ class Sidebar extends React.Component { ...@@ -70,9 +70,6 @@ class Sidebar extends React.Component {
content={facility.facility_location && facility.facility_location.address} /> content={facility.facility_location && facility.facility_location.address} />
<TextwTitle label="Phone Number" <TextwTitle label="Phone Number"
content={facility.phone_number ? phoneFormatter.format(facility.phone_number, '(NNN) NNN-NNNN') : 'Unknown'} /> content={facility.phone_number ? phoneFormatter.format(facility.phone_number, '(NNN) NNN-NNNN') : 'Unknown'} />
{
//<TextwTitle label="Labels" content={<FacilityLabels facility={facility} />} />
}
<TextwTitle label="Hours" content={<WeekHours facility={facility} />} /> <TextwTitle label="Hours" content={<WeekHours facility={facility} />} />
</div> </div>
</div> </div>
......
...@@ -49,6 +49,7 @@ class AlertContainer extends React.Component { ...@@ -49,6 +49,7 @@ class AlertContainer extends React.Component {
render() { render() {
const {alerts} = this.props; const {alerts} = this.props;
const activeAlerts = alerts.filter(this.isAlertActive); const activeAlerts = alerts.filter(this.isAlertActive);
return ( return (
<div> <div>
<IconButton classes={{ <IconButton classes={{
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
padding: 8px 16px; padding: 8px 16px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; flex-direction: column;
font-size: 0.875rem; font-size: 0.875rem;
font-weight: 400; font-weight: 400;
font-family: "Roboto", "Helvetica", "Arial", sans-serif; font-family: "Roboto", "Helvetica", "Arial", sans-serif;
...@@ -16,10 +16,21 @@ ...@@ -16,10 +16,21 @@
} }
} }
.alert-message { .alert-subject-container {
display: flex; display: flex;
flex-wrap: wrap; justify-content: space-between;
margin-right: 10px; align-items: center;
width: 100%;
margin-bottom: 5px;
}
.alert-subject {
margin: 0;
}
.alert-body {
display: inline;
} }
.alert-urgency-chip { .alert-urgency-chip {
...@@ -29,6 +40,14 @@ ...@@ -29,6 +40,14 @@
color: white !important; color: white !important;
} }
.alert-url-container {
width: 100%;
}
.alert-url-button-root {
padding: 0 !important;
min-height: 24px !important;
}
.alert-link { .alert-link {
color: #0645AD; color: #0645AD;
......
...@@ -60,12 +60,6 @@ ...@@ -60,12 +60,6 @@
align-items: center; align-items: center;
} }
.fd-facility-labels {
@extend .fd-small-grid;
width: 100%;
}
.fd-week-hours { .fd-week-hours {
@extend .fd-small-grid; @extend .fd-small-grid;
......
@import '../variables';
.label-chip-holder {
display: flex;
flex-wrap: wrap;
}
.label-chip {
height: 24px !important;
margin: 2px;
}
@media screen and (max-width: map-get($breakpoints, lg) - 1px) {
.label-chip-holder {
justify-content: center;
}
}
\ No newline at end of file
...@@ -8,7 +8,6 @@ ...@@ -8,7 +8,6 @@
@import './components/facilityCategory'; @import './components/facilityCategory';
@import './components/facilityDialog'; @import './components/facilityDialog';
@import './components/facilityStatus'; @import './components/facilityStatus';
@import './components/facilityLabels';
@import './components/favoriteButton'; @import './components/favoriteButton';
@import './components/mapDialog'; @import './components/mapDialog';
@import './components/sidebar'; @import './components/sidebar';
......
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